|
@@ -1,32 +1,38 @@
|
|
|
<template>
|
|
<template>
|
|
|
<div class="workbench-bos" :class="isOpen ? 'workbench-bos1' : 'workbench-bos2'">
|
|
<div class="workbench-bos" :class="isOpen ? 'workbench-bos1' : 'workbench-bos2'">
|
|
|
|
|
+ <!-- 展开状态 -->
|
|
|
<div class="workbench-box1" v-if="isOpen">
|
|
<div class="workbench-box1" v-if="isOpen">
|
|
|
<div class="workbench-expand1 flex-row-start" @click="onOpen">
|
|
<div class="workbench-expand1 flex-row-start" @click="onOpen">
|
|
|
<img src="@/assets/images/layout/workbench.png" alt="" />
|
|
<img src="@/assets/images/layout/workbench.png" alt="" />
|
|
|
<div>收起菜单</div>
|
|
<div>收起菜单</div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div v-for="(item1, index1) in menuList" :key="index1" class="menu-list1" @click="toggleMenu(item1.path)">
|
|
|
|
|
- <div class="menu-head1 flex-row-between">
|
|
|
|
|
- <div class="menu-title1 flex-row-start">
|
|
|
|
|
- <img :src="item1.icon" alt="" />
|
|
|
|
|
- <div>{{ item1.title }}</div>
|
|
|
|
|
|
|
+ <!-- 修改点1: 增加 v-if="item1.show" 过滤无权限菜单 -->
|
|
|
|
|
+ <template v-for="(item1, index1) in menuList" :key="index1">
|
|
|
|
|
+ <div class="menu-list1" v-if="item1.show" @click="toggleMenu(item1.path)">
|
|
|
|
|
+ <div class="menu-head1 flex-row-between">
|
|
|
|
|
+ <div class="menu-title1 flex-row-start">
|
|
|
|
|
+ <img :src="item1.icon" alt="" />
|
|
|
|
|
+ <div>{{ item1.title }}</div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <el-icon v-if="openedMenus.includes(item1.path)" size="14">
|
|
|
|
|
+ <ArrowDown />
|
|
|
|
|
+ </el-icon>
|
|
|
|
|
+ <el-icon v-else size="14">
|
|
|
|
|
+ <ArrowRight />
|
|
|
|
|
+ </el-icon>
|
|
|
</div>
|
|
</div>
|
|
|
- <el-icon v-if="openedMenus.includes(item1.path)" size="14"><ArrowDown /></el-icon>
|
|
|
|
|
- <el-icon v-else size="14"><ArrowRight /></el-icon>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="menu-item" v-show="openedMenus.includes(item1.path)">
|
|
|
|
|
- <div
|
|
|
|
|
- @click.stop="onPath(item2.path)"
|
|
|
|
|
- v-for="(item2, index2) in item1.children"
|
|
|
|
|
- :key="index2"
|
|
|
|
|
- class="menu-box"
|
|
|
|
|
- :class="{ 'menu-hig': activeMenu == item2.path }"
|
|
|
|
|
- >
|
|
|
|
|
- {{ item2.title }}
|
|
|
|
|
|
|
+ <div class="menu-item" v-show="openedMenus.includes(item1.path)">
|
|
|
|
|
+ <template v-for="(item2, index2) in item1.children" :key="index2">
|
|
|
|
|
+ <div @click.stop="onPath(item2.path)" class="menu-box" :class="{ 'menu-hig': activeMenu == item2.path }">
|
|
|
|
|
+ {{ item2.title }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
|
|
+ </template>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 收起状态 -->
|
|
|
<div v-else class="workbench-box2">
|
|
<div v-else class="workbench-box2">
|
|
|
<div class="workbench-expand2 flex-row-center" @click="onOpen">
|
|
<div class="workbench-expand2 flex-row-center" @click="onOpen">
|
|
|
<div class="menu-icon flex-row-center">
|
|
<div class="menu-icon flex-row-center">
|
|
@@ -34,30 +40,30 @@
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
- <div v-for="(item1, index1) in menuList" :key="index1" class="workbench-expand2 flex-row-center">
|
|
|
|
|
- <el-popover placement="right">
|
|
|
|
|
- <template #reference>
|
|
|
|
|
- <div class="menu-icon flex-row-center" :class="{ 'hig': openedMenus.includes(item1.path) }">
|
|
|
|
|
- <img :src="item1.icon" alt="" />
|
|
|
|
|
- </div>
|
|
|
|
|
- </template>
|
|
|
|
|
- <div class="popover-bos">
|
|
|
|
|
- <div class="popover-title">{{ item1.title }}</div>
|
|
|
|
|
- <div
|
|
|
|
|
- class="popover-list"
|
|
|
|
|
- :class="{ 'popover-hig': activeMenu == item2.path }"
|
|
|
|
|
- v-for="(item2, index2) in item1.children"
|
|
|
|
|
- :key="index2"
|
|
|
|
|
- @click="onPath(item2.path)"
|
|
|
|
|
- >
|
|
|
|
|
- {{ item2.title }}
|
|
|
|
|
|
|
+ <!-- 修改点2: 增加 v-if="item1.show" 过滤无权限菜单 -->
|
|
|
|
|
+ <template v-for="(item1, index1) in menuList" :key="index1">
|
|
|
|
|
+ <div class="workbench-expand2 flex-row-center" v-if="item1.show">
|
|
|
|
|
+ <el-popover placement="right">
|
|
|
|
|
+ <template #reference>
|
|
|
|
|
+ <div class="menu-icon flex-row-center" :class="{ 'hig': openedMenus.includes(item1.path) }">
|
|
|
|
|
+ <img :src="item1.icon" alt="" />
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="popover-bos">
|
|
|
|
|
+ <div class="popover-title">{{ item1.title }}</div>
|
|
|
|
|
+ <template v-for="(item2, index2) in item1.children" :key="index2">
|
|
|
|
|
+ <div class="popover-list" :class="{ 'popover-hig': activeMenu == item2.path }" @click="onPath(item2.path)">
|
|
|
|
|
+ {{ item2.title }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
- </el-popover>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ </el-popover>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
+
|
|
|
<script setup lang="ts">
|
|
<script setup lang="ts">
|
|
|
import workbench1 from '@/assets/images/layout/workbench1.png';
|
|
import workbench1 from '@/assets/images/layout/workbench1.png';
|
|
|
import workbench2 from '@/assets/images/layout/workbench2.png';
|
|
import workbench2 from '@/assets/images/layout/workbench2.png';
|
|
@@ -66,19 +72,41 @@ import workbench4 from '@/assets/images/layout/workbench4.png';
|
|
|
import workbench5 from '@/assets/images/layout/workbench5.png';
|
|
import workbench5 from '@/assets/images/layout/workbench5.png';
|
|
|
import workbench6 from '@/assets/images/layout/workbench6.png';
|
|
import workbench6 from '@/assets/images/layout/workbench6.png';
|
|
|
import workbench7 from '@/assets/images/layout/workbench7.png';
|
|
import workbench7 from '@/assets/images/layout/workbench7.png';
|
|
|
|
|
+import { getWorkbenchMenuList } from '@/api/pc/system/index';
|
|
|
import { onPath } from '@/utils/siteConfig';
|
|
import { onPath } from '@/utils/siteConfig';
|
|
|
|
|
+import { useRouter } from 'vue-router';
|
|
|
|
|
+import { getInfo } from '@/api/login';
|
|
|
|
|
+import { el } from 'element-plus/es/locale/index.mjs';
|
|
|
|
|
+
|
|
|
|
|
+const router = useRouter();
|
|
|
const isOpen = ref(false);
|
|
const isOpen = ref(false);
|
|
|
const openedMenus = ref<string[]>([]);
|
|
const openedMenus = ref<string[]>([]);
|
|
|
const route = useRoute();
|
|
const route = useRoute();
|
|
|
const menuIndex = ref<any>(0);
|
|
const menuIndex = ref<any>(0);
|
|
|
-const menuList = [
|
|
|
|
|
|
|
+
|
|
|
|
|
+interface MenuItemChild {
|
|
|
|
|
+ path: string;
|
|
|
|
|
+ title: string;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+interface MenuItem {
|
|
|
|
|
+ path: string;
|
|
|
|
|
+ title: string;
|
|
|
|
|
+ icon: string;
|
|
|
|
|
+ children?: MenuItemChild[];
|
|
|
|
|
+ show?: boolean;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 注意:这里定义的是完整的全量菜单结构,后续会根据权限动态修改 children 和 show
|
|
|
|
|
+const menuList = ref<MenuItem[]>([
|
|
|
{
|
|
{
|
|
|
path: '/enterprise',
|
|
path: '/enterprise',
|
|
|
title: '企业账户',
|
|
title: '企业账户',
|
|
|
icon: workbench1,
|
|
icon: workbench1,
|
|
|
|
|
+ show: false,
|
|
|
children: [
|
|
children: [
|
|
|
{ path: '/enterprise/companyInfo', title: '企业信息' },
|
|
{ path: '/enterprise/companyInfo', title: '企业信息' },
|
|
|
- { path: '/enterprise/messageNotice', title: '消息通知' },
|
|
|
|
|
|
|
+ { path: '/enterprise/messageNotice', title: '消息通知' }, // 接口没返这个,应该被过滤
|
|
|
{ path: '/easybuv', title: '地址管理' },
|
|
{ path: '/easybuv', title: '地址管理' },
|
|
|
{ path: '/enterprise/invoiceManage', title: '发票抬头管理' },
|
|
{ path: '/enterprise/invoiceManage', title: '发票抬头管理' },
|
|
|
{ path: '/enterprise/purchasePlan', title: '专属采购方案' },
|
|
{ path: '/enterprise/purchasePlan', title: '专属采购方案' },
|
|
@@ -92,6 +120,7 @@ const menuList = [
|
|
|
path: '/order',
|
|
path: '/order',
|
|
|
title: '交易管理',
|
|
title: '交易管理',
|
|
|
icon: workbench2,
|
|
icon: workbench2,
|
|
|
|
|
+ show: false,
|
|
|
children: [
|
|
children: [
|
|
|
{ path: '/order/orderManage', title: '订单管理' },
|
|
{ path: '/order/orderManage', title: '订单管理' },
|
|
|
{ path: '/order/orderAudit', title: '审核订单' },
|
|
{ path: '/order/orderAudit', title: '审核订单' },
|
|
@@ -104,6 +133,7 @@ const menuList = [
|
|
|
path: '/organization',
|
|
path: '/organization',
|
|
|
title: '组织管理',
|
|
title: '组织管理',
|
|
|
icon: workbench3,
|
|
icon: workbench3,
|
|
|
|
|
+ show: false,
|
|
|
children: [
|
|
children: [
|
|
|
{ path: '/i', title: '个人信息' },
|
|
{ path: '/i', title: '个人信息' },
|
|
|
{ path: '/organization/deptManage', title: '部门管理' },
|
|
{ path: '/organization/deptManage', title: '部门管理' },
|
|
@@ -117,6 +147,7 @@ const menuList = [
|
|
|
path: '/cost',
|
|
path: '/cost',
|
|
|
title: '成本管理',
|
|
title: '成本管理',
|
|
|
icon: workbench4,
|
|
icon: workbench4,
|
|
|
|
|
+ show: false,
|
|
|
children: [
|
|
children: [
|
|
|
{ path: '/cost/itemExpense', title: '分项费用' },
|
|
{ path: '/cost/itemExpense', title: '分项费用' },
|
|
|
{ path: '/cost/quotaControl', title: '额度控制' }
|
|
{ path: '/cost/quotaControl', title: '额度控制' }
|
|
@@ -126,6 +157,7 @@ const menuList = [
|
|
|
path: '/reconciliation',
|
|
path: '/reconciliation',
|
|
|
title: '对账管理',
|
|
title: '对账管理',
|
|
|
icon: workbench5,
|
|
icon: workbench5,
|
|
|
|
|
+ show: false,
|
|
|
children: [
|
|
children: [
|
|
|
{ path: '/reconciliation/billManage', title: '对账单管理' },
|
|
{ path: '/reconciliation/billManage', title: '对账单管理' },
|
|
|
{ path: '/reconciliation/invoiceManage', title: '开票管理' }
|
|
{ path: '/reconciliation/invoiceManage', title: '开票管理' }
|
|
@@ -135,6 +167,7 @@ const menuList = [
|
|
|
path: '/valueAdded',
|
|
path: '/valueAdded',
|
|
|
title: '增值服务',
|
|
title: '增值服务',
|
|
|
icon: workbench6,
|
|
icon: workbench6,
|
|
|
|
|
+ show: false,
|
|
|
children: [
|
|
children: [
|
|
|
{ path: '/valueAdded/maintenance', title: '维保服务' },
|
|
{ path: '/valueAdded/maintenance', title: '维保服务' },
|
|
|
{ path: '/valueAdded/complaint', title: '投诉与建议' }
|
|
{ path: '/valueAdded/complaint', title: '投诉与建议' }
|
|
@@ -144,6 +177,7 @@ const menuList = [
|
|
|
path: '/analysis',
|
|
path: '/analysis',
|
|
|
title: '采购分析',
|
|
title: '采购分析',
|
|
|
icon: workbench7,
|
|
icon: workbench7,
|
|
|
|
|
+ show: false,
|
|
|
children: [
|
|
children: [
|
|
|
{ path: '/analysis/orderAnalysis', title: '订单交易分析' },
|
|
{ path: '/analysis/orderAnalysis', title: '订单交易分析' },
|
|
|
{ path: '/analysis/purchaseDetail', title: '商品采购明细' },
|
|
{ path: '/analysis/purchaseDetail', title: '商品采购明细' },
|
|
@@ -152,22 +186,101 @@ const menuList = [
|
|
|
{ path: '/analysis/deptPurchase', title: '部门采购金额' }
|
|
{ path: '/analysis/deptPurchase', title: '部门采购金额' }
|
|
|
]
|
|
]
|
|
|
}
|
|
}
|
|
|
-];
|
|
|
|
|
|
|
+]);
|
|
|
|
|
|
|
|
const activeMenu = computed(() => route.path);
|
|
const activeMenu = computed(() => route.path);
|
|
|
|
|
+const userInfo = ref<any>({});
|
|
|
|
|
+
|
|
|
const onOpen = () => {
|
|
const onOpen = () => {
|
|
|
isOpen.value = !isOpen.value;
|
|
isOpen.value = !isOpen.value;
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
-onMounted(() => {
|
|
|
|
|
|
|
+const allowedPaths = ref<Set<string>>(new Set());
|
|
|
|
|
+
|
|
|
|
|
+const processMenuPermissions = (apiMenuList: any[]) => {
|
|
|
|
|
+ // 1. 收集接口返回的所有合法 path
|
|
|
|
|
+ const paths = new Set<string>();
|
|
|
|
|
+ const traverse = (items: any[]) => {
|
|
|
|
|
+ items.forEach((item) => {
|
|
|
|
|
+ // 统一格式:确保以 / 开头
|
|
|
|
|
+ const p = item.path.startsWith('/') ? item.path : `/${item.path}`;
|
|
|
|
|
+ paths.add(p);
|
|
|
|
|
+ if (item.children && item.children.length > 0) {
|
|
|
|
|
+ traverse(item.children);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ };
|
|
|
|
|
+ traverse(apiMenuList);
|
|
|
|
|
+ allowedPaths.value = paths;
|
|
|
|
|
+
|
|
|
|
|
+ // 2. 更新本地 menuList:过滤子菜单并设置父级显示状态
|
|
|
|
|
+ menuList.value.forEach((menu) => {
|
|
|
|
|
+ if (!menu.children) {
|
|
|
|
|
+ menu.show = false;
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 【核心修改】过滤出有权限的子菜单
|
|
|
|
|
+ const permittedChildren = menu.children.filter((child) => {
|
|
|
|
|
+ const childPath = child.path.startsWith('/') ? child.path : `/${child.path}`;
|
|
|
|
|
+ return paths.has(childPath);
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ // 将过滤后的子菜单重新赋值给 menu.children
|
|
|
|
|
+ // 这样模板里 v-for 循环时就只有有权限的子项了
|
|
|
|
|
+ menu.children = permittedChildren;
|
|
|
|
|
+
|
|
|
|
|
+ // 如果过滤后还有子菜单,则显示父级;否则隐藏父级
|
|
|
|
|
+ menu.show = permittedChildren.length > 0;
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ checkCurrentRoutePermission();
|
|
|
|
|
+
|
|
|
|
|
+ // 权限处理完后,重新计算展开状态
|
|
|
initOpenedMenus();
|
|
initOpenedMenus();
|
|
|
|
|
+};
|
|
|
|
|
|
|
|
|
|
+const checkCurrentRoutePermission = () => {
|
|
|
|
|
+ const currentPath = route.path;
|
|
|
|
|
+ const publicPaths = ['/', '/login', '/404'];
|
|
|
|
|
+ if (!publicPaths.includes(currentPath) && !allowedPaths.value.has(currentPath)) {
|
|
|
|
|
+ router.push('/');
|
|
|
|
|
+ }
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+onMounted(() => {
|
|
|
if (window.innerWidth > 1420) {
|
|
if (window.innerWidth > 1420) {
|
|
|
isOpen.value = true;
|
|
isOpen.value = true;
|
|
|
} else {
|
|
} else {
|
|
|
isOpen.value = false;
|
|
isOpen.value = false;
|
|
|
}
|
|
}
|
|
|
window.addEventListener('resize', handleResize);
|
|
window.addEventListener('resize', handleResize);
|
|
|
|
|
+
|
|
|
|
|
+ getInfo().then((res1) => {
|
|
|
|
|
+ if (res1.code == 200) {
|
|
|
|
|
+ userInfo.value = res1.data;
|
|
|
|
|
+ if (res1.data && res1.data.user?.userSonType == 4) {
|
|
|
|
|
+ menuList.value.forEach((item1: any) => {
|
|
|
|
|
+ if (item1.path == '/enterprise') {
|
|
|
|
|
+ item1.show = false;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ item1.show = true;
|
|
|
|
|
+ }
|
|
|
|
|
+ item1.children.forEach((item2: any) => {
|
|
|
|
|
+ item2.show = true;
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
|
|
+ initOpenedMenus();
|
|
|
|
|
+ } else {
|
|
|
|
|
+ getWorkbenchMenuList().then((res: any) => {
|
|
|
|
|
+ const apiData = res.data || res;
|
|
|
|
|
+ if (Array.isArray(apiData)) {
|
|
|
|
|
+ processMenuPermissions(apiData);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
const handleResize = () => {
|
|
const handleResize = () => {
|
|
@@ -178,13 +291,20 @@ const handleResize = () => {
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
-// 根据当前路由自动展开对应的父级菜单
|
|
|
|
|
const initOpenedMenus = () => {
|
|
const initOpenedMenus = () => {
|
|
|
const currentPath = route.path;
|
|
const currentPath = route.path;
|
|
|
- for (const menu of menuList) {
|
|
|
|
|
- const hasActiveChild = menu.children?.some((child) => currentPath === child.path || currentPath.startsWith(child.path + '/'));
|
|
|
|
|
|
|
+ openedMenus.value = [];
|
|
|
|
|
+
|
|
|
|
|
+ for (const menu of menuList.value) {
|
|
|
|
|
+ if (!menu.show) continue;
|
|
|
|
|
+
|
|
|
|
|
+ // 此时 menu.children 已经是过滤后的干净数据
|
|
|
|
|
+ const hasActiveChild = menu.children?.some((child) => {
|
|
|
|
|
+ const childPath = child.path.startsWith('/') ? child.path : `/${child.path}`;
|
|
|
|
|
+ return currentPath === childPath || currentPath.startsWith(childPath + '/');
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
if (hasActiveChild) {
|
|
if (hasActiveChild) {
|
|
|
- // 只展开当前路由对应的菜单
|
|
|
|
|
openedMenus.value = [menu.path];
|
|
openedMenus.value = [menu.path];
|
|
|
return;
|
|
return;
|
|
|
}
|
|
}
|
|
@@ -194,10 +314,8 @@ const initOpenedMenus = () => {
|
|
|
const toggleMenu = (path: string) => {
|
|
const toggleMenu = (path: string) => {
|
|
|
const index = openedMenus.value.indexOf(path);
|
|
const index = openedMenus.value.indexOf(path);
|
|
|
if (index > -1) {
|
|
if (index > -1) {
|
|
|
- // 如果已展开,则收起
|
|
|
|
|
openedMenus.value.splice(index, 1);
|
|
openedMenus.value.splice(index, 1);
|
|
|
} else {
|
|
} else {
|
|
|
- // 手风琴效果:先收起所有,再展开当前
|
|
|
|
|
openedMenus.value = [path];
|
|
openedMenus.value = [path];
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
@@ -206,11 +324,15 @@ watch(
|
|
|
() => route.path,
|
|
() => route.path,
|
|
|
() => {
|
|
() => {
|
|
|
initOpenedMenus();
|
|
initOpenedMenus();
|
|
|
|
|
+ if (userInfo.value && userInfo.value.user.userSonType != 4) {
|
|
|
|
|
+ checkCurrentRoutePermission();
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
);
|
|
);
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
|
|
|
+/* 样式保持不变 */
|
|
|
.workbench-bos {
|
|
.workbench-bos {
|
|
|
// position: absolute;
|
|
// position: absolute;
|
|
|
// top: 0;
|
|
// top: 0;
|
|
@@ -221,6 +343,7 @@ watch(
|
|
|
border-radius: 10px;
|
|
border-radius: 10px;
|
|
|
padding: 10px 8px;
|
|
padding: 10px 8px;
|
|
|
width: 180px;
|
|
width: 180px;
|
|
|
|
|
+
|
|
|
.workbench-expand1 {
|
|
.workbench-expand1 {
|
|
|
height: 42px;
|
|
height: 42px;
|
|
|
width: 100%;
|
|
width: 100%;
|
|
@@ -228,30 +351,37 @@ watch(
|
|
|
color: #1d2129;
|
|
color: #1d2129;
|
|
|
padding-left: 12px;
|
|
padding-left: 12px;
|
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
|
|
|
+
|
|
|
&:hover {
|
|
&:hover {
|
|
|
color: #e60012;
|
|
color: #e60012;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
img {
|
|
img {
|
|
|
height: 16px;
|
|
height: 16px;
|
|
|
width: 16px;
|
|
width: 16px;
|
|
|
margin-right: 8px;
|
|
margin-right: 8px;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
.menu-list1 {
|
|
.menu-list1 {
|
|
|
width: calc(100% - 24px);
|
|
width: calc(100% - 24px);
|
|
|
border-bottom: 1px #e5e6eb solid;
|
|
border-bottom: 1px #e5e6eb solid;
|
|
|
margin: 0 12px;
|
|
margin: 0 12px;
|
|
|
|
|
+
|
|
|
&:nth-last-child(1) {
|
|
&:nth-last-child(1) {
|
|
|
border-bottom: none;
|
|
border-bottom: none;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
.menu-head1 {
|
|
.menu-head1 {
|
|
|
height: 54px;
|
|
height: 54px;
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
color: #1d2129;
|
|
color: #1d2129;
|
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
|
|
|
+
|
|
|
&:hover {
|
|
&:hover {
|
|
|
color: #e60012;
|
|
color: #e60012;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
.menu-title1 {
|
|
.menu-title1 {
|
|
|
font-size: 14px;
|
|
font-size: 14px;
|
|
|
|
|
|
|
@@ -262,8 +392,10 @@ watch(
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
.menu-item {
|
|
.menu-item {
|
|
|
padding-bottom: 5px;
|
|
padding-bottom: 5px;
|
|
|
|
|
+
|
|
|
.menu-box {
|
|
.menu-box {
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
height: 36px;
|
|
height: 36px;
|
|
@@ -273,10 +405,12 @@ watch(
|
|
|
padding-left: 12px;
|
|
padding-left: 12px;
|
|
|
line-height: 36px;
|
|
line-height: 36px;
|
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
|
|
|
+
|
|
|
&.menu-hig {
|
|
&.menu-hig {
|
|
|
background: #f7f8fa;
|
|
background: #f7f8fa;
|
|
|
color: #e60012;
|
|
color: #e60012;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
&:hover {
|
|
&:hover {
|
|
|
color: #e60012;
|
|
color: #e60012;
|
|
|
}
|
|
}
|
|
@@ -291,17 +425,21 @@ watch(
|
|
|
border-radius: 10px;
|
|
border-radius: 10px;
|
|
|
padding: 10px 8px;
|
|
padding: 10px 8px;
|
|
|
width: 50px;
|
|
width: 50px;
|
|
|
|
|
+
|
|
|
.workbench-expand2 {
|
|
.workbench-expand2 {
|
|
|
width: 34px;
|
|
width: 34px;
|
|
|
height: 36px;
|
|
height: 36px;
|
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
|
position: relative;
|
|
position: relative;
|
|
|
|
|
+
|
|
|
.menu-icon {
|
|
.menu-icon {
|
|
|
width: 24px;
|
|
width: 24px;
|
|
|
height: 24px;
|
|
height: 24px;
|
|
|
|
|
+
|
|
|
&.hig {
|
|
&.hig {
|
|
|
background-color: #ffe8e8;
|
|
background-color: #ffe8e8;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
img {
|
|
img {
|
|
|
height: 16px;
|
|
height: 16px;
|
|
|
width: 16px;
|
|
width: 16px;
|
|
@@ -319,33 +457,12 @@ watch(
|
|
|
border-radius: 10px;
|
|
border-radius: 10px;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- // .workbench-expand2 {
|
|
|
|
|
- // width: 24px;
|
|
|
|
|
- // height: 24px;
|
|
|
|
|
- // cursor: pointer;
|
|
|
|
|
- // margin: 16px auto;
|
|
|
|
|
- // position: relative;
|
|
|
|
|
- // &:hover {
|
|
|
|
|
- // background-color: #ffe8e8;
|
|
|
|
|
- // }
|
|
|
|
|
- // &::after {
|
|
|
|
|
- // content: '';
|
|
|
|
|
- // width: 10px;
|
|
|
|
|
- // height: 1px;
|
|
|
|
|
- // background-color: #e5e6eb;
|
|
|
|
|
- // position: absolute;
|
|
|
|
|
- // left: 7px;
|
|
|
|
|
- // bottom: -10px;
|
|
|
|
|
- // }
|
|
|
|
|
- // img {
|
|
|
|
|
- // height: 16px;
|
|
|
|
|
- // width: 16px;
|
|
|
|
|
- // }
|
|
|
|
|
- // }
|
|
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
&.workbench-bos1 {
|
|
&.workbench-bos1 {
|
|
|
left: -200px;
|
|
left: -200px;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
&.workbench-bos2 {
|
|
&.workbench-bos2 {
|
|
|
left: -70px;
|
|
left: -70px;
|
|
|
}
|
|
}
|
|
@@ -358,6 +475,7 @@ watch(
|
|
|
margin-bottom: 7px;
|
|
margin-bottom: 7px;
|
|
|
padding-left: 4px;
|
|
padding-left: 4px;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
.popover-list {
|
|
.popover-list {
|
|
|
width: 120px;
|
|
width: 120px;
|
|
|
height: 32px;
|
|
height: 32px;
|
|
@@ -366,9 +484,11 @@ watch(
|
|
|
line-height: 32px;
|
|
line-height: 32px;
|
|
|
padding-left: 4px;
|
|
padding-left: 4px;
|
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
|
|
|
+
|
|
|
&:hover {
|
|
&:hover {
|
|
|
color: var(--el-color-primary);
|
|
color: var(--el-color-primary);
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
&.popover-hig {
|
|
&.popover-hig {
|
|
|
background: #ffe8e8;
|
|
background: #ffe8e8;
|
|
|
}
|
|
}
|