diff --git a/src/views/bigScreen/index_enm.vue b/src/views/bigScreen/index_enm.vue
index 25d5df73..c83bf505 100644
--- a/src/views/bigScreen/index_enm.vue
+++ b/src/views/bigScreen/index_enm.vue
@@ -1,76 +1,45 @@
 <template>
-	<div class="dashboard">
-		<header>
-			<div class="title_left"></div>
-			<h1 class="title">{{ factoryName }}</h1>
-			<h2 class="title_right">数据更新: {{ updateTime }}</h2>
+	<div class="container">
+		<header class="pageHeader">
+			<span class="top-line top-line-left"></span>
+			{{ bigScreenName }}
+			<span class="top-line top-line-right"></span>
 		</header>
-		<div class="left_main animate__animated animate__zoomIn">
-			<div class="panel">
-				<div class="panel_title">本月全厂主要数据</div>
-				<el-row :gutter="16" style="height: 72px; margin-top: 4px">
-					<el-col :span="12" class="panel_item">
-						<div class="panel_label">
-							<img
-								src="img/elec.png"
-								style="height: 24px; vertical-align: middle"
-							/>动力电消耗
+		<div id="model" class="model">
+			<div class="top_block">
+				<div class="top_block_time">
+					<img src="img/photon_top_line.png" />
+					<span>凌源</span>
+					{{ currentDay }}{{ currentWeek }}{{ currentTime }}
+					<img
+						src="img/photon_top_line.png"
+						style="transform: rotateY(180deg)"
+					/>
+				</div>
+				<div class="totalNumContnier">
+					<div class="totalNumWrap totalNum_orange">
+						<img class="" src="img/number_bg_orange.png" />
+						<span class="totalNumText">产量</span>
+						<div class="totalNumber">
+							{{ totalData.total_production }}
 						</div>
-						<div class="pannel_number">
-							<span class="panel_value">{{
-								factoryData.elec_consume
-							}}</span>
-							<span class="panel_unit">(kW·h)</span>
+					</div>
+					<div class="totalNumWrap totalNumWrap_green">
+						<img src="img/number_bg_green.png" />
+						<span class="totalNumText">实物煤耗</span>
+						<div class="totalNumber">
+							{{ totalData.pcoal_consume }}
 						</div>
-					</el-col>
-					<el-col :span="12" class="panel_item">
-						<div class="panel_label">
-							<img
-								src="img/coal.png"
-								style="height: 24px; vertical-align: bottom"
-							/>煤粉消耗
+					</div>
+					<div class="totalNumWrap totalNum_blue">
+						<img src="img/number_bg_blue.png" />
+						<span class="totalNumText">综合电耗</span>
+						<div class="totalNumber">
+							{{ totalData.celec_consume_unit }}
 						</div>
-						<div class="pannel_number">
-							<span class="panel_value">{{
-								factoryData.pcoal_consume
-							}}</span>
-							<span class="panel_unit">(t)</span>
-						</div>
-					</el-col>
-				</el-row>
-				<el-row :gutter="16" style="height: 72px; margin-top: 4px">
-					<el-col :span="12" class="panel_item">
-						<div class="panel_label">
-							<img
-								src="img/water.png"
-								style="height: 24px; vertical-align: bottom"
-							/>工业水消耗
-						</div>
-						<div class="pannel_number">
-							<span class="panel_value">{{
-								factoryData.water_consume
-							}}</span>
-							<span class="panel_unit">(t)</span>
-						</div>
-					</el-col>
-					<el-col :span="12" class="panel_item">
-						<div class="panel_label">
-							<img
-								src="img/cair.png"
-								style="height: 24px; vertical-align: bottom"
-							/>压缩空气消耗
-						</div>
-						<div class="pannel_number">
-							<span class="panel_value">{{
-								factoryData.cair_consume
-							}}</span>
-							<span class="panel_unit">(t)</span>
-						</div>
-					</el-col>
-				</el-row>
+					</div>
+				</div>
 			</div>
-		</div>
-		<div class="model">
 			<div id="loadingScreen">
 				<el-progress
 					type="circle"
@@ -99,714 +68,949 @@
 						</div>
 					</template>
 				</el-progress>
-				<!-- 工厂模型加载中.....{{ loadedPercent }}% -->
 			</div>
 			<canvas id="renderCanvas"></canvas>
 		</div>
-		<div class="right_main">
-			<div class="panel">
-				<div class="panel_title">
-					今日工段主要数据-{{ activeSectionName }}
+		<div class="left_block">
+			<div class="flexItem">
+				<div class="itemTitle">
+					<div class="itemTitleIcon"></div>
+					<div>产量</div>
+				</div>
+				<div class="itemBody" id="line1"></div>
+			</div>
+			<div class="flexItem">
+				<div class="itemTitle">
+					<div class="itemTitleIcon"></div>
+					<div>设备运转率</div>
+				</div>
+				<div class="itemBody itemBodyCircle">
+					<div
+						class="item_circle"
+						v-for="item in rateData"
+						:key="item.name"
+					>
+						<el-progress
+							class="elProgress"
+							type="circle"
+							:stroke-width="15"
+							:percentage="item.value"
+							:color="colors"
+						>
+							<template #default="{ percentage }">
+								<span class="percentage-value"
+									>{{ percentage }}%</span
+								>
+								<p class="percentage-label">{{ item.name }}</p>
+							</template>
+						</el-progress>
+					</div>
+				</div>
+			</div>
+			<div class="flexItem">
+				<div class="itemTitle">
+					<div class="itemTitleIcon"></div>
+					<div>数据采集</div>
+				</div>
+				<div class="itemBody itemBodyFlex">
+					<div
+						id="pieChart"
+						style="width: 100px; height: 300px"
+					></div>
+					<el-table
+						id="elTable"
+						style="width: 250px"
+						:data="tableData"
+						:header-cell-style="{
+							'text-align': 'center',
+							color: '#fff',
+						}"
+						:cell-style="{ 'text-align': 'center', color: '#fff' }"
+					>
+						<el-table-column
+							prop="code"
+							label="位号"
+						></el-table-column>
+						<el-table-column label="数值">
+							<template #default="scope">
+								{{ scope.row.last_data.last_val }}
+							</template>
+						</el-table-column>
+						<el-table-column label="状态" width="50">
+							<template #default="scope">
+								<div
+									v-if="scope.row.gather_state == 0"
+									class="successCircle"
+								></div>
+								<div v-else class="warningCircle"></div>
+							</template>
+						</el-table-column>
+					</el-table>
 				</div>
-				<el-row :gutter="16" style="height: 72px; margin-top: 4px">
-					<el-col :span="12" class="panel_item">
-						<div class="panel_label">
-							<img
-								src="img/elec.png"
-								style="height: 24px; vertical-align: middle"
-							/>单位产品电耗
-						</div>
-						<div class="pannel_number">
-							<span class="panel_value" v-if="sectionData">{{
-								sectionData.elec_consume_unit
-							}}</span>
-							<span class="panel_unit">(kW·h)</span>
-						</div>
-					</el-col>
-					<el-col :span="12" class="panel_item">
-						<div class="panel_label">
-							<img
-								src="img/total_production.png"
-								style="height: 24px; vertical-align: middle"
-							/>产品产量
-						</div>
-						<div class="pannel_number">
-							<span class="panel_value" v-if="sectionData">{{
-								sectionData.total_production
-							}}</span>
-							<span class="panel_unit">(t)</span>
-						</div>
-					</el-col>
-				</el-row>
-				<el-row :gutter="16" style="height: 72px; margin-top: 4px">
-					<el-col :span="12" class="panel_item">
-						<div class="panel_label">
-							<img
-								src="img/run_rate.png"
-								style="height: 24px; vertical-align: middle"
-							/>
-							运转率
-						</div>
-						<div class="pannel_number">
-							<span class="panel_value" v-if="sectionData">{{
-								sectionData.run_rate
-							}}</span>
-							<span class="panel_unit">(%)</span>
-						</div>
-					</el-col>
-					<el-col :span="12" class="panel_item" v-show="showKgcet">
-						<div class="panel_label">
-							<img
-								src="img/coal.png"
-								style="height: 24px; vertical-align: bottom"
-							/>单位产品标煤耗
-						</div>
-						<div class="pannel_number">
-							<span class="panel_value" v-if="sectionData">{{
-								sectionData.coal_consume_unit
-							}}</span>
-							<span class="panel_unit">(kgce/t)</span>
-						</div>
-					</el-col>
-				</el-row>
 			</div>
 		</div>
-		<div class="dropdown">
-			<div
-				class="dropdown-item"
-				v-for="(val, index) in sectionNames"
-				:key="val"
-				@click="handleSectionClick(val, index)"
-				:class="{ active: activeSection === index }"
-			>
-				{{ val }}
+		<div class="right_block">
+			<div class="flexItem">
+				<div class="itemTitle">
+					<div class="itemTitleIcon"></div>
+					<div>工序电耗</div>
+				</div>
+				<div class="itemBody itemBodyFlex">
+					<div id="radar" style="height: 100%"></div>
+					<div class="bodyList">
+						<table>
+							<tbody>
+								<tr class="bodyListItem tableHeader">
+									<th class="bodyListItem_name">工序</th>
+									<th>
+										电耗<span
+											style="
+												color: #fff;
+												font-weight: 500;
+												font-size: 12px;
+											"
+											>kwh</span
+										>
+									</th>
+								</tr>
+								<tr
+									v-for="item in elecData"
+									:key="item"
+									class="bodyListItem bodyListItemBg"
+								>
+									<td class="bodyListItem_name">
+										{{ item.name }}
+									</td>
+									<td class="bodyListItem_num">
+										{{ item.value }}
+									</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+				</div>
 			</div>
-		</div>
-		<div class="left_other animate__animated animate__backInLeft">
-			<div class="panel">
-				<div class="panel_title">动力电消耗趋势图</div>
-				<div class="chart" id="chart1"></div>
+			<div class="flexItem">
+				<div class="itemTitle">
+					<div class="itemTitleIcon"></div>
+					<div>质量分析</div>
+				</div>
+				<div class="itemBody" id="line3"></div>
 			</div>
-			<div class="panel">
-				<div class="panel_title">工业水/原煤消耗趋势图</div>
-				<div class="chart" id="chart2"></div>
-			</div>
-			<div class="panel">
-				<div class="panel_title">压缩空气消耗趋势图</div>
-				<div class="chart" id="chart3"></div>
-			</div>
-		</div>
-		<div class="right_other">
-			<div class="panel">
-				<div class="panel_title">单位产品电耗趋势图</div>
-				<div class="chart" id="chart4"></div>
-			</div>
-			<div class="panel">
-				<div class="panel_title">产品产量趋势图</div>
-				<div class="chart" id="chart5"></div>
-			</div>
-			<div class="panel">
-				<div class="panel_title">运转率趋势图</div>
-				<div class="chart" id="chart6"></div>
+			<div class="flexItem">
+				<div class="itemTitle">
+					<div class="itemTitleIcon"></div>
+					<div>环保数据</div>
+				</div>
+				<div class="itemBody" style="padding: 5%">
+					<div class="elecItem">
+						<div class="elecItem_wrap">
+							<span>当月发电量</span>
+							<p class="elec_number">
+								{{ hotData.total_production }}
+								<span class="elec_unit">kwh</span>
+							</p>
+						</div>
+					</div>
+					<div class="elecItem">
+						<div class="elecItem_wrap">
+							<span>NOx折算值</span>
+							<p class="elec_number">
+								{{ hotData.NOx }}
+								<span class="elec_unit">mg/m³</span>
+							</p>
+						</div>
+					</div>
+					<div class="elecItem">
+						<div class="elecItem_wrap">
+							<span>发电量</span>
+							<p class="elec_number">
+								{{ hotData.production_elec_unit }}
+								<span class="elec_unit">kwh</span>
+							</p>
+						</div>
+					</div>
+
+					<div class="elecItem">
+						<div class="elecItem_wrap">
+							<span>SO2折算值</span>
+							<p class="elec_number">
+								{{ hotData.SO2 }}
+								<span class="elec_unit">mg/m³</span>
+							</p>
+						</div>
+					</div>
+					<div class="elecItem">
+						<div class="elecItem_wrap">
+							<span>自用电量</span>
+							<p class="elec_number">
+								{{ hotData.elec_consume }}
+								<span class="elec_unit">kwh</span>
+							</p>
+						</div>
+					</div>
+					<div class="elecItem">
+						<div class="elecItem_wrap">
+							<span>颗粒物折算值</span>
+							<p class="elec_number">
+								{{ hotData.klw }}
+								<span class="elec_unit">mg/m³</span>
+							</p>
+						</div>
+					</div>
+				</div>
 			</div>
 		</div>
 	</div>
 </template>
 <script>
