|
@@ -3,9 +3,12 @@ import { h, watch, ref } from 'vue'
|
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
|
import { NMenu, NScrollbar } from 'naive-ui'
|
|
|
import SvgIcon from '@/components/SvgIcon/index.vue'
|
|
|
+import { useUserStore } from '@/stores/modules/userStore';
|
|
|
|
|
|
+let menuOptions = []
|
|
|
const route = useRoute();
|
|
|
const router = useRouter();
|
|
|
+const userStore = useUserStore();
|
|
|
|
|
|
const activeMenuKey = ref(route.path);
|
|
|
|
|
@@ -13,11 +16,11 @@ watch(() => route.path, currentPath => {
|
|
|
activeMenuKey.value = currentPath;
|
|
|
})
|
|
|
|
|
|
-function renderIcon (props) {
|
|
|
+function renderIcon(props) {
|
|
|
return () => h(SvgIcon, { ...props })
|
|
|
}
|
|
|
|
|
|
-function renderChildrenIcon ({ name, size = '20' }) {
|
|
|
+function renderChildrenIcon({ name, size = '20' }) {
|
|
|
return () => (
|
|
|
<div class="flex items-center justify-center">
|
|
|
{renderIcon({ name, size, class: ['icon-default'] })()}
|
|
@@ -26,86 +29,112 @@ function renderChildrenIcon ({ name, size = '20' }) {
|
|
|
)
|
|
|
}
|
|
|
|
|
|
-function renderLabel (val, url) {
|
|
|
- return url ? (<a href={ url } target="_blank" class="pl-1">{ val }</a>) : (<span class="">{ val }</span>) ;
|
|
|
+function renderLabel(val, url) {
|
|
|
+ return url ? (<a href={url} target="_blank" class="pl-1">{val}</a>) : (<span class="">{val}</span>);
|
|
|
}
|
|
|
|
|
|
-const menuOptions = [
|
|
|
- {
|
|
|
- label: () => renderLabel('智慧总控'),
|
|
|
- icon: renderIcon({ name: 'menu-control' }),
|
|
|
- key: '/'
|
|
|
- },
|
|
|
- {
|
|
|
- label: () => renderLabel('专家问答'),
|
|
|
- icon: renderIcon({ name: 'menu-answers' }),
|
|
|
- key: '/answer'
|
|
|
- },
|
|
|
- {
|
|
|
- label: () => renderLabel('工艺管控'),
|
|
|
- icon: renderIcon({ name: 'menu-analyse' }),
|
|
|
- key: '/analyse',
|
|
|
- children: [
|
|
|
- {
|
|
|
- label: '水质报警',
|
|
|
- icon: renderChildrenIcon({ name: 'menu-analyse-water' }),
|
|
|
- key: '/water-warn',
|
|
|
- },
|
|
|
+
|
|
|
+
|
|
|
+const updateMenOptions = () => {
|
|
|
+ if (userStore.isCheckUser) {
|
|
|
+ menuOptions = [
|
|
|
{
|
|
|
- label: '生化报警',
|
|
|
- icon: renderChildrenIcon({ name: 'menu-analyse-pymol' }),
|
|
|
- key: '/pymol-warn',
|
|
|
+ label: () => renderLabel('专家问答'),
|
|
|
+ icon: renderIcon({ name: 'menu-answers' }),
|
|
|
+ key: '/answer'
|
|
|
},
|
|
|
{
|
|
|
- label: '预测预警',
|
|
|
- icon: renderChildrenIcon({ name: 'menu-analyse-notice' }),
|
|
|
- key: '/forecast-warn',
|
|
|
+ label: () => renderLabel('智慧办公'),
|
|
|
+ icon: renderIcon({ name: 'menu-work' }),
|
|
|
+ key: '/work'
|
|
|
},
|
|
|
{
|
|
|
- label: '智能工单',
|
|
|
- icon: renderChildrenIcon({ name: 'menu-analyse-order' }),
|
|
|
- key: '/work-order',
|
|
|
+ label: () => renderLabel('用户中心'),
|
|
|
+ icon: renderIcon({ name: 'menu-user' }),
|
|
|
+ key: '/user',
|
|
|
}
|
|
|
]
|
|
|
- },
|
|
|
- {
|
|
|
- label: () => renderLabel('成本管控'),
|
|
|
- icon: renderIcon({ name: 'menu-cost-control' }),
|
|
|
- key: '/control',
|
|
|
- children: [
|
|
|
+ } else {
|
|
|
+ menuOptions = [
|
|
|
+ {
|
|
|
+ label: () => renderLabel('智慧总控'),
|
|
|
+ icon: renderIcon({ name: 'menu-control' }),
|
|
|
+ key: '/'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: () => renderLabel('专家问答'),
|
|
|
+ icon: renderIcon({ name: 'menu-answers' }),
|
|
|
+ key: '/answer'
|
|
|
+ },
|
|
|
{
|
|
|
- label: '智适应碳源投加',
|
|
|
- icon: renderChildrenIcon({ name: 'menu-cost-drug' }),
|
|
|
- key: 'medicinal',
|
|
|
+ label: () => renderLabel('工艺管控'),
|
|
|
+ icon: renderIcon({ name: 'menu-analyse' }),
|
|
|
+ key: '/analyse',
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ label: '水质报警',
|
|
|
+ icon: renderChildrenIcon({ name: 'menu-analyse-water' }),
|
|
|
+ key: '/water-warn',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '生化报警',
|
|
|
+ icon: renderChildrenIcon({ name: 'menu-analyse-pymol' }),
|
|
|
+ key: '/pymol-warn',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '预测预警',
|
|
|
+ icon: renderChildrenIcon({ name: 'menu-analyse-notice' }),
|
|
|
+ key: '/forecast-warn',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '智能工单',
|
|
|
+ icon: renderChildrenIcon({ name: 'menu-analyse-order' }),
|
|
|
+ key: '/work-order',
|
|
|
+ }
|
|
|
+ ]
|
|
|
},
|
|
|
- // {
|
|
|
- // label: '精准曝气',
|
|
|
- // icon: renderChildrenIcon({ name: 'menu-cost-accurate' }),
|
|
|
- // key: 'normal-2',
|
|
|
- // },
|
|
|
- // {
|
|
|
- // label: '微生物镜检',
|
|
|
- // icon: renderChildrenIcon({ name: 'menu-cost-microorganism' }),
|
|
|
- // key: 'normal-3',
|
|
|
- // },
|
|
|
{
|
|
|
- label: '碳排放管理',
|
|
|
- icon: renderChildrenIcon({ name: 'menu-carbon-emission' }),
|
|
|
- key: '/carbon',
|
|
|
+ label: () => renderLabel('成本管控'),
|
|
|
+ icon: renderIcon({ name: 'menu-cost-control' }),
|
|
|
+ key: '/control',
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ label: '智适应碳源投加',
|
|
|
+ icon: renderChildrenIcon({ name: 'menu-cost-drug' }),
|
|
|
+ key: 'medicinal',
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // label: '精准曝气',
|
|
|
+ // icon: renderChildrenIcon({ name: 'menu-cost-accurate' }),
|
|
|
+ // key: 'normal-2',
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // label: '微生物镜检',
|
|
|
+ // icon: renderChildrenIcon({ name: 'menu-cost-microorganism' }),
|
|
|
+ // key: 'normal-3',
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ label: '碳排放管理',
|
|
|
+ icon: renderChildrenIcon({ name: 'menu-carbon-emission' }),
|
|
|
+ key: '/carbon',
|
|
|
+ },
|
|
|
+ ]
|
|
|
},
|
|
|
+ {
|
|
|
+ label: () => renderLabel('智慧办公'),
|
|
|
+ icon: renderIcon({ name: 'menu-work' }),
|
|
|
+ key: '/work'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: () => renderLabel('用户中心'),
|
|
|
+ icon: renderIcon({ name: 'menu-user' }),
|
|
|
+ key: '/user',
|
|
|
+ }
|
|
|
]
|
|
|
- },
|
|
|
- {
|
|
|
- label: () => renderLabel('智慧办公'),
|
|
|
- icon: renderIcon({ name: 'menu-work' }),
|
|
|
- key: '/work'
|
|
|
- },
|
|
|
- {
|
|
|
- label: () => renderLabel('用户中心'),
|
|
|
- icon: renderIcon({ name: 'menu-user' }),
|
|
|
- key: '/user',
|
|
|
- },
|
|
|
-]
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+updateMenOptions();
|
|
|
|
|
|
const handleUpdateValue = (key, { url }) => {
|
|
|
if (url) return window.open(url);
|
|
@@ -173,5 +202,4 @@ const handleUpdateValue = (key, { url }) => {
|
|
|
// svg {
|
|
|
// display: none;
|
|
|
// }
|
|
|
-// }
|
|
|
-</style>
|
|
|
+// }</style>
|