From a2b031ebf977da9726d14797afe1cc2923b71566 Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Mon, 3 Jun 2024 10:14:24 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E7=BB=BC=E5=90=88=E6=9F=A5=E8=AF=A2?=
 =?UTF-8?q?=E6=A8=A1=E6=8B=9F=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/enm_base/mock.json  |  74 ++++++++
 src/views/enm_base/mock2.json |  74 ++++++++
 src/views/enm_base/search.vue | 329 +++++++++++++++++++---------------
 3 files changed, 337 insertions(+), 140 deletions(-)
 create mode 100644 src/views/enm_base/mock.json
 create mode 100644 src/views/enm_base/mock2.json

diff --git a/src/views/enm_base/mock.json b/src/views/enm_base/mock.json
new file mode 100644
index 00000000..3bef526d
--- /dev/null
+++ b/src/views/enm_base/mock.json
@@ -0,0 +1,74 @@
+[
+  {
+    "mgroup": "3566085057347543040",
+    "mgroup__name": "石灰石破碎",
+    "total_production": 0,
+    "run_sec": 296088,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "石灰石破碎",
+    "production_hour": 0,
+    "elec_consume_unit": 0,
+    "run_hour": 82.25,
+    "run_rate": 11.4231,
+    "coal_consume_unit": 0
+  },
+  {
+    "mgroup": "3566609562721439744",
+    "mgroup__name": "原料磨",
+    "total_production": 22232,
+    "run_sec": 372752,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "原料磨",
+    "production_hour": 214.71,
+    "elec_consume_unit": 0,
+    "run_hour": 103.54,
+    "run_rate": 14.3809,
+    "coal_consume_unit": 0
+  },
+  {
+    "mgroup": "3566614036835889152",
+    "mgroup__name": "煤磨",
+    "total_production": 0,
+    "run_sec": 337988,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "煤磨",
+    "production_hour": 0,
+    "elec_consume_unit": 0,
+    "run_hour": 93.89,
+    "run_rate": 13.0397,
+    "coal_consume_unit": 0
+  },
+  {
+    "mgroup": "3566646268703080448",
+    "mgroup__name": "余热发电",
+    "total_production": 0,
+    "run_sec": 310131,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "余热发电",
+    "production_hour": 0,
+    "elec_consume_unit": 0,
+    "run_hour": 86.15,
+    "run_rate": 11.9649,
+    "coal_consume_unit": 0
+  },
+  {
+    "mgroup": "3566638510322909184",
+    "mgroup__name": "回转窑",
+    "total_production": 0,
+    "run_sec": 347311,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "回转窑",
+    "production_hour": 0,
+    "elec_consume_unit": 0,
+    "run_hour": 96.48,
+    "run_rate": 13.3993,
+    "coal_consume_unit": 0,
+    "celec_consume_unit": 0,
+    "en_consume_unit": 0
+  }
+]
\ No newline at end of file
diff --git a/src/views/enm_base/mock2.json b/src/views/enm_base/mock2.json
new file mode 100644
index 00000000..00530d3c
--- /dev/null
+++ b/src/views/enm_base/mock2.json
@@ -0,0 +1,74 @@
+[
+  {
+    "mgroup": "3566085057347543040",
+    "mgroup__name": "石灰石破碎",
+    "total_production": 0,
+    "run_sec": 296088,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "石灰石破碎",
+    "production_hour": 0,
+    "elec_consume_unit": 0,
+    "run_hour": 82.25,
+    "run_rate": 5.7116,
+    "coal_consume_unit": 0
+  },
+  {
+    "mgroup": "3566609562721439744",
+    "mgroup__name": "原料磨",
+    "total_production": 22232,
+    "run_sec": 372752,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "原料磨",
+    "production_hour": 214.71,
+    "elec_consume_unit": 0,
+    "run_hour": 103.54,
+    "run_rate": 7.1904,
+    "coal_consume_unit": 0
+  },
+  {
+    "mgroup": "3566614036835889152",
+    "mgroup__name": "煤磨",
+    "total_production": 0,
+    "run_sec": 337988,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "煤磨",
+    "production_hour": 0,
+    "elec_consume_unit": 0,
+    "run_hour": 93.89,
+    "run_rate": 6.5198,
+    "coal_consume_unit": 0
+  },
+  {
+    "mgroup": "3566646268703080448",
+    "mgroup__name": "余热发电",
+    "total_production": 0,
+    "run_sec": 310131,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "余热发电",
+    "production_hour": 0,
+    "elec_consume_unit": 0,
+    "run_hour": 86.15,
+    "run_rate": 5.9825,
+    "coal_consume_unit": 0
+  },
+  {
+    "mgroup": "3566638510322909184",
+    "mgroup__name": "回转窑",
+    "total_production": 0,
+    "run_sec": 347311,
+    "elec_consume": 0,
+    "pcoal_coal_consume": 0,
+    "mgroup_name": "回转窑",
+    "production_hour": 0,
+    "elec_consume_unit": 0,
+    "run_hour": 96.48,
+    "run_rate": 6.6997,
+    "coal_consume_unit": 0,
+    "celec_consume_unit": 0,
+    "en_consume_unit": 0
+  }
+]
\ No newline at end of file
diff --git a/src/views/enm_base/search.vue b/src/views/enm_base/search.vue
index 907653aa..1da3139a 100644
--- a/src/views/enm_base/search.vue
+++ b/src/views/enm_base/search.vue
@@ -1,126 +1,148 @@
 <template>
