From 68da7e57f4c201d70982b1eba579e13631ee4907 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com> Date: Wed, 4 Dec 2024 18:13:16 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=9C=8B=E6=9D=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../views/board/production/secondFloor.vue | 1 + .../src/views/board/warehouse/fourthFloor.vue | 516 +++++++----------- 2 files changed, 199 insertions(+), 318 deletions(-) diff --git a/hw-ui/src/views/board/production/secondFloor.vue b/hw-ui/src/views/board/production/secondFloor.vue index 27dc0d60..71eebcf5 100644 --- a/hw-ui/src/views/board/production/secondFloor.vue +++ b/hw-ui/src/views/board/production/secondFloor.vue @@ -216,6 +216,7 @@ export default { this.scrollTableData = e.data.map((v, k) => { return { no: k + 1, + materialName:v.materialName, orderCode: v.orderCode, planAmount: v.planAmount, completeAmount: v.completeAmount, diff --git a/hw-ui/src/views/board/warehouse/fourthFloor.vue b/hw-ui/src/views/board/warehouse/fourthFloor.vue index 193bcbf8..b0ded419 100644 --- a/hw-ui/src/views/board/warehouse/fourthFloor.vue +++ b/hw-ui/src/views/board/warehouse/fourthFloor.vue @@ -8,12 +8,12 @@ {{ i }}
- +
- - - + + +
@@ -160,13 +160,7 @@ import vueSeamlessScroll from 'vue-seamless-scroll' import Chart from '@/components/board/Chart' import HighChart from '@/components/board/HighChart' import * as echarts from 'echarts' -import { - bomInfo, - inAndOutInfo, - productInAndOutInfo, - purchaseInfo, - stockPercentage -} from '@/api/board/fourthFloorWarehouse' +import {} from '@/api/board/fourthFloorWarehouse' import { parseTime } from '@/utils/ruoyi' const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100 @@ -237,343 +231,229 @@ export default { 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 e = { + data: { + 'rawInstockAmount': 28, + 'rawOutstockAmount': 14, + 'productInstockAmount': 8 } - this.$refs.chart1.setData({ - tooltip: { - trigger: 'item' - }, - grid: { - borderWidth: 0, - top: '10%', - left: '10%', - right: '10%', - bottom: '10%' + } + this.topData.num1 = [...[0, 0, 0, 0], ...(e.data.rawInstockAmount || 0).toString().split('')].slice(-4) + this.topData.num2 = [...[0, 0, 0, 0], ...(e.data.rawOutstockAmount || 0).toString().split('')].slice(-4) + this.topData.num3 = [...[0, 0, 0, 0], ...(e.data.productInstockAmount || 0).toString().split('')].slice(-4) + this.$refs.chart1.setData({ + tooltip: { + trigger: 'item' + }, + grid: { + borderWidth: 0, + top: '10%', + left: '10%', + right: '10%', + bottom: '10%' + }, + yAxis: { + type: 'category', + axisLabel: { + margin: 10, + color: '#ffffff63' }, - yAxis: { - type: 'category', - axisLabel: { - margin: 10, - color: '#ffffff63' - }, - axisTick: { - show: true, - lineStyle: { - color: '#ffffff1f' - } - }, - splitLine: { - show: true, - lineStyle: { - type: 'dashed', - color: '#ffffff1f' - } - }, - axisLine: { - lineStyle: { - color: '#fff3', - width: 2 - } - }, - data: [1,2,3] - }, - xAxis: { - type: 'value', - axisLabel: { - margin: 10, - color: '#ffffff63' - }, - axisLine: { - show: false - }, - axisTick: { - show: true, - lineStyle: { - color: '#ffffff1f' - } - }, - splitLine: { - show: true, - lineStyle: { - type: 'dashed', - color: '#ffffff1f' - } + axisTick: { + show: true, + lineStyle: { + color: '#ffffff1f' } }, - series: [ - { - name: '', - type: 'bar', - barMaxWidth: '40px', - barWidth: '40%', - itemStyle: { - - color: new echarts.graphic.LinearGradient( - 0, - 0, - 1, - 0, - [ - { - offset: 0, - color: '#0a2ad7' - }, - { - offset: 1, - color: '#138dd7' - } - ], - false - ) - }, - data:[11,22,3] - }, - { - name: '', - type: 'pictorialBar', - barWidth: '40%', - barMaxWidth: '40px', - symbolSize: [5, '100%'], - symbolPosition: 'end', - symbolOffset: [3, 0], - barGap: '-100%', - itemStyle: { - color: '#138dd7' - }, - data:[11,22,3] + splitLine: { + show: true, + lineStyle: { + type: 'dashed', + color: '#ffffff1f' } - ] - }) - 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' + }, + axisLine: { + lineStyle: { + color: '#fff3', + width: 2 } }, - credits: { - enabled: false + data: [1, 2, 3] + }, + xAxis: { + type: 'value', + axisLabel: { + margin: 10, + color: '#ffffff63' }, - 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 - } + axisLine: { + show: false }, - legend: { - reversed: true, - itemStyle: { - color: '#fff' + axisTick: { + show: true, + lineStyle: { + color: '#ffffff1f' } }, - 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 即可禁用图例点击事件 - } - } - } + splitLine: { + show: true, + lineStyle: { + type: 'dashed', + color: '#ffffff1f' } + } + }, + series: [ + { + name: '', + type: 'bar', + barMaxWidth: '40px', + barWidth: '40%', + itemStyle: { + + color: new echarts.graphic.LinearGradient( + 0, + 0, + 1, + 0, + [ + { + offset: 0, + color: '#0a2ad7' + }, + { + offset: 1, + color: '#138dd7' + } + ], + false + ) + }, + data: [11, 22, 3] }, - 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 + { + name: '', + type: 'pictorialBar', + barWidth: '40%', + barMaxWidth: '40px', + symbolSize: [5, '100%'], + symbolPosition: 'end', + symbolOffset: [3, 0], + barGap: '-100%', + itemStyle: { + color: '#138dd7' + }, + data: [11, 22, 3] + } + ] }) - productInAndOutInfo().then(e => { - this.$refs.chart3.setData({ - tooltip: { - trigger: 'axis', - axisPointer: { - // 坐标轴指示器，坐标轴触发有效 - type: 'shadow' // 默认为直线，可选为：'line' | 'shadow' - } + this.scrollTableData = [] + this.scrollTableData1 = [] + 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' }, - grid: { - left: '2%', - right: '4%', - bottom: '14%', - top: '16%', - containLabel: true + itemWidth: 12, + itemHeight: 10 + // itemGap: 35 + }, + xAxis: { + type: 'category', + data: e.data.map(v => parseTime(v.day, '{m}-{d}')), + axisLine: { + lineStyle: { + color: 'white' + } }, - legend: { - x: 'center', - top: 12, + axisLabel: { + // interval: 0, + // rotate: 40, textStyle: { - color: '#fff' - }, - itemWidth: 12, - itemHeight: 10 - // itemGap: 35 + fontFamily: 'Microsoft YaHei' + } + } + }, + + yAxis: { + type: 'value', + axisLine: { + show: false, + lineStyle: { + color: 'white' + } }, - 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' - } + splitLine: { + show: true, + lineStyle: { + color: 'rgba(255,255,255,0.3)' } }, - - 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' + } + ]) } }, - axisLabel: {} + data: e.data.map(v => v.instockAmount) }, - 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' + } + ]) + } }, - { - 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: e.data.map(v => v.outStockAmount) + } + ] }) } }