From 3a5e80d8f3b890edd46381fa9b6218f4cc7e47cb Mon Sep 17 00:00:00 2001
From: lixiangyu <lixiangyu@xalxzn.com>
Date: 星期三, 13 八月 2025 17:06:54 +0800
Subject: [PATCH] feat(盘点模块): 完善盘点功能并优化UI
---
src/views/mdc/base/DeviceBaseInfo.vue | 300 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 300 insertions(+), 0 deletions(-)
diff --git a/src/views/mdc/base/DeviceBaseInfo.vue b/src/views/mdc/base/DeviceBaseInfo.vue
new file mode 100644
index 0000000..298685d
--- /dev/null
+++ b/src/views/mdc/base/DeviceBaseInfo.vue
@@ -0,0 +1,300 @@
+<template>
+ <a-card :bordered="false">
+ <a-row type="flex" :gutter="16">
+ <a-col :md="5" :sm="24">
+ <base-tree @sendSelectBaseTree="changeSelection" @getCurrSelected="changeSelectionNode"></base-tree>
+ </a-col>
+ <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>
+ </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>
+ </a-tab-pane>
+ <a-tab-pane key="2" tab="鍒楄〃" force-render>
+ <equipment-list :dataSource="dataList" @editEquipmentStatus="editEquipmentStatus" :equipmentId="this.param.key"></equipment-list>
+ </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 BaseTree from '../common/BaseTree'
+ import EquipmentLayout from './modules/DeviceBaseInfo/EquipmentLayout'
+ import EquipmentList from './modules/DeviceBaseInfo/EquipmentList'
+
+ export default {
+ name: 'DeviceBaseInfo',
+ components: {
+ BaseTree,
+ EquipmentLayout,
+ EquipmentList
+ },
+ data() {
+ return {
+ description: '璁惧淇℃伅',
+ selectEquipmentId: '',
+ selectEquipment: {},
+ equipmentStatisticsInfo: {},
+ dataList: [],
+ standbyNumber: 0,
+ offNumber: 0,
+ warningNumber: 0,
+ workNumber: 0,
+ allNumber: 0,
+ url: {
+ list: '/mdc/mdcEquipment/queryEquipmentMonitorList',
+ updateEquipmentStatus: '/mdc/mdcEquipment/updateEquipmentStatus'
+ },
+ param: {},
+ timer: null,
+ deviceStatusList: [
+ {
+ label: '鍏虫満',
+ value: 0,
+ color: '#A8A8A8'
+ },
+ {
+ label: '寰呮満',
+ value: 2,
+ color: '#FFFF00'
+ },
+ {
+ label: '杩愯',
+ value: 3,
+ color: '#00EE00'
+ },
+ {
+ label: '鎶ヨ',
+ value: 22,
+ color: '#FF0000'
+ },
+ {
+ label: '鎬绘暟',
+ value: 99,
+ color: '#fff'
+ }
+ ]// 璁惧鐘舵�佹寚绀虹伅鍒楄〃锛�
+ }
+ },
+ created() {
+ const { productionId } = this.$route.params
+ if (productionId) this.param.key = productionId
+ },
+ 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',
+ message: '娑堟伅',
+ description: resopnse.message
+ })
+ }
+ 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 {
+ this.$notification.warning({
+ message: '娑堟伅',
+ description: '姝よ溅闂翠笅闈㈡棤璁惧锛侊紒'
+ })
+ }
+ } else {
+ this.$notification.warning({
+ message: '娑堟伅',
+ description: res.message
+ })
+ }
+ })
+ },
+
+ /**
+ * 绛涢�夋弧瓒充粠鐪嬫澘璺宠浆杩囨潵鏃剁殑鏉′欢鐨勬暟鎹�
+ * @param record
+ */
+ filterDataList(signageData) {
+ this.dataList = this.dataList.filter(item => item.oporationDict === signageData.name)
+ },
+
+ changeSelection(val) {
+ this.selectEquipmentId = val
+ },
+ changeSelectionNode(val) {
+ 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
+ })
+ })
+ },
+
+ /**
+ * 鏍规嵁璁惧鐘舵�佸�艰幏鍙栧搴旇澶囨暟閲�
+ * @param value 璁惧鐘舵�佸��
+ * @returns {number} 璁惧鏁伴噺
+ */
+ getDeviceNumberByStatus(value) {
+ if (value === 99) return this.dataList.length
+ return this.dataList.filter((item) => item.oporation === 1 && value === 2 || item.oporation === value).length
+ }
+ },
+ mounted() {
+ this.equipmentStatistics(this.param)
+ },
+ beforeDestroy() {
+ clearInterval(this.timer)
+ this.timer = null
+ }
+ }
+</script>
+<style scoped lang="less">
+ @import '~@assets/less/common.less';
+
+ .equipMessage {
+ width: 100%;
+ height: 20px;
+ }
+
+ .equipMessage table {
+ width: 60%;
+ height: 100%;
+ line-height: 50%;
+ float: right;
+ }
+
+ .equipMessage table td {
+ text-align: center;
+ }
+
+ .equipMessage table td span {
+ 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 {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+
+ .single-status-info {
+ margin: 10px;
+ .status-square {
+ width: 20px;
+ height: 20px;
+ border: 1px solid #ddd;
+ border-radius: 3px;
+ }
+ }
+ }
+</style>
\ No newline at end of file
--
Gitblit v1.9.3