-	<div class="app-container">
-		<el-header>
-			<div class="left-panel">
-				时间1：
-				<el-date-picker
-					v-model="query.searchData"
-					type="daterange"
-					range-separator="至"
-					start-placeholder="开始日期"
-					end-placeholder="结束日期"
-					value-format="YYYY-MM-DD"
-					@change="getList1"
-				/>
-				<el-button
-					type="primary"
-					@click="exportExcel()"
-					:loading="exportLoading"
-					>导出xlsx
-				</el-button>
-				时间2：
-				<el-date-picker
-					v-model="query.searchData2"
-					type="daterange"
-					range-separator="至"
-					start-placeholder="开始日期"
-					end-placeholder="结束日期"
-					value-format="YYYY-MM-DD"
-					@change="getList2"
-				/>
-				<el-button type="primary" @click="comparas">对比 </el-button>
-			</div>
-		</el-header>
-		<el-card style="margin-top: 5px">
-			<div class="printWrap">
-				<div ref="print" id="myReport" class="printContainer">
-					<table
-						border="1"
-						width="1200"
-						cellspacing="0"
-						:key="timeStamp"
-						id="myTable"
-						class="myTable"
-					>
-						<thead class="myTableHead">
-							<tr>
-								<th>工段</th>
-								<th>总产量</th>
-								<th>台时产量</th>
-								<th>运转时间</th>
-								<th>运转率</th>
-								<th>单位产品电耗</th>
-								<th>单位产品综合电耗</th>
-								<th>单位产品标煤耗</th>
-								<th>单位产品综合能耗</th>
-								<th>吨熟料发电量</th>
-							</tr>
-						</thead>
-						<tr v-for="(item, index) in tableDatas1" :key="index">
-							<td>{{ item.mgroup_name }}</td>
-							<td>{{ item.total_production }}</td>
-							<td>{{ item.production_hour }}</td>
-							<td>{{ item.run_hour }}</td>
-							<td>{{ item.run_rate }}</td>
-							<td>{{ item.elec_consume_unit }}</td>
-							<td>{{ item.celec_consume_unit }}</td>
-							<td>{{ item.coal_consume_unit }}</td>
-							<td>{{ item.cen_consume_unit }}</td>
-							<td>{{ item.production_elec_unit }}</td>
-							<!-- <td
-								v-for="(item0, index0) in item"
-								:key="index0"
-								class="numCell"
+	<el-container>
+		<el-main>
+			<el-container>
+				<el-header style="height: 400px; padding: 0">
+					<el-container>
+						<el-header>
+							<div class="left-panel">
+								<div class="left-panel">
+									时间段1：
+									<el-date-picker
+										v-model="query.searchData"
+										type="daterange"
+										range-separator="至"
+										start-placeholder="开始日期"
+										end-placeholder="结束日期"
+										value-format="YYYY-MM-DD"
+										@change="getList1"
+									/>
+									<el-button
+										type="primary"
+										@click="exportExcel()"
+										:loading="exportLoading"
+										>导出xlsx
+									</el-button>
+								</div>
+							</div>
+						</el-header>
+						<el-main style="background: #ffffff">
+							<div
+								ref="print"
+								id="myReport"
+								class="printContainer"
 							>
