From 48a1f3a23b12b8c78cfaa77de9528c96ff57769f Mon Sep 17 00:00:00 2001 From: CD配唱片 <CD配唱片> Date: 星期五, 25 四月 2025 22:55:43 +0800 Subject: [PATCH] 提交气柜管路负载统计页面全部 --- src/views/mainPlan/gasProduceStatics/index.vue | 312 ++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 228 insertions(+), 84 deletions(-) diff --git a/src/views/mainPlan/gasProduceStatics/index.vue b/src/views/mainPlan/gasProduceStatics/index.vue index 2272d3f..1417358 100644 --- a/src/views/mainPlan/gasProduceStatics/index.vue +++ b/src/views/mainPlan/gasProduceStatics/index.vue @@ -36,7 +36,7 @@ </div> <div v-else> <el-date-picker - v-model="value2" + v-model="queryParams.monthDays" type="month" placeholder="閫夋嫨鏈堜唤" /> @@ -104,22 +104,23 @@ } from "@/api/mainPlan/gasProduceStatics.js"; import { ref } from "vue"; import * as XLSX from "xlsx"; -import { ElMessage } from "element-plus"; const { proxy } = getCurrentInstance(); const loading = ref(false); const gridRef = ref(); const gridRef2 = ref(); -const height = ref(document.documentElement.clientHeight - 130 + "px;"); +const height = ref(document.documentElement.clientHeight - 400 + "px;"); const headers = ref([]); const exportData = ref([]); const showSearch = ref(true); const data = reactive({ queryParams: { monthRange: "", + monthDays: "", searchType: "鎸夋湀缁熻", }, }); +let searchTypeValue = ref("month"); const options = [ { value: "month", @@ -136,7 +137,7 @@ stripe: true, loading: false, showOverflow: true, - showHeaderOverflow: true, + eaderOverflow: true, showFooterOverflow: true, height: height, columnConfig: { @@ -158,21 +159,32 @@ let tableData = []; let merges = []; function handleChangeSelectType(e) { - console.log(e, "sjcsuhcushc"); + searchTypeValue.value = e + console.log(e,searchTypeValue.value, "sjcsuhcushc"); if (e === "day") { dayCom.value = true; } else { dayCom.value = false; } } +function dateStr(dateTimeString) { + const dateTime = new Date(dateTimeString); + // 鎻愬彇骞翠唤鍜屾湀浠� + const year = dateTime.getFullYear(); + const month = String(dateTime.getMonth() + 1).padStart(2, "0"); // 鏈堜唤浠�0寮�濮嬶紝鎵�浠ラ渶瑕佸姞1锛屽苟鐢╬adStart琛ラ浂 + // 鏍煎紡鍖栧勾浠藉拰鏈堜唤涓� "yyyy-mm" 鏍煎紡鐨勫瓧绗︿覆 + return`${year}-${month}`; +} /** 鏌ヨ闆朵欢缁熻琛ㄥ垪琛� */ -function getList() { - let type = "" - options.map(item=>{ - if(queryParams.value.searchType === item.label){ - type = item.value - } - }) +function getPipeList() { + let sYearMonth = ""; + let eYearMonth = ""; + // let type = ""; + // options.map((item) => { + // if (queryParams.value.searchType === item.label) { + // type = item.value; + // } + // }); // 鍒涘缓涓�涓狣ate瀵硅薄 let sDate = new Date(queryParams.value.monthRange[0]); let eDate = new Date(queryParams.value.monthRange[1]); @@ -182,8 +194,8 @@ let eYear = eDate.getFullYear(); let eMonth = eDate.getMonth() + 1; // 鏈堜唤鏄粠0寮�濮嬬殑锛屾墍浠ヨ鍔�1 // 鏍煎紡鍖栦负"YYYY-MM"鐨勫舰寮� - let sYearMonth = `${sYear}-${sMonth.toString().padStart(2, "0")}`; - let eYearMonth = `${eYear}-${eMonth.toString().padStart(2, "0")}`; + sYearMonth = `${sYear}-${sMonth.toString().padStart(2, "0")}`; + eYearMonth = `${eYear}-${eMonth.toString().padStart(2, "0")}`; console.log(sYearMonth, eYearMonth, "yearMonth"); let rowKey = 0; @@ -194,132 +206,262 @@ tableData = []; loading.value = true; listGasProduceStatics({ - searchStartDate: sYearMonth, - searchEndDate: eYearMonth, - searchType: type, + searchStartDate: + queryParams.value.searchType === "鎸夋湀缁熻" + ? sYearMonth + : dateStr(queryParams.value.monthDays), + searchEndDate: + queryParams.value.searchType === "鎸夋湀缁熻" + ? eYearMonth + : dateStr(queryParams.value.monthDays), + searchType: searchTypeValue.value, + major:'piping' }).then((response) => { + console.log(response.data.planTable,'responseresponseresponse') const colList = []; let headersOne = []; let headersTwo = []; - if (response.code == "200") { - if (!response.planTitle) { + if(response.code == '200'){ + if (!response.data.planTitle) { loading.value = false; return; } - headersOne.push("鏃ユ湡"); - headersTwo.push("璧勬簮缁�"); + 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) => { + field: 'dateCol', + title: '鏃ユ湡', + fixed: 'left', + children: [ + { field: `resourceName`, title: '宸ュ簭鍚嶇О', width: 250, type: 'html'}, + ], + width: 160 + }) + response.data.planTitle.forEach(item => { headersOne.push(item); - headersOne.push(""); - headersOne.push(""); - headersTwo.push("璁捐宸ユ椂"); - headersTwo.push("闇�姹傚伐鏃�"); - headersTwo.push("浜ц兘璐熻嵎"); - colKey++; + 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", - }, + { field: `designTimes${colKey}`, title: '璁捐浜ц兘', width: 80}, + { field: `requireTimes${colKey}`, title: '闇�姹備骇鑳�', width: 80}, + { field: `capacityLoad${colKey}`, title: '浜ц兘璐熻浇', width: 80, type: 'html'}, ], - width: 160, - }); + width: 160 + }) }); headers.value.push(headersOne); headers.value.push(headersTwo); - const columnList = [...tableColumn, ...colList]; - const dataList = []; + const columnList = [...tableColumn, ...colList] + const dataList = [] let startCol = 1; //鑾峰彇map - response.planTable.forEach((mapItem) => { - rowKey++; + response.data.planTable.map(mapItem => { + rowKey++ let lastCol = startCol + 2; - merges.push({ s: { r: 0, c: startCol }, e: { r: 0, c: lastCol } }); + merges.push({ s: { r: 0, c: startCol }, e: { r: 0, c: lastCol} }); startCol = lastCol + 1; let data = []; const item = { - id: `${rowKey}`, - }; + id: `${rowKey}` + } for (const [key, listValue] of Object.entries(mapItem)) { data.push(key); - + let tableKey = 0; let flag = false; - listValue.forEach((listItem) => { - tableKey++; + 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 + "%"; + 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 + "%"); + 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; + 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; - const $grid2 = gridRef.value; - if ($grid || $grid2) { - tableColumn = columnList; - tableData = [...tableData, ...dataList]; - $grid.loadColumn(tableColumn); - $grid.loadData(tableData); - $grid2.loadColumn(tableColumn); - $grid2.loadData(tableData); - gridOptions.loading = false; + + const $grid = gridRef.value + if ($grid) { + tableColumn = columnList + tableData = [...tableData, ...dataList] + $grid.loadColumn(tableColumn) + $grid.loadData(tableData) + gridOptions.loading = false } loading.value = false; } }); } +function getGasList() { + let sYearMonth = ""; + let eYearMonth = ""; + // let type = ""; + // options.map((item) => { + // if (queryParams.value.searchType === item.label) { + // type = item.value; + // } + // }); + // 鍒涘缓涓�涓狣ate瀵硅薄 + let sDate = new Date(queryParams.value.monthRange[0]); + let eDate = new Date(queryParams.value.monthRange[1]); + // 鑾峰彇骞翠唤鍜屾湀浠� + let sYear = sDate.getFullYear(); + let sMonth = sDate.getMonth() + 1; // 鏈堜唤鏄粠0寮�濮嬬殑锛屾墍浠ヨ鍔�1 + let eYear = eDate.getFullYear(); + let eMonth = eDate.getMonth() + 1; // 鏈堜唤鏄粠0寮�濮嬬殑锛屾墍浠ヨ鍔�1 + // 鏍煎紡鍖栦负"YYYY-MM"鐨勫舰寮� + sYearMonth = `${sYear}-${sMonth.toString().padStart(2, "0")}`; + eYearMonth = `${eYear}-${eMonth.toString().padStart(2, "0")}`; + console.log(sYearMonth, eYearMonth, "yearMonth"); + let rowKey = 0; + let colKey = 0; + headers.value = []; + exportData.value = []; + tableColumn = []; + tableData = []; + loading.value = true; + listGasProduceStatics({ + searchStartDate: + queryParams.value.searchType === "鎸夋湀缁熻" + ? sYearMonth + : dateStr(queryParams.value.monthDays), + searchEndDate: + queryParams.value.searchType === "鎸夋湀缁熻" + ? eYearMonth + : dateStr(queryParams.value.monthDays), + searchType: searchTypeValue.value, + major:'gas' + }).then((response) => { + console.log(response.data.planTable,'responseresponseresponse') + const colList = []; + let headersOne = []; + let headersTwo = []; + if(response.code == '200'){ + if (!response.data.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.data.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.data.planTable.map(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 = gridRef2.value + if ($grid) { + tableColumn = columnList + tableData = [...tableData, ...dataList] + $grid.loadColumn(tableColumn) + $grid.loadData(tableData) + gridOptions.loading = false + } + + loading.value = false; + } + }); +} /** 瀵煎嚭鎸夐挳鎿嶄綔 */ function handleExport() { proxy.download( - "/aps/apsGasPipingRouteStat/exportExcel", {}, + "/aps/apsGasPipingRouteStat/exportExcel", + {}, `aps_gas_produce_statics_${new Date().getTime()}.xlsx` ); } /** 鎼滅储鎸夐挳鎿嶄綔 */ function handleQuery() { - if (!queryParams.value.monthRange) { + if ( + (!queryParams.value.monthRange && dayCom.value == false) || + (!queryParams.value.monthDays && dayCom.value == true) + ) { ElMessage({ message: "璇烽�夋嫨骞存湀", type: "error", @@ -327,7 +469,8 @@ return; } // queryParams.value.pageNum = 1; - getList(); + getPipeList(); + getGasList(); } /** 閲嶇疆鎸夐挳鎿嶄綔 */ @@ -339,7 +482,8 @@ function handleRefresh() { updateStat().then((response) => { if (response.code == "200") { - getList(); + getPipeList(); + getGasList(); } }); } -- Gitblit v1.9.3