mt-fe-group/yudao-init
9
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

剩余报表

Browse Source
This commit is contained in:
朱菊兰
2024-06-20 15:23:05 +08:00
parent 7ba831f496
commit ce350c0c7f
11 changed files with 1250 additions and 517 deletions
Download Patch File Download Diff File Expand all files Collapse all files

270
src/views/report/completionStatusIntrBM/index.vue
View File

@@ -11,8 +11,8 @@
<bm-bar-complete
:chartHeight="chartHeight"
:legendList="legendList"
:chartMsg="chartMsg"
:chartId="chartId"
:chartMsg1="chartMsg1"
:chartMsg2="chartMsg2"
:chartNum="chartNum"
/>
<base-table
@@ -29,77 +29,49 @@
<script>
import BmSearchBarComplete from "./components/bmSearchBarComplete.vue";
import BmBarComplete from "./components/bmBarComplete.vue";
const tableProps = [
{
prop: "factory",
label: "指标名称",
// filter: (val) => factoryList[val],
},
{
prop: "unit",
label: "单位",
},
{
prop: "time1",
label: "时间1",
},
{
prop: "time2",
label: "时间2",
},
];
import {
targetCompletionPage,
targetCompletionExport,
} from "@/api/report/benchmarking.js";
import moment from "moment";
export default {
name: "CompletionStatusIntrBM",
data() {
return {
tableProps,
tableProps: [],
tableProps1: [
{
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: "2023年4月", type: 1, color: "#288AFF33" },
{ id: 2, name: "2024年4月", type: 1, color: "#288AFF" },
{ id: 1, name: "", type: 1, color: "#288AFF33" },
{ id: 2, name: "", type: 1, color: "#288AFF" },
],
chartMsg: {
chartMsg1: {
color: ["#288AFF33", "#288AFF"],
xData: ["成都", "邯郸", "瑞昌"],
xData: [],
yName: "单位/MW",
series: [
{
name: "2023年4月",
data: [5505, 6578, 5500],
name: "1",
data: [],
type: "bar",
barWidth: 20,
label: {
@@ -109,8 +81,38 @@ export default {
},
},
{
name: "2024年4月",
data: [3503, 3456, 4500],
name: "2",
data: [],
type: "bar",
barWidth: 20,
barGap: "-100%",
label: {
show: true,
position: "top",
color: "#288AFF",
},
},
],
},
chartMsg2: {
color: ["#288AFF33", "#288AFF"],
xData: [],
yName: "单位/㎡",
series: [
{
name: "1",
data: [],
type: "bar",
barWidth: 20,
label: {
show: true,
position: "top",
color: "#2789FF",
},
},
{
name: "2",
data: [],
type: "bar",
barWidth: 20,
barGap: "-100%",
@@ -122,7 +124,6 @@ export default {
},
],
},
chartId: "completionStatusIntrBMChart",
chartNum: 1,
};
},
@@ -148,6 +149,12 @@ 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.getList();
},
destroyed() {
window.removeEventListener("resize", this._setTableHeight);
},
@@ -166,11 +173,144 @@ export default {
}
},
getSearch(val) {
console.log(val);
console.log("=========================");
this.listQuery.type = val.type;
this.listQuery.startDate = val.startDate;
this.getList();
},
handleExport() {
console.log("导出");
getList() {
this.tableProps = [];
targetCompletionPage({ ...this.listQuery }).then((res) => {
if (res.data && res.data.records.length > 0) {
let msg = res.data.records[0];
let arr = [
{
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.queryColumn;
this.chartMsg1.series[0].name = msg.targetColumn;
this.chartMsg1.series[1].name = msg.queryColumn;
this.chartMsg2.series[0].name = msg.targetColumn;
this.chartMsg2.series[1].name = msg.queryColumn;
// 设置偏移量
switch (this.listQuery.type) {
case 0:
this.chartMsg1.series[1].label.position = [-5, -16];
this.chartMsg2.series[1].label.position = [-5, -16];
break;
case 1:
this.chartMsg1.series[1].label.position = [-5, -16];
this.chartMsg2.series[1].label.position = [-5, -16];
break;
case 2:
this.chartMsg1.series[1].label.position = [-10, -16];
this.chartMsg2.series[1].label.position = [-10, -16];
break;
default:
this.chartMsg1.series[1].label.position = [-17, -16];
this.chartMsg2.series[1].label.position = [-17, -16];
}
// 设置chartMsg的series的数据
this.setChartMsg(res.data.records);
} else {
// 重置
this.resetMsg();
}
});
},
setChartMsg(val) {
let xData1 = [];
let xData2 = [];
let barData1 = [];
let barData2 = [];
let barData3 = [];
let barData4 = [];
for (let i = 0; i < val.length; i++) {
if (val[i].unit !== "㎡") {
xData1.push(val[i].item);
barData1.push(val[i].target || 0);
barData2.push(val[i].queryValue || 0);
} else {
xData2.push(val[i].item);
barData3.push(val[i].target || 0);
barData4.push(val[i].queryValue || 0);
}
}
this.chartMsg1.xData = xData1;
this.chartMsg2.xData = xData2;
this.chartMsg1.series[0].data = barData1;
this.chartMsg1.series[1].data = barData2;
this.chartMsg2.series[0].data = barData3;
this.chartMsg2.series[1].data = barData4;
},
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;
let fileName = "指标完成情况对标.xls";
targetCompletionExport({ ...this.listQuery })
.then((response) => {
this.$download.excel(response, fileName);
this.$message.success("导出成功");
})
.catch(() => {});
},
},
};