-								{{ item0 }}
-							</td> -->
-						</tr>
-					</table>
-					<table
-						border="1"
-						width="1200"
-						cellspacing="0"
-						:key="timeStamp"
-						id="myTable"
-						class="myTable"
-					>
-						<thead class="myTableHead">
-							<tr>
-								<th>工段</th>
-								<th>总产量</th>
-								<th>台时产量</th>
-								<th>运转时间</th>
-								<th>运转率</th>
-								<th>单位产品电耗</th>
-								<th>单位产品综合电耗</th>
-								<th>单位产品标煤耗</th>
-								<th>单位产品综合能耗</th>
-								<th>吨熟料发电量</th>
-							</tr>
-						</thead>
-						<tr v-for="(item, index) in tableDatas2" :key="index">
-							<td>{{ item.mgroup_name }}</td>
-							<td>{{ item.total_production }}</td>
-							<td>{{ item.production_hour }}</td>
-							<td>{{ item.run_hour }}</td>
-							<td>{{ item.run_rate }}</td>
-							<td>{{ item.elec_consume_unit }}</td>
-							<td>{{ item.celec_consume_unit }}</td>
-							<td>{{ item.coal_consume_unit }}</td>
-							<td>{{ item.cen_consume_unit }}</td>
-							<td>{{ item.production_elec_unit }}</td>
-							<!-- <td
-								v-for="(item0, index0) in item"
-								:key="index0"
-								class="numCell"
+								<table
+									border="1"
+									width="1200"
+									cellspacing="0"
+									:key="timeStamp"
+									id="myTable"
+									class="myTable"
+								>
+									<thead class="myTableHead">
+										<tr>
+											<th>工段</th>
+											<th>总产量</th>
+											<th>台时产量</th>
+											<th>运转时间</th>
+											<th>运转率</th>
+											<th>单位产品电耗</th>
+											<th>单位产品综合电耗</th>
+											<th>单位产品标煤耗</th>
+											<th>单位产品综合能耗</th>
+											<th>吨熟料发电量</th>
+										</tr>
+									</thead>
+									<tr
+										v-for="(item, index) in tableDatas1"
+										:key="index"
+									>
+										<td>{{ item.mgroup_name }}</td>
+										<td>{{ item.total_production }}</td>
+										<td>{{ item.production_hour }}</td>
+										<td>{{ item.run_hour }}</td>
+										<td>{{ item.run_rate }}</td>
+										<td>{{ item.elec_consume_unit }}</td>
+										<td>{{ item.celec_consume_unit }}</td>
+										<td>{{ item.coal_consume_unit }}</td>
+										<td>{{ item.cen_consume_unit }}</td>
+										<td>{{ item.production_elec_unit }}</td>
+									</tr>
+								</table>
+							</div>
+						</el-main>
+					</el-container>
+				</el-header>
+				<el-main style="padding: 8px 0 0 0">
+					<el-container>
+						<el-header>
+							<div class="left-panel">
+								时间2：
+								<el-date-picker
+									v-model="query.searchData2"
+									type="daterange"
+									range-separator="至"
+									start-placeholder="开始日期"
+									end-placeholder="结束日期"
+									value-format="YYYY-MM-DD"
+									@change="getList2"
+								/>
+								<el-button type="primary" @click="comparas"
+									>对比
+								</el-button>
+							</div>
+						</el-header>
+						<el-main style="background: #ffffff">
+							<div
+								ref="print"
+								id="myReport"
+								class="printContainer"
 							>
-								{{ item0 }}
-							</td> -->
-						</tr>
-					</table>
-				</div>
-			</div>
-		</el-card>
+								<table
+									border="1"
+									width="1200"
+									cellspacing="0"
+									:key="timeStamp"
+									id="myTable"
+									class="myTable"
+								>
+									<thead class="myTableHead">
+										<tr>
+											<th>工段</th>
+											<th>总产量</th>
+											<th>台时产量</th>
+											<th>运转时间</th>
+											<th>运转率</th>
+											<th>单位产品电耗</th>
+											<th>单位产品综合电耗</th>
+											<th>单位产品标煤耗</th>
+											<th>单位产品综合能耗</th>
+											<th>吨熟料发电量</th>
+										</tr>
+									</thead>
+									<tr
+										v-for="(item, index) in tableDatas2"
+										:key="index"
+									>
+										<td>{{ item.mgroup_name }}</td>
+										<td>{{ item.total_production }}</td>
+										<td>{{ item.production_hour }}</td>
+										<td>{{ item.run_hour }}</td>
+										<td>{{ item.run_rate }}</td>
+										<td>{{ item.elec_consume_unit }}</td>
+										<td>{{ item.celec_consume_unit }}</td>
+										<td>{{ item.coal_consume_unit }}</td>
+										<td>{{ item.cen_consume_unit }}</td>
+										<td>{{ item.production_elec_unit }}</td>
+									</tr>
+								</table>
+							</div>
+						</el-main>
+					</el-container>
+				</el-main>
+			</el-container>
+		</el-main>
 		<el-dialog title="对比" v-model="dialogVisible" width="1224">
 			<el-select
 				v-model="mgroupName"
