From 8bb7824522c4e5a73cbcb642db02ab68d1d1ad4f Mon Sep 17 00:00:00 2001
From: CD配唱片 <CD配唱片>
Date: 星期五, 25 四月 2025 14:16:52 +0800
Subject: [PATCH] 提交负载统计页面搭建
---
src/views/mainPlan/gasProduceStatics/index.vue | 209 ++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 209 insertions(+), 0 deletions(-)
diff --git a/src/views/mainPlan/gasProduceStatics/index.vue b/src/views/mainPlan/gasProduceStatics/index.vue
index e69de29..d79ef8f 100644
--- a/src/views/mainPlan/gasProduceStatics/index.vue
+++ b/src/views/mainPlan/gasProduceStatics/index.vue
@@ -0,0 +1,209 @@
+<template>
+ <div class="app-container">
+ <el-row :gutter="10" class="mb8">
+ <el-col :span="1.5">
+ <el-button
+ type="warning"
+ plain
+ icon="Download"
+ @click="handleExport"
+ v-hasPermi="['apsPartRouteStat:export']"
+ >瀵煎嚭</el-button>
+ </el-col>
+ <el-col :span="1.5">
+ <el-button
+ type="info"
+ plain
+ icon="Refresh"
+ @click="handleRefresh"
+ v-hasPermi="['apsPartRouteStat:edit']"
+ >鏇存柊</el-button>
+ </el-col>
+ <right-toolbar @queryTable="getList" :search="false"></right-toolbar>
+ </el-row>
+ <vxe-grid ref="gridRef" v-bind="gridOptions" :loading="loading"></vxe-grid>
+ </div>
+</template>
+
+<script setup name="apsPartRouteStat">
+import { query,updateStat } from "@/api/mainPlan/partRouteStat.js";
+import { ref } from "vue";
+import * as XLSX from 'xlsx';
+
+const { proxy } = getCurrentInstance();
+
+const loading = ref(true);
+const gridRef = ref();
+const height = ref(document.documentElement.clientHeight - 130 + "px;")
+const headers = ref([]);
+const exportData = ref([]);
+
+const gridOptions = reactive({
+ border: true,
+ stripe: true,
+ loading: false,
+ showOverflow: true,
+ showHeaderOverflow: true,
+ showFooterOverflow: true,
+ height: height,
+ columnConfig: {
+ resizable: true
+ },
+ scrollX: {
+ enabled: true,
+ gt: 0,
+ threshold: 50
+ },
+ scrollY: {
+ enabled: true,
+ gt: 0,
+ threshold: 50
+ }
+});
+
+let tableColumn = []
+let tableData = []
+let merges = [];
+
+/** 鏌ヨ闆朵欢缁熻琛ㄥ垪琛� */
+function getList() {
+ let rowKey = 0
+ let colKey = 0
+ headers.value = []
+ exportData.value = []
+ tableColumn = []
+ tableData = []
+ loading.value = true;
+ query().then(response => {
+ const colList = []
+ let headersOne = []
+ let headersTwo = []
+ if(response.code == '200'){
+ if (!response.planTitle) {
+ loading.value = false;
+ return;
+ }
+ headersOne.push('鏃ユ湡');
+ headersTwo.push('璧勬簮缁�');
+ colList.push({
+ field: 'dateCol',
+ title: '鏃ユ湡',
+ fixed: 'left',
+ children: [
+ { field: `resourceName`, title: '璧勬簮缁�', width: 250, type: 'html'},
+ ],
+ width: 160
+ })
+ response.planTitle.forEach(item => {
+ headersOne.push(item);
+ headersOne.push('');
+ headersOne.push('');
+ headersTwo.push('璁捐宸ユ椂');
+ headersTwo.push('闇�姹傚伐鏃�');
+ headersTwo.push('浜ц兘璐熻嵎');
+ colKey++
+ colList.push({
+ field: `dateColTime${colKey}`,
+ title: item,
+ children: [
+ { field: `designTimes${colKey}`, title: '璁捐宸ユ椂', width: 80},
+ { field: `requireTimes${colKey}`, title: '闇�姹傚伐鏃�', width: 80},
+ { field: `capacityLoad${colKey}`, title: '浜ц兘璐熻嵎', width: 80, type: 'html'},
+ ],
+ width: 160
+ })
+ });
+
+ headers.value.push(headersOne);
+ headers.value.push(headersTwo);
+
+ const columnList = [...tableColumn, ...colList]
+ const dataList = []
+ let startCol = 1;
+
+ //鑾峰彇map
+ response.planTable.forEach(mapItem => {
+ rowKey++
+ let lastCol = startCol + 2;
+ merges.push({ s: { r: 0, c: startCol }, e: { r: 0, c: lastCol} });
+ startCol = lastCol + 1;
+ let data = [];
+ const item = {
+ id: `${rowKey}`
+ }
+ for (const [key, listValue] of Object.entries(mapItem)) {
+ data.push(key);
+
+ let tableKey = 0;
+ let flag = false;
+ listValue.forEach(listItem => {
+
+ tableKey++
+ item[`designTimes${tableKey}`] = listItem.designTimes;
+ item[`requireTimes${tableKey}`] = listItem.requireTimes;
+ item[`capacityLoad${tableKey}`] = listItem.capacityLoad > 100 ? `<font color="red">${listItem.capacityLoad}%</font>` :listItem.capacityLoad+'%';
+ data.push(listItem.designTimes);
+ data.push(listItem.requireTimes);
+ data.push(listItem.capacityLoad+'%');
+ if (listItem.capacityLoad > 100) {
+ flag = true;
+ }
+ });
+
+ item[`resourceName`] = flag ? `<div class='el-badge'><sup class="el-badge__content is-fixed is-dot"></sup>${key}</div>` : key;
+ }
+ exportData.value.push(data);
+ dataList.push(item);
+ });
+
+ const $grid = gridRef.value
+ if ($grid) {
+ tableColumn = columnList
+ tableData = [...tableData, ...dataList]
+ $grid.loadColumn(tableColumn)
+ $grid.loadData(tableData)
+ gridOptions.loading = false
+ }
+
+ loading.value = false;
+ }
+ });
+}
+
+/** 瀵煎嚭鎸夐挳鎿嶄綔 */
+function handleExport() {
+
+ // 鍚堝苟琛ㄥご鍜屾暟鎹�
+ const finalData = [...headers.value, ...exportData.value];
+
+ // 灏嗘暟鎹浆鎹负 worksheet
+ const ws = XLSX.utils.aoa_to_sheet(finalData);
+
+ // 鍚堝苟鍗曞厓鏍硷紙濡傛灉闇�瑕侊級
+ /* ws['!merges'] = [
+ { s: { r: 0, c: 1 }, e: { r: 0, c: 3 } },
+ { s: { r: 0, c: 0 }, e: { r: 0, c: 0 } }
+ ]; */
+
+ ws['!merges'] = merges;
+
+ // 鍒涘缓 workbook
+ const wb = XLSX.utils.book_new();
+ // 灏� worksheet 娣诲姞鍒� workbook 涓�
+ XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');
+ // 瀵煎嚭鏂囦欢
+ XLSX.writeFile(wb, `apsPartRouteStat_${new Date().getTime()}.xlsx`);
+
+}
+
+/** 鍒锋柊鎸夐挳鎿嶄綔 */
+function handleRefresh(){
+ updateStat().then(response => {
+ if(response.code == '200'){
+ getList();
+ }
+ });
+}
+
+getList();
+</script>
--
Gitblit v1.9.3