From 958233d0bb26417d5b51e68ecc1cfb9410fcdccc Mon Sep 17 00:00:00 2001 From: “linengliang” <vanSuperEnergy@163.com> Date: 星期二, 21 十一月 2023 20:30:02 +0800 Subject: [PATCH] ABC评分签审 --- src/views/WorkshopSignage.vue | 130 +++++++++++++++++++++++++++++-------------- 1 files changed, 88 insertions(+), 42 deletions(-) diff --git a/src/views/WorkshopSignage.vue b/src/views/WorkshopSignage.vue index d13018c..81b35a5 100644 --- a/src/views/WorkshopSignage.vue +++ b/src/views/WorkshopSignage.vue @@ -1,62 +1,85 @@ <template> <dv-full-screen-container class="full-screen-container"> <header class="page-header"> - {{workshopDetails.workshopName}} + {{ workshopDetails.workshopName }} <div class="header-right" v-has="'home:saveDevicePositionAndSize'"> <a-space> <span v-if="!isSwitchChecked">寮�鍚姛鑳�</span> <span v-else>鍏抽棴鍔熻兘</span> - <a-switch checked-children="寮�" un-checked-children="鍏�" @change="handleSwitchChange" - v-model="isSwitchChecked" :disabled="isSwitchChecked"/> + <a-switch + checked-children="寮�" + un-checked-children="鍏�" + @change="handleSwitchChange" + v-model="isSwitchChecked" + :disabled="isSwitchChecked" + /> </a-space> - <a-button type="primary" icon="save" size="large" @click="saveDevicePositionAndSizeByApi" - >淇濆瓨浣嶇疆 - </a-button> + <a-button type="primary" icon="save" size="large" @click="saveDevicePositionAndSizeByApi">淇濆瓨浣嶇疆 </a-button> </div> </header> <dv-border-box-8> <div class="content-container" ref="deviceContainerRef"> - <VueDragResize v-for="(item,index) in deviceList" :key="item.equipmentId" :w="item.vw" - :h="item.vh" :x="item.coordinateLeft" :y="item.coordinateTop" - v-on:resizing="resize($event,index)" - v-on:dragging="resize($event,index)" - :parentLimitation="true" - :minw="100" - :minh="100" - :isDraggable="isDraggable" - :isResizable="isResizable" - :stickSize="6" + <VueDragResize + v-for="(item, index) in deviceList" + :key="item.equipmentId" + :w="item.vw" + :h="item.vh" + :x="item.coordinateLeft" + :y="item.coordinateTop" + v-on:resizing="resize($event, index)" + v-on:dragging="resize($event, index)" + :parentLimitation="true" + :minw="100" + :minh="100" + :isDraggable="isDraggable" + :isResizable="isResizable" + :stickSize="6" > - <div class="single-device" - :style="{width: item.vw+ 'px',height:item.vh+'px'}"> + <div class="single-device" :style="{ width: item.vw + 'px', height: item.vh + 'px' }" + @mouseenter="openDetail(item)"> <div class="device-status"> - <div v-if="item.equipmentStatus==2||item.equipmentStatus==1" - :style="{backgroundImage:`url(${require('@/assets/yellow.png')})`}" class="status-image"></div> - <div v-if="item.equipmentStatus==22" :style="{backgroundImage:`url(${require('@/assets/red.png')})`}" - class="status-image"></div> - <div v-if="item.equipmentStatus==0" :style="{backgroundImage:`url(${require('@/assets/gray.png')})`}" - class="status-image"></div> - <div v-if="item.equipmentStatus==3" :style="{backgroundImage:`url(${require('@/assets/green.png')})`}" - class="status-image"></div> <div - :style="{backgroundImage:`url(${getImgView(item.equipmentImage)||require('@/assets/8.png')})`}" - class="device-image"></div> + v-if="item.equipmentStatus == 2 || item.equipmentStatus == 1" + :style="{ backgroundImage: `url(${require('@/assets/yellow.png')})` }" + class="status-image" + ></div> + <div + v-if="item.equipmentStatus == 22" + :style="{ backgroundImage: `url(${require('@/assets/red.png')})` }" + class="status-image" + ></div> + <div + v-if="item.equipmentStatus == 0" + :style="{ backgroundImage: `url(${require('@/assets/gray.png')})` }" + class="status-image" + ></div> + <div + v-if="item.equipmentStatus == 3" + :style="{ backgroundImage: `url(${require('@/assets/green.png')})` }" + class="status-image" + ></div> + <div + :style="{ backgroundImage: `url(${getImgView(item.equipmentImage) || require('@/assets/8.png')})` }" + class="device-image" + ></div> </div> - <div class="device-id" :style="{fontSize: item.fontSize+'px'}"> - {{item.equipmentId}} + <div class="device-id" :style="{ fontSize: item.fontSize + 'px' }"> + {{ item.equipmentId }} </div> </div> </VueDragResize> <div class="device-status-info"> <div v-for="item in deviceStatusList" :key="item.value" class="single-status-info"> - <div>{{item.label}}</div> - <div class="status-square" :style="{backgroundColor:item.color}"></div> - <div>{{getDeviceNumberByStatus(item.value)}}</div> + <div>{{ item.label }}</div> + <div class="status-square" :style="{ backgroundColor: item.color }"></div> + <div>{{ getDeviceNumberByStatus(item.value) }}</div> </div> </div> </div> </dv-border-box-8> + + <EquipmentDetailModal ref="EquipmentDetailModal"></EquipmentDetailModal> </dv-full-screen-container> </template> @@ -64,10 +87,17 @@ import VueDragResize from 'vue-drag-resize' import api from '@/api/mdc' import { getFileAccessHttpUrl } from '@/api/manage' + import EquipmentDetailModal from './mdc/base/modules/WorkshopSignage/EquipmentDetailModal' + import { message } from 'ant-design-vue' + + message.config({ + maxCount: 3 + }) export default { components: { - VueDragResize + VueDragResize, + EquipmentDetailModal }, data() { return { @@ -136,7 +166,7 @@ */ getDeviceListByApi(id) { console.log('閲嶆柊鍒锋柊') - api.getDeviceListInWorkshopSignagePageApi(id).then(res => { + api.getDeviceListInWorkshopSignagePageApi(id).then((res) => { if (res.result && res.result.length > 0) { this.deviceList = res.result } @@ -148,9 +178,11 @@ * @param id 杞﹂棿Id */ getWorkshopDetailsByApi(id) { - api.getWorkshopDetailByWorkshopIdApi(id).then(res => { + api.getWorkshopDetailByWorkshopIdApi(id).then((res) => { this.workshopDetails = res.result - this.$refs.deviceContainerRef.style.backgroundImage = `url(${this.getImgView(this.workshopDetails.backgroundImage)})` + this.$refs.deviceContainerRef.style.backgroundImage = `url(${this.getImgView( + this.workshopDetails.backgroundImage + )})` }) }, @@ -171,7 +203,7 @@ saveDevicePositionAndSizeByApi() { console.log('瑙﹀彂淇濆瓨') if (this.isOperatingDevice) { - api.saveDevicePositionAndSizeApi(this.deviceList).then(res => { + api.saveDevicePositionAndSizeApi(this.deviceList).then((res) => { if (res.code === 200) { this.$notification.success({ message: '娑堟伅', @@ -192,7 +224,6 @@ description: '璇峰紑鍚姛鑳藉悗鍐嶈繘琛屼繚瀛�' }) } - }, /** @@ -222,7 +253,7 @@ * @returns {number} 璁惧鏁伴噺 */ getDeviceNumberByStatus(value) { - return this.deviceList.filter(item => item.equipmentStatus === value).length + return this.deviceList.filter((item) => item.equipmentStatus === value).length }, /** @@ -233,7 +264,23 @@ this.isOperatingDevice = true this.isResizable = !this.isResizable this.isDraggable = !this.isDraggable - } + }, + + openDetail(item) { + if (item.equipmentStatus == 0) { + // this.$message.warn("璁惧澶勪簬鍏虫満鐘舵�侊紒"); + this.$message.warning('璁惧澶勪簬鍏虫満鐘舵�侊紒') + return false + } + console.log(item) + console.log(this.$refs.EquipmentDetailModal) + this.$refs.EquipmentDetailModal.initData(item.equId) + this.$refs.EquipmentDetailModal.timerModel(item.equId) + // this.equipMessageTimer = setInterval(() => { + // setTimeout( this.$refs.equmentDetaiModel.initData(item.equipmentId),0) + // },1000*10) + }, + }, created() { if (this.$route.params.id) { @@ -343,7 +390,6 @@ } } } - } } </style> \ No newline at end of file -- Gitblit v1.9.3