修改新增

祖安之光

2025-12-24 40a29e1c59601e6aff61c1752a4104c6b796e97a

 src/views/menuPage.vue

@@ -2,14 +2,15 @@
  <div class="system-select-container">
    <!-- 顶部用户信息栏 -->
    <div class="user-info-bar">
      <div class="user-left"></div>
      <h3 class="user-details">欢迎访问多体系建设信息化系统</h3>
      <div class="user-left">
        欢迎访问多体系建设信息化系统
      </div>
      <div class="avatar-container">
        <el-dropdown @command="handleCommand" class="right-menu-item hover-effect" trigger="click">
          <div class="avatar-wrapper" style="display: flex;align-items: center">
            <img src="../assets/images/avator.png" class="user-avatar"  />
            <span style="font-size: 16px">{{userName}}（{{userTypeName}}）</span>
            <el-icon><caret-bottom /></el-icon>
            <span style="font-size: 16px;color: #fff">{{userName}}（{{userTypeName}}）</span>
            <el-icon color="#fff"><caret-bottom /></el-icon>
          </div>
          <template #dropdown>
            <el-dropdown-menu>
@@ -51,6 +52,15 @@
        </div>
      </div>
    </div>
<!--    <div class="sys-footer">-->
<!--      <div class="footer-left">-->
<!--        <img src="../assets/images/menuPageLogo.png"/>-->
<!--        <span>中国科学院苏州纳米技术与纳米仿生研究所</span>-->
<!--      </div>-->
<!--      <div class="footer-right">-->
<!--        系统版本：V1.0.0-->
<!--      </div>-->
<!--    </div>-->
    <user-dialog ref="reviewRef"></user-dialog>
  </div>
</template>
@@ -205,7 +215,7 @@
// 进入系统
const enterSystem = (systemId) => {
  if(systemId == 1){
    router.push({ path: "/"});
    router.push({ path: "/menuIndex"});
  }else{
    ElMessage.warning('系统正在开发中...')
  }
@@ -246,20 +256,15 @@
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  background-color: #ffffff;
  background-color: rgb(16,66,143);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);

  .user-left{
    width: 20%;
  }

  .user-details{
    width: 60%;
    margin: 0;
    color: #333;
    text-align: center;
    font-size: 28px;
    letter-spacing: 2px;
    width: 80%;
    font-size: clamp(1rem, -0.143rem + 1.79vw, 2rem);
    font-weight: bolder;
    padding-left: 40px;
    color: #fff;
  }

  .avatar-container {
@@ -292,23 +297,44 @@

.systems-container {
  flex: 1;
  padding: 20px;
  padding: 20px 60px;
  overflow-y: auto;
  margin-top: 60px;
}

.sys-footer{
  height: 100px;
  background: #e6e6e6;
  display: flex;
  justify-content: space-between;
  align-items: center;
  .footer-left{
    display: flex;
    justify-content: left;
    align-items: center;

    img{
      width: 60px;
      height: 60px;
    }
    span{
      font-size: 24px;
    }
  }
}

.systems-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
  grid-template-columns: repeat(3,1fr);
  gap: 30px;
  max-width: 1500px;
  max-width: 100%;
  margin: 0 auto;
  perspective: 1000px;
}

.system-card {
  position: relative;
  height: 280px;
  height: 320px;
  background-color: #ffffff;
  border-radius: 4px;
  transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1),