@@ -129,43 +151,35 @@
 			>
 				<el-option
 					v-for="item in mgroups"
-					:key="item.id"
-					:label="item.name"
-					:value="item.name"
+					:key="item"
+					:label="item"
+					:value="item"
 				></el-option>
 			</el-select>
 			<div id="myChart" style="width: 1200px; height: 400px"></div>
 		</el-dialog>
-	</div>
+	</el-container>
 </template>
 <script>
 import * as echarts from "echarts";
+import mockData from "./mock.json";
+import mockData2 from "./mock2.json";
 const colors = ["#647bfe", "#91CC75"];
 export default {
 	data() {
 		return {
 			mgroupName: "",
 			timeStamp: 0,
+			mockData: mockData,
+			mockData2: mockData2,
 			query: {
 				searchData: "",
 				page: 0,
 				type: "month_st",
 				mgroup: "",
 			},
-			tableDatas1: [
-				{ mgroup_name: "石灰石破碎" },
-				{ mgroup_name: "原料磨" },
-				{ mgroup_name: "煤磨" },
-				{ mgroup_name: "回转窑" },
-				{ mgroup_name: "余热发电" },
-			],
-			tableDatas2: [
-				{ mgroup_name: "石灰石破碎" },
-				{ mgroup_name: "原料磨" },
-				{ mgroup_name: "煤磨" },
-				{ mgroup_name: "回转窑" },
-				{ mgroup_name: "余热发电" },
-			],
+			tableDatas1: [],
+			tableDatas2: [],
 			chartData1: {},
 			chartData2: {},
 			mgroups: [],
@@ -248,9 +262,44 @@ export default {
 		};
 	},
 	mounted() {
-		this.getMgroup();
+		this.useMock();
 	},
 	methods: {
+		useMock() {
+			let that = this;
+			that.tableDatas1 = that.mockData;
+			that.mockData.forEach((item) => {
+				that.mgroups.push(item.mgroup_name);
+				that.chartData1[item.mgroup_name] = [];
+				let arr = [];
+				arr[0] = item.total_production;
+				arr[1] = item.production_hour;
+				arr[2] = item.run_hour;
+				arr[3] = item.run_rate;
+				arr[4] = item.elec_consume_unit;
+				arr[5] = item.celec_consume_unit;
+				arr[6] = item.coal_consume_unit;
+				arr[7] = item.cen_consume_unit;
+				arr[8] = item.production_elec_unit;
+				that.chartData1[item.mgroup_name] = arr;
+			});
+
+			that.tableDatas2 = that.mockData2;
+			that.mockData2.forEach((item) => {
+				that.chartData2[item.mgroup_name] = [];
+				let arr = [];
+				arr[0] = item.total_production;
+				arr[1] = item.production_hour;
+				arr[2] = item.run_hour;
+				arr[3] = item.run_rate;
+				arr[4] = item.elec_consume_unit;
+				arr[5] = item.celec_consume_unit;
+				arr[6] = item.coal_consume_unit;
+				arr[7] = item.cen_consume_unit;
+				arr[8] = item.production_elec_unit;
+				that.chartData2[item.mgroup_name] = arr;
+			});
+		},
 		getList1(val) {
 			let that = this;
 			let start_date = val[0];
@@ -263,6 +312,7 @@ export default {
 				.then((res) => {
 					that.tableDatas1 = res;
 					res.forEach((item) => {
+						that.mgroups.push(item.mgroup_name);
 						that.chartData1[item.mgroup_name] = [];
 						let arr = [];
 						arr[0] = item.total_production;
@@ -305,7 +355,6 @@ export default {
 					});
 				});
 		},
-
 		getMgroup() {
 			this.$API.mtm.mgroup.list.req({ page: 0 }).then((res) => {
 				this.mgroups = res;