Merge branch 'main' of http://39.101.199.1:8888/gongjiale/gangkou
This commit is contained in:
commit
f3c39d4a13
|
@ -102,7 +102,23 @@ export default {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const { data } = res;
|
const { data } = res;
|
||||||
this.chartData.series.data = Object.keys(data).map((key) => {
|
// 按照 month 正确排序
|
||||||
|
function sortDataByMonth(data) {
|
||||||
|
// 遍历对象的每个键
|
||||||
|
for (const key in data) {
|
||||||
|
if (data.hasOwnProperty(key)) {
|
||||||
|
// 对每个键对应的数组进行排序
|
||||||
|
data[key].sort((a, b) => {
|
||||||
|
// 比较 month 属性
|
||||||
|
return new Date(a.month) - new Date(b.month);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
const sortedData = sortDataByMonth(data);
|
||||||
|
|
||||||
|
this.chartData.series.data = Object.keys(sortedData).map((key) => {
|
||||||
return {
|
return {
|
||||||
name: this.deptList.find((item) => item.deptId === parseInt(key))?.deptName,
|
name: this.deptList.find((item) => item.deptId === parseInt(key))?.deptName,
|
||||||
type: "line",
|
type: "line",
|
||||||
|
|
|
@ -14,24 +14,32 @@
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="18">
|
<el-col :span="18">
|
||||||
<div class="export_btn">
|
<div class="export_btn">
|
||||||
<el-button type="primary" icon="eel-icon-download" @click="handleExport">导出</el-button>
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
icon="eel-icon-download"
|
||||||
|
@click="handleExport"
|
||||||
|
>导出</el-button
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row :gutter="10">
|
<el-row :gutter="10">
|
||||||
<el-table
|
<el-table
|
||||||
id="dailyTable"
|
id="dailyTable"
|
||||||
:data="tableData"
|
:data="tableData"
|
||||||
border
|
border
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
:span-method="objectSpanMethod"
|
:span-method="objectSpanMethod"
|
||||||
|
:row-class-name="tableRowClassName"
|
||||||
>
|
>
|
||||||
<el-table-column prop="ppp" label="港口">
|
<el-table-column prop="ppp" label="港口">
|
||||||
<template slot-scope="{ row }">
|
<template slot-scope="{ row }">
|
||||||
<div>{{ row.ppp }}</div>
|
<div>{{ row.ppp }}</div>
|
||||||
<div style="display: flex; gap: 10px">
|
<div style="display: flex; gap: 10px">
|
||||||
<el-tag>港口数: {{ getChildCount(row, 'ppp', 'pp') }}</el-tag>
|
<el-tag>港口数: {{ getChildCount(row, "ppp", "pp") }}</el-tag>
|
||||||
<el-tag type="warning">平均值: {{ calculateChildAvg(row, 'ppp') }}</el-tag>
|
<el-tag type="warning"
|
||||||
|
>平均值: {{ calculateChildAvg(row, "ppp") }}</el-tag
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
@ -40,8 +48,10 @@
|
||||||
<template slot-scope="{ row }">
|
<template slot-scope="{ row }">
|
||||||
<div>{{ row.pp }}</div>
|
<div>{{ row.pp }}</div>
|
||||||
<div style="display: flex; gap: 10px">
|
<div style="display: flex; gap: 10px">
|
||||||
<el-tag>企业数: {{ getChildCount(row, 'pp', 'p') }}</el-tag>
|
<el-tag>企业数: {{ getChildCount(row, "pp", "p") }}</el-tag>
|
||||||
<el-tag type="warning">平均值: {{ calculateChildAvg(row, 'pp') }}</el-tag>
|
<el-tag type="warning"
|
||||||
|
>平均值: {{ calculateChildAvg(row, "pp") }}</el-tag
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
@ -50,8 +60,10 @@
|
||||||
<template slot-scope="{ row }">
|
<template slot-scope="{ row }">
|
||||||
<div>{{ row.p }}</div>
|
<div>{{ row.p }}</div>
|
||||||
<div style="display: flex; gap: 10px">
|
<div style="display: flex; gap: 10px">
|
||||||
<el-tag>设备数: {{ getChildCount(row, 'p', 'sn') }}</el-tag>
|
<el-tag>设备数: {{ getChildCount(row, "p", "sn") }}</el-tag>
|
||||||
<el-tag type="warning">平均值: {{ calculateChildAvg(row, 'p') }}</el-tag>
|
<el-tag type="warning"
|
||||||
|
>平均值: {{ calculateChildAvg(row, "p") }}</el-tag
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
@ -84,7 +96,18 @@ export default {
|
||||||
this.day = moment().format("YYYY-MM-DD");
|
this.day = moment().format("YYYY-MM-DD");
|
||||||
this.queryData();
|
this.queryData();
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
pppList() {
|
||||||
|
return Array.from(new Set(this.tableData.map((item) => item.ppp)));
|
||||||
|
},
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
tableRowClassName({ row, rowIndex }) {
|
||||||
|
const classNames = ["default-row", "success-row", "error-row", "warning-row", "info-row"];
|
||||||
|
const index = this.pppList.findIndex((item) => item === row.ppp);
|
||||||
|
if (index === -1) return "info-row";
|
||||||
|
return index > classNames.length - 1 ? classNames[index % classNames.length] : classNames[index];
|
||||||
|
},
|
||||||
changeDate() {
|
changeDate() {
|
||||||
this.queryData();
|
this.queryData();
|
||||||
},
|
},
|
||||||
|
@ -94,7 +117,7 @@ export default {
|
||||||
this.tableData = res.data.map((item) => {
|
this.tableData = res.data.map((item) => {
|
||||||
return {
|
return {
|
||||||
...item,
|
...item,
|
||||||
avgDs: parseFloat(item.avgDs.toFixed(2))
|
avgDs: parseFloat(item.avgDs.toFixed(2)),
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -152,7 +175,9 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// 计算平均值, 保留两位小数
|
// 计算平均值, 保留两位小数
|
||||||
return (childList.reduce((a, b) => a + b, 0) / childList.length).toFixed(2);
|
return (childList.reduce((a, b) => a + b, 0) / childList.length).toFixed(
|
||||||
|
2
|
||||||
|
);
|
||||||
},
|
},
|
||||||
handleExport() {
|
handleExport() {
|
||||||
exportExcel("#dailyTable", `${this.day}-数据统计`);
|
exportExcel("#dailyTable", `${this.day}-数据统计`);
|
||||||
|
@ -161,6 +186,27 @@ export default {
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-table .warning-row {
|
||||||
|
background: rgba(248,236,216,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table .success-row {
|
||||||
|
background: rgba(225,243,216,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table .error-row {
|
||||||
|
background: rgba(252,226,226,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table .default-row {
|
||||||
|
background: rgba(201,226,255,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table .info-row {
|
||||||
|
background: rgba(233,233,235,0.3);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.daily-data {
|
.daily-data {
|
||||||
padding: 10px 20px;
|
padding: 10px 20px;
|
||||||
|
|
|
@ -30,7 +30,17 @@
|
||||||
:border="true"
|
:border="true"
|
||||||
:header-cell-style="headerStyle"
|
:header-cell-style="headerStyle"
|
||||||
>
|
>
|
||||||
<el-table-column prop="month" label="名称">
|
<!-- <el-table-column label="港区">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
{{ deptName }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="月份">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ dateValue.replace("-", "年") }}月</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column> -->
|
||||||
|
<el-table-column prop="month" label="名称" align="center">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ getTableFirstColumnName(scope.row) }}
|
{{ getTableFirstColumnName(scope.row) }}
|
||||||
</template>
|
</template>
|
||||||
|
@ -41,18 +51,6 @@
|
||||||
align="center"
|
align="center"
|
||||||
:formatter="dataFormatter"
|
:formatter="dataFormatter"
|
||||||
></el-table-column>
|
></el-table-column>
|
||||||
<el-table-column
|
|
||||||
prop="avgDbz"
|
|
||||||
label="低报值"
|
|
||||||
align="center"
|
|
||||||
:formatter="dataFormatter"
|
|
||||||
></el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
prop="avgGbz"
|
|
||||||
label="高报值"
|
|
||||||
align="center"
|
|
||||||
:formatter="dataFormatter"
|
|
||||||
></el-table-column>
|
|
||||||
</el-table>
|
</el-table>
|
||||||
<el-table
|
<el-table
|
||||||
:data="cmDeviceDs"
|
:data="cmDeviceDs"
|
||||||
|
@ -120,10 +118,10 @@ export default {
|
||||||
this.queryData();
|
this.queryData();
|
||||||
},
|
},
|
||||||
getTableFirstColumnName(row) {
|
getTableFirstColumnName(row) {
|
||||||
if (row.month && row.month === this.month) {
|
if (row.month && row.month === this.dateValue) {
|
||||||
return "本月均值";
|
return "本月均值";
|
||||||
}
|
}
|
||||||
if (row.month && row.month !== this.month) {
|
if (row.month && row.month !== this.dateValue) {
|
||||||
return "上月均值";
|
return "上月均值";
|
||||||
}
|
}
|
||||||
return "变化率";
|
return "变化率";
|
||||||
|
@ -172,8 +170,8 @@ export default {
|
||||||
const ws_name = "SheetJS";
|
const ws_name = "SheetJS";
|
||||||
const ws_data = [
|
const ws_data = [
|
||||||
[filename],
|
[filename],
|
||||||
["名称", "读数", "低报值", "高报值"],
|
["名称", "读数",],
|
||||||
...this.overViewTableData.map(row => [this.getTableFirstColumnName(row), row.avgDs, row.avgDbz, row.avgGbz]),
|
...this.overViewTableData.map(row => [this.getTableFirstColumnName(row), row.avgDs,]),
|
||||||
["港区", "企业", "编号", "平均值"],
|
["港区", "企业", "编号", "平均值"],
|
||||||
...this.cmDeviceDs.map(row => [row.gangQu, row.deptName, row.sn, row.avgDs]),
|
...this.cmDeviceDs.map(row => [row.gangQu, row.deptName, row.sn, row.avgDs]),
|
||||||
];
|
];
|
||||||
|
|
Loading…
Reference in New Issue