diff --git a/package.json b/package.json index 556024f1..285e0d8c 100644 --- a/package.json +++ b/package.json @@ -43,6 +43,7 @@ "dependencies": { "@antv/x6": "^2.15.3", "@babel/parser": "7.18.4", + "@jiaminghi/data-view": "^2.10.0", "@riophae/vue-treeselect": "0.4.0", "axios": "0.27.2", "benz-amr-recorder": "^1.1.5", diff --git a/public/favicon.ico b/public/favicon.ico index 47918ab0..71ea1add 100644 Binary files a/public/favicon.ico and b/public/favicon.ico differ diff --git a/src/layout/components/TagsView/index.vue b/src/layout/components/TagsView/index.vue index 7b7b76fc..913a7f6f 100644 --- a/src/layout/components/TagsView/index.vue +++ b/src/layout/components/TagsView/index.vue @@ -88,7 +88,7 @@ export default { visitedViews(newVal, oldVal){ let num = 0 newVal && newVal.map(item => { - if (item.path === '/databoard/kiln' || item.path === '/databoard/whole-plant') { + if (item.path === '/databoard/kiln' || item.path === '/databoard/whole-plant' || item.path === '/databoard/deep-processing') { num++ } }) diff --git a/src/main.js b/src/main.js index 9d15a451..9e38edca 100644 --- a/src/main.js +++ b/src/main.js @@ -9,6 +9,7 @@ import store from './store'; import router from './router'; import directive from './directive'; // directive import plugins from './plugins'; // plugins +// import { borderBox1 } from '@jiaminghi/data-view' import './assets/icons'; // icon import './permission'; // permission control @@ -78,6 +79,7 @@ Vue.use(CodeBrickZj) Vue.use(directive); Vue.use(plugins); Vue.use(VueMeta); +// Vue.use(dataV) // Vue.use(hljs.vuePlugin); // bpmnProcessDesigner 需要引入 diff --git a/src/store/modules/websocket.js b/src/store/modules/websocket.js index 27a0782c..7966e519 100644 --- a/src/store/modules/websocket.js +++ b/src/store/modules/websocket.js @@ -4,7 +4,7 @@ const state = { gasInfo:{},// 天然气流量图 sumGasInfo: {},// 天然气总量 - israKiln:[],// ISRA缺陷检测 + israKiln:[],// ISRA窑炉缺陷检测 material:[],// 原料 energyInfo: { elecQty1: '', @@ -14,11 +14,17 @@ const state = { energyWeekTrend:[], energyMonthTrend:[], energyYearTrend:[],// 能耗图 + energyMonitoring: [], // 能源监控 exhaustGasInfo:{}, // 烟气 gasChartDayTrend:{}, // 烟气 gasChartWeekTrend:{}, // 烟气 gasChartMonthTrend:{}, // 烟气 - gasChartYearTrend:{} // 烟气 + gasChartYearTrend:{}, // 烟气 + israDayStatistic: [],//缺陷统计 + israWeekStatistic: [],//缺陷统计 + israMonthStatistic: [],//缺陷统计 + israYearStatistic: [],//缺陷统计 + productline: [] // 产线产量及良品率 }; const mutations = { SET_FANFREQUENCYINFO: (state, fanFrequencyInfo) => { @@ -60,6 +66,9 @@ const mutations = { state.energyYearTrend = energyTrend.year } }, + SET_ENERGY_MONITORING: (state, energyMonitoring) => { + state.energyMonitoring = energyMonitoring + }, SET_EXHAUSTGASINFO: (state, exhaustGasInfo) => { state.exhaustGasInfo = exhaustGasInfo }, @@ -68,6 +77,15 @@ const mutations = { state.gasChartWeekTrend = exhaustGasChart.gasChartWeekTrend state.gasChartMonthTrend = exhaustGasChart.gasChartMonthTrend state.gasChartYearTrend = exhaustGasChart.gasChartYearTrend + }, + SET_DEFECTCHART: (state, israStatistic) => { + state.israDayStatistic = israStatistic.dayStatistic + state.israWeekStatistic = israStatistic.weekStatistic + state.israMonthStatistic = israStatistic.monthStatistic + state.israYearStatistic = israStatistic.yearStatistic + }, + SET_PRODUCTLINE: (state, productline) => { + state.productline = productline } }; const actions = { @@ -97,12 +115,21 @@ const actions = { setEnergyTrend({ commit }, energyTrend) { commit('SET_ENERGYTREND', energyTrend.payload) }, + setEnergyMonitoring({ commit }, energyMonitoring) { + commit('SET_ENERGY_MONITORING', energyMonitoring.payload) + }, setExhaustGasInfo({ commit }, exhaustGasInfo) { commit('SET_EXHAUSTGASINFO', exhaustGasInfo.payload) }, setExhaustGasChart({ commit }, exhaustGasChart) { commit('SET_EXHAUSTGASCHART', exhaustGasChart.payload) }, + setDefectChart({ commit }, israStatistic) { + commit('SET_DEFECTCHART', israStatistic.payload) + }, + setProductline({ commit }, productline) { + commit('SET_PRODUCTLINE', productline.payload) + }, }; export default { namespaced: true, diff --git a/src/views/databoard/assets/defectStatistics.png b/src/views/databoard/assets/defectStatistics.png new file mode 100644 index 00000000..c65bd849 Binary files /dev/null and b/src/views/databoard/assets/defectStatistics.png differ diff --git a/src/views/databoard/assets/eqMonitor.png b/src/views/databoard/assets/eqMonitor.png new file mode 100644 index 00000000..bb63e762 Binary files /dev/null and b/src/views/databoard/assets/eqMonitor.png differ diff --git a/src/views/databoard/assets/goodRate.png b/src/views/databoard/assets/goodRate.png new file mode 100644 index 00000000..847e9c0d Binary files /dev/null and b/src/views/databoard/assets/goodRate.png differ diff --git a/src/views/databoard/assets/order.png b/src/views/databoard/assets/order.png new file mode 100644 index 00000000..f7b1ee13 Binary files /dev/null and b/src/views/databoard/assets/order.png differ diff --git a/src/views/databoard/components/Container.vue b/src/views/databoard/components/Container.vue index 36a8742e..e86c92e5 100644 --- a/src/views/databoard/components/Container.vue +++ b/src/views/databoard/components/Container.vue @@ -55,6 +55,24 @@ export default { return require('../assets/msg.png'); case '烟气处理': return require('../assets/gas.png'); + case '产线缺陷统计': + return require('../assets/defectStatistics.png'); + case '产线当日缺陷分类': + return require('../assets/check.png'); + case '本日生产良品率': + return require('../assets/goodRate.png'); + case '订单完成情况': + return require('../assets/order.png'); + case '设备报警': + return require('../assets/goodRate.png'); + case '各工序缺陷汇总': + return require('../assets/check.png'); + case '能源监控': + return require('../assets/defectStatistics.png'); + case '产线产量及良品率': + return require('../assets/order.png'); + case '工单监控': + return require('../assets/eqMonitor.png'); } }, }, diff --git a/src/views/databoard/components/DefectChart.vue b/src/views/databoard/components/DefectChart.vue new file mode 100644 index 00000000..f10647b4 --- /dev/null +++ b/src/views/databoard/components/DefectChart.vue @@ -0,0 +1,216 @@ + + + + \ No newline at end of file diff --git a/src/views/databoard/components/DefectClassChart.vue b/src/views/databoard/components/DefectClassChart.vue new file mode 100644 index 00000000..a1d4a9a7 --- /dev/null +++ b/src/views/databoard/components/DefectClassChart.vue @@ -0,0 +1,170 @@ + + + + \ No newline at end of file diff --git a/src/views/databoard/components/EnergeMonitoringChart.vue b/src/views/databoard/components/EnergeMonitoringChart.vue new file mode 100644 index 00000000..c845341d --- /dev/null +++ b/src/views/databoard/components/EnergeMonitoringChart.vue @@ -0,0 +1,157 @@ + + + + \ No newline at end of file diff --git a/src/views/databoard/components/GasChart.vue b/src/views/databoard/components/GasChart.vue index 3a7b46f9..87445833 100644 --- a/src/views/databoard/components/GasChart.vue +++ b/src/views/databoard/components/GasChart.vue @@ -51,27 +51,34 @@ export default { } }, watch: { - energyWeekTrend: {// 监听时间变化,更新图 + energyWeekTrend: {// 监听周电能,更新图 handler(newVal, oldVal) { if (this.chartTime === '周' && this.chartType === '电耗能') { this.updateChart() } } }, - energyMonthTrend: {// 监听时间变化,更新图 + energyMonthTrend: {// 监听月电能,更新图 handler(newVal, oldVal) { if (this.chartTime === '月' && this.chartType === '电耗能') { this.updateChart() } } }, - energyYearTrend: {// 监听时间变化,更新图 + energyYearTrend: {// 监听年电能,更新图 handler(newVal, oldVal) { if (this.chartTime === '年' && this.chartType === '电耗能') { this.updateChart() } } }, + gasChartMsg: {// 监听天然气,更新图 + handler(newVal, oldVal) { + if (this.chartType === '天然气I' || this.chartType === '天然气II') { + this.updateChart() + } + } + }, chartTime: {// 监听时间变化,更新图 handler(newVal, oldVal) { this.updateChart() @@ -114,33 +121,27 @@ export default { break; } case '天然气I':{ - yData = this.gasChartMsg.hisSumGas1 || [] + if (this.chartTime === '周') { + yData = this.gasChartMsg.hisSumGas1For7Day || [] + }else if(this.chartTime === '月') { + yData = this.gasChartMsg.sumGas1ForMonth || [] + }else{ + yData = this.gasChartMsg.sumGas1ForYear || [] + } gasName = '天然气I' - xData = Array(7) - .fill(1) - .map((_, index) => { - const today = new Date(); - const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000; - return `${new Date(dtimestamp).getMonth() + 1}.${new Date( - dtimestamp - ).getDate()}`; - }) - .reverse() + xData = this.getXdata() break; } default: gasName = '天然气II' - yData = this.gasChartMsg.hisSumGas2 || [] - xData = Array(7) - .fill(1) - .map((_, index) => { - const today = new Date(); - const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000; - return `${new Date(dtimestamp).getMonth() + 1}.${new Date( - dtimestamp - ).getDate()}`; - }) - .reverse() + if (this.chartTime === '周') { + yData = this.gasChartMsg.hisSumGas2For7Day || [] + }else if(this.chartTime === '月') { + yData = this.gasChartMsg.sumGas2ForMonth || [] + }else{ + yData = this.gasChartMsg.sumGas2ForYear || [] + } + xData = this.getXdata() } if (yData.length == 0) { seriesData = [] @@ -177,7 +178,7 @@ export default { this.chart = echarts.init(this.$el); var option = { color: colors, - grid: { top: 32, right: 12, bottom: 20, left: 48 }, + grid: { top: 32, right: 12, bottom: 20, left: 60 }, xAxis: { type: 'category', data: xData, @@ -223,6 +224,40 @@ export default { }, } option && this.chart.setOption(option) + }, + getXdata() { + const today = new Date(); + const currentYear = today.getFullYear(); + const currentMonth = today.getMonth() + 1; + let days = 30; + if (this.chartTime === '周') { + return Array(7) + .fill(1) + .map((_, index) => { + const today = new Date(); + const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000; + return `${new Date(dtimestamp).getMonth() + 1}.${new Date( + dtimestamp + ).getDate()}`;}).reverse() + }else if (this.chartTime == "月") { + if (currentMonth in [1, 3, 5, 7, 8, 10, 12]) { + days = 31; + } else if (currentMonth == 2) { + days = this.isLeapYear(currentYear) ? 29 : 28; + } + return Array(days) + .fill(1) + .map((_, index) => { + return `${currentMonth}.${days - index}`;}).reverse() + } else { + return Array(12) + .fill(1) + .map((_, index) => { + return `${currentYear}.${12 - index}`;}).reverse() + } + }, + isLeapYear(year) { + return year % 400 == 0 || (year % 4 == 0 && year % 100 != 0); } }, }; diff --git a/src/views/databoard/components/NumRateChart.vue b/src/views/databoard/components/NumRateChart.vue new file mode 100644 index 00000000..f8d4c00c --- /dev/null +++ b/src/views/databoard/components/NumRateChart.vue @@ -0,0 +1,204 @@ + + + + \ No newline at end of file diff --git a/src/views/databoard/deepProcessing/BottomTwo.vue b/src/views/databoard/deepProcessing/BottomTwo.vue index d7dda8dc..8d3f5ccb 100644 --- a/src/views/databoard/deepProcessing/BottomTwo.vue +++ b/src/views/databoard/deepProcessing/BottomTwo.vue @@ -1,22 +1,34 @@ \ No newline at end of file diff --git a/src/views/databoard/deepProcessing/EnergyMonitoring.vue b/src/views/databoard/deepProcessing/EnergyMonitoring.vue new file mode 100644 index 00000000..678250a0 --- /dev/null +++ b/src/views/databoard/deepProcessing/EnergyMonitoring.vue @@ -0,0 +1,30 @@ + + + \ No newline at end of file diff --git a/src/views/databoard/deepProcessing/OrderStatus.vue b/src/views/databoard/deepProcessing/EqAlarm.vue similarity index 65% rename from src/views/databoard/deepProcessing/OrderStatus.vue rename to src/views/databoard/deepProcessing/EqAlarm.vue index 4021eda7..ef7be248 100644 --- a/src/views/databoard/deepProcessing/OrderStatus.vue +++ b/src/views/databoard/deepProcessing/EqAlarm.vue @@ -1,14 +1,14 @@ \ No newline at end of file diff --git a/src/views/databoard/deepProcessing/NumRate.vue b/src/views/databoard/deepProcessing/NumRate.vue new file mode 100644 index 00000000..7718f79b --- /dev/null +++ b/src/views/databoard/deepProcessing/NumRate.vue @@ -0,0 +1,30 @@ + + + \ No newline at end of file diff --git a/src/views/databoard/deepProcessing/TopThree.vue b/src/views/databoard/deepProcessing/TopThree.vue index 8caf0354..e3cfa8d6 100644 --- a/src/views/databoard/deepProcessing/TopThree.vue +++ b/src/views/databoard/deepProcessing/TopThree.vue @@ -1,22 +1,44 @@ \ No newline at end of file diff --git a/src/views/databoard/deepProcessing/index.vue b/src/views/databoard/deepProcessing/index.vue index 2515dd91..f2cdefcf 100644 --- a/src/views/databoard/deepProcessing/index.vue +++ b/src/views/databoard/deepProcessing/index.vue @@ -18,18 +18,18 @@ " :style="{transform:'scale('+scaleNum+')'}"> - + + + -
@@ -38,7 +38,7 @@
-
+
--> diff --git a/src/views/databoard/kiln/EnergeCost.vue b/src/views/databoard/kiln/EnergeCost.vue index c3003b2a..b152d828 100644 --- a/src/views/databoard/kiln/EnergeCost.vue +++ b/src/views/databoard/kiln/EnergeCost.vue @@ -76,28 +76,30 @@ export default { // 切换能源 toggleType(val) { console.log('能源' + val) - if (val === '天然气I' || val === '天然气II') { - if (this.chartTime === '周') { - this.chartType = val - } else { - this.$message.warning('暂无数据') - } - }else { - this.chartType = val - } + this.chartType = val + // if (val === '天然气I' || val === '天然气II') { + // if (this.chartTime === '周') { + // this.chartType = val + // } else { + // this.$message.warning('暂无数据') + // } + // }else { + // this.chartType = val + // } }, // 切换时间 toggleDate(val) { console.log('时间' + val) - if (val === '月' || val === '年') { - if (this.chartType === '电耗能') { - this.chartTime = val - } else { - this.$message.warning('暂无数据') - } - }else{ - this.chartTime = val - } + this.chartTime = val + // if (val === '月' || val === '年') { + // if (this.chartType === '电耗能') { + // this.chartTime = val + // } else { + // this.$message.warning('暂无数据') + // } + // }else{ + // this.chartTime = val + // } } }, }; diff --git a/src/views/databoard/kiln/GasHandle.vue b/src/views/databoard/kiln/GasHandle.vue index 39c47a98..64750686 100644 --- a/src/views/databoard/kiln/GasHandle.vue +++ b/src/views/databoard/kiln/GasHandle.vue @@ -23,7 +23,7 @@ "> 氧气含量 - {{exhaustGasInfo.O2_float}}% + {{exhaustGasInfo?.O2_float ? (exhaustGasInfo?.O2_float).toFixed(2): ''}}%
一氧化氮

排放浓度

- {{exhaustGasInfo.NOX_float}}mg/m³ + {{exhaustGasInfo?.NOX_float ? (exhaustGasInfo?.NOX_float).toFixed(2):''}}mg/m³
@@ -54,7 +54,7 @@

二氧化硫

排放浓度

- {{exhaustGasInfo.SO2_float}}mg/m³ + {{exhaustGasInfo?.SO2_float ? (exhaustGasInfo?.SO2_float).toFixed(2): ''}}mg/m³
@@ -69,7 +69,7 @@ "> 颗粒物浓度 - {{exhaustGasInfo.dust_float}}mg/m³ + {{exhaustGasInfo?.dust_float ? (exhaustGasInfo?.dust_float).toFixed(2) : ''}}mg/m³ diff --git a/src/views/databoard/wholePlant/DefectClass.vue b/src/views/databoard/wholePlant/DefectClass.vue new file mode 100644 index 00000000..28546c7f --- /dev/null +++ b/src/views/databoard/wholePlant/DefectClass.vue @@ -0,0 +1,38 @@ + + + \ No newline at end of file diff --git a/src/views/databoard/wholePlant/DefectStatistics.vue b/src/views/databoard/wholePlant/DefectStatistics.vue index 64e2a161..cc96c75c 100644 --- a/src/views/databoard/wholePlant/DefectStatistics.vue +++ b/src/views/databoard/wholePlant/DefectStatistics.vue @@ -2,16 +2,19 @@
- - +
+ +
+