✨ feat: 每日数据前后端
This commit is contained in:
parent
5c341d8133
commit
56e0b23e1e
|
|
@ -158,4 +158,10 @@ public class OilStatisticsController extends BaseController {
|
|||
LocalDate lastYearDate = date.minus(1, ChronoUnit.YEARS);
|
||||
return lastYearDate.format(formatter);
|
||||
}
|
||||
|
||||
@GetMapping("/dailyData")
|
||||
public AjaxResult dailyData(String day) {
|
||||
List<Map<String, Object>> dailyReportDataOverview = oilThDeviceReportService.dailyReportDataOverview(day);
|
||||
return success(dailyReportDataOverview);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -64,4 +64,11 @@ public interface ThDeviceReportMapper {
|
|||
*/
|
||||
@MapKey("month")
|
||||
List<Map<String, Object>> monthReportDataOverviewDeviceDs(@Param("deptId") Long deptId, @Param("month") String month);
|
||||
|
||||
/**
|
||||
* 每日数据
|
||||
* @param day 日期 2024-08-30
|
||||
*/
|
||||
@MapKey("day")
|
||||
List<Map<String, Object>> dailyReportDataOverview(@Param("day") String day);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,4 +7,6 @@ public interface IOilThDeviceReportService {
|
|||
List<Map<String, Object>> monthReportDataOverview(Long deptId, String month);
|
||||
|
||||
List<Map<String, Object>> monthReportDataOverviewDeviceDs(Long deptId, String month);
|
||||
|
||||
List<Map<String, Object>> dailyReportDataOverview(String day);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,4 +26,9 @@ public class OilThDeviceReportService implements IOilThDeviceReportService {
|
|||
return camelCaseMapListKey(thDeviceReportMapper.monthReportDataOverviewDeviceDs(deptId, month));
|
||||
}
|
||||
|
||||
@Override
|
||||
public List<Map<String, Object>> dailyReportDataOverview(String day) {
|
||||
return camelCaseMapListKey(thDeviceReportMapper.dailyReportDataOverview(day));
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -159,4 +159,22 @@
|
|||
GROUP BY d.sn, p.dept_name, pp.dept_name
|
||||
ORDER BY pp.dept_name, p.dept_name
|
||||
</select>
|
||||
|
||||
<select id="dailyReportDataOverview" parameterType="map" resultType="map">
|
||||
SELECT TO_CHAR(d.report_time, 'YYYY-MM-DD') AS day,
|
||||
d.sn,
|
||||
p.dept_name as "p",
|
||||
pp.dept_name as "pp",
|
||||
ppp.dept_name as "ppp",
|
||||
ROUND(AVG(TO_NUMBER(d.ds)), 8) AS avg_ds
|
||||
FROM th_device_report d
|
||||
LEFT JOIN th_device td ON d.sn = td.sn
|
||||
LEFT JOIN sys_dept p ON td.dept_id = p.dept_id
|
||||
LEFT JOIN sys_dept pp ON p.parent_id = pp.dept_id
|
||||
LEFT JOIN sys_dept ppp ON pp.parent_id = ppp.dept_id
|
||||
WHERE d.sn IN (SELECT d.sn FROM th_device d)
|
||||
AND TO_CHAR(d.report_time, 'YYYY-MM-DD') = #{day}
|
||||
GROUP BY TO_CHAR(d.report_time, 'YYYY-MM-DD'), ppp.dept_name, pp.dept_name, p.dept_name, d.sn
|
||||
ORDER BY ppp.dept_name, pp.dept_name, p.dept_name
|
||||
</select>
|
||||
</mapper>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,9 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
export function getDailyData(params) {
|
||||
return request({
|
||||
url: '/statistics/dailyData',
|
||||
params: params,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
|
@ -1,7 +1,6 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
export function reportCenterApi(params) {
|
||||
console.log(params);
|
||||
return request({
|
||||
url: '/statistics/reportCenter',
|
||||
params: params,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,20 @@
|
|||
import * as XLSX from "xlsx";
|
||||
|
||||
|
||||
export function exportExcel(dom, fileName="导出文件") {
|
||||
const xlsxParam = { raw: true };//转换成excel时，使用原始的格式
|
||||
let table;
|
||||
if (!dom) {
|
||||
return;
|
||||
}
|
||||
// dom是字符串
|
||||
if (typeof dom === "string") {
|
||||
table = document.querySelector(dom).cloneNode(true);
|
||||
} else {
|
||||
table = dom.cloneNode(true);
|
||||
}
|
||||
let wb = XLSX.utils.table_to_book(table, xlsxParam);
|
||||
|
||||
// 生成excel
|
||||
XLSX.writeFile(wb, `${fileName.endsWith(".xlsx") ? fileName : fileName + ".xlsx"}`);
|
||||
}
|
||||
|
|
@ -0,0 +1,176 @@
|
|||
<template>
|
||||
<div class="daily-data">
|
||||
<el-row :gutter="10" class="tool-bar">
|
||||
<el-col :span="6">
|
||||
<el-date-picker
|
||||
v-model="day"
|
||||
type="date"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
@change="changeDate"
|
||||
placeholder="选择日期"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-col>
|
||||
<el-col :span="18">
|
||||
<div class="export_btn">
|
||||
<el-button type="primary" icon="eel-icon-download" @click="handleExport">导出</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-table
|
||||
id="dailyTable"
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%"
|
||||
:span-method="objectSpanMethod"
|
||||
>
|
||||
<el-table-column prop="ppp" label="港口">
|
||||
<template slot-scope="{ row }">
|
||||
<div>{{ row.ppp }}</div>
|
||||
<div style="display: flex; gap: 10px">
|
||||
<el-tag>港口数: {{ getChildCount(row, 'ppp', 'pp') }}</el-tag>
|
||||
<el-tag type="warning">平均值: {{ calculateChildAvg(row, 'ppp') }}</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="pp" label="港区">
|
||||
<template slot-scope="{ row }">
|
||||
<div>{{ row.pp }}</div>
|
||||
<div style="display: flex; gap: 10px">
|
||||
<el-tag>企业数: {{ getChildCount(row, 'pp', 'p') }}</el-tag>
|
||||
<el-tag type="warning">平均值: {{ calculateChildAvg(row, 'pp') }}</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="p" label="企业">
|
||||
<template slot-scope="{ row }">
|
||||
<div>{{ row.p }}</div>
|
||||
<div style="display: flex; gap: 10px">
|
||||
<el-tag>设备数: {{ getChildCount(row, 'p', 'sn') }}</el-tag>
|
||||
<el-tag type="warning">平均值: {{ calculateChildAvg(row, 'p') }}</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="sn" label="设备编号"></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="avgDs"
|
||||
label="当日均值"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from "moment";
|
||||
import { getDailyData } from "@/api/statistics/daily.js";
|
||||
import { exportExcel } from "@/utils/excel";
|
||||
export default {
|
||||
name: "Daily",
|
||||
data() {
|
||||
return {
|
||||
day: "",
|
||||
tableData: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.day = moment().format("YYYY-MM-DD");
|
||||
this.queryData();
|
||||
},
|
||||
methods: {
|
||||
changeDate() {
|
||||
this.queryData();
|
||||
},
|
||||
queryData() {
|
||||
getDailyData({ day: this.day }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.tableData = res.data.map((item) => {
|
||||
return {
|
||||
...item,
|
||||
avgDs: parseFloat(item.avgDs.toFixed(2))
|
||||
};
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
||||
const calculateRowSpan = (key) => {
|
||||
const value = row[key];
|
||||
let rowSpan = 1;
|
||||
if (rowIndex === 0) {
|
||||
while (
|
||||
this.tableData[rowIndex + rowSpan] &&
|
||||
this.tableData[rowIndex + rowSpan][key] === value
|
||||
) {
|
||||
rowSpan++;
|
||||
}
|
||||
return { rowspan: rowSpan, colspan: 1 };
|
||||
} else {
|
||||
if (this.tableData[rowIndex - 1][key] === value) {
|
||||
return { rowspan: 0, colspan: 0 };
|
||||
} else {
|
||||
while (
|
||||
this.tableData[rowIndex + rowSpan] &&
|
||||
this.tableData[rowIndex + rowSpan][key] === value
|
||||
) {
|
||||
rowSpan++;
|
||||
}
|
||||
return { rowspan: rowSpan, colspan: 1 };
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if (columnIndex === 0) {
|
||||
return calculateRowSpan("ppp");
|
||||
} else if (columnIndex === 1) {
|
||||
return calculateRowSpan("pp");
|
||||
} else if (columnIndex === 2) {
|
||||
return calculateRowSpan("p");
|
||||
}
|
||||
},
|
||||
getChildCount(row, key, childKey) {
|
||||
const childSet = new Set();
|
||||
for (let i = 0; i < this.tableData.length; i++) {
|
||||
if (row[key] === this.tableData[i][key]) {
|
||||
childSet.add(this.tableData[i][childKey]);
|
||||
}
|
||||
}
|
||||
return childSet.size;
|
||||
},
|
||||
calculateChildAvg(row, key) {
|
||||
const childList = [];
|
||||
for (let i = 0; i < this.tableData.length; i++) {
|
||||
if (row[key] === this.tableData[i][key]) {
|
||||
childList.push(this.tableData[i].avgDs);
|
||||
}
|
||||
}
|
||||
// 计算平均值, 保留两位小数
|
||||
return (childList.reduce((a, b) => a + b, 0) / childList.length).toFixed(2);
|
||||
},
|
||||
handleExport() {
|
||||
exportExcel("#dailyTable", `${this.day}-数据统计`);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.daily-data {
|
||||
padding: 10px 20px;
|
||||
|
||||
.tool-bar {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
.export_btn {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue