| | |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | .el-menu-item.is-active{ |
| | | background: linear-gradient(#ccc,#fff) !important; |
| | | //background-color: #fff; |
| | | border-top: 1px solid rgba(255,255,255,.2); |
| | | border-bottom: 1px solid rgba(255,255,255,.2); |
| | | width: 94%; |
| | | margin-left: 3%; |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | |
| | | // 公共路由 |
| | | export const constantRoutes = [ |
| | | { |
| | | path: '/', |
| | | component: Layout, |
| | | redirect: '/menuIndex', |
| | | children: [ |
| | | { |
| | | path: 'menuIndex', |
| | | component: () => import('@/views/work/menuIndex/index'), |
| | | name: 'MenuIndex', |
| | | meta: { title: '首页', icon: 'build', affix: true } |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | path: '/redirect', |
| | | component: Layout, |
| | | hidden: true, |
| | |
| | | // 进入系统 |
| | | const enterSystem = (systemId) => { |
| | | if(systemId == 1){ |
| | | router.push({ path: "/"}); |
| | | router.push({ path: "/menuIndex"}); |
| | | }else{ |
| | | ElMessage.warning('系统正在开发中...') |
| | | } |
| | |
| | | <template> |
| | | <div class="system-select-container"> |
| | | <div class="user-info-bar"> |
| | | <div class="user-left"></div> |
| | | <h3 class="user-details">欢迎访问多体系建设信息化系统</h3> |
| | | <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> |
| | | </div> |
| | | <template #dropdown> |
| | | <el-dropdown-menu> |
| | | <el-dropdown-item command="password"> |
| | | <span>修改密码</span> |
| | | </el-dropdown-item> |
| | | <el-dropdown-item divided command="logout"> |
| | | <span>退出登录</span> |
| | | </el-dropdown-item> |
| | | </el-dropdown-menu> |
| | | </template> |
| | | </el-dropdown> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 重新布局的系统选择区域 --> |
| | | <div class="app-container"> |
| | | <div class="systems-container"> |
| | | <div class="layout-container"> |
| | | <!-- 左侧列 --> |
| | |
| | | <style scoped lang="scss"> |
| | | .system-select-container { |
| | | height: 100vh; |
| | | display: flex; |
| | | flex-direction: column; |
| | | background-color: #f5f7fa; |
| | | } |
| | | |
| | | .user-info-bar { |
| | |
| | | |
| | | .systems-container { |
| | | flex: 1; |
| | | padding: 20px; |
| | | overflow-y: auto; |
| | | width: 100%; |
| | | } |
| | | |
| | |
| | | display: flex; |
| | | gap: 20px; |
| | | width: 100%; |
| | | height: 100%; |
| | | height: calc(100% - 60px); |
| | | max-width: none; /* 移除最大宽度限制 */ |
| | | margin: 0; /* 移除居中margin */ |
| | | } |
| | |
| | | |
| | | // 超大屏幕优化 |
| | | @media (min-width: 1920px) { |
| | | .systems-container { |
| | | padding: 30px 40px; |
| | | } |
| | | |
| | | .layout-container { |
| | | gap: 30px; |
| | | gap: 20px; |
| | | } |
| | | |
| | | .module-card { |