-import tool from "@/utils/tool";
-import config from "@/config";
 import * as echarts from "echarts";
 import * as BABYLON from "babylonjs";
 import * as BABYLON_GUI from "babylonjs-gui";
 import * as BABYLON_GRID from "@/utils/gridMaterial";
 import * as BABYLON_MATERIAL from "@/utils/babylonMaterial";
+import value from "./../enm_energy/value.vue";
+import config from "@/config";
+BABYLON.DracoCompression.Configuration.decoder.wasmUrl =
+	"./draco_wasm_wrapper_gltf.js";
+BABYLON.DracoCompression.Configuration.decoder.wasmBinaryUrl =
+	"./draco_decoder_gltf.wasm";
+BABYLON.DracoCompression.Configuration.decoder.fallbackUrl =
+	"./draco_decoder_gltf.js";
 import "babylonjs-loaders";
 import "animate.css";
 export default {
+	components: { value },
 	data() {
 		return {
-			query: {
-				year_s: 2023,
-				month_s: 8,
-				type: "month_s",
-				page: 0,
+			colors: [
+				{ color: "#f95050", percentage: 20 },
+				{ color: "#e6a23c", percentage: 40 },
+				{ color: "#1989fa", percentage: 60 },
+				{ color: "#02f5f2", percentage: 80 },
+				{ color: "#5cb87a", percentage: 100 },
+			],
+			shengliaoData: {
+				KH: [
+					1.081, 0.922, 1.034, 1.079, 1.088, 0.983, 0.917, 1.125,
+					1.03, 0.995, 1.019, 1.074, 0.925, 0.943, 1.067, 1.048,
+					0.964, 0.884, 0.947, 1.017, 1.011, 1.022, 0.994, 1.025,
+					1.031, 1.003, 0.941, 0.982, 1.067, 0.982, 0.987,
+				],
+				SM: [
+					2.18, 2.46, 2.63, 2.34, 2.14, 2.52, 2.41, 2.65, 2.45, 2.5,
+					2.52, 2.49, 2.49, 2.45, 2.44, 2.38, 2.38, 2.3, 2.65, 2.53,
+					2.49, 2.41, 2.57, 2.69, 2.64, 2.74, 2.81, 2.38, 2.54, 2.54,
+					2.38,
+				],
+				IM: [
+					1.67, 1.6, 1.4, 1.41, 1.61, 1.41, 1.53, 1.35, 1.33, 1.35,
+					1.29, 1.27, 0.61, 0.72, 0.66, 1.14, 1.18, 1.21, 1.48, 1.48,
+					1.49, 1.45, 1.41, 1.48, 1.35, 1.22, 1.33, 1.68, 1.45, 1.36,
+					1.49,
+				],
 			},
-			factoryData: {},
-			sectionData: {},
-			nowDay: 1,
-			initialAlpha: -Math.PI / 0.89,
-			initialBeta: Math.PI / 3.3,
-			initialRadius: 18,
+			shuliaoData: {
+				KH: [
+					0.873, 0.861, 0.873, 0.876, 0.883, 0.882, 0.83, 0.882,
+					0.913, 0.92, 0.893, 0.93, 0.94, 0.851, 0.87, 0.958, 0.935,
+					0.886, 0.873, 0.886, 0.939, 0.919, 0.941, 0.948, 0.899,
+					0.906, 0.914, 0.852, 0.852, 0.923, 0.884,
+				],
+				SM: [
+					2.37, 2.51, 2.66, 2.44, 2.58, 2.54, 2.41, 2.52, 2.41, 2.51,
+					2.56, 2.49, 2.54, 2.44, 2.6, 2.44, 2.42, 2.46, 2.53, 2.54,
+					2.53, 2.45, 2.64, 2.64, 2.73, 2.59, 2.79, 2.39, 2.4, 2.6,
+					2.52,
+				],
+				IM: [
+					1.65, 1.48, 1.43, 1.53, 1.39, 1.41, 1.52, 1.43, 1.4, 1.39,
+					1.28, 1.31, 0.75, 0.92, 0.83, 1.1, 1.21, 1.18, 1.28, 1.45,
+					1.51, 1.45, 1.37, 1.35, 1.35, 1.34, 1.31, 1.6, 1.54, 1.37,
+					1.41,
+				],
+			},
+			KHData: [],
+			SMData: [],
+			IMData: [],
+			factoryName: "",
+			initialAlpha: -Math.PI / 4.5,
+			initialBeta: Math.PI / 2,
+			initialRadius: 2.5,
 			initialTarget: null,
-			// scene: null,
-			// myui: null,
-			// engine: null,
-			// camera: null,
-			is_mainviewpoint: false,
 			resizeTimeout: null,
 			loadedPercent: 0,
-			sectionNames: {
-				干渣库_primitive0: "电石渣",
-				原料磨及废气处理_primitive0: "原料磨",
-				窑: "回转窑",
-				煤粉制备_primitive1: "煤磨",
-				水泥磨房_primitive0: "水泥磨",
-				水泥储存及散装库_primitive2: "水泥包装",
-				// "停车场": "停车场"
-			},
-			factoryName: "",
-			showKgcet: true,
 			currentLightMesh: null,
-			activeSection: 2,
-			activeSectionName: "回转窑",
-			updateTime: "",
-			basicOption: {
-				color: "rgb(1,235,239)",
-				backgroundColor: "",
-				xAxis: {
-					data: ["一月", "二月", "三月", "四月", "五月", "六月"],
-				},
-				yAxis: { type: "value" },
-				series: [
+			infoVisibel: false,
+			clickVisible: false,
+			percentage: 25,
+			updateTime: "2023-08-17 16:00:00",
+			yurefadianId: "",
+			currentTime: "",
+			currentWeek: "",
+			currentYear: "",
+			currentMonth: "",
+			currentDay: "",
+			timerTime: null,
+			timerData: null,
+			start_date: "",
+			end_date: "",
+			dialogData: {
+				deptName: "",
+			},
+			currentData: {
+				deptName: "",
+			},
+			deptName: "入窑生料",
+			heightTimer: null,
+			count_shuliao: 0,
+			count_meihao: 0,
+			count_elec: 0,
+			blockTableHeight: 0,
+			xAxisDate: [],
+			linearGradientColors: [
+				new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 					{
-						name: "销量",
-						type: "bar",
-						barwidth: 10,
+						offset: 0,
+						color: "rgb(128, 255, 165)",
+					},
+					{
+						offset: 1,
+						color: "rgb(1, 191, 236)",
+					},
+				]),
+
+				new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+					{
+						offset: 0,
+						color: "rgb(0, 221, 255)",
+					},
+					{
+						offset: 1,
+						color: "rgb(77, 119, 255)",
+					},
+				]),
+				new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+					{
+						offset: 0,
+						color: "rgb(55, 162, 255)",
+					},
+					{
+						offset: 1,
+						color: "rgb(116, 21, 219)",
+					},
+				]),
+				new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+					{
+						offset: 0,
+						color: "rgb(255, 0, 135)",
+					},
+					{
+						offset: 1,
+						color: "rgb(135, 0, 157)",
+					},
+				]),
+				new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+					{
+						offset: 0,
+						color: "rgb(255, 191, 0)",
+					},
+					{
+						offset: 1,
+						color: "rgb(224, 62, 76)",
+					},
+				]),
+			],
+			sectionNames: {
+				电石渣堆棚: "电石渣",
+				原料磨及废气处理: "原料磨",
+				窑: "回转窑",
+				煤粉制备_primitive0: "煤磨",
+				水泥磨房_primitive1: "水泥磨",
+				水泥储存及散装库: "水泥包装",
+			},
+			totalData: {
+				total_production: 0,
+				pcoal_consume: 0,
+				celec_consume_unit: 0,
+			},
+			rateData: [
+				{ name: "电石渣", value: 0 },
+				{ name: "原料磨", value: 0 },
+				{ name: "煤磨", value: 0 },
+				{ name: "回转窑", value: 0 },
+				{ name: "水泥磨", value: 0 },
+				{ name: "水泥包装", value: 0 },
+			],
+			elecData: [
+				{ name: "电石渣", value: 0 },
+				{ name: "原料磨", value: 0 },
+				{ name: "煤磨", value: 0 },
+				{ name: "回转窑", value: 0 },
+				{ name: "水泥磨", value: 0 },
+				{ name: "水泥包装", value: 0 },
+			],
+			hotData: {
+				total_production: "",
+				production_elec_unit: "",
+				elec_consume: "",
+				NOx: "",
+				SO2: "",
+				klw: "",
+			},
+			tableData: [],
+			tezhongData: [],
+			option: {
+				color: ["#80FFA5", "#00DDFF", "#37A2FF", "#FF0087", "#FFBF00"],
+				tooltip: {
+					trigger: "axis",
+					axisPointer: {
+						type: "cross",
 						label: {
-							show: true,
-							position: "top",
+							backgroundColor: "#6a7985",
 						},
-						itemStyle: {
-							color: new echarts.graphic.LinearGradient(
-								0,
-								0,
-								0,
-								1,
-								[
-									{ offset: 0, color: "#83bff6" },
-									{ offset: 0.5, color: "#188df0" },
-									{ offset: 1, color: "#188df0" },
-								]
-							),
+					},
+				},
+				legend: {
+					icon: "stack",
+					top: 5,
+					right: 5,
+					data: [],
+				},
+				grid: {
+					left: "2%",
+					right: "4%",
+					bottom: "5%",
+					containLabel: true,
+				},
+				xAxis: {
+					type: "category",
+					data: [],
+					nameTextStyle: {
+						color: "#ffffff",
+					},
+					axisLabel: {
+						color: "#ffffff",
+					},
+					splitLine: {
+						show: false,
+					},
+				},
+				yAxis: {
+					name: "",
+					type: "value",
+					nameTextStyle: {
+						color: "#ffffff",
+					},
+					axisLabel: {
+						color: "#ffffff",
+					},
+
+					splitLine: {
+						show: false,
+						lineStyle: {
+							type: "dashed", //y轴分割线类型
+							color: "rgba(102,102,102,0.9)",
+							width: 1,
 						},
-						emphasis: {
+					},
+				},
+				series: [],
+			},
+			radarSeriesData: [0, 0, 0, 0, 0],
+			radarOption: {
+				radar: {
+					indicator: [
+						{ name: "电石渣" },
+						{ name: "原料磨" },
+						{ name: "煤磨" },
+						{ name: "回转窑" },
+						{ name: "水泥磨" },
+						{ name: "水泥包装" },
+					],
+					name: {
+						textStyle: {
+							padding: [-20, -20], // 控制文字padding
+						},
+					},
+					nameGap: 2,
+					radius: 63, //缩放
+					center: ["50%", "50%"], //位置
+					// shape: "circle",
+					splitNumber: 4,
+					axisName: {
+						color: "#2adbbc",
+					},
+					splitLine: {
+						lineStyle: {
+							color: [
+								"rgba(238, 197, 102, 0.1)",
+								"rgba(238, 197, 102, 0.2)",
+								"rgba(238, 197, 102, 0.4)",
+								"rgba(238, 197, 102, 0.7)",
+								"rgba(238, 197, 102, 1)",
+							].reverse(),
+						},
+					},
+					splitArea: {
+						show: false,
+					},
+					axisLine: {
+						lineStyle: {
+							color: "rgba(238, 197, 102, 0.5)",
+						},
+					},
+				},
+				series: {
+					name: "工序电耗",
+					type: "radar",
+					lineStyle: {
+						width: 1,
+						opacity: 0.5,
+					},
+					data: [
+						{
+							value: [120, 118, 130, 100, 99],
+							name: "Data C",
+							// symbol: "rect",
+							symbolSize: 5,
+							lineStyle: {
+								type: "dashed",
+							},
+							//点的颜色
 							itemStyle: {
-								color: new echarts.graphic.LinearGradient(
-									0,
-									0,
-									0,
+								color: "#ffa500",
+							},
+							areaStyle: {
+								opacity: 0.7,
+								color: new echarts.graphic.RadialGradient(
+									0.1,
+									0.6,
 									1,
 									[
-										{ offset: 0, color: "#2378f7" },
-										{ offset: 0.7, color: "#2378f7" },
-										{ offset: 1, color: "#83bff6" },
+										{
+											offset: 0,
+											color: "rgb(128, 255, 165)",
+										},
+										{
+											offset: 1,
+											color: "rgb(1, 191, 236)",
+										},
 									]
 								),
 							},
+							label: {
+								show: true,
+								color: "#02f5f2",
+								formatter: function (params) {
+									return params.value;
+								},
+							},
 						},
-						data: [],
-					},
-				],
-				grid: {
-					// 让图表占满容器
-					top: "10%",
-					left: "12%",
-					right: "0px",
-					bottom: "15%",
-				},
-			},
-			year_start: 0,
-			end_time: "",
-			start_time: "",
-			xAxisData: [],
-			arrMonth: [],
-			chart1Option: {},
-			chart2Option: {},
-			chart3Option: {},
-			chart4Option: {},
-			chart5Option: {},
-			chart6Option: {},
-			seriesData1: [0, 0, 0, 0, 0, 0],
-			seriesData2: [0, 0, 0, 0, 0, 0],
-			seriesData2_2: [0, 0, 0, 0, 0, 0],
-			seriesData3: [0, 0, 0, 0, 0, 0],
-			seriesData3_2: [0, 0, 0, 0, 0, 0],
-			seriesData4: [0, 0, 0, 0, 0, 0],
-			seriesData5: [0, 0, 0, 0, 0, 0],
-			seriesData6: [0, 0, 0, 0, 0, 0],
-			path: "ws://49.232.14.174:2226/ws/my/?token=",
-			ws: null,
-			mgroupValues: {
-				电石渣: { total: "0", elec: "0" },
-				原料磨: { total: "0", elec: "0" },
-				煤磨: { total: "0", elec: "0" },
-				回转窑: { total: "0", elec: "0" },
-				水泥磨: { total: "0", elec: "0" },
-				水泥包装: { total: "0", elec: "0" },
-			},
-			sectionDatas: {
-				回转窑: {
-					elec_consume_unit: 29,
-					total_production: 2541,
-					coal_consume_unit: 105,
-					run_rate: 100,
-					charts_ele: [30, 29, 28, 31, 28, 16],
-					charts_prod: [2530, 2698, 2600, 2550, 2610, 2000],
-					charts_rate: [100, 100, 100, 100, 100, 100],
-				},
-				电石渣: {
-					elec_consume_unit: 4,
-					total_production: 1523,
-					coal_consume_unit: "",
-					run_rate: 100,
-					charts_ele: [3, 6, 4, 7, 5, 3],
-					charts_prod: [2015, 2698, 2904, 2550, 2610, 1200],
-					charts_rate: [100, 100, 100, 100, 100, 100],
-				},
-				原料磨: {
-					elec_consume_unit: 15,
-					total_production: 3230,
-					coal_consume_unit: "",
-					run_rate: 100,
-					charts_ele: [16, 15, 17, 15, 16, 10],
-					charts_prod: [3204, 3500, 3385, 3461, 3359, 2000],
-					charts_rate: [100, 100, 100, 100, 100, 100],
-				},
-				煤磨: {
-					elec_consume_unit: 36,
-					total_production: 420,
-					coal_consume_unit: "",
-					run_rate: 100,
-					charts_ele: [35, 37, 36, 37, 36, 20],
-					charts_prod: [426, 445, 425, 449, 438, 265],
-					charts_rate: [100, 100, 100, 100, 100, 100],
-				},
-				水泥磨: {
-					elec_consume_unit: 35,
-					total_production: 3063,
-					coal_consume_unit: "",
-					run_rate: 100,
-					charts_ele: [35, 37, 36, 37, 36, 20],
-					charts_prod: [3204, 3500, 3385, 3461, 3359, 2000],
-					charts_rate: [100, 100, 100, 100, 100, 100],
-				},
-				水泥包装: {
-					elec_consume_unit: 2,
-					total_production: 1000,
-					coal_consume_unit: "",
-					run_rate: 100,
-					charts_ele: [1, 3, 2, 3, 2, 1],
-					charts_prod: [1052, 1462, 1268, 1389, 1156, 800],
-					charts_rate: [100, 100, 100, 100, 100, 100],
+					],
 				},
 			},
 		};
 	},
 	mounted() {
-		var that = this;
-		this.initCharts();
-		this.addListener();
-		let myDate = new Date();
-		let year = myDate.getFullYear();
-		let month = myDate.getMonth() + 1;
-		let day = myDate.getDate();
-		that.nowDay = day;
-		that.query.year_s = year;
-		that.query.month_s = month;
-		that.updateTime =
-			myDate.getFullYear() +
-			"-" +
-			(myDate.getMonth() + 1) +
-			"-" +
-			myDate.getDate() +
-			" " +
-			myDate.getHours() +
-			":" +
-			myDate.getMinutes() +
-			":" +
-			myDate.getSeconds();
-		this.factoryName = that.$TOOL.data.get("BASE_INFO").base.base_name;
-		this.initDomStyle();
-		this.$nextTick(() => {
-			this.$API.enm.enstat
-				.req({ type: "month_s", month_s: month, year_s: year, page: 0 })
-				.then((res1) => {
-					console.log("工段数据：", res1);
-					// debugger
-					res1.forEach((item) => {
-						if (item.mgroup_name == "电石渣") {
-							that.mgroupValues.电石渣.total =
-								item.total_production + "";
-							that.mgroupValues.电石渣.elec =
-								item.elec_consume_unit + "";
-						} else if (item.mgroup_name == "原料磨") {
-							that.mgroupValues.原料磨.total =
-								item.total_production + "";
-							that.mgroupValues.原料磨.elec =
-								item.elec_consume_unit + "";
-						} else if (item.mgroup_name == "煤磨") {
-							that.mgroupValues.煤磨.total =
-								item.total_production + "";
-							that.mgroupValues.煤磨.elec =
-								item.elec_consume_unit + "";
-						} else if (item.mgroup_name == "回转窑") {
-							that.mgroupValues.回转窑.total =
-								item.total_production + "";
-							that.mgroupValues.回转窑.elec =
-								item.elec_consume_unit + "";
-						} else if (item.mgroup_name == "水泥磨") {
-							that.mgroupValues.水泥磨.total =
-								item.total_production + "";
-							that.mgroupValues.水泥磨.elec =
-								item.elec_consume_unit + "";
-						} else if (item.mgroup_name == "水泥包装") {
-							that.mgroupValues.水泥包装.total =
-								item.total_production + "";
-							that.mgroupValues.水泥包装.elec =
-								item.elec_consume_unit + "";
-						}
-					});
-				});
-			setTimeout(function () {
-				that.initFactory();
+		let that = this;
+		that.bigScreenName =
+			that.$TOOL.data.get("BASE_INFO").base.bigScreen_name;
+		that.showTime();
+		that.addListener();
+		//一天的毫秒数
+		let nowDate = new Date();
+		let year = nowDate.getFullYear();
+		let month = nowDate.getMonth() + 1;
+		let day = nowDate.getDate();
+		let days = new Date(year, month, 0).getDate();
+		// month = month < 10 ? "0" + month : month;
+		that.currentYear = year;
+		that.currentMonth = month;
+		that.currentDay = day;
+		let datelist = [];
+		let tezhongData = [];
+		function getRandomNumber(min, max) {
+			return Math.floor(Math.random() * (max - min + 1)) + min;
+		}
+		for (let i = 0; i < days; i++) {
+			datelist.push(i + 1);
+		}
+		for (let i = 0; i < day; i++) {
+			let randomNumber = getRandomNumber(50, 5000);
+			tezhongData.push(randomNumber);
+		}
+		that.tezhongData = tezhongData;
+		that.option.xAxis.data = datelist;
+		that.xAxisDate = datelist;
+		that.$nextTick(() => {
+			//获取熟料产量
+			that.productNum();
+			//获取设备运转率
+			that.eqRate();
+			//余热发电
+			that.generation();
+			//工序电耗
+			that.proceElec();
+			//质量分析
+			that.qualAnalys();
+			//数据采集
+			that.dataCollect();
+
+			that.initDomStyle();
+			that.initFactory();
+			that.timerTime = setInterval(() => {
+				that.showTime();
 			}, 1000);
+			that.qualityTimer = setInterval(() => {
+				let lineDom = document.getElementById("line3");
+				if (lineDom) {
+					that.KHData = [];
+					that.SMData = [];
+					that.IMData = [];
+					if (that.deptName == "出磨熟料") {
+						that.deptName = "入窑生料";
+						for (let i = 0; i < day; i++) {
+							that.KHData.push(that.shengliaoData.KH[i]);
+							that.SMData.push(that.shengliaoData.SM[i]);
+							that.IMData.push(that.shengliaoData.IM[i]);
+						}
+					} else {
+						that.deptName = "出磨熟料";
+						for (let i = 0; i < day; i++) {
+							that.KHData.push(that.shuliaoData.KH[i]);
+							that.SMData.push(that.shuliaoData.SM[i]);
+							that.IMData.push(that.shuliaoData.IM[i]);
+						}
+					}
+					that.initChart();
+				}
+			}, 5000);
+			// that.timerTime = setInterval(() => {
+			// 	that.productNum();
+			// 	that.eqRate();
+			// 	that.generation();
+			// 	that.proceElec();
+			// 	that.dataCollect();
+			// }, 3600000);
 		});
-		let month1 = month > 9 ? month : "0" + month;
-		let end_time = year + "-" + month1 + "-01 10:00:00";
-		let year_s = year;
-		if (month < 6) {
-			year_s = year - 1;
-		}
-		let arr = [],
-			xAxisData = [];
-		let monthItem = month;
-		for (let i = 0; i < 6; i++) {
-			arr.push(monthItem);
-			if (monthItem === 1) {
-				monthItem = 12;
-			} else {
-				monthItem--;
-			}
-		}
-		arr.reverse();
-		for (let i = 0; i < 6; i++) {
-			let item = arr[i] + "月";
-			xAxisData.push(item);
-		}
-		// 模拟数据
-		xAxisData = ["1.19", "1.20", "1.21", "1.22", "1.23", "1.24"];
-		let month0 = arr[0] > 9 ? arr[0] : "0" + arr[0];
-		let start_time = year_s + "-" + month0 + "-01 10:00:00";
-		that.arrMonth = arr;
-		that.year_start = year_s;
-		that.xAxisData = xAxisData;
-		that.start_time = start_time;
-		that.end_time = end_time;
-		this.getFactoryData();
-		this.getSectionData();
-		this.getDayData();
-		this.init();
-		setTimeout(() => {
-			this.getMockData();
-		}, 1000);
-	},
-	beforeUnmount() {
-		// 性能优化
-		const canvas = document.getElementById("renderCanvas");
-		if (canvas) {
-			canvas.parentNode.removeChild(canvas);
-		}
 	},
 	methods: {
-		// 动态绑定Class
-		bindClass(type) {
-			let classInfo = {
-				socketDom: true,
-				redColor: false,
-				orangeColor: false,
-				yellowColor: false,
-				blueColor: true,
-			};
-			if (type == "") {
-				classInfo.redColor = true;
-			}
-			return classInfo;
-		},
-		init() {
-			var that = this;
-			if (typeof WebSocket === "undefined") {
-				alert("您的浏览器不支持socket");
-			} else {
-				this.ws = new WebSocket(this.path + tool.data.get("TOKEN"));
-				//监听是否连接成功
-				this.ws.onopen = () => {
-					// console.log("socket连接成功");
-					setTimeout(() => {
-						that.ws.send(JSON.stringify({ type: "event" }));
-					}, 500);
-				};
-
-				//接听服务器发回的信息并处理展示
-				this.ws.onmessage = (msg) => {
-					let data = JSON.parse(msg.data);
-					console.log(data);
-					if (data.type == "event") {
-						that.bindClass();
-					}
-					if (data.type == "ticket") {
-					}
-					if (data.type == "remaind") {
-					}
-				};
-				// 监听并处理error事件
-				this.ws.onerror = function (error) {
-					console.log("ws断开,尝试重连");
-					// setTimeout(() => {
-					//   this.ws = null;
-					//   this.init()
-					// }, 5000)
-				};
-			}
-		},
-		getMessage(msg) {
-			console.log(msg);
-		},
-		close() {
-			if (this.ws) {
-				this.ws.close();
-				this.ws = null;
-				console.log("socket已经关闭");
-			}
-		},
-		compare(property) {
-			return function (a, b) {
-				return a[property] - b[property];
-			};
-		},
-		getMockData() {
+		//熟料产量
+		productNum() {
 			let that = this;
-			this.factoryData = {
-				elec_consume: 10983267,
-				pcoal_consume: 9500,
-				water_consume: 12825,
-				cair_consume: 676534,
-			};
-			this.mgroupValues = {
-				电石渣: { total: 1523, elec: 4 },
-				原料磨: { total: 3230, elec: 15 },
-				煤磨: { total: 420, elec: 36 },
-				回转窑: { total: 2541, elec: 29 },
-				水泥磨: { total: 3063, elec: 35 },
-				水泥包装: { total: 1000, elec: 2 },
-			};
-			this.sectionData = this.sectionDatas[this.activeSectionName];
-			setInterval(() => {
-				this.factoryData.elec_consume += Math.floor(Math.random() * 10);
-				this.factoryData.pcoal_consume += Math.floor(
-					Math.random() * 10
-				);
-				this.factoryData.water_consume += Math.floor(
-					Math.random() * 10
-				);
-				this.factoryData.cair_consume += Math.floor(Math.random() * 10);
-				this.sectionDatas[this.activeSectionName].total_production +=
-					Math.floor(Math.random() * 10);
-				this.sectionDatas[this.activeSectionName].elec_consume_unit +=
-					Math.floor(Math.random() * 1);
-				this.sectionDatas[this.activeSectionName].charts_ele[5] =
-					this.sectionDatas[this.activeSectionName].elec_consume_unit;
-				this.sectionDatas[this.activeSectionName].charts_prod[5] =
-					this.sectionDatas[this.activeSectionName].total_production;
-				let data = new Date();
-				that.updateTime =
-					data.getFullYear() +
-					"-" +
-					(data.getMonth() + 1) +
-					"-" +
-					data.getDate() +
-					" " +
-					data.getHours() +
-					":" +
-					data.getMinutes() +
-					":" +
-					data.getSeconds();
-			}, 10000);
-		},
-
-		getFactoryData() {
-			var that = this;
-			that.$API.enm.enstat2.req(that.query).then((res) => {
-				if (res.length > 0) {
-					that.factoryData = res[0];
-				} else {
-				}
-			});
-			//图表数据
-			let obj = {};
-			obj.type = "month_s";
-			obj.start_time = that.start_time;
-			obj.end_time = that.end_time;
-			obj.page = 0;
-			this.$API.enm.enstat2.req(obj).then((res1) => {
-				let list0 = res1.sort(this.compare("month_s"));
-				let list = list0.sort(this.compare("year_s"));
-				let seriesData1 = [0, 0, 0, 0, 0, 0],
-					seriesData2 = [0, 0, 0, 0, 0, 0],
-					seriesData3 = [0, 0, 0, 0, 0, 0],
-					seriesData3_2 = [0, 0, 0, 0, 0, 0];
-				list.forEach((item) => {
-					let index = that.arrMonth.indexOf(item.month_s);
-					seriesData1[index] = Number(item.elec_consume);
-					seriesData2[index] = Number(item.pcoal_consume);
-					seriesData3[index] = Number(item.water_consume);
-					seriesData3_2[index] = Number(item.cair_consume);
+			this.$API.mtm.mgroup.list
+				.req({ page: 0, search: "回转窑" })
+				.then((res) => {
+					// console.log("回转窑", res);
+					that.huihzuanyaoId = res[0].id;
+					let query = {};
+					query.page = 0;
+					query.year_s = that.currentYear;
+					query.month_s = that.currentMonth;
+					query.type = "day_s";
+					query.mgroup = that.huihzuanyaoId;
+					this.$API.enm.enstat.req(query).then((response) => {
+						let seriesData = [];
+						let data = response;
+						data.forEach((item) => {
+							let ind = item.day_s - 1;
+							seriesData[ind] = item.total_production;
+							if (item.day_s == that.currentDay) {
+								that.totalData.total_production =
+									item.total_production;
+								that.totalData.pcoal_consume =
+									item.pcoal_consume;
+								that.totalData.celec_consume_unit =
+									item.celec_consume_unit;
+							}
+						});
+						let option1 = that.deepCopy(that.option);
+						let chartDom = document.getElementById("line1");
+						let myChart = echarts.init(chartDom);
+						option1.legend.data = [
+							// {
+							// 	name: "熟料",
+							// 	textStyle: {
+							// 		color: "#fff",
+							// 	},
+							// 	borderRadius: 2,
+							// 	itemStyle: {
+							// 		color: that.linearGradientColors[0],
+							// 	},
+							// },
+							// {
+							// 	name: "特种熟料",
+							// 	textStyle: {
+							// 		color: "#fff",
+							// 	},
+							// 	borderRadius: 2,
+							// 	itemStyle: {
+							// 		color: that.linearGradientColors[1],
+							// 	},
+							// },
+						];
+						option1.series = [
+							{
+								name: "",
+								type: "line",
+								stack: "Total",
+								smooth: true,
+								lineStyle: {
+									width: 0,
+								},
+								showSymbol: false,
+								areaStyle: {
+									opacity: 0.8,
+									color: that.linearGradientColors[0],
+								},
+								emphasis: {
+									focus: "series",
+								},
+								data: seriesData,
+							},
+							{
+								name: "",
+								type: "line",
+								stack: "Total",
+								smooth: true,
+								lineStyle: {
+									width: 0,
+								},
+								showSymbol: false,
+								areaStyle: {
+									opacity: 0.8,
+									color: that.linearGradientColors[1],
+								},
+								emphasis: {
+									focus: "series",
+								},
+								data: that.tezhongData,
+							},
+						];
+						myChart.setOption(option1);
+					});
 				});
-				that.seriesData1 = seriesData1;
-				that.seriesData2 = seriesData2;
-				that.seriesData3 = seriesData3;
-				that.seriesData3_2 = seriesData3_2;
-				// 模拟数据
-				that.seriesData1 = [
-					303468, 303524, 312095, 305684, 307468, 223420,
-				];
-				that.chart1Option.yAxis.min = 200000;
-				that.seriesData2 = [425, 430, 436, 430, 443, 340];
-				that.seriesData2_2 = [586, 560, 576, 555, 543, 205];
-				that.chart2Option.yAxis.min = 100;
-				that.seriesData3 = [20456, 24783, 21430, 22354, 25531, 15687];
-				// that.seriesData3 = [586, 560, 576, 555, 543, 205]
-				that.chart3Option.yAxis.min = 15000;
-				that.initCharts();
-			});
 		},
-		getSectionData() {
-			var that = this;
-			let obj = {};
-			obj.type = "month_s";
-			obj.start_time = that.start_time;
-			obj.end_time = that.end_time;
-			obj.mgroup__name = that.activeSectionName;
-			obj.page = 0;
-			this.$API.enm.enstat.req(obj).then((res) => {
-				let list0 = res.sort(this.compare("month_s"));
-				let list = list0.sort(this.compare("year_s"));
-				let seriesData4 = [0, 0, 0, 0, 0, 0],
-					seriesData5 = [0, 0, 0, 0, 0, 0],
-					seriesData6 = [0, 0, 0, 0, 0, 0];
-				list.forEach((item) => {
-					let index = that.arrMonth.indexOf(item.month_s);
-					seriesData4[index] = Number(item.elec_consume_unit);
-					seriesData5[index] = Number(item.total_production);
-					seriesData6[index] = Number(item.run_rate);
+		//设备运转率
+		eqRate() {
+			let that = this;
+			let query = {};
+			query.page = 0;
+			query.year_s = that.currentYear;
+			query.month_s = that.currentMonth;
+			query.type = "month_s";
+			this.$API.enm.enstat.req(query).then((response) => {
+				let seriesData = [];
+				let data = response;
+				data.forEach((item) => {
+					if (item.mgroup_name == "电石渣") {
+						that.rateData[0].value = Number(item.run_rate);
+					} else if (item.mgroup_name == "原料磨") {
+						that.rateData[1].value = Number(item.run_rate);
+					} else if (item.mgroup_name == "煤磨") {
+						that.rateData[2].value = Number(item.run_rate);
+					} else if (item.mgroup_name == "回转窑") {
+						that.rateData[3].value = Number(item.run_rate);
+					} else if (item.mgroup_name == "水泥磨") {
+						that.rateData[4].value = Number(item.run_rate);
+					} else if (item.mgroup_name == "水泥包装") {
+						that.rateData[5].value = Number(item.run_rate);
+					}
 				});
-				that.seriesData4 = seriesData4;
-				that.seriesData5 = seriesData5;
-				that.seriesData6 = seriesData6;
-				// 模拟数据
-				that.seriesData4 = this.sectionDatas.回转窑.charts_ele;
-				that.seriesData5 = this.sectionDatas.回转窑.charts_prod;
-				that.seriesData6 = this.sectionDatas.回转窑.charts_rate;
-				// that.chart4Option.yAxis.min = 200000;
-				// that.seriesData5 = [425, 430, 436, 430, 443, 340];
-				// that.chart5Option.yAxis.min = 300;
-				// that.seriesData6 = [586, 560, 576, 555, 543, 205]
-				// that.chart6Option.yAxis.min = 500;
-				that.initCharts1();
 			});
 		},
-		getDayData() {
-			var that = this;
-			let obj = {};
-			obj.type = "day_s";
-			obj.year_s = that.query.year_s;
-			obj.month_s = that.query.month_s;
-			obj.day_s = that.nowDay;
-			obj.mgroup__name = that.activeSectionName;
-			obj.page = 0;
-			this.$API.enm.enstat.req(obj).then((res) => {
-				that.sectionData = res[0];
+		//余热发电&环保数据
+		generation() {
+			let that = this;
+			this.$API.mtm.mgroup.list
+				.req({ page: 0, search: "余热发电" })
+				.then((res) => {
+					// console.log("余热发电", res);
+					that.yurefadianId = res[0].id;
+					let params = {};
+					params.page = 0;
+					params.year_s = that.currentYear;
+					params.month_s = that.currentMonth;
+					params.type = "month_s";
+					params.mgroup = that.yurefadianId;
+					this.$API.enm.enstat.req(params).then((ress) => {
+						that.hotData.total_production =
+							ress[0].total_production;
+						that.hotData.production_elec_unit =
+							ress[0].production_elec_unit;
+						that.hotData.elec_consume = ress[0].elec_consume;
+					});
+				});
+			//环保数据
+			this.$API.enm.mpoint.list
+				.req({
+					page: 0,
+					code: "K_TX_IP20_TX_MD500", //nox
+					query: " { id, name, code, last_data, gather_state }",
+				})
+				.then((res0) => {
+					if (res0[0].last_data.last_val) {
+						that.hotData.NOx =
+							res0[0].last_data.last_val.toFixed(2);
+					}
+				});
+			this.$API.enm.mpoint.list
+				.req({
+					page: 0,
+					code: "K_TX_IP20_TX_MD508", //so2
+					query: "{ id, name, code, last_data, gather_state }",
+				})
+				.then((res1) => {
+					if (res1[0].last_data.last_val) {
+						that.hotData.SO2 =
+							res1[0].last_data.last_val.toFixed(2);
+					}
+				});
+			this.$API.enm.mpoint.list
+				.req({
+					page: 0,
+					code: "K_TX_IP20_TX_MD504", //颗粒物
+					query: "{ id, name, code, last_data, gather_state }",
+				})
+				.then((res2) => {
+					if (res2[0].last_data.last_val) {
+						that.hotData.klw =
+							res2[0].last_data.last_val.toFixed(2);
+					}
+				});
+		},
+		//工序电耗
+		proceElec() {
+			let that = this;
+			let params = {
+				type: "month_s",
+				year_s: that.currentYear,
+				month_s: that.currentMonth,
+			};
+			that.$API.enm.enstat.req(params).then((res) => {
+				let data = res.results;
+				console.log("工序电耗", data);
+				let seriesData = [0, 0, 0, 0, 0];
+				data.forEach((item, index) => {
+					if (item.mgroup_name == "电石渣") {
+						seriesData[0] = that.elecData[0].value =
+							item.elec_consume;
+					} else if (item.mgroup_name == "原料磨") {
+						seriesData[1] = that.elecData[1].value =
+							item.elec_consume;
+					} else if (item.mgroup_name == "煤磨") {
+						seriesData[2] = that.elecData[2].value =
+							item.elec_consume;
+					} else if (item.mgroup_name == "回转窑") {
+						seriesData[3] = that.elecData[3].value =
+							item.elec_consume;
+					} else if (item.mgroup_name == "水泥磨") {
+						seriesData[4] = that.elecData[4].value =
+							item.elec_consume;
+					} else if (item.mgroup_name == "水泥包装") {
+						seriesData[5] = that.elecData[5].value =
+							item.elec_consume;
+					}
+				});
+				that.radarOption.series.data[0].value = seriesData;
+				//右1---工序电耗---雷达图
+				let radarDom = document.getElementById("radar");
+				let radarChart = echarts.init(radarDom);
+				radarChart.setOption(that.radarOption);
 			});
 		},
-		initCharts() {
+		//质量分析---待定
+		qualAnalys() {},
+		//数据采集——设备运行状态
+		dataCollect() {
 			let that = this;
-			function deepCopy(obj) {
-				return JSON.parse(JSON.stringify(obj));
+			let params = {
+				enabled: true,
+				type: 10,
+				page: 0,
+				query: "{ id, name, code, last_data, gather_state }",
+			};
+			that.tableData = [];
+			function getTypeof(variable) {
+				return typeof variable;
 			}
-			// 初始化所有表格
-			that.basicOption.xAxis.data = that.xAxisData;
-			that.chart1Option = deepCopy(that.basicOption);
-			that.chart1Option.series = [
-				{
-					name: "电耗",
-					type: "bar",
-					barWidth: 15,
-					label: {
-						show: true,
-						position: "top",
+			that.$API.enm.mpoint.list.req(params).then((res) => {
+				console.log("数据采集", res);
+				let success_num = 0;
+				let error_num = 0;
+				res.forEach((item, index) => {
+					if (item.gather_state == 0) {
+						success_num++;
+					} else {
+						error_num++;
+					}
+					if (item.last_data.last_val) {
+						if (getTypeof(item.last_data.last_val) == "number") {
+							item.last_data.last_val.toFixed(2);
+						}
+					}
+					that.tableData.push(item);
+				});
+				console.log("数据采集tableData", that.tableData);
+
+				let chartDom6 = document.getElementById("pieChart");
+				let myChart6 = echarts.init(chartDom6);
+				let colors = [];
+				colors.push(that.linearGradientColors[0]);
+				colors.push(that.linearGradientColors[3]);
+				let option6 = {
+					color: colors,
+					tooltip: {
+						trigger: "item",
 					},
-					emphasis: {
-						focus: "series",
+					legend: {
+						top: "2%",
+						left: "center",
+						textStyle: {
+							color: "#fff",
+						},
 					},
-					data: that.seriesData1,
-				},
-			];
-			that.setChart("chart1", that.chart1Option);
-			this.chart2Option = deepCopy(that.basicOption);
-			this.chart2Option.series[0].type = "line";
-			(this.chart2Option.series[1] = {
-				name: "工业水",
-				type: "line",
-				barWidth: 15,
-				label: {
-					show: true,
-					position: "top",
-				},
-				emphasis: {
-					focus: "series",
-				},
-				data: that.seriesData2_2,
-			}),
-				(this.chart2Option.series[0].data = that.seriesData2);
-			this.setChart("chart2", this.chart2Option);
-			this.chart3Option = deepCopy(that.basicOption);
-			this.chart3Option.series = [
-				{
-					name: "压缩空气",
-					type: "bar",
-					barWidth: 15,
-					emphasis: {
-						focus: "series",
-					},
-					data: that.seriesData3,
-				},
-			];
-			this.setChart("chart3", this.chart3Option);
+					series: [
+						{
+							name: "运行状态",
+							type: "pie",
+							radius: ["40%", "70%"],
+							padAngle: 5,
+							itemStyle: {
+								borderRadius: 5,
+							},
+							label: {
+								show: true,
+								position: "inner",
+								fontSize: 16,
+								formatter: "{d}%",
+								color: "#fff",
+							},
+							labelLine: {
+								show: false,
+							},
+							data: [
+								{ value: success_num, name: "正常" },
+								{ value: error_num, name: "掉线" },
+							],
+						},
+					],
+				};
+				myChart6.setOption(option6);
+			});
 		},
-		initCharts1() {
-			let that = this;
-			function deepCopy(obj) {
-				return JSON.parse(JSON.stringify(obj));
-			}
-			that.basicOption.xAxis.data = that.xAxisData;
-			this.chart4Option = deepCopy(that.basicOption);
-			this.chart4Option.series[0].type = "bar";
-			this.chart4Option.series[0].barWidth = 20;
-			this.chart4Option.series[0].data = that.seriesData4;
-			this.setChart("chart4", this.chart4Option);
-			this.chart5Option = deepCopy(that.basicOption);
-			this.chart5Option.series[0].type = "line";
-			this.chart5Option.series[0].data = that.seriesData5;
-			this.setChart("chart5", this.chart5Option);
-			this.chart6Option = deepCopy(that.basicOption);
-			this.chart6Option.series[0].type = "bar";
-			this.chart6Option.series[0].barWidth = 20;
-			this.chart6Option.series[0].data = that.seriesData6;
-			this.setChart("chart6", this.chart6Option);
+		showTime() {
+			this.currentTime = this.$TOOL.dateFormat(new Date(), "hh:mm:ss");
+			this.currentWeek = this.$TOOL.dateFormat(new Date(), "week");
+			this.currentDay = this.$TOOL.dateFormat(
+				new Date(),
+				"yyyy年MM月dd日"
+			);
 		},
 		addListener() {
 			var that = this;
 			window.addEventListener("resize", function () {
-				// 如果已经有 resizeTimeout，清除它
 				if (this.resizeTimeout) {
 					clearTimeout(this.resizeTimeout);
 				}
@@ -817,65 +1021,59 @@ export default {
 			});
 		},
 		initDomStyle() {
+			let that = this;
 			// 获取窗口的总高度
 			var windowHeight = window.innerHeight;
 			var windowWidth = window.innerWidth;
-			// 获取目标元素
-			var dashboard = document.getElementsByClassName("dashboard")[0];
-			var left_main = document.getElementsByClassName("left_main")[0];
-			var left_other = document.getElementsByClassName("left_other")[0];
-			var right_main = document.getElementsByClassName("right_main")[0];
-			var right_other = document.getElementsByClassName("right_other")[0];
+			var container = document.getElementsByClassName("container")[0];
 			var model = document.getElementsByClassName("model")[0];
-			// var renderCanvas = document.getElementById('renderCanvas');
+			var left_block = document.getElementsByClassName("left_block")[0];
+			var right_block = document.getElementsByClassName("right_block")[0];
+			var pieChart = document.getElementById("pieChart");
+			var elTable = document.getElementById("elTable");
+			var radarChart = document.getElementById("radar");
 			if (windowWidth > 960) {
-				dashboard.style.overflow = "hidden";
-				// 设置目标元素的高度
-				left_main.style.position = "absolute";
-				left_main.style.width = "22%";
-				right_main.style.position = "absolute";
-				right_main.style.width = "22%";
-				left_other.style.position = "absolute";
-				left_other.style.width = "22%";
-				right_other.style.position = "absolute";
-				right_other.style.width = "22%";
+				container.style.overflow = "hidden";
+				container.style.height = windowHeight + "px";
 				model.style.position = "absolute";
 				model.style.height = windowHeight - 3 + "px";
 				model.style.top = 0;
-				var chartHeight = (windowHeight - 400) / 3 + "px";
-				var charts = document.getElementsByClassName("chart");
-				for (var i = 0; i < charts.length; i++) {
-					var chart = charts[i];
-					chart.style.height = chartHeight;
+				left_block.style.position = "absolute";
+				left_block.style.width = "25%";
+				// left_block.style.display = "none";
+				right_block.style.position = "absolute";
+				right_block.style.width = "25%";
+				// right_block.style.display = "none";
+				var itemHeight = Math.round((windowHeight - 150) / 3);
+				var itemBodyHeight = itemHeight - 40;
+				var flexItems = document.getElementsByClassName("flexItem");
+				var itemBodys = document.getElementsByClassName("itemBody");
+				for (var i = 0; i < flexItems.length; i++) {
+					var flexItem = flexItems[i];
+					flexItem.style.height = itemHeight + "px";
 				}
+				for (var i = 0; i < itemBodys.length; i++) {
+					var itemBody = itemBodys[i];
+					itemBody.style.height = itemBodyHeight + "px";
+				}
+				elTable.style.height = itemBodyHeight - 20 + "px";
+				let pieWidth = Math.round(windowWidth / 100) * 22 - 180;
+				let radarWidth = Math.round(windowWidth / 100) * 22 - 130;
+				pieChart.style.width = pieWidth + "px";
+				radarChart.style.width = radarWidth + "px";
 			} else {
-				dashboard.style.overflow = "auto";
+				container.style.overflow = "auto";
 				var chartHeight = windowWidth * 0.6;
-				left_main.style.position = "static";
-				left_main.style.width = "100%";
-				right_main.style.position = "static";
-				right_main.style.width = "100%";
-				left_other.style.position = "static";
-				left_other.style.width = "100%";
-				right_other.style.position = "static";
-				right_other.style.width = "100%";
 				model.style.position = "relative";
 				model.style.height = chartHeight;
-				var charts = document.getElementsByClassName("chart");
-				for (var i = 0; i < charts.length; i++) {
-					var chart = charts[i];
-					chart.style.height = chartHeight;
-				}
 			}
-			if (this.engine != null) {
-				this.engine.resize();
+			if (that.engine != null) {
+				that.engine.resize();
 			}
-			this.resizeChart("chart1");
-			this.resizeChart("chart2");
-			this.resizeChart("chart3");
-			this.resizeChart("chart4");
-			this.resizeChart("chart5");
-			this.resizeChart("chart6");
+			that.resizeChart("line1");
+			that.resizeChart("pieChart");
+			that.resizeChart("radar");
+			that.resizeChart("line3");
 		},
 		resizeChart(name) {
 			// 根据name resize chart
@@ -887,123 +1085,8 @@ export default {
 				myChart.resize();
 			}
 		},
-		setChart(name, option = null) {
-			// 根据name 渲染数据, option需填写，否则option为模拟数据
-			var myChart = echarts.getInstanceByDom(
-				document.getElementById(name)
-			);
-			if (myChart == undefined) {
-				myChart = echarts.init(document.getElementById(name), "dark", {
-					renderer: "svg",
-				});
-			}
-			if (option == null) {
-				option = Object.assign({}, this.basicOption);
-			}
-
-			setTimeout(() => {
-				try {
-					myChart.setOption(option);
-				} catch (error) {}
-			}, 500);
-		},
-		handleSectionClick(val, index) {
-			let that = this;
-			this.activeSectionName = val;
-			this.activeSection = index;
-			if (val == "回转窑") {
-				this.showKgcet = true;
-			} else {
-				this.showKgcet = false;
-			}
-			let obj = {};
-			obj.type = "month_s";
-			obj.start_time = that.start_time;
-			obj.end_time = that.end_time;
-			obj.mgroup__name = val;
-			obj.page = 0;
-			this.$API.enm.enstat.req(obj).then((res) => {
-				let list0 = res.sort(this.compare("month_s"));
-				let list = list0.sort(this.compare("year_s"));
-				let seriesData4 = [0, 0, 0, 0, 0, 0],
-					seriesData5 = [0, 0, 0, 0, 0, 0],
-					seriesData6 = [0, 0, 0, 0, 0, 0];
-				list.forEach((item) => {
-					let index = that.arrMonth.indexOf(item.month_s);
-					seriesData4[index] = Number(item.elec_consume_unit);
-					seriesData5[index] = Number(item.total_production);
-					seriesData6[index] = Number(item.run_rate);
-				});
-				that.seriesData4 = seriesData4;
-				that.seriesData5 = seriesData5;
-				that.seriesData6 = seriesData6;
-				//模拟数据
-				that.seriesData4 =
-					this.sectionDatas[this.activeSectionName].charts_ele;
-				that.seriesData5 =
-					this.sectionDatas[this.activeSectionName].charts_prod;
-				that.seriesData6 =
-					this.sectionDatas[this.activeSectionName].charts_rate;
-				that.initCharts1();
-				const element_main = document.querySelector(".right_main");
-				element_main.classList.add(
-					"animate__animated",
-					"animate__fadeIn"
-				);
-				element_main.addEventListener("animationend", () => {
-					// 移除属性
-					element_main.classList.remove("animate__fadeIn");
-				});
-				const element = document.querySelector(".right_other");
-				element.classList.add("animate__animated", "animate__fadeIn");
-				element.addEventListener("animationend", () => {
-					// 移除属性
-					element.classList.remove("animate__fadeIn");
-				});
-				const sectionUI = this.myui.getControlByName(val + "_rect");
-				sectionUI.onPointerDownObservable.notifyObservers();
-			});
-		},
-		getMgroupChartData(name) {
-			let that = this;
-			this.sectionData = this.sectionDatas[this.activeSectionName];
-			//模拟数据
-			that.seriesData4 =
-				this.sectionDatas[this.activeSectionName].charts_ele;
-			that.seriesData5 =
-				this.sectionDatas[this.activeSectionName].charts_prod;
-			that.seriesData6 =
-				this.sectionDatas[this.activeSectionName].charts_rate;
-			that.initCharts1();
-			console.log(this.sectionData, this.activeSectionName);
-			// 模拟数据
-			// var that = this;
-			// let obj = {};
-			// obj.type = 'month_s';
-			// obj.start_time = that.start_time;
-			// obj.end_time = that.end_time;
-			// obj.mgroup__name = name;
-			// obj.page = 0;
-			// this.$API.enm.enstat.req(obj).then((res) => {
-			//   let list0 = res.sort(this.compare('month_s'));
-			//   let list = list0.sort(this.compare('year_s'));
-			//   let seriesData4 = [0, 0, 0, 0, 0, 0],
-			//     seriesData5 = [0, 0, 0, 0, 0, 0],
-			//     seriesData6 = [0, 0, 0, 0, 0, 0];
-			//   list.forEach(item => {
-			//     let index = that.arrMonth.indexOf(item.month_s);
-			//     seriesData4[index] = Number(item.elec_consume_unit)
-			//     seriesData5[index] = Number(item.total_production)
-			//     seriesData6[index] = Number(item.run_rate)
-			//   })
-			//   that.seriesData4 = seriesData4;
-			//   that.seriesData5 = seriesData5;
-			//   that.seriesData6 = seriesData6;
-			//   that.initCharts1();
-			// })
-		},
 		initFactory() {
-			var that = this;
+			let that = this;
 			const canvas = document.getElementById("renderCanvas"); // Get the canvas element
 			const engine = new BABYLON.Engine(canvas, true); // Generate the BABYLON 3D engine
 			BABYLON.DefaultLoadingScreen.prototype.displayLoadingUI =
@@ -1017,9 +1100,10 @@ export default {
 			const createScene = function () {
 				const scene = new BABYLON.Scene(engine);
 				scene.clearColor = BABYLON.Color3.Black(); //BABYLON.Color3(1, 0, 1);
+
 				const ground = BABYLON.MeshBuilder.CreateGround("ground", {
-					width: 100,
-					height: 100,
+					width: 50,
+					height: 50,
 				});
 				const groundMaterial = new BABYLON_GRID.GridMaterial(
 					"groundMaterial",
@@ -1033,6 +1117,12 @@ export default {
 				ground.position.y = -0.1;
 
 				// 加载背景图片
+				const backgroundImage = new BABYLON.Layer(
+					"",
+					"img/photon_bg.png",
+					scene,
+					true
+				);
 				// const backgroundImage = new BABYLON.Layer('', 'img/bj.png', scene, true);
 				const camera = new BABYLON.ArcRotateCamera(
 					"camera",
@@ -1047,137 +1137,15 @@ export default {
 				camera.attachControl(canvas, true);
 				camera.maxZ = 1000; // 调整适当的值
 				// 相机限制
-				camera.lowerRadiusLimit = 6;
-				camera.upperRadiusLimit = 18;
+				camera.lowerRadiusLimit = 8;
+				camera.upperRadiusLimit = 20;
 
 				// 灯光
 				const light = new BABYLON.HemisphericLight(
 					"light",
 					new BABYLON.Vector3(1, 1, 0)
 				);
-				light.intensity = 1.6;
-
-				// skybox
-				const skybox = BABYLON.MeshBuilder.CreateBox(
-					"skyBox",
-					{ size: 150 },
-					scene
-				);
-				var skyboxMaterial = new BABYLON_MATERIAL.SkyMaterial(
-					"skyMaterial",
-					scene
-				);
-				skyboxMaterial.backFaceCulling = false;
-				skybox.material = skyboxMaterial;
-				/*
-				 * Keys:
-				 * - 1: Day
-				 * - 2: Evening
-				 * - 3: Increase Luminance
-				 * - 4: Decrease Luminance
-				 * - 5: Increase Turbidity
-				 * - 6: Decrease Turbidity
-				 * - 7: Move horizon to -50
-				 * - 8: Restore horizon to 0
-				 */
-				var setSkyConfig = function (property, from, to) {
-					var keys = [
-						{ frame: 0, value: from },
-						{ frame: 100, value: to },
-					];
-
-					var animation = new BABYLON.Animation(
-						"animation",
-						property,
-						100,
-						BABYLON.Animation.ANIMATIONTYPE_FLOAT,
-						BABYLON.Animation.ANIMATIONLOOPMODE_CONSTANT
-					);
-					animation.setKeys(keys);
-
-					scene.stopAnimation(skybox);
-					scene.beginDirectAnimation(
-						skybox,
-						[animation],
-						0,
-						100,
-						false,
-						1
-					);
-				};
-
-				window.addEventListener("keydown", function (evt) {
-					switch (evt.keyCode) {
-						case 49:
-							setSkyConfig(
-								"material.inclination",
-								skyboxMaterial.inclination,
-								0
-							);
-							break; // 1
-						case 50:
-							setSkyConfig(
-								"material.inclination",
-								skyboxMaterial.inclination,
-								-0.5
-							);
-							break; // 2
-
-						case 51:
-							setSkyConfig(
-								"material.luminance",
-								skyboxMaterial.luminance,
-								0.1
-							);
-							break; // 3
-						case 52:
-							setSkyConfig(
-								"material.luminance",
-								skyboxMaterial.luminance,
-								1.0
-							);
-							break; // 4
-
-						case 53:
-							setSkyConfig(
-								"material.turbidity",
-								skyboxMaterial.turbidity,
-								40
-							);
-							break; // 5
-						case 54:
-							setSkyConfig(
-								"material.turbidity",
-								skyboxMaterial.turbidity,
-								5
-							);
-							break; // 6
-
-						case 55:
-							setSkyConfig(
-								"material.cameraOffset.y",
-								skyboxMaterial.cameraOffset.y,
-								50
-							);
-							break; // 7
-						case 56:
-							setSkyConfig(
-								"material.cameraOffset.y",
-								skyboxMaterial.cameraOffset.y,
-								0
-							);
-							break; // 8
-						default:
-							break;
-					}
-				});
-
-				// Set to Day
-				setSkyConfig(
-					"material.inclination",
-					skyboxMaterial.inclination,
-					0
-				);
+				light.intensity = 1.8;
 
 				// 全屏GUI
 				const advancedTexture =
@@ -1193,8 +1161,8 @@ export default {
 				// 主控制区
 				var control_main = new BABYLON_GUI.StackPanel();
 				control_main.isVertical = false;
-				control_main.top = "-40%";
-				control_main.left = "-20%";
+				control_main.top = "40%";
+				control_main.left = "-15%";
 				advancedTexture.addControl(control_main);
 
 				var button_main = BABYLON_GUI.Button.CreateSimpleButton(
@@ -1226,29 +1194,42 @@ export default {
 				mesh_name.fontSize = "14px";
 				mesh_rect.addControl(mesh_name);
 				var remoteGlbUrl = config.HOST_URL + "/media/model/factory.glb";
-				// var remoteGlbUrl = process.env.VUE_APP_BASEURL + "/media/model/factory.glb";
+
 				BABYLON.SceneLoader.Append(
 					remoteGlbUrl,
 					"",
 					scene,
 					function (scene) {
-						// debugger;
-						// console.log(scene)
-						// console.table(scene.meshes)
 						// 判断字符串是否包含中文------   /[\u4E00-\u9FA5]+/g.test(str)
 						for (let key in that.sectionNames) {
 							const value = that.sectionNames[key];
 							const mesh = scene.getMeshByName(key);
 							if (mesh) {
-								//建筑标签
-								that.createLabelPanel(value, mesh);
-								// 创建一个工段数据展示panel
-								const info = { name: value,
-							rows:[{label: "产品产量(t)", field: "total_production", value: 100},
-							{label: "运转率(%)", field: "run_rate", value: 100},
-							{label: "单位电耗(kwh)", field: "elec_consume_unit", value: 100}
-							] };
-								that.createDetailPanel(info, mesh);
+								// that.createImgLabel(value, mesh);
+								that.getMgroupChartData(value, mesh);
+
+								// // 创建一个工段数据展示panel
+								const info = {
+									name: value,
+									rows: [
+										{
+											label: "产品产量(t)",
+											field: "total_production",
+											value: 100,
+										},
+										{
+											label: "运转率(%)",
+											field: "run_rate",
+											value: 100,
+										},
+										{
+											label: "单位电耗(kwh)",
+											field: "elec_consume_unit",
+											value: 100,
+										},
+									],
+								};
+								// that.createDetailPanel(info, mesh);
 							}
 						}
 						engine.hideLoadingUI();
@@ -1298,19 +1279,16 @@ export default {
 				checkbox1.marginLeft = "16px";
 				checkbox1.color = "green";
 				checkbox1.onIsCheckedChangedObservable.add(function (value) {
-					// debugger;
 					if (value) {
 						for (let key in that.sectionNames) {
-							let name = that.sectionNames[key] + "_data_view";
-							console.log(name);
+							let name = that.sectionNames[key] + "_data_detail";
 							let dataView =
 								advancedTexture.getControlByName(name);
 							dataView.isVisible = true;
 						}
 					} else {
 						for (let key in that.sectionNames) {
-							let name = that.sectionNames[key] + "_data_view";
-							console.log(name);
+							let name = that.sectionNames[key] + "_data_detail";
 							let dataView =
 								advancedTexture.getControlByName(name);
 							dataView.isVisible = false;
@@ -1318,7 +1296,6 @@ export default {
 					}
 				});
 				control_main.addControl(checkbox1);
-
 				var header1 = new BABYLON_GUI.TextBlock();
 				header1.text = "工段数据";
 				header1.width = "80px";
@@ -1338,42 +1315,17 @@ export default {
 						mesh_rect.isVisible = false;
 						highlightLayer.removeAllMeshes();
 					}
-					if (pickResult.hit) {
-						const mesh = pickResult.pickedMesh;
-						highlightLayer.removeAllMeshes();
-						if (
-							/.*[\u4e00-\u9fa5]+.*$/.test(mesh.name) &&
-							mesh.name !== "地面1" &&
-							mesh.name !== "绿地" &&
-							mesh.name !== "停车场"
-						) {
-							// 在选中的 mesh 上添加高亮效果
-							highlightLayer.addMesh(
-								mesh,
-								new BABYLON.Color3(1, 1, 0.5)
-							);
-							that.currentLightMesh = mesh;
-							mesh_rect.linkWithMesh(mesh);
-							let name = mesh.name.split("_")[0];
-							mesh_name.text = name;
-							mesh_rect.isVisible = true;
-						}
-					}
 				});
-				// checkbox.isChecked = true; //默认开启自动旋转
 				return scene;
 			};
 
-			const scene = createScene(); //Call the createScene function
-			// // scene.debugLayer.show()
-
-			// // Register a render loop to repeatedly render the scene
+			const scene = createScene();
+			// scene.debugLayer.show();
 			engine.runRenderLoop(function () {
 				scene.render();
 			});
 			this.engine = engine;
 			this.scene = scene;
-			// Watch for browser/canvas resize events
 			window.addEventListener("resize", function () {
 				engine.resize();
 			});
@@ -1401,7 +1353,9 @@ export default {
 					);
 					let position = that.initialTarget;
 					var ease = new BABYLON.CubicEase();
-					ease.setEasingMode(BABYLON.EasingFunction.EASINGMODE_EASEINOUT);
+					ease.setEasingMode(
+						BABYLON.EasingFunction.EASINGMODE_EASEINOUT
+					);
 					BABYLON.Animation.CreateAndStartAnimation(
 						"at5",
 						camera,
@@ -1426,7 +1380,7 @@ export default {
 					);
 				}
 			} else if (camera.target != mesh.position) {
-				console.log('fly to')
+				console.log("fly to");
 				// 计算新的相机位置
 				let position = mesh._parentNode._position;
 				if (mesh._parentNode.id == "__root__") {
@@ -1465,78 +1419,121 @@ export default {
 				);
 			}
 		},
-		createLabelPanel(value, mesh) {
+		createImgLabel(value, mesh) {
 			let that = this;
-			let advancedTexture = that.myui;
-			const rect1 = new BABYLON_GUI.Rectangle(value + "_rect");
-			rect1.width = "64px";
-			rect1.height = "30px";
-			rect1.cornerRadius = 1;
-			rect1.thickness = 0;
-			rect1.background = "rgba(0, 128, 0, 0.8)";
-			rect1.isPointerBlocker = true; // 防止点击穿透
-			advancedTexture.addControl(rect1);
-			var label = new BABYLON_GUI.TextBlock(value + "_label");
-			label.text = value;
-			label.color = "white";
-			label.fontSize = "14px";
-			rect1.addControl(label);
-			rect1.linkWithMesh(mesh);
-			rect1.linkOffsetY = -30;
-			if (value == "电石渣") {
-				rect1.linkOffsetY = -200;
-				var line = new BABYLON_GUI.Line();
-				line.lineWidth = 4;
-				line.color = "Orange";
-				line.y1 = 10;
-				line.y2 = 15;
-				line.linkOffsetY = -15;
-				line.dash = [3, 3];
-				advancedTexture.addControl(line);
-				line.linkWithMesh(mesh);
-				let connectedControl =
-					advancedTexture.getControlByName("电石渣_rect");
-				line.connectedControl = connectedControl;
+			let imgUrl = "";
+			if (value == "石灰石破碎") {
+				imgUrl = "img/ly/ps.png";
+			} else if (value == "原料磨") {
+				imgUrl = "img/ly/ylm.png";
+			} else if (value == "煤磨") {
+				imgUrl = "img/ly/mm.png";
+			} else if (value == "回转窑") {
+				imgUrl = "img/ly/hzy.png";
+			} else if (value == "余热发电") {
+				imgUrl = "img/ly/yrfd.png";
 			}
-			rect1.onPointerDownObservable.add(() => {
-				const mesh = rect1.linkedMesh;
+			var image = new BABYLON_GUI.Image(value + "_img", imgUrl);
+			image.width = "40px";
+			image.height = "40px";
+			image.linkOffsetY = -30;
+			that.myui.addControl(image);
+			image.linkWithMesh(mesh);
+			image.onPointerDownObservable.add(() => {
 				that.flyToMesh(mesh);
-				// let dataViewName = rect1.name.split('_')[0] + '_data_view';
-				let dataViewName = rect1.name.split("_")[0];
-				that.activeSectionName = dataViewName;
-				that.activeSection = 2;
-				that.getMgroupChartData(dataViewName);
-				let dataView = that.myui.getControlByName(
-					dataViewName + "_data_view"
-				);
-				if (dataView) {
-					// // 在这里进行矩形的操作
-					dataView.isVisible = true;
+			});
+		},
+		getMgroupChartData(value, mesh) {
+			//value:工段名称,mesh:模块
+			let that = this;
+			//根据名称获取工段数据
+			let query = {
+				mgroup__name: value,
+				type: "month_s",
+				year_s: that.currentYear,
+				month_s: that.currentMonth,
+				page: 0,
+				query: "{total_production,run_rate,elec_consume_unit,production_elec_unit}",
+			};
+			that.$API.enm.enstat.req(query).then((res) => {
+				let info = {
+					name: value,
+					rows: [],
+				};
+				if (value == "余热发电") {
+					info.rows = [
+						{
+							label: "发电量(kwh)",
+							field: "total_production",
+							value: res[0].total_production,
+						},
+						{
+							label: "运转率(%)",
+							field: "run_rate",
+							value: res[0].run_rate,
+						},
+						{
+							label: "发电量(kwh/t)",
+							field: "production_elec_unit",
+							value: res[0].production_elec_unit
+								? res[0].production_elec_unit
+								: "0.00",
+						},
+					];
+				} else {
+					info.rows = [
+						{
+							label: "产品产量(t)",
+							field: "total_production",
+							value: res[0].total_production,
+						},
+						{
+							label: "运转率(%)",
+							field: "run_rate",
+							value: res[0].run_rate,
+						},
+						{
+							label: "单位电耗(kwh)",
+							field: "elec_consume_unit",
+							value: res[0].elec_consume_unit,
+						},
+					];
 				}
+
+				that.createDetailPanel(info, mesh);
 			});
 		},
 		// 创建3D数据展示层GUI
 		createDetailPanel(info, mesh) {
-			// info格式{"name": "xxx",
-			//"rows": ["label": "xxx1", "field": "ccc", "value": 123, "type": "primary"]}
 			let that = this;
 			const data_view = new BABYLON_GUI.StackPanel(
-				info.name + "_data_view"
+				info.name + "_data_detail"
 			);
-			data_view.width = "200px"; // StackPanel的宽度
+			data_view.width = "240px"; // StackPanel的宽度
 			// data_view.height = "140px";
+			data_view.padding = "20px";
+			data_view.boxShow = "10px";
+			data_view.shadowBlur = 20; // 阴影模糊度
+			data_view.shadowOffsetX = 0; // 阴影水平偏移
+			data_view.shadowOffsetY = 5; // 阴影垂直偏移v
 			data_view.background = "rgba(0, 34, 51, 0.6)"; //暗色
 
 			const mgroup_line = new BABYLON_GUI.Rectangle(info.name + "_line");
 			mgroup_line.height = "3px";
-			mgroup_line.width = "200px";
+			mgroup_line.width = "240px";
 			mgroup_line.thickness = 0;
+			mgroup_line.shadowBlur = 15; // 阴影模糊度
+			mgroup_line.shadowOffsetX = 0; // 阴影水平偏移
+			mgroup_line.shadowOffsetY = 0; // 阴影垂直偏移v
+			mgroup_line.shadowColor = "rgba(44, 237, 255, 0.8)";
 			mgroup_line.background = "rgba(44, 237, 255, 0.8)";
 			data_view.addControl(mgroup_line);
 
+			const titleImg = new BABYLON_GUI.Image();
+
 			const header = new BABYLON_GUI.StackPanel(info.name + "_header");
 			header.width = "200px";
-			header.height = "30px";
+			header.height = "60px";
 			// header.background = "rgba(0, 34, 51, 0.6)";
 			header.isVertical = false;
 
@@ -1555,7 +1552,7 @@ export default {
 			);
 			mgroup_close.width = "25px";
 			mgroup_close.height = "25px";
-			mgroup_close.color = "rgb(255,165,0,0.7)";
+			mgroup_close.color = "rgba(255,165,0,0.7)";
 			mgroup_close.cornerRadius = 16;
 			mgroup_close.fontSize = "12px";
 			mgroup_close.thickness = 0;
@@ -1566,13 +1563,17 @@ export default {
 			header.addControl(mgroup_close);
 			data_view.addControl(header);
 
-			info.rows.forEach((item, index)=>{
-				const row = new BABYLON_GUI.StackPanel(info.name + `_${item.field}` + "_row");
+			info.rows.forEach((item, index) => {
+				const row = new BABYLON_GUI.StackPanel(
+					info.name + `_${item.field}` + "_row"
+				);
 				row.width = "200px";
 				row.height = "30px";
 				row.isVertical = false;
 
-				const field = new BABYLON_GUI.TextBlock(info.name + `_${item.field}` + "_label");
+				const field = new BABYLON_GUI.TextBlock(
+					info.name + `_${item.field}` + "_label"
+				);
 				field.width = "120px";
 				field.height = "30px";
 				field.color = "rgba(255,255,255, 0.7)";
@@ -1582,80 +1583,381 @@ export default {
 				field.paddingLeft = "8px";
 				row.addControl(field);
 
-				const valx = new BABYLON_GUI.TextBlock(info.name + `_${item.field}` + "_value");
+				const valx = new BABYLON_GUI.TextBlock(
+					info.name + `_${item.field}` + "_value"
+				);
 				valx.width = "80px";
 				valx.height = "30px";
 				valx.color = "white";
 				valx.fontSize = 14;
 				valx.text = item.value;
-				valx.textHorizontalAlignment = BABYLON_GUI.Control.HORIZONTAL_ALIGNMENT_RIGHT;
+				valx.textHorizontalAlignment =
+					BABYLON_GUI.Control.HORIZONTAL_ALIGNMENT_RIGHT;
 				valx.paddingRight = "8px";
 				row.addControl(valx);
 				data_view.addControl(row);
-			})
-			
+			});
+			data_view.isVisible = true;
 			// 将StackPanel添加到GUI系统中
 			that.myui.addControl(data_view);
 			data_view.linkWithMesh(mesh);
 			data_view.linkOffsetY = -120;
-			if (info.name == "电石渣") {
-				data_view.linkOffsetY = -290;
+		},
+		deepCopy(obj) {
+			return JSON.parse(JSON.stringify(obj));
+		},
+		//质量分析模拟数据
+		initChart() {
+			let that = this;
+			function deepCopy(obj) {
+				return JSON.parse(JSON.stringify(obj));
 			}
+			//右2---质量分析---折线图
+			let option5 = deepCopy(that.option);
+			let chartDom5 = document.getElementById("line3");
+			let myChart5 = echarts.init(chartDom5);
+			option5.legend.data = [
+				{
+					name: "KH",
+					textStyle: {
+						color: "#fff",
+					},
+					borderRadius: 2,
+					itemStyle: {
+						color: that.linearGradientColors[0],
+					},
+				},
+				{
+					name: "SM",
+					textStyle: {
+						color: "#fff",
+					},
+					borderRadius: 2,
+					itemStyle: {
+						color: that.linearGradientColors[1],
+					},
+				},
+				{
+					name: "IM",
+					textStyle: {
+						color: "#fff",
+					},
+					borderRadius: 2,
+					itemStyle: {
+						color: that.linearGradientColors[2],
+					},
+				},
+			];
+			option5.series = [
+				{
+					name: "KH",
+					type: "line",
+					stack: "Total",
+					smooth: true,
+					lineStyle: {
+						width: 0,
+					},
+					showSymbol: false,
+					areaStyle: {
+						opacity: 0.8,
+						color: that.linearGradientColors[0],
+					},
+					emphasis: {
+						focus: "series",
+					},
+					data: that.KHData,
+				},
+				{
+					name: "SM",
+					type: "line",
+					stack: "Total",
+					smooth: true,
+					lineStyle: {
+						width: 0,
+					},
+					showSymbol: false,
+					areaStyle: {
+						opacity: 0.8,
+						color: that.linearGradientColors[1],
+					},
+					emphasis: {
+						focus: "series",
+					},
+					data: that.SMData,
+				},
+				{
+					name: "IM",
+					type: "line",
+					stack: "Total",
+					smooth: true,
+					lineStyle: {
+						width: 0,
+					},
+					showSymbol: false,
+					areaStyle: {
+						opacity: 0.8,
+						color: that.linearGradientColors[2],
+					},
+					emphasis: {
+						focus: "series",
+					},
+					data: that.IMData,
+				},
+			];
+			myChart5.setOption(option5);
 		},
 	},
-	unmounted() {
-		this.close();
-		window.removeEventListener("resize", ()=>{this.engine.resize()});
+	beforeUnmount() {
+		let that = this;
+		clearInterval(that.timerTime);
+		clearInterval(that.timerData);
+		clearInterval(that.qualityTimer);
+		that.timerTime = null;
+		that.timerData = null;
+		that.qualityTimer = null;
+	},
+	beforeDestoryed() {
+		let that = this;
+		clearInterval(that.timerTime);
+		clearInterval(that.timerData);
+		clearInterval(that.qualityTimer);
+		that.timerTime = null;
+		that.timerData = null;
+		that.qualityTimer = null;
 	},
 };
 </script>
 <style scoped>
-.dashboard {
-	background-color: black;
-	/* background-color: #0b2e4a; */
-	font-family: Inter, "-apple-system", BlinkMacSystemFont, "PingFang SC",
-		"Hiragino Sans GB", "noto sans", "Microsoft YaHei", "Helvetica Neue",
-		Helvetica, Arial, sans-serif;
+@font-face {
+	font-family: "myfont";
+	/* 字体名称 */
+	src: url("../../utils/youShe.ttf");
+	/* 字体文件相对路径 */
 }
 
-header {
-	position: relative;
-	z-index: 10;
-	height: 50px;
-	/* 调整头部高度 */
-	background-image: url("/public/img/header.png");
-	/* 替换为实际的背景图片路径 */
+.container {
+	background: url("/public/img/photon_bg.png") no-repeat;
 	background-size: cover;
-	background-position: center;
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
+	height: 100%;
+	position: relative;
 }
-
-.title_left {
-	flex: 1;
-}
-
-.title {
-	flex: 1;
+/* header-start */
+.pageHeader {
+	font-size: 32px;
+	background: none;
+	border-bottom: none;
+	position: relative;
+	display: block;
 	text-align: center;
-	color: white;
-	font-size: 24px;
-	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
+	color: #ffffff;
+	padding: 1px;
+	font-family: "myfont";
+	background: url("/public/img/photon_header.png") no-repeat;
+	background-size: 100% 100%;
+	z-index: 100;
+	height: 80px;
 }
 
-.title_right {
-	flex: 1;
-	font-size: 20px;
-	color: white;
-	text-align: right;
+.top-line {
+	height: 1px;
+	width: 3%;
+	position: absolute;
+	bottom: 5px;
+	background: rgba(54, 217, 187, 1);
+}
+
+.top-line-left {
+	left: 24%;
+}
+
+.top-line-right {
+	right: 24%;
+}
+/* header-end */
+/* 模型上方的三个统计数及时间--start */
+.top_block {
+	position: absolute;
+	width: 100%;
+	text-align: center;
+	top: 80px;
+}
+.top_block_time {
+	margin: 5px 0 50px 0;
+	color: #fff;
+	font-size: 12px;
+	font-weight: bold;
+}
+.totalNumContnier {
+	display: flex;
+	width: fit-content;
+	margin: auto;
+}
+
+.totalNumWrap {
+	margin: 0 10px;
+	position: relative;
+}
+
+.totalNumWrap > img {
+	width: 10vw;
+}
+
+.totalNumWrap_green > .totalNumber {
+	color: rgb(5, 245, 2);
+}
+
+.totalNum_orange > .totalNumber {
+	color: orange;
+}
+
+.totalNum_blue > .totalNumber {
+	color: rgb(2, 245, 242);
+}
+
+.totalNumber {
+	font-size: 25px;
+	font-weight: bold;
+	position: absolute;
+	left: 50%;
+	top: 50%;
+	transform: translateX(-50%) translateY(-50%);
+}
+
+.totalNumText {
+	color: #fff;
+	font-weight: bold;
+	font-size: 0.7vw;
+	position: absolute;
+	top: -6px;
+	left: 50%;
+	transform: translateX(-50%);
+}
+/* 模型上方的三个统计数及时间--end */
+/*  */
+.left_block,
+.right_block {
+	z-index: 10;
+	display: flex;
+	flex-direction: column;
+	padding: 10px 20px 0 20px;
+}
+.left_block {
+	left: 0;
+}
+.right_block {
+	right: 0;
+}
+.flexItem {
+	margin-bottom: 10px;
+}
+
+.itemTitle {
+	color: #fff;
+	height: 40px;
+	padding-left: 10px;
+	font-size: 16px;
+	line-height: 40px;
+	font-weight: bold;
+	background: url("/public/img/photon_title.png");
+	background-size: 100% 100%;
+	display: flex;
+}
+
+.itemTitleIcon {
+	width: 20px;
+	height: 20px;
+	margin-top: 10px;
+	margin-right: 5px;
+	display: inline-block;
+	animation: rotate 3s infinite;
+	transform-origin: center center;
+	background: url("/public/img/photon_title_icon.png");
+	background-size: 100% 100%;
+}
+.itemBody {
+	width: 100%;
+	background: rgba(9, 31, 43, 0.5);
+	border-radius: 20px;
+	margin-top: 5px;
+}
+.bodyList {
+	width: 200px;
+	height: 100%;
+	color: #ffffff;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-around;
+}
+.bodyListItem {
+	font-size: 1vh;
+	border: 1px solid #02f5f2;
+	height: 16%;
+	border-radius: 15px;
+	text-align: center;
+}
+.bodyListItemBg {
+	background: rgba(2, 245, 242, 0.18);
+}
+.tableHeader {
+	color: #02f5f2;
+	font-size: 1.1vh;
+}
+.bodyListItem_name {
+	width: 60px;
+	padding: 0.5vh 0;
+}
+.bodyListItem_num {
+	width: 65px;
+}
+.itemBodyFlex {
+	display: flex;
+}
+.itemBodyCircle {
+	display: flex;
+	flex-wrap: wrap;
+	justify-content: center;
+	padding-top: 1vh;
+}
+.item_circle {
+	width: 33%;
+	text-align: center;
+}
+@keyframes rotate {
+	0% {
+		transform: rotate(0deg);
+	}
+
+	25% {
+		transform: rotate(90deg);
+	}
+
+	50% {
+		transform: rotate(180deg);
+	}
+
+	75% {
+		transform: rotate(270deg);
+	}
+
+	100% {
+		transform: rotate(360deg);
+	}
+}
+
+.row-item {
+	height: 40px !important;
+	line-height: 40px !important;
+}
+
+#scrollTable > .hader {
+	background: rgb(10, 63, 68) !important;
+	background-color: #0a3f44 !important;
 }
 
 .model {
 	top: 0;
 	width: 100%;
-	background-image: url("/public/img/bj.png");
-	background-size: cover;
+	height: 100%;
 }
 
 #renderCanvas {
@@ -1674,145 +1976,248 @@ header {
 	font-size: 30px;
 }
 
-.left_main,
-.right_main {
-	z-index: 10;
-	position: absolute;
-	top: 40px;
-	width: 20%;
-}
-
-.right_main {
-	right: 0;
-}
-
-.left_other,
-.right_other {
-	position: absolute;
-	top: 240px;
-	width: 20%;
-}
-
-.right_other {
-	right: 0;
-}
-
-.panel {
-	padding: 4px 8px;
-	overflow: auto;
-	background: linear-gradient(#99fffe, #99fffe) left -3px top 0,
-		linear-gradient(#99fffe, #99fffe) left -3px top -3px,
-		linear-gradient(#99fffe, #99fffe) right -3px top 0,
-		linear-gradient(#99fffe, #99fffe) right -3px top -3px,
-		linear-gradient(#99fffe, #99fffe) left -3px bottom 0,
-		linear-gradient(#99fffe, #99fffe) left -3px bottom -3px,
-		linear-gradient(#99fffe, #99fffe) right -3px bottom 0,
-		linear-gradient(#99fffe, #99fffe) right -3px bottom -3px;
-	background-color: rgba(0, 34, 51, 0.5);
-	background-repeat: no-repeat;
-	background-size: 20px 20px, 20px 20px;
-	background-size: 3px 16px, 16px 3px;
-	border: 1px solid transparent;
-	margin: 6px 6px;
-}
-
-.panel_title {
-	height: 30px;
-	margin-bottom: 4px;
-	font-size: 18px;
+.numberFont {
+	font-size: 22px;
 	font-weight: bold;
-	color: #fff;
 }
 
-.panel_item {
+.numberUnit {
+	font-size: 12px;
+}
+
+#dashbordProcess .el-progress-circle {
+	height: 60px !important;
+	width: 60px !important;
+}
+
+.el-progress--circle .el-progress__text {
+	display: block;
+	margin-top: 1px;
 	color: #fff;
-	padding: 6px;
+	font-size: 20px !important;
+	font-weight: bold !important;
+}
+
+.inforBlock {
+	left: 60%;
+	top: 30%;
+	width: 420px;
+	height: 150px;
+	position: absolute;
+	font-weight: 500;
+	color: #fff;
+	padding: 20px;
+	font-size: 14px;
+	box-sizing: border-box;
 	background: linear-gradient(
-		40deg,
-		rgba(11, 101, 140, 0.451),
-		rgba(0, 34, 48, 0.335)
+		to bottom left,
+		rgba(25, 154, 118, 0.5),
+		rgba(31, 44, 50, 0.5)
 	);
 }
 
-.panel_label {
-	font-size: 16px;
-	margin-bottom: 6px;
-}
-
-.pannel_number {
-	position: relative;
-}
-
-.panel_value {
-	padding-left: 1em;
-	font-size: 20px;
-	font-weight: bold;
-	text-align: right;
-}
-
-.panel_unit {
-	right: 5px;
-	color: #aebfe9;
-	font-size: 12px;
-	text-align: right;
-	position: absolute;
-}
-
-.chart {
-	width: 100%;
-	height: 220px;
-}
-
-.dropdown {
-	/* top: 20%;
-    font-size: 18px;
-    right: 22%;
-    position: absolute; */
-	bottom: 3%;
-	font-size: 18px;
+.inforBlock.clickBlock {
 	left: 50%;
-	position: absolute;
+	width: 520px;
+	height: 225px;
+	padding: 40px;
+	font-size: 16px;
 	transform: translateX(-50%);
 }
 
-/* .dropdown-item {
-    padding: 12px 16px;
-    text-decoration: none;
-    display: block;
-    color: white;
-    background: linear-gradient(40deg, rgba(11, 101, 140, 0.451), rgba(0, 25, 36, 0.335));
-    border-radius: 5%;
-    margin-bottom: 6px;
-    border: 1px solid  #99fffe;
-  }
-*/
-.dropdown-item {
-	text-decoration: none;
-	display: inline-block;
-	color: white;
-	width: 8vw;
-	height: 3.4vw;
-	font-size: 1vw;
-	text-align: center;
-	background: url(./../../../public/img/menu.png) no-repeat;
-	background-size: 100%;
-	line-height: 3.7vw;
-	margin: 0 0.1vw 0.1vw 0.1vw;
+.inforBlock > .border_corner {
+	z-index: 2500;
+	position: absolute;
+	width: 10px;
+	height: 10px;
+	background: rgba(0, 0, 0, 0);
+	border: 2px solid rgba(54, 217, 187, 1);
 }
 
-.dropdown-item:hover,
-.dropdown-item.active {
-	/* background-color: #ddd; */
-	width: 8.2vw;
-	height: 3.5vw;
-	font-size: 1vw;
-	line-height: 3.7vw;
-	margin: 0;
-	text-decoration: none;
-	display: inline-block;
-	color: white;
-	text-align: center;
-	background: url(./../../../public/img/menu_active.png) no-repeat;
-	background-size: 100%;
+.inforBlock > .border_left_top {
+	top: 0;
+	left: 0;
+	border-right: none;
+	border-bottom: none;
 }
+
+.inforBlock > .border_right_top {
+	top: 0;
+	right: 0;
+	border-left: none;
+	border-bottom: none;
+}
+
+.inforBlock > .border_left_bottom {
+	bottom: 0;
+	left: 0;
+	border-right: none;
+	border-top: none;
+}
+
+.inforBlock > .border_right_bottom {
+	bottom: 0;
+	right: 0;
+	border-left: none;
+	border-top: none;
+}
+
+.inforBlock > .title {
+	font-size: 20px;
+	font-weight: 600;
+	position: absolute;
+	top: -45px;
+	text-align: center;
+	width: 100%;
+	left: 0;
+}
+
+.inforBlock > .infoCantier {
+	display: flex;
+}
+
+.infoCantier > .leftBlock {
+	width: 100px;
+	display: flex;
+	flex-direction: column;
+	margin-right: 30px;
+}
+
+.infoCantier > .rightBlock {
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+}
+
+.infoCantier > .rightBlock > .countWrap {
+	display: flex;
+	justify-content: space-between;
+	width: 280px;
+	margin-top: 10px;
+}
+
+.percentage-value {
+	display: block;
+	margin-top: 6px;
+	font-size: 1.5vh;
+	color: #02f5f2;
+	font-weight: bold;
+}
+.percentage-label {
+	color: #ffffff;
+	font-size: 1.2vh;
+}
+.circle_bottom_text {
+	color: #02f5f2;
+	font-size: 0.8vw;
+}
+
+.elecItem {
+	color: #ffffff;
+	font-size: 20px;
+	margin-top: 10px;
+	height: 30%;
+	width: 50%;
+	font-size: 1.2vh;
+	display: inline-block;
+}
+.elecItem_wrap {
+	display: flex;
+	flex-direction: column;
+	border-left: 5px solid rgba(53, 156, 193, 0.66);
+	padding-left: 10px;
+	border-radius: 5px;
+}
+.elec_number {
+	color: rgb(2, 245, 242);
+	font-weight: bold;
+	font-size: 1.4vh;
+	padding-top: 5px;
+}
+.elec_unit {
+	font-size: 0.9vh;
+	color: #ffffff;
+	font-weight: 500;
+}
+.successState {
+	width: 10px;
+	height: 10px;
+	border-radius: 5px;
+	background: #00ff00;
+}
+.warningState {
+	width: 10px;
+	height: 10px;
+	border-radius: 5px;
+	background: #0000ff;
+}
+/* // 表格——el-table 去除背景颜色*/
+#elTable {
+	/* border-radius: 5px; */
+	margin-top: 10px;
+}
+.successCircle {
+	width: 10px;
+	height: 10px;
+	border-radius: 5px;
+	background: #02f5f2;
+}
+.warningCircle {
+	width: 10px;
+	height: 10px;
+	border-radius: 5px;
+	background: rgb(255, 0, 135);
+}
+/deep/ .el-table,
+.el-table__body,
+/deep/ .el-table .el-table__body-wrapper {
+	background: transparent !important;
+}
+/deep/ .el-table .el-table__header-wrapper {
+	background: rgba(32, 93, 74, 0.83) !important;
+}
+/deep/ .el-table .el-table__body-wrapper {
+	background: rgba(46, 139, 155, 0.48) !important;
+}
+/deep/ .el-table th {
+	background-color: transparent !important;
+}
+/deep/ .el-table tr {
+	background-color: transparent !important;
+}
+/deep/ .el-table tr :hover {
+	background-color: transparent !important;
+}
+/deep/
+	.el-table--enable-row-hover
+	.el-table__body
+	tr:hover
+	> td.el-table__cell {
+	background-color: transparent !important;
+}
+/* //清除鼠标移入效果 */
+/deep/.el-table__body tr.hover-row > td {
+	background-color: transparent !important;
+}
+/* // 行底边线 */
+/deep/ .el-table .el-table__body-wrapper /deep/ .el-table td.el-table__cell,
+.el-table th.el-table__cell.is-leaf {
+	background: transparent !important;
+}
+/deep/ .el-table td.el-table__cell,
+/deep/ .el-table th.el-table__cell.is-leaf {
+	border-bottom: 1px solid rgb(25, 111, 115, 0.82) !important;
+}
+/* 改变radio选中时的样式 */
+/deep/ .el-radio.elRadio > .el-radio__label {
+	color: #ffffff;
+}
+/deep/ .el-radio__input.is-checked .el-radio__inner {
+	background: #13f1df;
+	border-color: #13f1df;
+}
+/deep/ .el-table__inner-wrapper:before {
+	background-color: rgba(0, 0, 0, 0) !important;
+}
+/* 改变radio选中时的样式 */
 </style>