| | |
| | | <template> |
| | | <div class="page-container"> |
| | | <!--<index-chart v-if="indexStyle==1"></index-chart>--> |
| | | <!--<index-bdc v-if="indexStyle==2"></index-bdc>--> |
| | | <!--<index-task v-if="indexStyle==3"></index-task>--> |
| | | <!--<div style="width: 100%;text-align: right;margin-top: 20px">--> |
| | | <!--请选择首页样式:--> |
| | | <!--<!–<a-radio-group v-model="indexStyle">–>--> |
| | | <!--<!–<a-radio :value="1">统计图表</a-radio>–>--> |
| | | <!--<!–<a-radio :value="2">统计图表2</a-radio>–>--> |
| | | <!--<!–<a-radio :value="3">任务表格</a-radio>–>--> |
| | | <!--<!–</a-radio-group>–>--> |
| | | <!--</div>--> |
| | | |
| | | <a-list |
| | | :grid="{ gutter: [{xs: 0, sm: 24, md: 24, lg: 56, xl: 64, xxl: 80},20], xs: 1, sm: 2, md: 2, lg: 3, xl: 4, xxl: 4 }" |
| | | :data-source="workshopList"> |
| | | <a-list-item slot="renderItem" slot-scope="item, index"> |
| | | <div class="workshop-name" @click="navigateToWorkshopSignage(item.id)">{{item.workshopName}}</div> |
| | | </a-list-item> |
| | | </a-list> |
| | | |
| | | </div> |
| | | <!--<Component :is="currentSignage" :userType="userType" :productionCode="productionCode"--> |
| | | <!--:workshopSectionProductionCode="workshopSectionProductionCode"--> |
| | | <!--@switchToNextSignage="switchToNextSignage" @backToLastSignage="backToLastSignage">--> |
| | | <!--</Component>--> |
| | | </template> |
| | | |
| | | <script> |
| | | import IndexChart from './IndexChart' |
| | | import IndexTask from './IndexTask' |
| | | import IndexBdc from './IndexBdc' |
| | | import api from '@/api/mdc' |
| | | import signageApi from '@/api/signage' |
| | | import IndexSignage from './IndexSignage.vue' |
| | | import BranchFactorySignage from './BranchFactorySignage.vue' |
| | | import WorkshopSectionSignage from './WorkshopSectionSignage.vue' |
| | | import EquipmentSignage from './EquipmentSignage.vue' |
| | | |
| | | export default { |
| | | name: 'Analysis', |
| | | components: { |
| | | IndexChart, |
| | | IndexTask, |
| | | IndexBdc |
| | | IndexSignage, |
| | | BranchFactorySignage, |
| | | WorkshopSectionSignage, |
| | | EquipmentSignage |
| | | }, |
| | | data() { |
| | | return { |
| | | indexStyle: 1, |
| | | workshopList: [] |
| | | currentSignage: '', |
| | | productionCode: '', |
| | | branchFactoryProductionCode: '', |
| | | workshopSectionProductionCode: '', |
| | | userType: '' |
| | | } |
| | | }, |
| | | created() { |
| | | this.getWorkshopListByApi() |
| | | this.showModuleByUserInfo() |
| | | }, |
| | | mounted() { |
| | | }, |
| | | methods: { |
| | | /** |
| | | * 通过车间Id跳转至相应车间大屏看板 |
| | | * @param id 车间Id |
| | | */ |
| | | navigateToWorkshopSignage(id) { |
| | | const url = this.$router.resolve(`/workshopSignage/${id}`).href |
| | | window.open(url, '_blank') |
| | | showModuleByUserInfo() { |
| | | const id = JSON.parse(localStorage.getItem('pro__Login_Userinfo')).value.id |
| | | signageApi.getUserByIdApi(id) |
| | | .then(res => { |
| | | this.userType = res.userType |
| | | switch (this.userType) { |
| | | case 1: |
| | | this.currentSignage = 'EquipmentSignage' |
| | | break |
| | | case 2: |
| | | this.currentSignage = 'WorkshopSectionSignage' |
| | | break |
| | | case 3: |
| | | this.currentSignage = 'BranchFactorySignage' |
| | | break |
| | | case 4: |
| | | this.currentSignage = 'IndexSignage' |
| | | break |
| | | default: |
| | | this.currentSignage = '' |
| | | break |
| | | } |
| | | }) |
| | | |
| | | }, |
| | | /** |
| | | * 获取车间列表 |
| | | */ |
| | | getWorkshopListByApi() { |
| | | api.getWorkshopListInHomePageApi().then(res => { |
| | | console.log('res', res) |
| | | if (res.result && res.result.length > 0) { |
| | | this.workshopList = res.result |
| | | } |
| | | |
| | | backToLastSignage(signageName) { |
| | | if (signageName === 'Index') this.productionCode = '' |
| | | if (signageName === 'WorkshopSection') this.productionCode = this.workshopSectionProductionCode |
| | | if (signageName === 'BranchFactory') this.productionCode = this.branchFactoryProductionCode |
| | | this.currentSignage = signageName + 'Signage' |
| | | }, |
| | | |
| | | switchToNextSignage(params) { |
| | | console.log('子组件params', params) |
| | | if (params.signageName === 'WorkshopSection') this.branchFactoryProductionCode = this.productionCode |
| | | if (params.signageName === 'Equipment') this.workshopSectionProductionCode = this.productionCode |
| | | this.$nextTick(() => { |
| | | this.productionCode = params.productionCode |
| | | this.currentSignage = params.signageName + 'Signage' |
| | | }) |
| | | } |
| | | } |
| | |
| | | </script> |
| | | |
| | | <style lang="less" scoped> |
| | | .page-container { |
| | | padding: 30px 30px 0; |
| | | |
| | | .workshop-name { |
| | | width: 100%; |
| | | background: #fff; |
| | | padding: 55px 0; |
| | | border-radius: 20px; |
| | | text-align: center; |
| | | white-space: nowrap; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | font-size: 30px; |
| | | cursor: pointer; |
| | | } |
| | | /deep/ .back-nav { |
| | | width: 100px; |
| | | height: 30px; |
| | | color: #fff; |
| | | position: absolute; |
| | | top: 15px; |
| | | left: 10px; |
| | | cursor: pointer; |
| | | z-index: 9999 |
| | | } |
| | | |
| | | </style> |