From 3432c3100ccb4c3b78dc0a5f7f242bdcda503a63 Mon Sep 17 00:00:00 2001 From: zhaowei <zhaowei> Date: 星期三, 18 六月 2025 10:45:49 +0800 Subject: [PATCH] 1、终端程序呼叫页面呼叫原因组件由输入框改为多行文本域 2、设备管理页面新增设备图片字段同时在新增和编辑设备时添加设备图片 3、设备监控以及设备看板页面新增故障状态同时替换设备图片为设备管理页面中维护的设备图片而不再是设备所属设备类型图片以及三色灯增加故障状态灯 --- src/views/dnc/base/modules/TerminalIndex/ProcedureCall.vue | 2 src/views/mdc/base/MdcWorkshopSignage.vue | 219 +++-------------- src/views/mdc/base/modules/EquipmentList/UserModal.vue | 48 ++- src/views/mdc/base/GroupUtilizationRateChart.vue | 4 src/views/mdc/base/DeviceBaseInfo.vue | 178 +++----------- src/assets/orange.png | 0 src/views/mdc/base/modules/DeviceBaseInfo/EquipmentList.vue | 92 ------- src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue | 146 ++++------- 8 files changed, 178 insertions(+), 511 deletions(-) diff --git a/src/assets/orange.png b/src/assets/orange.png new file mode 100644 index 0000000..02b4076 --- /dev/null +++ b/src/assets/orange.png Binary files differ diff --git a/src/views/dnc/base/modules/TerminalIndex/ProcedureCall.vue b/src/views/dnc/base/modules/TerminalIndex/ProcedureCall.vue index a2f68d1..cf6d76b 100644 --- a/src/views/dnc/base/modules/TerminalIndex/ProcedureCall.vue +++ b/src/views/dnc/base/modules/TerminalIndex/ProcedureCall.vue @@ -20,7 +20,7 @@ <a-row> <a-col :span="24"> <a-form-model-item label="鍛煎彨鍘熷洜" prop="callReason"> - <a-input placeholder="璇疯緭鍏ュ懠鍙師鍥�" v-model="model.callReason" allowClear/> + <a-textarea placeholder="璇疯緭鍏ュ懠鍙師鍥�" v-model="model.callReason" allowClear/> </a-form-model-item> </a-col> </a-row> diff --git a/src/views/mdc/base/DeviceBaseInfo.vue b/src/views/mdc/base/DeviceBaseInfo.vue index 0394307..15f550c 100644 --- a/src/views/mdc/base/DeviceBaseInfo.vue +++ b/src/views/mdc/base/DeviceBaseInfo.vue @@ -7,39 +7,29 @@ <a-col :md="24-5" :sm="24"> <div class="device-status-info"> <a-space v-for="item in deviceStatusList" :key="item.value" class="single-status-info"> - <template v-if="item.value!=99"> - <div>{{ item.label }}</div> - <div class="status-square" :style="{ backgroundColor: item.color }"></div> - <div>{{getDeviceNumberByStatus(item.value) }}</div> - </template> - <template v-else> - <div>{{ item.label }}</div> - <div>{{getDeviceNumberByStatus(item.value) }}</div> - </template> + <div>{{ item.label }}</div> + <div v-if="item.value!=99" class="status-square" :style="{ backgroundColor: item.color }"></div> + <div>{{getDeviceNumberByStatus(item.value) }}</div> </a-space> </div> <div> <a-tabs default-active-key="1"> <a-tab-pane key="1" tab="甯冨眬鍥�"> - <equipment-layout :dataList="dataList" :equipmentId="selectEquipmentId" - :node="selectEquipment"></equipment-layout> + <equipment-layout :dataList="dataList" :equipmentId="selectEquipmentId" :node="selectEquipment"/> </a-tab-pane> <a-tab-pane key="2" tab="鍒楄〃" force-render> - <equipment-list :dataSource="dataList" @editEquipmentStatus="editEquipmentStatus"></equipment-list> + <equipment-list :dataSource="dataList"/> </a-tab-pane> </a-tabs> </div> </a-col> </a-row> - - </a-card> </template> <script> - import { putAction, getAction } from '@/api/manage' - import { JeecgListMixin } from '@/mixins/JeecgListMixin' + import { getAction } from '@/api/manage' import BaseTree from '../common/BaseTree' import EquipmentLayout from './modules/DeviceBaseInfo/EquipmentLayout' import EquipmentList from './modules/DeviceBaseInfo/EquipmentList' @@ -58,14 +48,8 @@ selectEquipment: {}, equipmentStatisticsInfo: {}, dataList: [], - standbyNumber: 0, - offNumber: 0, - warningNumber: 0, - workNumber: 0, - allNumber: 0, url: { - list: '/mdc/mdcEquipment/queryEquipmentMonitorList', - updateEquipmentStatus: '/mdc/mdcEquipment/updateEquipmentStatus' + list: '/mdc/mdcEquipment/queryEquipmentMonitorList' }, param: {}, timer: null, @@ -91,9 +75,9 @@ color: '#FF0000' }, { - label: '寮傚父', - value: 33, - color: '#FFA200' + label: '鏁呴殰', + value: 5, + color: '#C11900' }, { label: '鎬绘暟', @@ -109,67 +93,44 @@ }, methods: { equipmentStatistics(param, resopnse = { key: false }) { - getAction(this.url.list, param).then((res) => { - this.dataList = [] - if (res.success) { - if (res.result.length != 0) { - this.standbyNumber = 0 - this.offNumber = 0 - this.warningNumber = 0 - this.workNumber = 0 - this.allNumber = 0 - this.dataList = res.result - this.allNumber = this.dataList.length - if (resopnse.key) { - this.$notification.success({ - key: 'equipmentStatus', + getAction(this.url.list, param) + .then((res) => { + this.dataList = [] + if (res.success) { + if (res.result.length != 0) { + this.dataList = res.result + if (resopnse.key) { + this.$notification.success({ + key: 'equipmentStatus', + message: '娑堟伅', + description: resopnse.message + }) + } + + // 绛涢�変粠杞︽澘璺宠浆杩囨潵鐨勯渶姹傛暟鎹� + const { signageData } = this.$route.params + console.log('signageData', signageData) + if (!signageData) return + else this.filterDataList(signageData) + } else { + this.$notification.warning({ message: '娑堟伅', - description: resopnse.message + description: '姝よ溅闂翠笅闈㈡棤璁惧锛侊紒' }) } - for (let i = 0; i < this.dataList.length; i++) { - let item = this.dataList[i] - switch (item.oporationDict) { - case '寰呮満' : - this.standbyNumber = this.standbyNumber + 1 - break - case '杩愯' : - this.workNumber = this.workNumber + 1 - break - case '鍏虫満' : - this.offNumber = this.offNumber + 1 - break - case '鎶ヨ' : - this.warningNumber = this.warningNumber + 1 - break - default: - break - } - } - - // 绛涢�変粠杞︽澘璺宠浆杩囨潵鐨勯渶姹傛暟鎹� - const { signageData } = this.$route.params - console.log('signageData', signageData) - if (!signageData) return - else this.filterDataList(signageData) - } else { + } + else { this.$notification.warning({ message: '娑堟伅', - description: '姝よ溅闂翠笅闈㈡棤璁惧锛侊紒' + description: res.message }) } - } else { - this.$notification.warning({ - message: '娑堟伅', - description: res.message - }) - } - }) + }) }, /** * 绛涢�夋弧瓒充粠鐪嬫澘璺宠浆杩囨潵鏃剁殑鏉′欢鐨勬暟鎹� - * @param record + * @param signageData */ filterDataList(signageData) { this.dataList = this.dataList.filter(item => item.oporationDict === signageData.name) @@ -182,49 +143,12 @@ this.selectEquipment = val.equipmentId clearInterval(this.timer) this.timer = null - if (!val.equipmentId) { - this.param.key = val.key - this.equipmentStatistics(this.param) - this.timer = setInterval(() => { - setTimeout(this.equipmentStatistics(this.param), 0) - }, 1000 * 10) - } else { - this.param.key = val.parentId - this.equipmentStatistics(this.param) - this.timer = setInterval(() => { - setTimeout(this.equipmentStatistics(this.param), 0) - }, 1000 * 10) - } - }, - - /** - * 鍗曞嚮鐘舵�佸弽棣堝悗瑙﹀彂 - * @param record - */ - editEquipmentStatus(record) { - const _this = this - this.$notification.info({ - key: 'equipmentStatus', - message: '娑堟伅', - description: '鍙嶉涓�...' - }) - getAction(this.url.updateEquipmentStatus, { id: record.id }) - .then(res => { - if (res.success) { - _this.equipmentStatistics(this.param, { key: true, message: res.message }) - } else { - this.$notification.warning({ - message: '娑堟伅', - description: res.message - }) - } - }) - .catch(err => { - this.$notification.error({ - message: '娑堟伅', - description: err.message - }) - }) + if (!val.equipmentId) this.param.key = val.key + else this.param.key = val.parentId + this.equipmentStatistics(this.param) + this.timer = setInterval(() => { + setTimeout(this.equipmentStatistics(this.param), 0) + }, 1000 * 10) }, /** @@ -269,22 +193,6 @@ display: inline-block; width: 15px; height: 15px; - } - - .equipMessage table td .equipShutdown { - background-color: #808080; - } - - .equipMessage table td .standbyNumber { - background-color: #ffbf37; - } - - .equipMessage table td .equipRun { - background-color: #19FE01; - } - - .equipMessage table td .equipAlarm { - background-color: #FD0008; } .device-status-info { diff --git a/src/views/mdc/base/GroupUtilizationRateChart.vue b/src/views/mdc/base/GroupUtilizationRateChart.vue index ebb81fc..a7f005b 100644 --- a/src/views/mdc/base/GroupUtilizationRateChart.vue +++ b/src/views/mdc/base/GroupUtilizationRateChart.vue @@ -129,7 +129,7 @@ * @param shiftDataList 鐝鏁版嵁鍒楄〃 */ initChart({ dataList, dateList, shiftSubList, shiftDataList }) { - const defaultLegendData = ['24灏忔椂', '24灏忔椂锛堝幓闄ゆ晠闅滆澶囷級', '鐝', '绱杩愯鏃堕棿(h)'] + const defaultLegendData = ['24灏忔椂', '24灏忔椂锛堝幓闄ゆ晠闅滄椂闂达級', '鐝', '绱杩愯鏃堕棿(h)'] const defaultSeries = [ { type: 'line', @@ -139,7 +139,7 @@ }, { type: 'line', - name: '24灏忔椂锛堝幓闄ゆ晠闅滆澶囷級', + name: '24灏忔椂锛堝幓闄ゆ晠闅滄椂闂达級', yAxisIndex: 0, data: dataList ? dataList.map(item => item.amendUtilizationRate) : [] }, diff --git a/src/views/mdc/base/MdcWorkshopSignage.vue b/src/views/mdc/base/MdcWorkshopSignage.vue index 57586b7..6525c5b 100644 --- a/src/views/mdc/base/MdcWorkshopSignage.vue +++ b/src/views/mdc/base/MdcWorkshopSignage.vue @@ -6,8 +6,7 @@ <a-row style="height: 100%"> <a-col :span="7" class="header-left"> <a-space> - <span v-if="!isSwitchChecked">寮�鍚姛鑳�</span> - <span v-else>鍏抽棴鍔熻兘</span> + <span>鍔熻兘寮�鍏�</span> <a-switch checked-children="寮�" un-checked-children="鍏�" @@ -22,17 +21,9 @@ <a-col :span="10" class="workshop-name">{{ workshopDetails.workshopName }}</a-col> <a-col :span="7" class="device-status-info"> - <!--<a-space v-for="item in deviceStatusList" :key="item.value" class="single-status-info"--> - <!--@click="handleScreenDevive(item)">--> - <!--<div :style="{color:item.checked?'#1890FF':'#fff'}">{{ item.label }}</div>--> - <!--<div class="status-square" :style="{ backgroundColor: item.color }"></div>--> - <!--<!–<a-checkbox :checked="item.checked" @change="checkboxChange(item)"></a-checkbox>–>--> - <!--<div>{{getDeviceNumberByStatus(item.value) }}</div>--> - <!--</a-space>--> <a-space v-for="item in deviceStatusList" :key="item.value" class="single-status-info"> <div :style="{color:item.checked?'#1890FF':'#fff'}">{{ item.label }}</div> <div class="status-square" :style="{ backgroundColor: item.color }"></div> - <!--<a-checkbox :checked="item.checked" @change="checkboxChange(item)"></a-checkbox>--> <div>{{getDeviceNumberByStatus(item.value) }}</div> </a-space> </a-col> @@ -67,23 +58,7 @@ @click="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')})` }" + :style="{ backgroundImage: `url(${getStatusImgUrl(item.equipmentStatus)})` }" class="status-image" ></div> <div @@ -91,8 +66,7 @@ class="device-image" ></div> </div> - <div class="device-id" id="deviceId" - :style="{ color:workshopDetails.equipmentIdColor }"> + <div :style="{ color:workshopDetails.equipmentIdColor }"> {{ item.equipmentId }} </div> </div> @@ -133,48 +107,32 @@ showGuideline: 'none', guidelineXTop: 0, guidelineYLeft: 0, - deviceList: [ - // { - // equipmentId: '123213213123232',// 璁惧ID - // equipmentImage: require('@/assets/8.png'), // 璁惧鍥剧墖 - // coordinateTop: 200, // 鎷栨嫿鍏冪礌璺濈洅瀛愰《璺濈 - // coordinateLeft: 100, // 鎷栨嫿鍏冪礌璺濈洅瀛愬乏渚ц窛绂� - // vw: 100, // 缂╂斁鍏冪礌瀹藉害 - // vh: 100, // 缂╂斁鍏冪礌楂樺害 - // equipmentStatus: 1 // 璁惧鐘舵�� 0:鍏虫満 22:鎶ヨ 2:寰呮満 3:杩愯 寮�鏈�:1锛堟病鏈夊洓鑹茬伅鏍囪瘑褰掍负寰呮満锛� - // } - ], // 璁惧淇℃伅鍒楄〃 - deviceList_copy: [], + deviceList: [], // 璁惧淇℃伅鍒楄〃 deviceStatusList: [ - // { - // label: '鍏ㄩ儴', - // value: 99, - // color: '#fff', - // checked: true - // }, { label: '鍏虫満', value: 0, - color: '#A8A8A8', - checked: false + color: '#A8A8A8' }, { label: '寰呮満', value: 2, - color: '#FFFF00', - checked: false + color: '#FFFF00' }, { label: '杩愯', value: 3, - color: '#00EE00', - checked: false + color: '#00EE00' }, { label: '鎶ヨ', value: 22, - color: '#FF0000', - checked: false + color: '#FF0000' + }, + { + label: '鏁呴殰', + value: 5, + color: '#C11900' } ],// 璁惧鐘舵�佹寚绀虹伅鍒楄〃锛� windowHeight: null,// 褰撳墠娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴︼紙锛堜笉鍖呮嫭宸ュ叿鏍忋�佷功绛俱�佸簳閮ㄤ换鍔℃爮锛� @@ -207,11 +165,9 @@ * @param id 杞﹂棿Id */ getDeviceListByApi(id) { - console.log('閲嶆柊鍒锋柊') api.getDeviceListInWorkshopSignagePageApi(id).then((res) => { if (res.result && res.result.length > 0) { this.deviceList = res.result - this.deviceList_copy = res.result } }) }, @@ -223,12 +179,8 @@ getWorkshopDetailsByApi(id) { api.getWorkshopDetailByWorkshopIdApi(id).then((res) => { this.workshopDetails = res.result - // this.$refs.deviceContainerRef.style.backgroundImage = `url(${this.getImgView( - // this.workshopDetails.backgroundImage - // )})` this.imgSrc = this.getImgView(this.workshopDetails.backgroundImage) this.$refs.deviceContainerRef.style.height = (this.windowHeight - this.pageHeaderHeight) + 'px' - // this.parentH = this.windowHeight - this.pageHeaderHeight this.parentH = 900 this.parentLimitation = true // 鍦ㄧ埗鍏冪礌楂樺害璁剧疆鍚庡啀璁剧疆闄愬埗鎷栨嫿鍖哄煙锛屼笉杩欐牱鏈夋鐜囧鑷寸埗鍏冪礌楂樺害鏈缃氨闄愬埗鎷栨嫿 }) @@ -280,15 +232,6 @@ * @param index 鎷栨嫿璁惧鍦ㄦ暟缁勪腑鐨勪笅鏍� */ resize(newRect, index) { - // if (newRect.width > 100) { - // if (newRect.width / newRect.height < 2) { - // this.deviceList[index].fontSize = newRect.width / 10 - // } else { - // this.deviceList[index].fontSize = newRect.height / 5 - // } - // } else { - // this.deviceList[index].fontSize = 12 - // } this.showGuideline = 'block' this.deviceList[index].vw = newRect.width this.deviceList[index].vh = newRect.height @@ -304,8 +247,8 @@ * @returns {number} 璁惧鏁伴噺 */ getDeviceNumberByStatus(value) { - if (value === 99) return this.deviceList_copy.length - return this.deviceList_copy.filter((item) => item.equipmentStatus === value).length + if (value === 99) return this.deviceList.length + return this.deviceList.filter((item) => item.equipmentStatus === value).length }, /** @@ -318,19 +261,38 @@ this.isDraggable = !this.isDraggable }, - openDetail(item) { + /** + * 寮�鍚姛鑳借Е鍙戜簨浠� + * @param record 鐐瑰嚮鐨勮澶囦俊鎭� + */ + openDetail(record) { if (!this.isSwitchChecked) { - if (item.equipmentStatus == 0) { + if (record.equipmentStatus == 0) { 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) + this.$refs.EquipmentDetailModal.initData(record.equId) + this.$refs.EquipmentDetailModal.timerModel(record.equId) + } + }, + + /** + * 鏍规嵁璁惧鐘舵�佸�艰幏鍙栧搴斾笁鑹茬伅鍥剧墖鍦板潃 + * @param imgStatus 璁惧鐘舵�佸�� + */ + getStatusImgUrl(imgStatus) { + switch (imgStatus) { + case 1: + case 2: + return require('@/assets/yellow.png') + case 3: + return require('@/assets/green.png') + case 22: + return require('@/assets/red.png') + case 5: + return require('@/assets/orange.png') + default: + return require('@/assets/gray.png') } }, @@ -338,87 +300,11 @@ * 娴忚鍣ㄥ昂瀵稿彂鐢熸敼鍙樻椂瑙﹀彂 */ handleWindowSizeChange() { - // this.isFullScreen = !this.isFullScreen - // if (!this.isFullScreen) location.reload() // 濡傛灉涓哄叏灞忔ā寮忥紝鍒欏湪鍒囨崲妯″紡鏃堕噸鏂板姞杞介〉闈互閲嶆柊鑾峰彇娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴� const windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight - // this.parentH = 99999 - // const scaleRate = windowHeight / this.windowHeight - // this.windowHeight = windowHeight this.$refs.deviceContainerRef.style.height = (windowHeight - this.pageHeaderHeight) + 'px' - // const timer = setTimeout(() => { - // this.deviceList.forEach(item => { - // item.coordinateTop = item.coordinateTop * scaleRate - // item.vh = item.vh * scaleRate - // console.log('vh', item.vh) - // }) - // this.parentH = windowHeight - this.pageHeaderHeight - // console.log('changeDeviceList', this.deviceList) - // }, 500) - // console.log('scaleRate', scaleRate) - }, - - checkboxChange(obj) { - //闇�瑕佸垽鏂槸鍚﹀紑鍚姛鑳斤紝鐩殑鏄负浜嗗叧闂畾鏃跺櫒閬垮厤绛涢�夊悗璁惧琚畾鏃跺埛鏂扮殑鏂拌澶囪鐩� - if (this.isOperatingDevice) { - obj.checked = !obj.checked - if (obj.value !== 99) { - if (obj.checked) this.checkedStatusCount++ - else this.checkedStatusCount-- - } - - if (obj.value == 99) { - this.deviceStatusList.forEach(item => { - if (item.value !== obj.value) item.checked = obj.checked - }) - if (obj.checked) { - this.deviceList = this.deviceList_copy - this.checkedStatusCount = this.deviceStatusList.length - 1 - } else { - this.deviceList = [] - this.checkedStatusCount = 0 - } - } else { - this.deviceStatusList.forEach(item => { - if (item.value === 99) { - if (this.checkedStatusCount !== this.deviceStatusList.length - 1 || this.checkedStatusCount === 0) item.checked = false - if (this.checkedStatusCount === this.deviceStatusList.length - 1) item.checked = true - } - }) - if (obj.checked) { - this.deviceList.push(...this.deviceList_copy.filter(item => item.equipmentStatus === obj.value)) - } else { - this.deviceList = this.deviceList.filter(item => item.equipmentStatus !== obj.value) - } - } - } else { - this.$notification.warning({ - message: '娑堟伅', - description: '璇峰紑鍚姛鑳藉悗鍐嶈繘琛岀瓫閫�' - }) - } - }, - - handleScreenDevive(obj) { - //闇�瑕佸垽鏂槸鍚﹀紑鍚姛鑳斤紝鐩殑鏄负浜嗗叧闂畾鏃跺櫒閬垮厤绛涢�夊悗璁惧琚畾鏃跺埛鏂扮殑鏂拌澶囪鐩� - if (this.isOperatingDevice) { - obj.checked = true - this.deviceList = this.deviceList_copy - this.deviceStatusList.forEach(item => { - if (item.value !== obj.value) item.checked = false - }) - - if (obj.value == 99) this.deviceList = this.deviceList_copy - else this.deviceList = this.deviceList.filter(item => item.equipmentStatus === obj.value) - - } else { - this.$notification.warning({ - message: '娑堟伅', - description: '璇峰紑鍚姛鑳藉悗鍐嶈繘琛岀瓫閫�' - }) - } } }, created() { @@ -437,9 +323,6 @@ document.documentElement.clientHeight || document.body.clientHeight - // 鍒ゆ柇娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴︽槸鍚︾瓑浜庡垎杈ㄧ巼锛岃嫢鐩哥瓑鍒欒〃绀鸿繘鍏ユ椂娴忚鍣ㄤ负鍏ㄥ睆妯″紡 - // if (this.windowHeight === screen.height) this.isFullScreen = true - window.addEventListener('resize', this.handleWindowSizeChange) }, beforeDestroy() { @@ -457,10 +340,6 @@ color: #fff; .page-header { - /*font-size: 50px;*/ - /*text-align: center;*/ - /*position: relative;*/ - .header-left { height: 100%; display: flex; @@ -485,7 +364,6 @@ .single-status-info { margin: 10px; - cursor: pointer; .status-square { width: 14px; @@ -526,11 +404,7 @@ flex-direction: column; align-items: center; justify-content: space-between; - cursor: default; - - &:active { - border: 1px solid #1890ff; - } + cursor: pointer; .device-status { width: 100%; @@ -557,10 +431,5 @@ } } } - } - - /deep/ .ant-checkbox-inner { - background-color: transparent; - border-color: #fff; } </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue b/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue index f8099d1..048b06a 100644 --- a/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue +++ b/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentLayout.vue @@ -2,13 +2,14 @@ <a-card :bordered="false"> <div class="containerequip"> <div class="container_content"> - <div class="contnet" v-for="(item,index) in dataList" :key="index" :class="node == item.equipmentId ? 'addclass' : '' "> + <div class="contnet" v-for="(item,index) in dataList" :key="index" + :class="node == item.equipmentId ? 'addClass' : '' "> - <div class="content_equipment" @click="openDetail(item)"> + <div style="cursor: pointer" @click="openDetail(item)"> <div class="equipment_box"> <div> <img style="width: 11%;" :src="getStatusImgUrl(item.oporation)" alt=""> - <img class="orange" :src="getImgUrl(item.equipmentTypePictures)"> + <img class="deviceImage" :src="getImgUrl(item.equipmentTypePictures)"> </div> </div> </div> @@ -24,7 +25,7 @@ <script> import EquipmentDetailModal from './EquipmentDetailModal' - import {getFileAccessHttpUrl} from '@/api/manage'; + import { getFileAccessHttpUrl } from '@/api/manage' import { getAction } from '@/api/manage' @@ -32,128 +33,95 @@ export default { name: 'EquipmentLayout', components: { EquipmentDetailModal }, - props: { dataList: { + props: { + dataList: { type: Array, required: true, default: [] - }, equipmentId: '' , - node:''}, - data() { - return { - equipMessageTimer:'' - } - }, - created() { - }, - mounted() { - + }, + node: '' }, methods: { - getImgUrl(img){ - if(img == null || img ==''){ - return require("../../../../../assets/default.png"); + getImgUrl(img) { + if (img == null || img == '') { + return require('../../../../../assets/default.png') } return getFileAccessHttpUrl(img) }, - getStatusImgUrl(imgStaus){ - if(imgStaus == 1){ - return require("../../../../../assets/yellow.png"); - }else if(imgStaus == 2){ - return require("../../../../../assets/yellow.png"); - }else if(imgStaus == 3){ - return require("../../../../../assets/green.png"); - }else if(imgStaus ==22){ - return require("../../../../../assets/red.png"); - }else if(imgStaus ==0){ - return require("../../../../../assets/gray.png"); - }else{ - return require("../../../../../assets/gray.png"); + getStatusImgUrl(imgStatus) { + switch (imgStatus) { + case 1: + case 2: + return require('@/assets/yellow.png') + case 3: + return require('@/assets/green.png') + case 22: + return require('@/assets/red.png') + case 5: + return require('@/assets/orange.png') + default: + return require('@/assets/gray.png') } - }, - getBackgroundUrl(imgurl){ - return require("../../../../../assets/"+imgurl+".gif"); }, openDetail(item) { - if(item.oporation == 0){ - // this.$message.warn("璁惧澶勪簬鍏虫満鐘舵�侊紒"); + if (item.oporation == 0) { this.$notification.warning({ - message:'娑堟伅', - description:"璁惧澶勪簬鍏虫満鐘舵�侊紒" - }); - return false; + message: '娑堟伅', + description: '璁惧澶勪簬鍏虫満鐘舵�侊紒' + }) + return false } - console.log(item); - this.$refs.equipmentDetailModal.initData(item.id); - this.$refs.equipmentDetailModal.timerModel(item.id); - // this.equipMessageTimer = setInterval(() => { - // setTimeout( this.$refs.equmentDetaiModel.initData(item.equipmentId),0) - // },1000*10) + this.$refs.equipmentDetailModal.initData(item.id) + this.$refs.equipmentDetailModal.timerModel(item.id) } - }, - beforeDestroy(){ - // clearInterval(this.equipMessageTimer); - // this.equipMessageTimer = null } } </script> <style scoped> - .gray{ - background-image: url("../../../../../assets/gray.gif"); + .deviceImage { -webkit-background-size: 100% 100%; background-size: 100% 100%; background-repeat: no-repeat; } - .green{ - background-image: url("../../../../../assets/green.gif"); - -webkit-background-size: 100% 100%; - background-size: 100% 100%; - background-repeat: no-repeat; - } - .red{ - background-image: url("../../../../../assets/red.gif"); - -webkit-background-size: 100% 100%; - background-size: 100% 100%; - background-repeat: no-repeat; - } - .orange{ - /*background-image: url("../../../../../assets/orange.gif");*/ - -webkit-background-size: 100% 100%; - background-size: 100% 100%; - background-repeat: no-repeat; - } - .equipment_box img{ + + .equipment_box img { width: 45%; } - .containerequip{ + .containerequip { overflow: auto; } - @media screen and (min-width: 1920px){ - .containerequip{ - height: 640px!important; + @media screen and (min-width: 1920px) { + .containerequip { + height: 640px !important; } } - @media screen and (min-width: 1680px) and (max-width: 1920px){ - .containerequip{ - height: 640px!important; + + @media screen and (min-width: 1680px) and (max-width: 1920px) { + .containerequip { + height: 640px !important; } } - @media screen and (min-width: 1400px) and (max-width: 1680px){ - .containerequip{ - height: 493px!important; + + @media screen and (min-width: 1400px) and (max-width: 1680px) { + .containerequip { + height: 493px !important; } } - @media screen and (min-width: 1280px) and (max-width: 1400px){ - .containerequip{ - height: 493px!important; + + @media screen and (min-width: 1280px) and (max-width: 1400px) { + .containerequip { + height: 493px !important; } } - @media screen and (max-width: 1280px){ - .containerequip{ - height: 394px!important; + + @media screen and (max-width: 1280px) { + .containerequip { + height: 394px !important; } } + .container_content { width: 100%; position: relative; @@ -170,7 +138,7 @@ padding-top: 5%; } - .addclass p { + .addClass p { border-bottom: 2px solid #e957ff; } </style> \ No newline at end of file diff --git a/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentList.vue b/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentList.vue index 727cdb6..ef2bb0a 100644 --- a/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentList.vue +++ b/src/views/mdc/base/modules/DeviceBaseInfo/EquipmentList.vue @@ -1,84 +1,9 @@ <template> <a-card :bordered="false" style="display: flex;flex-direction: column"> - <!-- 鏌ヨ鍖哄煙 --> - <!--<div class="table-page-search-wrapper">--> - <!--<a-form layout="inline" @keyup.enter.native="searchQuery">--> - <!--<a-row :gutter="24">--> - <!--<a-col :md="7" :sm="7">--> - <!--<a-form-item label="璁惧鍚嶇О">--> - <!--<a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" v-model="queryParam.equipmentName"></a-input>--> - <!--</a-form-item>--> - <!--</a-col>--> - <!--<a-col :md="7" :sm="7">--> - <!--<a-form-item label="鐘舵��">--> - <!--<a-select v-model="queryParam.status" placeholder="璇烽�夋嫨">--> - <!--<a-select-option value="">璇烽�夋嫨</a-select-option>--> - <!--<a-select-option value="0">鍏虫満</a-select-option>--> - <!--<a-select-option value="2">寰呮満</a-select-option>--> - <!--<a-select-option value="3">杩愯</a-select-option>--> - <!--<a-select-option value="22">鎶ヨ</a-select-option>--> - <!--</a-select>--> - <!--</a-form-item>--> - <!--</a-col>--> - <!--<a-col :md="3" :sm="3">--> - <!--<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">--> - <!--<a @click="handleToggleSearch" style="margin-left: 8px">--> - <!--{{ toggleSearchStatus ? '鏀惰捣' : '灞曞紑' }}--> - <!--<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>--> - <!--</a>--> - <!--</span>--> - <!--</a-col>--> - <!--</a-row>--> - <!--<a-row :gutter="24">--> - <!--<template v-if="toggleSearchStatus">--> - <!--<a-col :md="12" :sm="12">--> - <!--<a-form-item label="閲囬泦鏃堕棿">--> - <!--<a-range-picker @change="dateParamChange" v-model="dates"/>--> - <!--</a-form-item>--> - <!--</a-col>--> - <!--</template>--> - - <!--</a-row>--> - <!--</a-form>--> - <!--</div>--> - <!-- 鎿嶄綔鎸夐挳鍖哄煙 --> - <!--<div class="table-operator" style="border-top: 5px">--> - <!--<a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>--> - <!--<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">閲嶇疆</a-button>--> - <!--</div>--> - <div class="equipmentList" id="DeviceList"> - <!--<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">--> - <!--<i class="anticon anticon-info-circle ant-alert-icon"></i>宸查�夋嫨 <a style="font-weight: 600">{{--> - <!--selectedRowKeys.length }}</a>椤� --> - <!--<a style="margin-left: 24px" @click="onClearSelected">娓呯┖</a>--> - <!--</div>--> - <a-table ref="table" bordered size="middle" rowKey="equipmentId" :columns="columns" :dataSource="dataSource" - :pagination="false" :loading="loading" :scroll="{x:'max-content',y:scrollY}"> - <!--<template slot="equipmentId" slot-scope="text, record">--> - <!--<div :style="{color:record.equipmentStatus!==0?'#f00':null}">{{text}}</div>--> - <!--</template>--> - <!--<template slot="equipmentName" slot-scope="text, record">--> - <!--<div :style="{color:record.equipmentStatus!==0?'#f00':null}">{{text}}</div>--> - <!--</template>--> - <!--<template slot="oporationDict" slot-scope="text, record">--> - <!--<div :style="{color:record.equipmentStatus!==0?'#f00':null}">{{text}}</div>--> - <!--</template>--> - <template slot="equipmentStatus" slot-scope="text"> - <div>{{text===0?'姝e父':'寮傚父'}}</div> - </template> - <!--<template slot="collecttime" slot-scope="text, record">--> - <!--<div :style="{color:record.equipmentStatus!==0?'#f00':null}">{{text}}</div>--> - <!--</template>--> - <!--<template slot="action" slot-scope="text, record">--> - <!--<a-popconfirm title="纭畾鍙嶉鍚�?" @confirm="$emit('editEquipmentStatus',record)" v-has="'deiveBaseInfo:responseStatus'">--> - <!--<a>鐘舵�佸弽棣�</a>--> - <!--</a-popconfirm>--> - <!--</template>--> - </a-table> - + :pagination="false" :loading="loading" :scroll="{x:'max-content',y:scrollY}"/> </div> </a-card> </template> @@ -113,13 +38,6 @@ width: 200 }, { - title: '璁惧寮傚父', - align: 'center', - dataIndex: 'equipmentStatus', - scopedSlots: { customRender: 'equipmentStatus' }, - width: 200 - }, - { title: '閲囬泦鏃堕棿', align: 'center', dataIndex: 'collecttime', @@ -129,14 +47,6 @@ }, width: 350 } - // { - // title: '鎿嶄綔', - // dataIndex: 'action', - // scopedSlots: {customRender: 'action'}, - // align: "center", - // width: 150, - // fixed:'right' - // } ], scrollY: 465 } diff --git a/src/views/mdc/base/modules/EquipmentList/UserModal.vue b/src/views/mdc/base/modules/EquipmentList/UserModal.vue index a460738..c102595 100644 --- a/src/views/mdc/base/modules/EquipmentList/UserModal.vue +++ b/src/views/mdc/base/modules/EquipmentList/UserModal.vue @@ -6,6 +6,7 @@ @cancel="visible=false" :visible="visible" :footer="null" + centered style="height: 100%;overflow: auto;padding-bottom: 53px;"> <template slot="title"> @@ -93,7 +94,7 @@ <a-row :gutter="24"> <a-col :span="12"> <a-form-model-item label="鏈哄簥IP" :labelCol="labelCol" :wrapperCol="wrapperCol"> - <a-input :disabled="true" placeholder="璇疯緭鍏ユ満搴奍P" + <a-input :disabled="true" placeholder="璇疯緭鍏ユ満搴奍P" v-model="model.equipmentIp"/> </a-form-model-item> </a-col> @@ -115,7 +116,7 @@ </a-col> <a-col :span="12"> <a-form-model-item label="璁惧鍨嬪彿" :labelCol="labelCol" :wrapperCol="wrapperCol"> - <a-input :disabled="true" allow-clear placeholder="璇疯緭鍏ヨ澶囧瀷鍙�" + <a-input :disabled="true" allow-clear placeholder="璇疯緭鍏ヨ澶囧瀷鍙�" v-model="model.equipmentModel"/> </a-form-model-item> </a-col> @@ -124,13 +125,15 @@ <a-row :gutter="24"> <a-col :span="12"> <a-form-model-item label="绯荤粺绫诲瀷" :labelCol="labelCol" :wrapperCol="wrapperCol"> - <j-dict-select-tag placeholder="璇烽�夋嫨绯荤粺绫诲瀷" :triggerChange="true" dictCode="system_type" :disabled="disableSubmit" + <j-dict-select-tag placeholder="璇烽�夋嫨绯荤粺绫诲瀷" :triggerChange="true" dictCode="system_type" + :disabled="disableSubmit" v-model="model.systemType" allow-clear/> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item label="璁惧绾у埆" :labelCol="labelCol" :wrapperCol="wrapperCol"> - <j-dict-select-tag placeholder="璇烽�夋嫨璁惧绾у埆" dictCode="device_level" v-model="model.deviceLevel" :disabled="disableSubmit" allow-clear/> + <j-dict-select-tag placeholder="璇烽�夋嫨璁惧绾у埆" dictCode="device_level" v-model="model.deviceLevel" + :disabled="disableSubmit" allow-clear/> </a-form-model-item> </a-col> </a-row> @@ -138,7 +141,8 @@ <a-row :gutter="24"> <a-col :span="12"> <a-form-model-item label="璁惧绉嶇被" :labelCol="labelCol" :wrapperCol="wrapperCol"> - <j-dict-select-tag placeholder="璇烽�夋嫨璁惧绉嶇被" dictCode="device_category" v-model="model.deviceCategory" :disabled="disableSubmit" + <j-dict-select-tag placeholder="璇烽�夋嫨璁惧绉嶇被" dictCode="device_category" v-model="model.deviceCategory" + :disabled="disableSubmit" allow-clear/> </a-form-model-item> </a-col> @@ -146,6 +150,14 @@ <a-form-model-item label="鎺掑簭" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-input :disabled="disableSubmit" :readOnly="disableSubmit" placeholder="璇疯緭鍏ユ帓搴�" v-model="model.sortNo" style="width: 100%"/> + </a-form-model-item> + </a-col> + </a-row> + + <a-row :gutter="24"> + <a-col :span='24'> + <a-form-model-item label="璁惧鍥剧墖" :labelCol="labelColLong" :wrapperCol="wrapperColLong"> + <j-image-upload v-model="model.equipmentImage" :disabled="disableSubmit"/> </a-form-model-item> </a-col> </a-row> @@ -538,20 +550,20 @@ // if(this.model.userIdentity!==2){ // this.model.departIds=""; // } - if (this.systemValue==null){ - this.$message.warning('璇烽�夋嫨绯荤粺绫诲瀷!'); - return false; + if (this.systemValue == null) { + this.$message.warning('璇烽�夋嫨绯荤粺绫诲瀷!') + return false } - let obj; - if(!this.model.id){ - this.model.id = this.userId; - this.model.systemValue=this.systemValue; - obj=addEquipment(this.model); - }else{ - this.model.systemValue=this.systemValue; - obj=editEquipment(this.model,{ - id: this.model.id - }); + let obj + if (!this.model.id) { + this.model.id = this.userId + this.model.systemValue = this.systemValue + obj = addEquipment(this.model) + } else { + this.model.systemValue = this.systemValue + obj = editEquipment(this.model, { + id: this.model.id + }) } obj.then((res) => { if (res.success) { -- Gitblit v1.9.3