<template>
|
<Component :is="currentSignage"
|
:userType="userType"
|
:productionCode="productionCode"
|
:workshopSectionProductionCode="workshopSectionProductionCode"
|
v-if="[1,2,3,4].includes(userType)"
|
>
|
</Component>
|
<div v-else> <!-- 与组件渲染互斥 -->
|
<img src="@/assets/index.png" style="width: 100%;height: 785px">
|
</div>
|
</template>
|
|
<script>
|
import signageApi from '@/api/signage'
|
import MdcManagerSignage from './mdcIndex/MdcManagerSignage.vue'
|
import DncManagerSignage from './dncIndex/DncManagerSignage.vue'
|
|
export default {
|
name: "Analysis",
|
components: {
|
MdcManagerSignage,
|
DncManagerSignage
|
},
|
data() {
|
return {
|
currentSignage: '',
|
productionCode: '',
|
branchFactoryProductionCode: '',
|
workshopSectionProductionCode: '',
|
userType: '',
|
}
|
},
|
created() {
|
this.showModuleByUserInfo()
|
},
|
methods: {
|
showModuleByUserInfo() {
|
// 安全处理:先判断localStorage中是否存在用户信息,避免JSON.parse报错
|
const userInfoStr = localStorage.getItem('pro__Login_Userinfo')
|
if (!userInfoStr) {
|
this.currentSignage = '' // 无用户信息时不渲染组件
|
return
|
}
|
|
const id = JSON.parse(userInfoStr).value.id
|
signageApi.getUserByIdApi(id)
|
.then(res => {
|
this.userType = res.userType // 赋值后自动触发条件渲染判断
|
// 根据userType匹配对应组件(恢复case1和case4的逻辑)
|
switch (this.userType) {
|
// case 1:
|
// //刀具管理
|
// this.currentSignage = 'EquipmentSignage'
|
// break
|
case 2:
|
// mdc
|
this.currentSignage = 'MdcManagerSignage'
|
break
|
case 3:
|
//dnc
|
this.currentSignage = 'DncManagerSignage'
|
break
|
// case 4:
|
// //设备管理
|
// this.currentSignage = 'IndexSignage'
|
// break
|
default:
|
this.currentSignage = ''
|
break
|
}
|
})
|
.catch(err => {
|
// 接口请求失败时,默认显示图片
|
console.error('获取用户类型失败:', err)
|
this.userType = ''
|
this.currentSignage = ''
|
})
|
}
|
}
|
}
|
|
|
</script>
|
<style lang="less" scoped>
|
/deep/ .back-nav {
|
width: 100px;
|
height: 30px;
|
color: #fff;
|
position: absolute;
|
top: 15px;
|
left: 10px;
|
cursor: pointer;
|
z-index: 9999
|
}
|
</style>
|