suojin
/
jonhon-mes-web
24
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

代码提交

Browse Source
dev-scheduling
zhangdi 4 months ago
parent ec8f589e27
commit e125559577
9 changed files with 69 additions and 188 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/config/website.js
  2. 115
      src/page/index/sidebar/index.vue
  3. 127
      src/page/index/top/top-menu.vue
  4. 2
      src/styles/theme/cool.scss
  5. 2
      src/styles/theme/go.scss
  6. 2
      src/styles/theme/star.scss
  7. 3
      src/styles/theme/white.scss
  8. 2
      src/styles/top.scss
  9. 2
      src/styles/variables.scss

2
src/config/website.js
Unescape View File

@ -10,7 +10,7 @@ export default {
clientSecret: 'saber3_secret', // 客户端密钥
tenantMode: true, // 是否开启租户模式
tenantId: '000000', // 管理组租户编号
captchaMode: true, // 是否开启验证码模式
captchaMode: false, // 是否开启验证码模式
switchMode: false, // 是否开启登录切换角色部门
lockPage: '/lock', // 锁屏页面地址
tokenTime: 3000, // 定时刷新token间隔(单位:毫秒)

115
src/page/index/sidebar/index.vue
Unescape View File

@ -10,121 +10,6 @@
v-if="setting.styleRadio == '4'" class="el-menu-title radio_four_menu">
<sidebar-item :menu="leftMenu"></sidebar-item>
</el-menu>
<left-menu :menulist="menu" v-if="setting.styleRadio == '2'"></left-menu>
<leftMenuSec :menulist="menu" v-if="setting.styleRadio == '5'"></leftMenuSec>
<div class="left_menu_box" :class="leftMenu[selectIndex].children ? 'right_box' : ''"
style="display: flex;height: 100%;background: #fff;" v-if="setting.styleRadio == '3'">
<div :class="leftMenu.find(item => item.children) ? 'children' : 'no_child'">
<!-- <div class="top_title">{{ this.menu.find(item => item.id == this.leftMenu[selectIndex].parentId).name }}</div> -->
<div class="left_menu" @click="clickItem(item, index)" v-for="(item, index) in leftMenu" :key="item.id"
@mouseenter="mouseEnter(item, index)" :class="index == selectIndex ? 'active' : ''">
<div class="left_menu_item">
<i :class="item.source"></i>
<span class="name_text">{{ item.name.substring(0, 4) }}</span>
</div>
</div>
</div>
<div style="flex: 1;height: 100%;background: #fff;" v-show="leftMenu[selectIndex].children"
@mouseleave="mouseleave(leftMenu[selectIndex])">
<div
v-if="leftMenu && leftMenu.length != 0 && leftMenu[selectIndex].children && leftMenu[selectIndex].children.length != 0">
<div class="left_top">{{ leftMenu[selectIndex].name }} </div>
<div class="right_menu" v-for="item in leftMenu[selectIndex].children" :key="item.id"
@mouseenter="mounseEnter(item)" @mouseleave="mounseLeave(leftMenu[selectIndex], item)">
<div class="right_menu_item">
<el-popover placement="right-start" :show-arrow="false" :offset="0" :hide-after='0'
popper-class="log-popover"
popper-style="visibility: visible;width:auto;border:none; transform-origin: left center; z-index: 2051;padding:0;offset:0 !important;"
@hide="hidePopover(leftMenu[selectIndex], item)">
<template #reference>
<div class="right_menu_item_box" @click='clickPage(item)'>
<div>{{ item.name }}</div>
<el-icon v-if="item.children && item.children.length != 0">
<ArrowRight />
</el-icon>
</div>
</template>
<template #default>
<div class="third_box"
v-if="item.children && item.children.length != 0 && !item.children.find(item1 => item1.children)">
<div class="third_box_item" v-for="third in item.children" :key="third.id"
@click="handleClick(third)">
{{ third.name }}
</div>
</div>
<div class="four_box"
v-if="item.children && item.children.length != 0 && item.children.find(item1 => item1.children)">
<div class="four_box_item" v-for="third in item.children" :key="third.id">
<div class="third_name" @click="handleClick(third)"><span></span>{{ third.name }}</div>
<div class="four_con_box" v-if="third.children">
<div class="four_con_item" v-for="four in third.children" :key="four.id"
@click="handleClick(four)">
{{ four.name }}
</div>
</div>
</div>
</div>
</template>
</el-popover>
</div>
</div>
</div>
</div>
</div>
<div v-if="setting.styleRadio == '6'" class="left_menu_box six">
<div class="left_menu six_menu">
<div class="left_menu_item" v-for="(item, index) in menu" :key="item.id" @click="clickMenu(item, index)"
:class="activeIndex == index ? 'hover' : ''">
<i :class="item.source" style="font-size: 20px;"></i>
<span class="name_text">{{ item.name.substring(0, 2) }}</span>
</div>
</div>
<div style="flex: 1;height: 100%;" v-show="menu[activeIndex].children" @mouseleave="mouseleave(menu[activeIndex])">
<div v-if="menu && menu.length != 0 && menu[activeIndex].children && menu[activeIndex].children.length != 0">
<div class="left_top">{{ menu[activeIndex].name }} </div>
<div class="right_menu" v-for="item in menu[activeIndex].children" :key="item.id"
@mouseenter="mounseEnter(item)" @mouseleave="mounseLeave(menu[activeIndex], item)">
<div class="right_menu_item">
<el-popover placement="right-start" :show-arrow="false" :offset="0" :hide-after='0'
popper-class="log-popover"
popper-style="visibility: visible;width:auto;border:none; transform-origin: left center; z-index: 2051;padding:0;offset:0 !important;"
@hide="hidePopover(menu[activeIndex], item)">
<template #reference>
<div class="right_menu_item_box" @click='clickPage(item)'>
<div class="second_name">{{ item.name }}</div>
<el-icon v-if="item.children && item.children.length != 0">
<ArrowRight />
</el-icon>
</div>
</template>
<template #default>
<div class="third_box"
v-if="item.children && item.children.length != 0 && !item.children.find(item1 => item1.children)">
<div class="third_box_item" v-for="third in item.children" :key="third.id"
@click="handleClick(third)">
{{ third.name }}
</div>
</div>
<div class="four_box"
v-if="item.children && item.children.length != 0 && item.children.find(item1 => item1.children)">
<div class="four_box_item" v-for="third in item.children" :key="third.id">
<div class="third_name" @click="handleClick(third)"><span></span>{{ third.name }}</div>
<div class="four_con_box" v-if="third.children">
<div class="four_con_item" v-for="four in third.children" :key="four.id"
@click="handleClick(four)">
{{ four.name }}
</div>
</div>
</div>
</div>
</template>
</el-popover>
</div>
</div>
</div>
</div>
</div>
</template>
<script>

127
src/page/index/top/top-menu.vue
Unescape View File

@ -1,53 +1,25 @@
<template>
<div>
<el-menu class="top-menu custom-menu" :default-active="activeIndex" mode="horizontal" ellipsis
style="width: 900px" v-if="setting.styleRadio != '3'">
<!-- <el-menu-item index="0" @click="openHome(itemHome)">
<template #title>
<i :class="itemHome.source" style="padding-right: 5px"></i>
<span>{{ itemHome.name }}</span>
</template>
</el-menu-item> -->
<template v-for="(item, index) in items" :key="index">
<el-menu-item :index="item.id + ''" @click="openMenu(item)" >
<template #title>
<i :class="item.source" style="padding-right: 5px"></i>
<span>{{ item.name }}</span>
</template>
</el-menu-item>
</template>
</el-menu>
<div class="top_menu_box" v-if="setting.styleRadio == '3' || setting.styleRadio == '6'">
<div v-for="(item, index) in items" :key="index" @click="openMenu(item)">
<div class="top_menu_box_item" v-if="index <= 7" :class="activeIndex == item.id ? 'active' : ''">
<el-menu
class="top-menu custom-menu"
:default-active="activeIndex1"
mode="horizontal"
ellipsis
style="width: 1100px"
v-if="setting.styleRadio == '4'&&menu.length>0"
>
<el-menu-item
v-for="(item, index) in items"
:key="index"
:index="index + ''"
@click="openMenu(item)"
>
<template #title>
<i :class="item.source" style="padding-right: 5px"></i>
<span>{{ item.name }}</span>
</div>
</div>
<div v-show="items.length > 9">
<el-popover placement="bottom-start" :show-arrow="false" :offset="0" :hide-after='0' popper-class="log-popover"
popper-style="visibility: visible;width:auto;border:none; transform-origin: left center; z-index: 2051;padding:0;offset:0 !important;">
<template #reference>
<div style="height:100%;display: flex;align-items: center;">
<el-icon class="el-icon--right" style="width: 16px;height: 16px;" color="#fff">
<arrow-down />
</el-icon>
</div>
</template>
<template #default>
<div v-if="items.length > 7">
<div v-for="item in items.filter((item, index) => index > 7)" style="padding: 10px;cursor: pointer; "
@click="openMenu(item)">
<div>{{ item.name }}</div>
</div>
</div>
</template>
</el-popover>
</div>
</div>
</template>
</el-menu-item>
</el-menu>
</div>
</template>
@ -64,18 +36,46 @@ export default {
name: '首页',
source: 'iconfont iconicon_work',
},
// activeIndex: '0',
activeIndex1: '0',
items: [],
timer: null
timer: null,
};
},
inject: ['index'],
created() {
this.getMenu();
this.interval()
// 先检查store中是否已有数据，没有则等待或主动获取
if (this.menu.length === 0) {
// 监听store中menu的变化（如果是Vuex，可通过watch监听）
this.$watch(
() => this.menu,
(newVal) => {
if (newVal.length > 0) {
this.getMenu(); // 数据就绪后再处理
}
},
{ immediate: true }
);
} else {
this.getMenu();
}
this.interval();
},
computed: {
...mapGetters(['tagCurrent', 'menu', 'tagWel', 'activeIndex', 'selectIndex', 'selectedIndex', 'leftMenu', 'setting']),
...mapGetters([
'tagCurrent',
'menu',
'tagWel',
'activeIndex',
'selectIndex',
'selectedIndex',
'leftMenu',
'setting',
]),
},
mounted() {
// this.getMenu();
// this.interval();
// console.log(89898, this.menu);
},
methods: {
openMenu(item) {
@ -97,20 +97,20 @@ export default {
},
interval() {
this.timer = setInterval(() => {
this.getMenu()
}, 1000)
this.getMenu();
}, 1000);
},
getMenu() {
this.items = this.menu
this.items = this.menu;
if (this.menu.length != 0) {
clearInterval(this.timer)
clearInterval(this.timer);
}
if (this.activeIndex) {
let tmp = this.menu.find(item => item.id == this.activeIndex)
this.openMenu(tmp)
let tmp = this.menu.find(item => item.id == this.activeIndex);
this.openMenu(tmp);
} else {
if (this.menu.length != 0) {
this.openMenu(this.menu[0])
this.openMenu(this.menu[0]);
}
}
// this.$store.dispatch('GetTopMenu').then(res => {
@ -146,9 +146,9 @@ export default {
}
}
:deep(.el-menu--horizontal>.el-menu-item.is-active) {
// background-color: #dceeff !important;
:deep(.el-menu--horizontal > .el-menu-item.is-active) {
border-bottom: none !important;
background-color:rgba(235,241,251,0.6) !important;
}
.custom-menu .el-menu-item.is-active {
background-color: #ebf1fb !important; /* 修改选中项的背景色 */
@ -157,18 +157,13 @@ export default {
/* 如果需要修改选中时span标签的文字颜色，可以嵌套样式 */
.el-menu-item.is-active span {
color: #fff !important;
// color: #284c89 !important;
}
:deep(.el-menu-item.is-active i) {
// color: #06f !important;
color: #284c89 !important;
}
:deep(.el-menu-item.is-active span) {
// color: #06f !important;
color: #284c89 !important;
}
</style>
</style>

2
src/styles/theme/cool.scss
Unescape View File

@ -139,7 +139,7 @@
.top-search {
.el-input__inner {
color: #333;
// color: #333;
}
input::-webkit-input-placeholder,

2
src/styles/theme/go.scss
Unescape View File

@ -68,7 +68,7 @@
}
.el-menu-item{
i,span{
font-size: 15px;
font-size: 16px;
}
}

2
src/styles/theme/star.scss
Unescape View File

@ -80,7 +80,7 @@
.top-search {
.el-input__inner {
color: #333;
// color: #333;
}
input::-webkit-input-placeholder,

3
src/styles/theme/white.scss
Unescape View File

@ -111,7 +111,8 @@
.top-search {
.el-input__inner {
color: #333;
// color: #333;
color:#fff
}
input::-webkit-input-placeholder,

2
src/styles/top.scss
Unescape View File

@ -13,7 +13,7 @@
.el-menu-item {
i, span {
font-size: 13px;
font-size: 14px;
}
}
}

2
src/styles/variables.scss
Unescape View File

@ -1,5 +1,5 @@
// $sidebar_width: 200px;
$sidebar_width: 260px;
$sidebar_width: 240px;
$sidebar_collapse: 65px;
$top_height: 60px;
// $top_height: 50px;

Write Preview
Loading…
Cancel
Save