135 lines
4.1 KiB
Vue
135 lines
4.1 KiB
Vue
<template>
|
|
<div class="footer flx-align-center pl10">
|
|
<el-dropdown>
|
|
<div class="change_mode">
|
|
{{ title }}
|
|
<el-icon class="el-icon--right change_mode_down"><arrow-down /></el-icon>
|
|
<el-icon class="el-icon--right change_mode_up"><arrow-up /></el-icon>
|
|
</div>
|
|
<template #dropdown>
|
|
<el-dropdown-menu>
|
|
<el-dropdown-item
|
|
v-for="item in modeList"
|
|
:key="item.key"
|
|
:disabled="!item.activated"
|
|
@click="handelOpen(item.code, item.key)"
|
|
>
|
|
{{ item.name }}
|
|
</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</template>
|
|
</el-dropdown>
|
|
<p style="margin: 0">
|
|
<a href="http://www.shining-electric.com/" target="_blank">2024 © 南京灿能电力自动化股份有限公司</a>
|
|
</p>
|
|
</div>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
import { computed } from 'vue'
|
|
import { useAuthStore } from '@/stores/modules/auth'
|
|
import { useModeStore } from '@/stores/modules/mode' // 引入模式 store
|
|
import { useTabsStore } from '@/stores/modules/tabs'
|
|
import { useRouter } from 'vue-router'
|
|
import { initDynamicRouter } from '@/routers/modules/dynamicRouter'
|
|
|
|
const router = useRouter()
|
|
const authStore = useAuthStore()
|
|
const modeStore = useModeStore()
|
|
const tabsStore = useTabsStore()
|
|
|
|
const title = computed(() => {
|
|
return modeStore.currentMode === '' ? '选择模块' : modeStore.currentMode + '模块'
|
|
})
|
|
const activateInfo = authStore.activateInfo
|
|
const isActivateOpen = import.meta.env.VITE_ACTIVATE_OPEN
|
|
const modeList = [
|
|
{
|
|
name: '模拟式模块',
|
|
code: '模拟式',
|
|
key: 'simulate',
|
|
activated: isActivateOpen === 'true' ? activateInfo.simulate.permanently === 1 : true
|
|
},
|
|
{
|
|
name: '数字式模块',
|
|
code: '数字式',
|
|
key: 'digital',
|
|
activated: isActivateOpen === 'true' ? activateInfo.digital.permanently === 1 : true
|
|
},
|
|
{
|
|
name: '比对式模块',
|
|
code: '比对式',
|
|
key: 'contrast',
|
|
activated: isActivateOpen === 'true' ? activateInfo.contrast.permanently === 1 : true
|
|
}
|
|
]
|
|
const handelOpen = async (item: string, key: string) => {
|
|
if (isActivateOpen === 'true' && activateInfo[key].permanently !== 1) {
|
|
ElMessage.warning(`${item}模块未激活`)
|
|
return
|
|
}
|
|
await authStore.setShowMenu()
|
|
modeStore.setCurrentMode(item) // 将模式code存入 store
|
|
// 强制刷新页面
|
|
await tabsStore.closeMultipleTab()
|
|
await initDynamicRouter()
|
|
|
|
// 只有当目标路径与当前路径不同时才跳转
|
|
if (router.currentRoute.value.path !== '/home/index') {
|
|
await router.push({ path: '/home/index' })
|
|
} else {
|
|
// 如果已在目标页面，手动触发组件更新
|
|
window.location.reload() // 或者采用其他方式刷新数据
|
|
}
|
|
|
|
}
|
|
</script>
|
|
<style scoped lang="scss">
|
|
@use './index.scss';
|
|
.footer {
|
|
position: relative;
|
|
background-color: var(--el-color-primary);
|
|
// .el-button:hover {
|
|
// background-color: var(--el-color-primary) !important;
|
|
// border: none !important;
|
|
// outline: none !important;
|
|
// }
|
|
.change_mode {
|
|
color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
height: 100%;
|
|
width: auto;
|
|
font-size: 14px;
|
|
.change_mode_down {
|
|
display: block;
|
|
}
|
|
.change_mode_up {
|
|
display: none;
|
|
}
|
|
}
|
|
.change_mode:hover {
|
|
.change_mode_down {
|
|
display: none;
|
|
}
|
|
.change_mode_up {
|
|
display: block;
|
|
}
|
|
}
|
|
.el-dropdown {
|
|
z-index: 1001;
|
|
}
|
|
p {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
text-align: right;
|
|
line-height: 40px;
|
|
a {
|
|
color: #fff;
|
|
margin-right: 25px; // 增加右边距
|
|
}
|
|
}
|
|
}
|
|
</style>
|