From 9de0dfc6399a2200c6d7c47adfb97e0b102dbe4b Mon Sep 17 00:00:00 2001 From: juzi <819872918@qq.com> Date: Wed, 19 Jun 2024 16:01:13 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AF=B9=E6=8E=A5=E6=8A=A5=E8=A1=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env.dev | 4 + src/api/report/benchmarking.js | 89 +++++ src/views/report/chipOutputBM/index.vue | 298 ++++++++++----- src/views/report/chipPerCapitaBM/index.vue | 285 ++++++++++----- .../components/baseChart.vue | 157 ++++++++ .../components/bmBarComplete.vue | 137 +------ src/views/report/ftoOutputBM/index.vue | 340 ++++++++++-------- src/views/report/packageOEEBM/index.vue | 282 ++++++++++----- src/views/report/scOutputBM/index.vue | 298 ++++++++++----- 9 files changed, 1238 insertions(+), 652 deletions(-) create mode 100644 src/views/report/completionStatusIntrBM/components/baseChart.vue diff --git a/.env.dev b/.env.dev index baa8f98..f20d89c 100644 --- a/.env.dev +++ b/.env.dev @@ -14,6 +14,10 @@ VUE_APP_TITLE = 发电玻璃智能管控平台 # 芋道管理系统/开发环境 # VUE_APP_BASE_API = 'http://192.168.1.70:30307' VUE_APP_BASE_API = 'http://glass.kszny.picaiba.com' +# 闫阳 +# VUE_APP_BASE_API = 'http://192.168.1.81:48080' +# 徐 +# VUE_APP_BASE_API = 'http://192.168.1.56:48080' # 郭 # VUE_APP_BASE_API = 'http://192.168.1.61:48080' # sara diff --git a/src/api/report/benchmarking.js b/src/api/report/benchmarking.js index 7ce4bd2..b863bbd 100644 --- a/src/api/report/benchmarking.js +++ b/src/api/report/benchmarking.js @@ -1,6 +1,59 @@ // 对标报表的接口 import request from '@/utils/request' +// 产量对标FTO +export function fTOReportByDateRangePage(data) { + return request({ + url: '/ip/prod-output/queryOBFTOReportByDateRange', + method: 'post', + data: data + }) +} +// 产量对标FTO导出 +export function fTOReportByDateRangeExport(data) { + return request({ + url: '/ip/prod-output/queryOBFTOReportByDateRangeExcel', + method: 'post', + responseType: 'blob', + data: data + }) +} + +// 芯片产量对标 +export function cPReportByDateRangePage(data) { + return request({ + url: '/ip/prod-output/queryCPReportByDateRange', + method: 'post', + data: data + }) +} +// 芯片产量对标导出 +export function cPReportByDateRangeExport(data) { + return request({ + url: '/ip/prod-output/queryCPReportByDateRangeExport', + method: 'post', + responseType: 'blob', + data: data + }) +} + +// 标准组件产量对标 +export function sCPReportByDateRangePage(data) { + return request({ + url: '/ip/prod-output/querySCPReportByDateRange', + method: 'post', + data: data + }) +} +// 标准组件产量对标导出 +export function sCPReportByDateRangeExport(data) { + return request({ + url: '/ip/prod-output/querySCPReportByDateRangeExport', + method: 'post', + responseType: 'blob', + data: data + }) +} // 稼动率对标 export function utilzationComparePage(data) { return request({ @@ -35,4 +88,40 @@ export function chipoeeCompareExport(data) { responseType: 'blob', data: data }) +} + +// 封装OEE对标 +export function componentOEEPage(data) { + return request({ + url: '/ip/component-oee/page', + method: 'post', + data: data + }) +} +// 封装OEE对标导出 +export function componentOEEExport(data) { + return request({ + url: '/ip/component-oee/export', + method: 'post', + responseType: 'blob', + data: data + }) +} + +// 芯片人均产量 +export function chipAnnualAverageProductionPage(data) { + return request({ + url: '/ip/chip-annual-average-production/page', + method: 'post', + data: data + }) +} +// 芯片人均产量导出 +export function chipAnnualAverageProductionExport(data) { + return request({ + url: '/ip/chip-annual-average-production/export', + method: 'post', + responseType: 'blob', + data: data + }) } \ No newline at end of file diff --git a/src/views/report/chipOutputBM/index.vue b/src/views/report/chipOutputBM/index.vue index 61fda8b..d3d09e1 100644 --- a/src/views/report/chipOutputBM/index.vue +++ b/src/views/report/chipOutputBM/index.vue @@ -4,7 +4,7 @@
-
4月芯片产量
+
芯片产量
import bmSearchBar from "../components/bmSearchBar.vue"; import BmLineBar from "../components/bmLineBar.vue"; -const tableProps = [ - { - prop: "factory", - label: "工厂名称", - // filter: (val) => factoryList[val], - minWidth: 200, - showOverflowtooltip: true, - }, - { - prop: "name", - label: "科目", - minWidth: 120, - showOverflowtooltip: true, - }, - { - prop: "unit", - label: "单位", - minWidth: 80, - showOverflowtooltip: true, - }, - { - prop: "time1", - label: "时间1", - minWidth: 150, - showOverflowtooltip: true, - }, - { - prop: "time2", - label: "时间2", - minWidth: 150, - showOverflowtooltip: true, - }, - { - prop: "mubiao", - label: "目标值", - minWidth: 150, - showOverflowtooltip: true, - }, -]; +import { + cPReportByDateRangePage, + cPReportByDateRangeExport, +} from "@/api/report/benchmarking.js"; +import moment from "moment"; export default { name: "ChipOutputBM", data() { return { - tableProps, + factoryList: [ + { id: 0, name: "瑞昌" }, + { id: 1, name: "邯郸" }, + ], + tableProps: [], + tableProps1: [ + { + prop: "factory", + label: "工厂名称", + filter: (val) => this.factoryList[val].name, + minWidth: 150, + showOverflowtooltip: true, + }, + { + prop: "item", + label: "科目", + minWidth: 120, + showOverflowtooltip: true, + }, + { + prop: "unit", + label: "单位", + minWidth: 80, + showOverflowtooltip: true, + }, + ], listQuery: { current: 1, - size: 1000, + size: 100, }, - tableData: [ - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - ], + tableData: [], chartHeight: this.tableHeight(269) / 2, tableH: this.tableHeight(269) / 2, legendList: [ - { id: 1, name: "2024年4月目标值", type: 2, color: "#FFCE6A" }, - { id: 2, name: "2023年4月", type: 1, color: "#8EF0AB" }, - { id: 3, name: "2024年4月", type: 1, color: "#288AFF" }, + { id: 1, name: "", type: 2, color: "#FFCE6A" }, + { id: 2, name: "", type: 1, color: "#8EF0AB" }, + { id: 3, name: "", type: 1, color: "#288AFF" }, ], chartMsg: { color: ["#FFCE6A", "#8EF0AB", "#288AFF"], - xData: ["成都", "邯郸", "瑞昌"], + xData: [], yName: "单位/片", series: [ { - name: "2024年4月目标值", - // data: [3000, 2000, 3000], - // data: [6800, 5000, 8900], - // data: [12000, 17000, 19000], - data: [560000, 540000, 600000], + name: "1", + data: [], type: "line", symbol: "circle", symbolSize: 6, @@ -130,28 +90,22 @@ export default { }, }, { - name: "2023年4月", - // data: [2100, 800, 1500], - // data: [9500, 7200, 9901], - // data: [14666, 15000, 17888], - data: [550000, 456666, 590000], + name: "2", + data: [], type: "bar", barWidth: 20, label: { show: true, // position: [-5, -16], // position: [-5, -16], - // position: [-10, -16], - position: [-17, -16], + position: [-10, -16], + // position: [-17, -16], color: "#68C483", }, }, { - name: "2024年4月", - // data: [2100, 900, 1300], - // data: [9100, 7300, 9700], - // data: [14666, 15300, 18000], - data: [556666, 456666, 650000], + name: "3", + data: [], type: "bar", barWidth: 20, label: { @@ -188,6 +142,13 @@ export default { this.chartHeight = this.tableHeight(269) / 2; window.addEventListener("resize", this._setTableHeight); }, + mounted() { + this.tableProp = this.tableProp1; + this.listQuery.date = 2; + this.listQuery.queryTime = moment().format("yyyy-MM-DD"); + this.listQuery.factorys = []; + this.getList(); + }, destroyed() { window.removeEventListener("resize", this._setTableHeight); }, @@ -206,11 +167,156 @@ export default { } }, getSearch(val) { - console.log(val); - console.log("========================="); + this.listQuery.date = val.type; + this.listQuery.queryTime = val.startDate; + this.listQuery.factorys = val.factory; + this.getList(); }, - handleExport() { - console.log("导出"); + getList() { + this.tableProps = []; + cPReportByDateRangePage({ ...this.listQuery }).then((res) => { + if (res.data && res.data.length > 0) { + // 设置表头 + let msg = res.data[0]; + let arr = [ + { + prop: "lastone", + label: msg.lastone.reportTime, + minWidth: 150, + }, + { + prop: "currentone", + label: msg.currentone.reportTime, + minWidth: 150, + }, + { + prop: "targetone", + label: msg.targetone.reportTime, + minWidth: 150, + }, + ]; + this.tableProps = this.tableProps1.concat(arr); + // 整理表格数据 + let tableArr = []; + res.data.forEach((item) => { + let obj = {}; + obj.factory = item.factory; + obj.item = "FTO投入"; + obj.unit = "片"; + obj.lastone = item.lastone.total; + obj.currentone = item.currentone.total; + obj.targetone = item.targetone.total; + tableArr.push(obj); + }); + this.tableData = tableArr; + // 设置图例 + this.legendList[0].name = msg.targetone.reportTime; + this.legendList[1].name = msg.lastone.reportTime; + this.legendList[2].name = msg.currentone.reportTime; + this.chartMsg.series[0].name = msg.targetone.reportTime; + this.chartMsg.series[1].name = msg.lastone.reportTime; + this.chartMsg.series[2].name = msg.currentone.reportTime; + // 设置偏移量 + switch (this.listQuery.type) { + case 0: + this.chartMsg.series[1].label.position = [-5, -16]; + break; + case 1: + this.chartMsg.series[1].label.position = [-5, -16]; + break; + case 2: + this.chartMsg.series[1].label.position = [-10, -16]; + break; + default: + this.chartMsg.series[1].label.position = [-17, -16]; + } + // 设置chartMsg的series的数据 + this.setChartMsg(res.data); + } else { + // 重置 + this.resetMsg(); + } + }); + }, + setChartMsg(val) { + let xData = []; + let lineData = []; + let barData1 = []; + let barData2 = []; + for (let i = 0; i < val.length; i++) { + this.factoryList.map((item) => { + if (item.id === val[i].factory) { + xData.push(item.name); + } + }); + lineData.push(val[i].targetone.total || 0); + barData1.push(val[i].lastone.total || 0); + barData2.push(val[i].currentone.total || 0); + } + this.chartMsg.xData = xData; + this.chartMsg.series[0].data = lineData; + this.chartMsg.series[1].data = barData1; + this.chartMsg.series[2].data = barData2; + this.chartMsg.xData = xData; + }, + resetMsg() { + this.tableProps = this.tableProps1; + this.tableData = []; + this.chartMsg = { + color: ["#FFCE6A", "#8EF0AB", "#288AFF"], + xData: [], + yName: "单位/片", + series: [ + { + name: "1", + data: [], + type: "line", + symbol: "circle", + symbolSize: 6, + label: { + show: true, + color: "#FFAE17", + }, + }, + { + name: "2", + data: [], + type: "bar", + barWidth: 20, + label: { + show: true, + // position: [-5, -16], + // position: [-5, -16], + position: [-10, -16], + // position: [-17, -16], + color: "#68C483", + }, + }, + { + name: "3", + data: [], + type: "bar", + barWidth: 20, + label: { + show: true, + position: [0, -16], + color: "#288AFF", + }, + }, + ], + }; + }, + handleExport(val) { + this.listQuery.type = val.type; + this.listQuery.startDate = val.startDate; + this.listQuery.factory = val.factory; + let fileName = "芯片产量.xls"; + cPReportByDateRangeExport({ ...this.listQuery }) + .then((response) => { + this.$download.excel(response, fileName); + this.$message.success("导出成功"); + }) + .catch(() => {}); }, }, }; diff --git a/src/views/report/chipPerCapitaBM/index.vue b/src/views/report/chipPerCapitaBM/index.vue index 27be4ac..01c40e3 100644 --- a/src/views/report/chipPerCapitaBM/index.vue +++ b/src/views/report/chipPerCapitaBM/index.vue @@ -4,7 +4,7 @@
-
4月芯片人均产量
+
芯片人均产量
import bmSearchBar from "../components/bmSearchBar.vue"; import BmLineBar from "../components/bmLineBar.vue"; -const tableProps = [ - { - prop: "factory", - label: "工厂名称", - // filter: (val) => factoryList[val], - minWidth: 200, - showOverflowtooltip: true, - }, - { - prop: "name", - label: "科目", - minWidth: 120, - showOverflowtooltip: true, - }, - { - prop: "unit", - label: "单位", - minWidth: 80, - showOverflowtooltip: true, - }, - { - prop: "time1", - label: "时间1", - minWidth: 150, - showOverflowtooltip: true, - }, - { - prop: "time2", - label: "时间2", - minWidth: 150, - showOverflowtooltip: true, - }, - { - prop: "mubiao", - label: "目标值", - minWidth: 150, - showOverflowtooltip: true, - }, -]; +import { + chipAnnualAverageProductionPage, + chipAnnualAverageProductionExport, +} from "@/api/report/benchmarking.js"; +import moment from "moment"; export default { name: "ChipPerCapitaBM", data() { return { - tableProps, + factoryList: [ + { id: 0, name: "瑞昌" }, + { id: 1, name: "邯郸" }, + ], + tableProps: [], + tableProps1: [ + { + prop: "factory", + label: "工厂名称", + filter: (val) => this.factoryList[val].name, + minWidth: 150, + showOverflowtooltip: true, + }, + { + prop: "item", + label: "科目", + minWidth: 120, + showOverflowtooltip: true, + }, + { + prop: "unit", + label: "单位", + minWidth: 80, + showOverflowtooltip: true, + }, + ], listQuery: { current: 1, - size: 1000, + size: 100, }, - tableData: [ - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - { factory: "工厂1" }, - ], + tableData: [], chartHeight: this.tableHeight(269) / 2, tableH: this.tableHeight(269) / 2, legendList: [ - { id: 1, name: "2024年4月目标值", type: 2, color: "#FFCE6A" }, - { id: 2, name: "2023年4月", type: 1, color: "#8EF0AB" }, - { id: 3, name: "2024年4月", type: 1, color: "#288AFF" }, + { id: 1, name: "", type: 2, color: "#FFCE6A" }, + { id: 2, name: "", type: 1, color: "#8EF0AB" }, + { id: 3, name: "", type: 1, color: "#288AFF" }, ], chartMsg: { color: ["#FFCE6A", "#8EF0AB", "#288AFF"], - xData: ["成都", "邯郸", "瑞昌"], + xData: [], yName: "单位/片", series: [ { - name: "2024年4月目标值", - // data: [3000, 2000, 3000], - // data: [6800, 5000, 8900], - // data: [12000, 17000, 19000], - data: [560000, 540000, 600000], + name: "1", + data: [], type: "line", symbol: "circle", symbolSize: 6, @@ -130,28 +90,22 @@ export default { }, }, { - name: "2023年4月", - // data: [2100, 800, 1500], - // data: [9500, 7200, 9901], - // data: [14666, 15000, 17888], - data: [550000, 456666, 590000], + name: "2", + data: [], type: "bar", barWidth: 20, label: { show: true, // position: [-5, -16], // position: [-5, -16], - // position: [-10, -16], - position: [-17, -16], + position: [-10, -16], + // position: [-17, -16], color: "#68C483", }, }, { - name: "2024年4月", - // data: [2100, 900, 1300], - // data: [9100, 7300, 9700], - // data: [14666, 15300, 18000], - data: [556666, 456666, 650000], + name: "3", + data: [], type: "bar", barWidth: 20, label: { @@ -188,6 +142,13 @@ export default { this.chartHeight = this.tableHeight(269) / 2; window.addEventListener("resize", this._setTableHeight); }, + mounted() { + this.tableProp = this.tableProp1; + this.listQuery.type = 2; + this.listQuery.startDate = moment().format("yyyy-MM-DD"); + this.listQuery.factory = []; + this.getList(); + }, destroyed() { window.removeEventListener("resize", this._setTableHeight); }, @@ -206,11 +167,143 @@ export default { } }, getSearch(val) { - console.log(val); - console.log("========================="); + this.listQuery.type = val.type; + this.listQuery.startDate = val.startDate; + this.listQuery.factory = val.factory; + this.getList(); }, - handleExport() { - console.log("导出"); + getList() { + this.tableProps = []; + chipAnnualAverageProductionPage({ ...this.listQuery }).then((res) => { + if (res.data && res.data.records.length > 0) { + let msg = res.data.records[0]; + let arr = [ + { + prop: "yoy", + label: msg.yoyColumn, + minWidth: 150, + }, + { + prop: "queryValue", + label: msg.queryColumn, + minWidth: 150, + }, + { + prop: "target", + label: msg.targetColumn, + minWidth: 150, + }, + ]; + this.tableProps = this.tableProps1.concat(arr); + this.tableData = res.data.records; + // 设置图例 + this.legendList[0].name = msg.targetColumn; + this.legendList[1].name = msg.yoyColumn; + this.legendList[2].name = msg.queryColumn; + this.chartMsg.series[0].name = msg.targetColumn; + this.chartMsg.series[1].name = msg.yoyColumn; + this.chartMsg.series[2].name = msg.queryColumn; + // 设置偏移量 + switch (this.listQuery.type) { + case 0: + this.chartMsg.series[1].label.position = [-5, -16]; + break; + case 1: + this.chartMsg.series[1].label.position = [-5, -16]; + break; + case 2: + this.chartMsg.series[1].label.position = [-10, -16]; + break; + default: + this.chartMsg.series[1].label.position = [-17, -16]; + } + // 设置chartMsg的series的数据 + this.setChartMsg(res.data.records); + } else { + // 重置 + this.resetMsg(); + } + }); + }, + setChartMsg(val) { + let xData = []; + let lineData = []; + let barData1 = []; + let barData2 = []; + for (let i = 0; i < val.length; i++) { + this.factoryList.map((item) => { + if (item.id === val[i].factory) { + xData.push(item.name); + } + }); + lineData.push(val[i].target || 0); + barData1.push(val[i].yoy || 0); + barData2.push(val[i].queryValue || 0); + } + this.chartMsg.xData = xData; + this.chartMsg.series[0].data = lineData; + this.chartMsg.series[1].data = barData1; + this.chartMsg.series[2].data = barData2; + this.chartMsg.xData = xData; + }, + resetMsg() { + this.tableProps = this.tableProps1; + this.tableData = []; + this.chartMsg = { + color: ["#FFCE6A", "#8EF0AB", "#288AFF"], + xData: [], + yName: "单位/片", + series: [ + { + name: "1", + data: [], + type: "line", + symbol: "circle", + symbolSize: 6, + label: { + show: true, + color: "#FFAE17", + }, + }, + { + name: "2", + data: [], + type: "bar", + barWidth: 20, + label: { + show: true, + // position: [-5, -16], + // position: [-5, -16], + position: [-10, -16], + // position: [-17, -16], + color: "#68C483", + }, + }, + { + name: "3", + data: [], + type: "bar", + barWidth: 20, + label: { + show: true, + position: [0, -16], + color: "#288AFF", + }, + }, + ], + }; + }, + handleExport(val) { + this.listQuery.type = val.type; + this.listQuery.startDate = val.startDate; + this.listQuery.factory = val.factory; + let fileName = "芯片人均产量对标.xls"; + chipAnnualAverageProductionExport({ ...this.listQuery }) + .then((response) => { + this.$download.excel(response, fileName); + this.$message.success("导出成功"); + }) + .catch(() => {}); }, }, }; diff --git a/src/views/report/completionStatusIntrBM/components/baseChart.vue b/src/views/report/completionStatusIntrBM/components/baseChart.vue new file mode 100644 index 0000000..125293a --- /dev/null +++ b/src/views/report/completionStatusIntrBM/components/baseChart.vue @@ -0,0 +1,157 @@ + + diff --git a/src/views/report/completionStatusIntrBM/components/bmBarComplete.vue b/src/views/report/completionStatusIntrBM/components/bmBarComplete.vue index 2eda8f4..81fbde3 100644 --- a/src/views/report/completionStatusIntrBM/components/bmBarComplete.vue +++ b/src/views/report/completionStatusIntrBM/components/bmBarComplete.vue @@ -33,84 +33,23 @@ {{ item.name }}
-
+ +