diff --git a/hw-ui/src/views/board/production/firstFloor.vue b/hw-ui/src/views/board/production/firstFloor.vue index 7cee545c..55fd5303 100644 --- a/hw-ui/src/views/board/production/firstFloor.vue +++ b/hw-ui/src/views/board/production/firstFloor.vue @@ -2,15 +2,54 @@
京源生产监控平台
-
当前楼层：3F
-
状态： - 出库中 +
当前楼层：{{ tsjData.currentFloor }}F
+
状态： + {{ tsjData.elevatorStatus }}
-
起始楼层： - 1F +
目标楼层： + {{ tsjData.targetFloor }}F
-
目标楼层： - 3F +
+
+
+ 起始楼层 +
+
+ 目标楼层 +
+
+ 任务状态 +
+
+ +
+
+
+ {{ item.data1 }}F +
+
+ {{ item.data2 }}F +
+
+ {{ item.data3 }} +
+
+
+
2/3 waitTime: 0 }, + scrollTableData1:[ + { + data1:1, + data2:3, + data3:'完成', + }, + { + data1:1, + data2:3, + data3:'取消', + }, + { + data1:2, + data2:3, + data3:'完成', + }, + ], scrollTableData: [ { "createBy": "admin", "createTime": "2024-11-24 20:11:12", @@ -322,10 +384,10 @@ export default { .table1 { position: absolute; - top: 14.5%; - left: 3.3%; - width: 23.8%; - height: 45.5%; + top: 76.5%; + left: 53%; + width: 43%; + height: 18.5%; color: #fff; font-size: 0.8vw } @@ -380,6 +442,7 @@ export default { position: absolute; transform: translate(-50%, -50%); font-size: 1.5vw; + white-space: nowrap; color: #eee; } diff --git a/hw-ui/src/views/board/warehouse/firstFloor.vue b/hw-ui/src/views/board/warehouse/firstFloor.vue index 765ddfed..8dfd705a 100644 --- a/hw-ui/src/views/board/warehouse/firstFloor.vue +++ b/hw-ui/src/views/board/warehouse/firstFloor.vue @@ -14,19 +14,34 @@
- 任务编号 + 计量设备编号
- 任务类型 + 计量设备名称
- 物料名称 + 采集时间
- 库位编号 + A项电压(V)
- 时间 + B项电压(V) +
+
+ C项电压(V) +
+
+ A项电流(A) +
+
+ B项电流(A) +
+
+ C项电流(V) +
+
+ 仪表值(kW·h)
- {{ item.taskCode }} + {{ item.monitorId }} +
+
+ {{ item.monitorName }} +
+
+ {{ item.collectTime }} +
+
+ {{ item.va }} +
+
+ {{ item.vb }} +
+
+ {{ item.vc }}
- 入库 + {{ item.ia }}
- {{ item.materialName }} + {{ item.ib }}
- {{ item.locationCode }} + {{ item.ic }}
- {{ item.applylate }} + {{ item.zxyg }}
@@ -110,7 +150,7 @@ export default { ' ', ' ', ' ', - '库存占比' + ' ' ], titlePosition: [ { @@ -148,7 +188,39 @@ export default { singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3 waitTime: 0 }, - scrollTableData: [], + scrollTableData: [ + { + 'createBy': null, + 'createTime': null, + 'updateBy': null, + 'updateTime': null, + 'remark': null, + 'objid': 463400, + 'monitorId': 'E0004_3500', + 'monitorName': '空压机', + 'address': null, + 'collectTime': '2024-12-04 12:56:33', + 'recordTime': '2024-12-04T12:56:39.000+08:00', + 'glys': 0.912, + 'zxyg': 62.94, + 'activePower': 0.00, + 'reactivePower': 0.00, + 'consumption': null, + 'collectType': null, + 'deptId': null, + 'userId': null, + 'monitorSubset': null, + 'onlineState': null, + 'startTime': null, + 'endTime': null, + 'vc': 229.90, + 'vb': 230.10, + 'va': 229.40, + 'ia': 0.02, + 'ib': 0.01, + 'ic': 0.01 + } + ], scrollTableData1: [] } }, @@ -156,322 +228,147 @@ export default { this.getData() window.onresize = () => { - this.$refs.chart1.resize() - this.$refs.chart2.resize() this.$refs.chart3.resize() } }, methods: { getData() { - inAndOutInfo().then(e => { - console.log(e) - this.topData.num1= [...[0, 0, 0, 0], ...(e.data.inStocks.find(v=>v.warehouseId===111)?.outstockAmount || 0).toString().split('')].slice(-4) - this.topData.num2= [...[0, 0, 0, 0], ...(e.data.rawOutstocks?.find(v=>v.warehouseId===111)?.outstockAmount || 0).toString().split('')].slice(-4) - this.topData.num3= [...[0, 0, 0, 0], ...(e.data.inStocks.find(v=>v.warehouseId===131)?.outstockAmount || 0).toString().split('')].slice(-4) - }) - stockPercentage().then(e => { - let num1 = e.data.nostockAmount + e.data.stockAmount - let num2 = e.data.stockAmount - let num2_1 - let num3 = e.data.nostockAmount - let num3_1 - if (num1 === 0) { - num2_1 = 50 - num3_1 = 50 - } else { - num2_1 = parseFloat(((num2 / num1) * 100).toFixed(2)) - num3_1 = parseFloat(((num3 / num1) * 100).toFixed(2)) + let data = [ + { + 'is_ammeter': '否', + 'expendPercentage': '7%', + 'monitorId': 'E0004_3400', + 'monitorName': '折弯1', + 'expend': 2.83, + 'meterValue': 11.24, + 'timeRange': '2024-11-04 至 2024-12-04' + }, + { + 'is_ammeter': '否', + 'expendPercentage': '0%', + 'monitorId': 'E0004_3300', + 'monitorName': '折弯2', + 'expend': 0.00, + 'meterValue': 2.80, + 'timeRange': '2024-11-04 至 2024-12-04' + }, + { + 'is_ammeter': '否', + 'expendPercentage': '27%', + 'monitorId': 'E0004_0400', + 'monitorName': '激光下料', + 'expend': 10.44, + 'meterValue': 36.81, + 'timeRange': '2024-11-04 至 2024-12-04' + }, + { + 'is_ammeter': '否', + 'expendPercentage': '0%', + 'monitorId': 'E0004_0200', + 'monitorName': '烘干机', + 'expend': 0.20, + 'meterValue': 1.19, + 'timeRange': '2024-11-04 至 2024-12-04' + }, + { + 'is_ammeter': '否', + 'expendPercentage': '41%', + 'monitorId': 'E0004_3500', + 'monitorName': '空压机', + 'expend': 15.53, + 'meterValue': 62.93, + 'timeRange': '2024-11-04 至 2024-12-04' + }, + { + 'is_ammeter': '否', + 'expendPercentage': '22%', + 'monitorId': 'E0004_0300', + 'monitorName': '除尘系统', + 'expend': 8.30, + 'meterValue': 33.09, + 'timeRange': '2024-11-04 至 2024-12-04' } - this.$refs.chart1.setData({ - title: { - text: '原料库存占比', - style: { - color: '#fff' - } - }, - credits: { - enabled: false - }, - chart: { - type: 'pie', - animation: false, - backgroundColor: null, - events: { - load: function() { - let each = Highcharts.each, - points = this.series[0].points - each(points, function(p, i) { - p.graphic.attr({ - translateY: -p.shapeArgs.ran - }) - p.graphic.side1.attr({ - translateY: -p.shapeArgs.ran - }) - p.graphic.side2.attr({ - translateY: -p.shapeArgs.ran - }) - }) - } - }, - options3d: { - enabled: true, - alpha: 60, - beta: 0 - } + ] + this.$refs.chart3.setData({ + tooltip: { + trigger: 'axis', + axisPointer: { + // 坐标轴指示器，坐标轴触发有效 + type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' + } + }, + grid: { + left: '2%', + right: '4%', + bottom: '14%', + top: '16%', + containLabel: true + }, + legend: { + x: 'center', + top: 12, + textStyle: { + color: '#fff' }, - legend: { - reversed: true, - itemStyle: { - color: '#fff' + itemWidth: 12, + itemHeight: 10 + // itemGap: 35 + }, + xAxis: { + type: 'category', + data: data.map(v => v.monitorName), + axisLine: { + lineStyle: { + color: 'white' } }, - plotOptions: { - pie: { - allowPointSelect: false, - cursor: 'pointer', - depth: 35, - startAngle: 45, - size: 200, - dataLabels: { - enabled: true, - formatter: function() { - return this.point.options.name + '
' + this.point.options.h + '%' - } - }, - showInLegend: false, - point: { - events: { - legendItemClick: function(e) { - return false // 直接 return false 即可禁用图例点击事件 - } - } - } + axisLabel: { + // interval: 0, + // rotate: 40, + textStyle: { + fontFamily: 'Microsoft YaHei' } - }, - series: [ - { - type: 'pie', - name: '占比', - data: [ - { - 'name': '已使用', - y: num2_1, - h: Math.min(num2_1, 50) - }, - { - name: '未使用', - y: num3_1, - h: Math.min(num3_1, 50) - } - ].sort((a, b) => a.y - b.y) - }] - }) - let num11 = e.data.noProductstockAmount + e.data.productstockAmount - let num12 = e.data.productstockAmount - let num12_1 - let num13 = e.data.noProductstockAmount - let num13_1 - if (num11 === 0) { - num12_1 = 50 - num13_1 = 50 - } else { - num12_1 = parseFloat(((num12 / num11) * 100).toFixed(2)) - num13_1 = parseFloat(((num13 / num11) * 100).toFixed(2)) - } - this.$refs.chart2.setData({ - title: { - text: '成品库存占比', - style: { - color: '#fff' + } + }, + + yAxis: { + type: 'value', + axisLine: { + show: false, + lineStyle: { + color: 'white' } }, - credits: { - enabled: false - }, - chart: { - type: 'pie', - startAngle: Math.PI / 6, - animation: false, - backgroundColor: null, - events: { - load: function() { - let each = Highcharts.each, - points = this.series[0].points - each(points, function(p, i) { - p.graphic.attr({ - translateY: -p.shapeArgs.ran - }) - p.graphic.side1.attr({ - translateY: -p.shapeArgs.ran - }) - p.graphic.side2.attr({ - translateY: -p.shapeArgs.ran - }) - }) - } - }, - options3d: { - enabled: true, - alpha: 60, - beta: 0 + splitLine: { + show: true, + lineStyle: { + color: 'rgba(255,255,255,0.3)' } }, - legend: { - reversed: true, + axisLabel: {} + }, + series: [ + { + name: '消耗', + type: 'bar', + barWidth: '15%', itemStyle: { - color: '#fff' - } - }, - plotOptions: { - pie: { - allowPointSelect: false, - cursor: 'pointer', - depth: 35, - startAngle: 45, - size: 200, - dataLabels: { - enabled: true, - formatter: function() { - return this.point.options.name + '
' + this.point.options.h + '%' - } - }, - showInLegend: false, - point: { - events: { - legendItemClick: function(e) { - return false // 直接 return false 即可禁用图例点击事件 + normal: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { + offset: 0, + color: '#fccb05' + }, + { + offset: 1, + color: '#f5804d' } - } - } - } - }, - series: [ - { - type: 'pie', - name: '占比', - data: [ - { - 'name': '已使用', - y: num12_1, - h: num12_1 - }, - { - name: '未使用', - y: num12_1, - h: num12_1 - } - ].sort((a, b) => a.y - b.y) - }] - }) - }) - purchaseInfo().then(e => { - this.scrollTableData = e.data - }) - bomInfo().then(e => { - this.scrollTableData1 = e.data - }) - productInAndOutInfo().then(e => { - this.$refs.chart3.setData({ - tooltip: { - trigger: 'axis', - axisPointer: { - // 坐标轴指示器，坐标轴触发有效 - type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' - } - }, - grid: { - left: '2%', - right: '4%', - bottom: '14%', - top: '16%', - containLabel: true - }, - legend: { - x: 'center', - top: 12, - textStyle: { - color: '#fff' - }, - itemWidth: 12, - itemHeight: 10 - // itemGap: 35 - }, - xAxis: { - type: 'category', - data: e.data.map(v => parseTime(v.day, '{m}-{d}')), - axisLine: { - lineStyle: { - color: 'white' + ]) } }, - axisLabel: { - // interval: 0, - // rotate: 40, - textStyle: { - fontFamily: 'Microsoft YaHei' - } - } - }, - - yAxis: { - type: 'value', - axisLine: { - show: false, - lineStyle: { - color: 'white' - } - }, - splitLine: { - show: true, - lineStyle: { - color: 'rgba(255,255,255,0.3)' - } - }, - axisLabel: {} - }, - series: [ - { - name: '入库', - type: 'bar', - barWidth: '15%', - itemStyle: { - normal: { - color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ - { - offset: 0, - color: '#fccb05' - }, - { - offset: 1, - color: '#f5804d' - } - ]) - } - }, - data: e.data.map(v => v.instockAmount) - }, - { - name: '出库', - type: 'bar', - barWidth: '15%', - itemStyle: { - normal: { - color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ - { - offset: 0, - color: '#8bd46e' - }, - { - offset: 1, - color: '#09bcb7' - } - ]) - } - }, - data: e.data.map(v => v.outStockAmount) - } - ] - }) + data: data.map(v => v.expend) + } + ] }) } } @@ -571,7 +468,7 @@ export default { .scrollTableItem { display: inline-block; - width: calc(100% / 5); + width: calc(100% / 10); text-align: center; padding: 14px 0; color: #4e99c5