无监督学习【未完成，弹窗 模型训练和测试的准确率】

src/views/MalfunctionWarning/components/detectionRecord.vue

@@ -30,7 +30,8 @@
 				</el-table-column>
 			</el-table>
 		</div>
-		<TestReport v-model="reportDisplay" :faultid='faultid'></TestReport>
+		<TestReport v-model="reportDisplay" :faultid='faultid' 
+	  ></TestReport>
 	</el-dialog>
 </template>
 <script>
@@ -41,7 +42,7 @@
 			TestReport,
 		},
 		props: {
-			myData: {}
+			myData: {},
 		},
 		data() {
 			return {

src/views/MalfunctionWarning/components/lineChart.vue

@@ -1,10 +1,18 @@
 <template>
-  <div class="precisionEcharts" :id="id"></div>
+  <div class="precisionEcharts" :id="id" :style="{width:width,height:height}"></div>
 </template>
 <script>
 import * as echarts from "echarts";
 export default {
   props: {
+	  width: {
+	    type: String,
+	    default: "600px",
+	  },
+	  height: {
+	    type: String,
+	    default: "250px",
+	  },
     dataList: {
       type: String,
       required: true,
@@ -92,8 +100,8 @@ export default {
 };
 </script>
 <style lang="less" scoped>
-.precisionEcharts {
-  width: 600px;
-  height: 250px;
-}
+// .precisionEcharts {
+//   width: 600px;
+//   height: 250px;
+// }
 </style>

src/views/MalfunctionWarning/components/records.vue

@@ -92,7 +92,7 @@
   </el-dialog>
 </template>
 <script>
-import BarChart from ".//barChart.vue";
+import BarChart from "./barChart.vue";
 import LineChart from "./lineChart.vue";
 import ChartDetails from "./chartDetails.vue";
 import * as echarts from "echarts";
@@ -253,7 +253,7 @@ export default {
             res.forEach((item) => {
               let arr = item.name.split("-");
               item.coordinate = JSON.parse(item.coordinate);
-              item.showName = arr[0];
+              item.showName = arr[0]+' - '+arr[1]+' - '+arr[2];
               item.showTime = new Date(Number(arr[1])).formatDate(
                 "yyyy-MM-dd hh:mm:ss"
               );
@@ -268,22 +268,21 @@ export default {
       let that = this;
       this.API.requestData({
         method: "GET",
-        baseURL: "http://192.168.10.18:8080/",
+        baseURL: "http://10.155.32.14:9090/",
         subUrl: "api/supervised/history",
         success(res) {
           if (res) {
             res.forEach((item) => {
               let arr = item.name.split("-");
               item.coordinate = JSON.parse(item.coordinate);
-              item.showName = arr[2];
+              item.showName = arr[0]+' - '+arr[1]+' - '+arr[2];
               item.showTime = new Date(Number(arr[3])).formatDate(
                 "yyyy-MM-dd hh:mm:ss"
               );
               item.coordinate.bar = JSON.parse(item.coordinate.bar);
             });
             that.accuracyList.accuracy = res[that.current]?.coordinate.accuracy;
-            that.accuracyList.val_accuracy =
-              res[that.current]?.coordinate.val_accuracy;
+            that.accuracyList.val_accuracy = res[that.current]?.coordinate.val_accuracy;
             res[that.current]?.coordinate.bar?.sort(that.Compare("value"));
             that.barList = res[that.current]?.coordinate.bar?.slice(0, 5);
             that.recordList = res;
@@ -365,7 +364,7 @@ export default {
       let that = this;
       this.API.requestData({
         method: "GET",
-        baseURL: "http://192.168.10.18:8080/",
+        baseURL: "http://10.155.32.14:9090/",
         subUrl: "api/coordinate/history/remove/",
         data: {
           names: val,

src/views/MalfunctionWarning/components/superviseDataClassify.vue

@@ -362,6 +362,7 @@ export default {
       axios({
         method: "post",
         url: "http://10.155.32.14:9090/api/supervised/execute",
+		// url: "http://192.168.10.16:8080/api/supervised/execute",
         data: params,
         header: {
           "Content-Type": "application/json",

src/views/MalfunctionWarning/components/testReport.vue

@@ -22,7 +22,7 @@
 				<div class="infoContent">
 					<div class="contents">
 						<div class="contentsTitle">使用模型：</div>
-						<div>{{reportData.modelName}}</div>
+						<div>{{modelName}}</div>
 					</div>
 					<div class="contents">
 						<div class="contentsTitle">训练次数：</div>
@@ -33,10 +33,13 @@
 				<div class="result">
 					<div class="moduleTitle">诊断结果:</div>
 					<div class="resultContent">
-						诊断故障最大可能为<text style="color: #dc143c">{{reportData.result}}</text>,下表为各故障可能发生的实际概率：
+						诊断故障最大可能为<text style="color: #dc143c">{{faultResult}}</text>下表为各故障可能发生的实际概率：
 					</div>
 					<div class="resultTable">
-						<el-table empty-text="暂无数据" :data="faultList" :header-cell-style="{ background: 'rgb(153,204,255)', color: '#000', 'font-size': '20px', }" :cell-style="{ 'font-size': '20px', color: '#696969', }" border stripe style="width: 100%; margin: 10px 0">
+						<el-table empty-text="暂无数据" :data="faultList"
+							:header-cell-style="{ background: 'rgb(153,204,255)', color: '#000', 'font-size': '20px', }"
+							:cell-style="{ 'font-size': '20px', color: '#696969', }" border stripe
+							style="width: 100%; margin: 10px 0">
 							<el-table-column prop="name" label="故障名称" align="center"></el-table-column>
 							<el-table-column prop="percent" label="发生概率" align="center"></el-table-column>
 						</el-table>
@@ -48,15 +51,15 @@
 						根据风场情况，训练故障权重图、训练和测试准确率、训练模型误差率如下：
 					</div>
 					<div class="charts">
-						<BarChart v-if="barList.length > 0" id="reportBar" :barList="barList"></BarChart>
-						<LineChart v-if="lossList" id="reporLoss" :reportFlag="true" :dataList="lossList"></LineChart>
-						<LineChart v-if="accuracyList" id="reporAccuracy" :reportFlag="true" :dataList="accuracyList">
-						</LineChart>
+						<LineChart width="33.33%" v-if="lossList" id="reporLoss" :reportFlag="true" :dataList="lossList"></LineChart>
+						<LineChart width="33.33%" v-if="accuracyList" id="reporAccuracy" :reportFlag="true" :dataList="accuracyList"> </LineChart>
+						<BarChart width="33.33%" v-if="barList.length > 0" id="reportBar" :baseLine='baseLine' :barList="barList"> </BarChart>
 					</div>
 					<div class="resultContent">
-						该模型训练和测试的准确率分别为<text style="color: #dc143c">74.2%和73.3%</text>；误差率分别为<text
-							style="color: #dc143c">2%和1%</text>；该模型训练所倚重的测点比重分别为：<text
-							style="color: #dc143c">偏航位置7.2%、发电机转速4.4%、有功功率3.4%、U1项绕组电流2.9%、齿轮箱轴2温度2.1%</text>。模型训练过程所有测点倚重占比如下表所示：
+						该模型训练和测试的准确率分别为<text style="color: #dc143c">74.2%和73.3%</text>；
+						误差率分别为<text style="color: #dc143c">2%和1%</text>；<br>
+						该模型训练所倚重的测点比重分别为：<text style="color: #dc143c" v-for="(item,index) in proportionList" :key="index">{{item.name+item.percent+(index != (proportionList.length-1)?'、':'')}}</text>。<br>
+						模型训练过程所有测点倚重占比如下表所示：
 					</div>
 					<div class="resultTable">
 						<el-table empty-text="暂无数据" :data="proportionList" :header-cell-style="{ background: 'rgb(153,204,255)', color: '#000', 'font-size': '20px', }" :cell-style="{ 'font-size': '20px', color: '#696969', }" border stripe style="width: 100%; margin: 10px 0">
@@ -78,25 +81,21 @@
 			LineChart,
 			BarChart,
 		},
-		props:{
-			faultid:''
+		props: {
+			faultid: '',
 		},
 		created() {
-			let dataList = JSON.parse(
-				'{"ducumentName":"NNS-1637028563000","loss":[1.0882383584976196,1.067789912223816,1.0520573854446411,1.0380222797393799,1.0230460166931152,1.0070627927780151,0.9899255037307739,0.9736341238021851,0.9547672271728516,0.9341660737991333,0.9082227945327759,0.8833365440368652,0.8581799268722534,0.8310791254043579,0.8011142611503601,0.7700659036636353,0.7383494973182678,0.7076452970504761,0.6731187105178833,0.6390867829322815],"accuracy":[0.3047619163990021,0.37142857909202576,0.3619047701358795,0.3619047701358795,0.380952388048172,0.5809524059295654,0.6571428775787354,0.6571428775787354,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6761904954910278,0.6952381134033203,0.7333333492279053,0.7428571581840515],"val_loss":[1.0914311408996582,1.0727100372314453,1.0579898357391357,1.0469794273376465,1.0305122137069702,1.012723684310913,0.9997329115867615,0.9839586615562439,0.9610583782196045,0.9339884519577026,0.9096081256866455,0.8876619338989258,0.862886905670166,0.8299474120140076,0.793283998966217,0.7597811222076416,0.7229973673820496,0.6826366782188416,0.6449647545814514,0.6126752495765686],"val_accuracy":[0.2666666805744171,0.2666666805744171,0.2666666805744171,0.2666666805744171,0.4000000059604645,0.644444465637207,0.644444465637207,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.7333333492279053,0.7555555701255798,0.7333333492279053],"bar":[{"name":"邮箱温度","value":0.3},{"name":"风速","value":0.25},{"name":"变桨","value":0.25},{"name":"有高","value":0.2}]}'
-			);
-			this.lossList.loss = dataList.loss;
-			this.lossList.val_loss = dataList.val_loss;
-			this.accuracyList.accuracy = dataList.accuracy;
-			this.accuracyList.val_accuracy = dataList.val_accuracy;
-			this.barList = dataList.bar;
+			
 		},
 		data() {
 			return {
-				reportData:{},
-				barList: [],
+				modelName:'',
 				lossList: {},
 				accuracyList: {},
+				baseLine: '',
+				barList: [],
+				faultResult:'',
+				reportData: {},
 				faultList: [{
 						name: "齿轮箱故障",
 						percent: "80%",
@@ -105,10 +104,6 @@
 						name: "变频器故障",
 						percent: "17%",
 					},
-					{
-						name: "变桨系统故障",
-						percent: "3%",
-					},
 				],
 				proportionList: [{
 						name: "偏航位置",
@@ -117,45 +112,111 @@
 					{
 						name: "发电机转速",
 						percent: "4.4%",
-					},
-					{
-						name: "有功功率",
-						percent: "3.4%",
-					},
-					{
-						name: "U1项绕组电流",
-						percent: "2.9%",
-					},
-					{
-						name: "齿轮箱轴2温度",
-						percent: "2.1%",
-					},
-					{
-						name: "电网无功功率",
-						percent: "1.9%",
-					},
+					}
 				],
 			};
 		},
 		methods: {
-			// 导出PDF
-			exportPDF(name) {
+			jzxF(arr){
+				let jzx = [],
+					jzxData = [],
+					baselineAdd = 0;
+				arr.forEach(ele => {
+					if (parseFloat(ele.value) >= this.BaseLine) {
+						baselineAdd += parseFloat(ele.value);
+						jzx.push(ele)
+					}
+				})
+				
+				let jzxNum = [];
+				let jzxNum2 = []; //初始顺序
+				jzx.forEach(ele => {
+					jzxNum.push(parseFloat(ele.value));
+					jzxNum2.push(parseFloat(ele.value));
+				})
+				let jzxNumData = jzxNum.sort().reverse().slice(0, 5);
+				
+				jzxNumData.forEach(ele => {
+					let idx = jzxNum2.indexOf(ele);
+					jzxData.push({
+						name: jzx[idx].name,
+						percent: ((ele/baselineAdd)*100).toFixed(4) + "%",
+					})
+				})
+				this.proportionList = jzxData;
+			},
+			history(name) {
+			  let that = this;
+			  that.API.requestData({
+			    method: "GET",
+			    baseURL: "http://10.155.32.14:9090/",
+			    subUrl: "api/supervised/history",
+			    success(res) {
+			      if (res) {
+					  let data = []
+					res.forEach(ele=>{
+						if(ele.name === name){
+							ele.coordinate = JSON.parse(ele.coordinate);
+							ele.coordinate.bar = JSON.parse(ele.coordinate.bar);
+							data = ele;
+						}
+					})
+					
+					that.lossList.loss = data?.coordinate.loss;
+					that.lossList.val_loss = data?.coordinate.val_loss;
+					that.BaseLine = parseFloat(data?.coordinate.BaseLine);
+					that.accuracyList.accuracy = data?.coordinate.accuracy;
+					that.accuracyList.val_accuracy = data?.coordinate.val_accuracy;
+					data?.coordinate.bar?.sort(that.Compare("value"));
+					that.barList = data?.coordinate.bar?.slice(0, 5);
+					
+					that.jzxF(data?.coordinate.bar);
+			      }
+			    },
+			  });
+			},
+			Compare(property) {
+			  return function (a, b) {
+			    var value1 = a[property];
+			    var value2 = b[property];
+			    return value2 - value1;
+			  };
+			},
+			exportPDF(name) {// 导出PDF
 				this.BASE.showMsg({
 					type: "success",
 					msg: "正在导出...请稍后...",
 				});
 				Get_PDF.downloadPDF(document.querySelector(".pdfDom"), "故障检测报告");
 			},
-			report(){
+			report() {
 				let that = this;
 				that.API.requestData({
 					method: "GET",
 					subUrl: "http://10.155.32.14:9090/api/autofault/report",
 					success(res) {
 						if (res) {
-							res.forEach(ele=>{
-								if(ele.id === that.faultid){
+							res.forEach(ele => {
+								if (ele.id === that.faultid) {
+									that.history(ele.modelName)
 									that.reportData = ele;
+									that.modelName=ele.modelName.split('-')[2];
+									let faultList = [],
+										faultResult = '';
+									ele.result.split(' ').forEach(ele => {
+										let data = ele.split(':');
+										if(data.length > 1){
+											faultList.push({
+												name: data[0],
+												percent: data[1] * 100 + '%'
+											})
+											faultResult += data[0] + ':' + data[1] * 100 + '%，'
+										}
+									})
+									
+									that.faultResult = faultResult;
+									that.faultList = faultList;
+									
 								}
 							})
 						}
@@ -216,8 +277,7 @@
 
 				.charts {
 					display: flex;
-					flex-direction: row;
-					align-items: center;
+					justify-content: left;
 				}
 			}
 		}

src/views/MalfunctionWarning/supervised.vue

@@ -1,28 +1,18 @@
 <template>
-  <div class="decision-page-1">
-    <div class="query mg-b-8">
-      <div class="query-items">
-        <div class="query-item">
-          <div class="lable">算法类型：</div>
-          <div class="search-input">
-            <el-select
-              v-model="chooseAlgorithm"
-              @change="algorithmChange(chooseAlgorithm)"
-              clearable
-              placeholder="请选择"
-              popper-class="select"
-            >
-              <el-option
-                v-for="item in algorithm"
-                :key="item.name"
-                :value="item.name"
-                :label="item.name"
-              >
-              </el-option>
-            </el-select>
-          </div>
-        </div>
-        <!-- <div v-for="(item, index) in chooseAlgorithm.parameters" :key="index">
+	<div class="decision-page-1">
+		<div class="query mg-b-8">
+			<div class="query-items">
+				<div class="query-item">
+					<div class="lable">算法类型：</div>
+					<div class="search-input">
+						<el-select v-model="chooseAlgorithm" @change="algorithmChange(chooseAlgorithm)" clearable
+							placeholder="请选择" popper-class="select">
+							<el-option v-for="item in algorithm" :key="item.name" :value="item.name" :label="item.name">
+							</el-option>
+						</el-select>
+					</div>
+				</div>
+				<!-- <div v-for="(item, index) in chooseAlgorithm.parameters" :key="index">
           {{ item.name }}:
           <input
             v-model="item.value"
@@ -31,597 +21,557 @@
             @blur="inputChange(item)"
           />
         </div> -->
-      </div>
-    </div>
-    <div class="actions mg-b-8">
-      <button class="btn" @click="TypeClick('sjfl')">数据分类</button>
-      <button class="btn" @click="TypeClick('mxjl')">模型记录</button>
-      <button class="btn" @click="TypeClick('jcjl')">检测记录</button>
-      <!-- <button class="btn" @click="handleTraining()">检测记录</button> -->
-    </div>
-    <el-row :type="'flex'" class="content">
-      <el-col :span="16" class="pd-l-8">
-        <panel :title="'训练记录'" :showLine="false">
-          <div class="dataTitle">
-            <div class="chooses">
-              <el-date-picker
-                class="picker"
-                @change="changes"
-                v-model="timeValue"
-                type="datetimerange"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"
-              >
-              </el-date-picker>
-              <div class="contents">
-                风电场：
-                <el-select
-                  v-model="selectValue"
-                  @change="search()"
-                  clearable
-                  placeholder="请选择"
-                  popper-class="select"
-                  style="width: 170px; margin-left: 20px"
-                >
-                  <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :value="item.value"
-                    :label="item.label"
-                  />
-                </el-select>
-              </div>
-              <div class="contents">
-                机型：
-                <el-select
-                  v-model="selectMoudle"
-                  @change="selectSearch()"
-                  clearable
-                  placeholder="全部"
-                  popper-class="select"
-                  style="width: 120px; margin-left: 20px"
-                >
-                  <el-option
-                    v-for="item in moudleList"
-                    :key="item.value"
-                    :value="item.value"
-                    :label="item.label"
-                  />
-                </el-select>
-              </div>
-            </div>
-            <button class="btn" @click="getFaultList">查询</button>
-          </div>
-          <div class="bodys" v-if="dataList.length > 0">
-            <div v-for="(item, index) in dataList" :key="index">
-              <div class="faultTitle">{{ item.name }}:</div>
-              <div class="fault">
-                <div
-                  class="faultBlock"
-                  v-for="(val, indexs) in item.children"
-                  :key="indexs"
-                >
-                  <div class="left">
-                    <div>{{ val.stationcn }}</div>
-                    <div>{{ val.windturbineid }}</div>
-                    <div>{{ val.model }}</div>
-                    <div style="font-size: 14px">{{ val.starttime }}</div>
-                  </div>
-                  <div class="right">
-                    <img class="imgs" src="./img/generator.png" alt="" />
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div v-else class="none">暂无数据</div>
-        </panel>
-      </el-col>
-      <el-col :span="8" class="pd-l-8">
-        <panel :title="'演示过程图'" :showLine="false">
-          <div class="bodys">
-            <div class="results" v-if="showTraining">
-              <div class="progressTitle">
-                <div v-if="!trainingFlag">数据获取中...</div>
-                <div v-if="trainingFlag && width < 100">训练中...</div>
-                <div v-if="trainingFlag && width === 100">训练完成</div>
-                <div class="progressNum">
-                  当前进度：{{ width >= 0 ? width : 0 }}%
-                </div>
-              </div>
-              <div class="box">
-                <div class="progress" :style="`width:${width}%;`"></div>
-                <div class="line"></div>
-                <div class="unprogress" :style="`width:${100 - width}%;`"></div>
-              </div>
-            </div>
-            <LineChart
-              v-if="lossList"
-              id="loss"
-              :dataList="lossList"
-            ></LineChart>
-            <LineChart
-              v-if="accuracyList"
-              id="accuracy"
-              :dataList="accuracyList"
-            ></LineChart>
-            <BarChart
-              v-if="barList.length > 0"
-              id="bar"
-              :baseLine="ceshiList?.BaseLine"
-              @click="showDetials"
-              :barList="barList"
-            ></BarChart>
-          </div>
-        </panel>
-      </el-col>
-    </el-row>
-    <SuperviseDataClassify
-      ref="dataClass"
-      @click-training="handleClick"
-      @handleInterval="intervals"
-      v-model="display"
-      :allData="allData"
-      :chooseAlgorithm="chooseAlgorithm"
-    ></SuperviseDataClassify>
-    <Records
-      @results="recordResults"
-      supervisedFlag="true"
-      :recordList="showBarList"
-      :accuracyList="accuracyList"
-      v-model="recordsDisplay"
-    ></Records>
-    <ChartDetails
-      v-model="detialsDisplay"
-      :barList="ceshiList?.bar"
-      :baseLine="ceshiList?.BaseLine"
-    ></ChartDetails>
-    <DetectionRecord
-      v-model="detectionDisplay"
-      :myData="myData"
-    ></DetectionRecord>
-  </div>
+			</div>
+		</div>
+		<div class="actions mg-b-8">
+			<button class="btn" @click="TypeClick('sjfl')">数据分类</button>
+			<button class="btn" @click="TypeClick('mxjl')">模型记录</button>
+			<button class="btn" @click="TypeClick('jcjl')">检测记录</button>
+			<!-- <button class="btn" @click="handleTraining()">检测记录</button> -->
+		</div>
+		<el-row :type="'flex'" class="content">
+			<el-col :span="16" class="pd-l-8">
+				<panel :title="'训练记录'" :showLine="false">
+					<div class="dataTitle">
+						<div class="chooses">
+							<el-date-picker class="picker" @change="changes" v-model="timeValue" type="datetimerange"
+								range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
+							</el-date-picker>
+							<div class="contents">
+								风电场：
+								<el-select v-model="selectValue" @change="search()" clearable placeholder="请选择"
+									popper-class="select" style="width: 170px; margin-left: 20px">
+									<el-option v-for="item in options" :key="item.value" :value="item.value"
+										:label="item.label" />
+								</el-select>
+							</div>
+							<div class="contents">
+								机型：
+								<el-select v-model="selectMoudle" @change="selectSearch()" clearable placeholder="全部"
+									popper-class="select" style="width: 120px; margin-left: 20px">
+									<el-option v-for="item in moudleList" :key="item.value" :value="item.value"
+										:label="item.label" />
+								</el-select>
+							</div>
+							<div class="contents">
+								数据源：
+								<el-select v-model="category" clearable placeholder="全部" popper-class="select">
+									<el-option v-for="item in sjyArr" :key="item.value" :value="item.value"
+										:label="item.label" />
+								</el-select>
+							</div>
+						</div>
+						<button class="btn" @click="getFaultList">查询</button>
+					</div>
+					<div class="bodys" v-if="dataList.length > 0">
+						<div v-for="(item, index) in dataList" :key="index">
+							<div class="faultTitle">{{ item.name }}:</div>
+							<div class="fault">
+								<div class="faultBlock" v-for="(val, indexs) in item.children" :key="indexs">
+									<div class="left">
+										<div>{{ val.stationcn }}</div>
+										<div>{{ val.windturbineid }}</div>
+										<div>{{ val.model }}</div>
+										<div style="font-size: 14px">{{ val.starttime }}</div>
+									</div>
+									<div class="right">
+										<img class="imgs" src="./img/generator.png" alt="" />
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+					<div v-else class="none">暂无数据</div>
+				</panel>
+			</el-col>
+			<el-col :span="8" class="pd-l-8">
+				<panel :title="'演示过程图'" :showLine="false">
+					<div class="bodys">
+						<div class="results" v-if="showTraining">
+							<div class="progressTitle">
+								<div v-if="!trainingFlag">数据获取中...</div>
+								<div v-if="trainingFlag && width < 100">训练中...</div>
+								<div v-if="trainingFlag && width === 100">训练完成</div>
+								<div class="progressNum">
+									当前进度：{{ width >= 0 ? width : 0 }}%
+								</div>
+							</div>
+							<div class="box">
+								<div class="progress" :style="`width:${width}%;`"></div>
+								<div class="line"></div>
+								<div class="unprogress" :style="`width:${100 - width}%;`"></div>
+							</div>
+						</div>
+						<LineChart v-if="lossList" id="loss" :dataList="lossList"></LineChart>
+						<LineChart v-if="accuracyList" id="accuracy" :dataList="accuracyList"></LineChart>
+						<BarChart v-if="barList.length > 0" id="bar" :baseLine="ceshiList?.BaseLine"
+							@click="showDetials" :barList="barList"></BarChart>
+					</div>
+				</panel>
+			</el-col>
+		</el-row>
+		<SuperviseDataClassify ref="dataClass" @click-training="handleClick" @handleInterval="intervals"
+			v-model="display" :allData="allData" :chooseAlgorithm="chooseAlgorithm"></SuperviseDataClassify>
+		<Records @results="recordResults" supervisedFlag="true" :recordList="showBarList" :accuracyList="accuracyList"
+			v-model="recordsDisplay"></Records>
+		<ChartDetails v-model="detialsDisplay" :barList="ceshiList?.bar" :baseLine="ceshiList?.BaseLine"></ChartDetails>
+		<DetectionRecord v-model="detectionDisplay" :myData="myData"></DetectionRecord>
+	</div>
 </template>
 <script>
-import Panel from "../../components/coms/panel/panel.vue";
-import LineChart from "./components/lineChart.vue";
-import BarChart from "./components/barChart.vue";
-import SuperviseDataClassify from "./components/superviseDataClassify.vue";
-import Records from "./components/records.vue";
-import ChartDetails from "./components/chartDetails.vue";
-import DetectionRecord from "./components/detectionRecord.vue";
-export default {
-  components: {
-    Panel,
-    LineChart,
-    BarChart,
-    SuperviseDataClassify,
-    Records,
-    ChartDetails,
-    DetectionRecord,
-  },
-  created() {
-    if (this.timeValue.length === 0) {
-      let date = new Date();
-      this.timeValue[0] = date.getTime() - 86400000;
-      this.timeValue[1] = date.getTime();
-    }
-    let select = this.options.filter(
-      (item) => item.value === this.selectValue
-    )[0];
-    this.selectMoudle = select.station[0].lable;
-    this.moudleList = select.station;
-    this.getfaultLables();
-  },
-  data() {
-    return {
-		myData:{},
-      dataList: [],
-      faultLists: [],
-      lossList: {},
-      accuracyList: {},
-      barList: [],
-      algorithm: [], //算法
-      chooseAlgorithm: "",
-      timeValue: [],
-      showBarList: [],
-      moudleList: [],
-      allData: [],
-      ceshiList: [],
-      detectionDisplay: false,
-      showTraining: false,
-      trainingFlag: false,
-      lastTraining: false,
-      display: false,
-      recordsDisplay: false,
-      detialsDisplay: false,
-      width: 60,
-      selectValue: "NSS_FDC",
-      selectMoudle: "UP82",
-      options: [
-        {
-          value: "NSS_FDC",
-          label: "牛首山风电场",
-          station: [
-            {
-              lable: "UP82",
-              value: "UP82",
-            },
-          ],
-        },
-        {
-          value: "MHS_FDC",
-          label: "麻黄山风电场",
-          station: [
-            {
-              lable: "UP77",
-              value: "UP77",
-            },
-            {
-              lable: "UP105-2000-S",
-              value: "UP105-2000-S",
-            },
-          ],
-        },
-        {
-          value: "QS_FDC",
-          label: "青山风电场",
-          station: [
-            {
-              lable: "CCWE-1500",
-              value: "CCWE-1500",
-            },
-            {
-              lable: "UP105-2000-S",
-              value: "UP105-2000-S",
-            },
-          ],
-        },
-        {
-          value: "SBQ_FDC",
-          label: "石板泉风电场",
-          station: [
-            {
-              lable: "UP82",
-              value: "UP82",
-            },
-            {
-              lable: "UP97",
-              value: "UP97",
-            },
-            {
-              lable: "UP105-2000-S",
-              value: "UP105-2000-S",
-            },
-          ],
-        },
-        {
-          value: "XS_FDC",
-          label: "香山风电场",
-          station: [
-            {
-              lable: "UP97",
-              value: "UP97",
-            },
-            {
-              lable: "UP105-2000-S",
-              value: "UP105-2000-S",
-            },
-          ],
-        },
-      ],
-    };
-  },
-  mounted() {
-    let dataList = JSON.parse(
-      '{"ducumentName":"NNS-1637028563000","loss":[1.0882383584976196,1.067789912223816,1.0520573854446411,1.0380222797393799,1.0230460166931152,1.0070627927780151,0.9899255037307739,0.9736341238021851,0.9547672271728516,0.9341660737991333,0.9082227945327759,0.8833365440368652,0.8581799268722534,0.8310791254043579,0.8011142611503601,0.7700659036636353,0.7383494973182678,0.7076452970504761,0.6731187105178833,0.6390867829322815],"accuracy":[0.3047619163990021,0.37142857909202576,0.3619047701358795,0.3619047701358795,0.380952388048172,0.5809524059295654,0.6571428775787354,0.6571428775787354,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6761904954910278,0.6952381134033203,0.7333333492279053,0.7428571581840515],"val_loss":[1.0914311408996582,1.0727100372314453,1.0579898357391357,1.0469794273376465,1.0305122137069702,1.012723684310913,0.9997329115867615,0.9839586615562439,0.9610583782196045,0.9339884519577026,0.9096081256866455,0.8876619338989258,0.862886905670166,0.8299474120140076,0.793283998966217,0.7597811222076416,0.7229973673820496,0.6826366782188416,0.6449647545814514,0.6126752495765686],"val_accuracy":[0.2666666805744171,0.2666666805744171,0.2666666805744171,0.2666666805744171,0.4000000059604645,0.644444465637207,0.644444465637207,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.7333333492279053,0.7555555701255798,0.7333333492279053],"bar":[{"name":"邮箱温度","value":0.3},{"name":"风速","value":0.25},{"name":"变桨","value":0.25},{"name":"有高","value":0.2}]}'
-    );
-    this.ceshiList = dataList;
-    this.lossList.loss = dataList.loss;
-    this.lossList.val_loss = dataList.val_loss;
-    this.accuracyList.accuracy = dataList.accuracy;
-    this.accuracyList.val_accuracy = dataList.val_accuracy;
-    this.barList = dataList.bar;
-    this.getType();
-  },
-  methods: {
-    getfaultLables() {
-      let that = this;
-      this.API.requestData({
-        method: "GET",
-        subUrl: "http://192.168.1.18:9002/know/fault/type/all",
-        success(res) {
-          if (res) {
-            that.faultLists = res.data;
-            that.getFaultList();
-          }
-        },
-      });
-    },
-    getType() {
-      let that = this;
-      this.API.requestData({
-        method: "GET",
-        baseURL: "http://10.155.32.14:9090/",
-        subUrl: "api/coordinate/algorithm",
-        data: {
-          type: 1,
-        },
-        success(res) {
-          if (res) {
-            that.algorithm = res;
-            that.chooseAlgorithm = res[0].name;
-          }
-        },
-      });
-    },
-    TypeClick(btnType) {
-      if (btnType === "sjfl") {
-        this.display = true;
-      } else if (btnType === "mxjl") {
-        this.showBarList.push(this.ceshiList);
-        this.recordsDisplay = true;
-      } else if (btnType === "jcjl") {
-		  this.myData = {
-			  station: this.selectValue,
-			  model: this.selectMoudle,
-			  st: new Date(this.timeValue[0]).formatDate("yyyy-MM-dd hh:mm:ss"),
-			  et: new Date(this.timeValue[1]).formatDate("yyyy-MM-dd hh:mm:ss"),
-		  };
-        this.detectionDisplay = true;
-      }
-    },
-    selectSearch() {
-      this.allData.forEach((item) => {
-        if (item.modelId.indexOf(this.selectMoudle) != -1) {
-          this.dataList.push(item);
-        }
-      });
-    },
-    search() {
-      let select = this.options.filter(
-        (item) => item.value === this.selectValue
-      )[0];
-      this.selectMoudle = select.station[0].lable;
-      this.moudleList = select.station;
-    },
-    showDetials() {
-      this.detialsDisplay = true;
-    },
-    getFaultList() {
-      this.dataList = [];
-      let that = this;
-      this.API.requestData({
-        method: "GET",
-        subUrl: "http://192.168.1.18:9002/case/fault/list",
-        data: {
-          station: this.selectValue,
-          model: this.selectMoudle,
-          st: new Date(this.timeValue[0]).formatDate("yyyy-MM-dd hh:mm:ss"),
-          et: new Date(this.timeValue[1]).formatDate("yyyy-MM-dd hh:mm:ss"),
-        },
-        success(res) {
-          if (res) {
-            that.allData = res.data;
-            res.data.forEach((item) => {
-              let array = that.dataList.filter(
-                (val) => val.code === item.faultcode
-              );
-              item.stationcn = that.options.filter(
-                (items) => items.value === item.stationen
-              )[0]?.label;
-              if (array.length > 0) {
-                array[0].children.push(item);
-              } else {
-                let obj = {
-                  name: that.faultLists.filter(
-                    (items) => items.faultcode === item.faultcode
-                  )[0]?.faulttype,
-                  code: item.faultcode,
-                  children: [],
-                };
-                obj.children.push(item);
-                that.dataList.push(obj);
-              }
-            });
-          }
-        },
-      });
-    },
-    handleClick() {
-      this.lastTraining = false;
-      this.barList = [];
-      this.handleTraining();
-    },
-    handleTraining() {
-      let that = this;
-      that.resultList = [];
-      this.API.requestData({
-        method: "GET",
-        baseURL: "http://10.155.32.14:9090/",
-        subUrl: "api/supervised/",
-        success(res) {
-          if (res.value.length > 0) {
-            let arr = JSON.parse(res.value);
-            that.ceshiList = arr;
-            that.lossList.loss = arr.loss;
-            that.lossList.val_loss = arr.val_loss;
-            that.accuracyList.accuracy = arr.accuracy;
-            that.accuracyList.val_accuracy = arr.val_accuracy;
-            if (arr.bar) {
-              arr.bar = JSON.parse(arr.bar);
-              arr.bar?.sort(that.Compare("value"));
-              that.barList = arr.bar?.slice(0, 5);
-            }
-          }
-        },
-      });
-      this.API.requestData({
-        method: "GET",
-        baseURL: "http://10.155.32.14:9090/",
-        subUrl: "api/supervised/progress",
-        success(res) {
-          that.showTraining = true;
-          if (res) {
-            that.trainingFlag = res.value === -1 ? false : true;
-            that.width = res.value === -1 ? 0 : (res.value * 100).toFixed(2);
-            if (that.width < 100) {
-              setTimeout(() => {
-                that.handleTraining();
-              }, 1000);
-            } else {
-              if (!that.lastTraining) {
-                that.lastTraining = true;
-                that.handleTraining();
-              }
-            }
-          }
-        },
-      });
-    },
-    handleClose() {
-      this.barList = this.ceshiList.bar.slice(0, 5);
-    },
-    algorithmChange(val) {
-      this.chooseAlgorithm = this.algorithm.filter(
-        (item) => item.name === val
-      )[0].name;
-    },
-    // clear() {
-    //   this.chooseAlgorithm = '';
-    // },
-    Compare(property) {
-      return function (a, b) {
-        var value1 = a[property];
-        var value2 = b[property];
-        return value2 - value1;
-      };
-    },
-  },
-};
+	import Panel from "../../components/coms/panel/panel.vue";
+	import LineChart from "./components/lineChart.vue";
+	import BarChart from "./components/barChart.vue";
+	import SuperviseDataClassify from "./components/superviseDataClassify.vue";
+	import Records from "./components/records.vue";
+	import ChartDetails from "./components/chartDetails.vue";
+	import DetectionRecord from "./components/detectionRecord.vue";
+	export default {
+		components: {
+			Panel,
+			LineChart,
+			BarChart,
+			SuperviseDataClassify,
+			Records,
+			ChartDetails,
+			DetectionRecord,
+		},
+		created() {
+			if (this.timeValue.length === 0) {
+				let date = new Date();
+				this.timeValue[0] = date.getTime() - 86400000;
+				this.timeValue[1] = date.getTime();
+			}
+			let select = this.options.filter(
+				(item) => item.value === this.selectValue
+			)[0];
+			this.selectMoudle = select.station[0].lable;
+			this.moudleList = select.station;
+			this.getfaultLables();
+		},
+		data() {
+			return {
+				category: 0,
+				sjyArr: [{
+					value: 0,
+					label: '检修数据'
+				}, {
+					value: 1,
+					label: '手动打标签'
+				}, {
+					value: 2,
+					label: 'scada'
+				}, {
+					value: 3,
+					label: '有监督学习'
+				}],
+				myData: {},
+				dataList: [],
+				faultLists: [],
+				lossList: {},
+				accuracyList: {},
+				barList: [],
+				algorithm: [], //算法
+				chooseAlgorithm: "",
+				timeValue: [],
+				showBarList: [],
+				moudleList: [],
+				allData: [],
+				ceshiList: [],
+				detectionDisplay: false,
+				showTraining: false,
+				trainingFlag: false,
+				lastTraining: false,
+				display: false,
+				recordsDisplay: false,
+				detialsDisplay: false,
+				width: 60,
+				selectValue: "NSS_FDC",
+				selectMoudle: "UP82",
+				options: [{
+						value: "NSS_FDC",
+						label: "牛首山风电场",
+						station: [{
+							lable: "UP82",
+							value: "UP82",
+						}, ],
+					},
+					{
+						value: "MHS_FDC",
+						label: "麻黄山风电场",
+						station: [{
+								lable: "UP77",
+								value: "UP77",
+							},
+							{
+								lable: "UP105-2000-S",
+								value: "UP105-2000-S",
+							},
+						],
+					},
+					{
+						value: "QS_FDC",
+						label: "青山风电场",
+						station: [{
+								lable: "CCWE-1500",
+								value: "CCWE-1500",
+							},
+							{
+								lable: "UP105-2000-S",
+								value: "UP105-2000-S",
+							},
+						],
+					},
+					{
+						value: "SBQ_FDC",
+						label: "石板泉风电场",
+						station: [{
+								lable: "UP82",
+								value: "UP82",
+							},
+							{
+								lable: "UP97",
+								value: "UP97",
+							},
+							{
+								lable: "UP105-2000-S",
+								value: "UP105-2000-S",
+							},
+						],
+					},
+					{
+						value: "XS_FDC",
+						label: "香山风电场",
+						station: [{
+								lable: "UP97",
+								value: "UP97",
+							},
+							{
+								lable: "UP105-2000-S",
+								value: "UP105-2000-S",
+							},
+						],
+					},
+				],
+			};
+		},
+		mounted() {
+			let dataList = JSON.parse(
+				'{"ducumentName":"NNS-1637028563000","loss":[1.0882383584976196,1.067789912223816,1.0520573854446411,1.0380222797393799,1.0230460166931152,1.0070627927780151,0.9899255037307739,0.9736341238021851,0.9547672271728516,0.9341660737991333,0.9082227945327759,0.8833365440368652,0.8581799268722534,0.8310791254043579,0.8011142611503601,0.7700659036636353,0.7383494973182678,0.7076452970504761,0.6731187105178833,0.6390867829322815],"accuracy":[0.3047619163990021,0.37142857909202576,0.3619047701358795,0.3619047701358795,0.380952388048172,0.5809524059295654,0.6571428775787354,0.6571428775787354,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6761904954910278,0.6952381134033203,0.7333333492279053,0.7428571581840515],"val_loss":[1.0914311408996582,1.0727100372314453,1.0579898357391357,1.0469794273376465,1.0305122137069702,1.012723684310913,0.9997329115867615,0.9839586615562439,0.9610583782196045,0.9339884519577026,0.9096081256866455,0.8876619338989258,0.862886905670166,0.8299474120140076,0.793283998966217,0.7597811222076416,0.7229973673820496,0.6826366782188416,0.6449647545814514,0.6126752495765686],"val_accuracy":[0.2666666805744171,0.2666666805744171,0.2666666805744171,0.2666666805744171,0.4000000059604645,0.644444465637207,0.644444465637207,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.6666666865348816,0.7333333492279053,0.7555555701255798,0.7333333492279053],"bar":[{"name":"邮箱温度","value":0.3},{"name":"风速","value":0.25},{"name":"变桨","value":0.25},{"name":"有高","value":0.2}]}'
+			);
+			this.ceshiList = dataList;
+			this.lossList.loss = dataList.loss;
+			this.lossList.val_loss = dataList.val_loss;
+			this.accuracyList.accuracy = dataList.accuracy;
+			this.accuracyList.val_accuracy = dataList.val_accuracy;
+			this.barList = dataList.bar;
+			this.getType();
+		},
+		methods: {
+			getfaultLables() {
+				let that = this;
+				this.API.requestData({
+					method: "GET",
+					subUrl: "http://192.168.1.18:9002/know/fault/type/all",
+					success(res) {
+						if (res) {
+							that.faultLists = res.data;
+							that.getFaultList();
+						}
+					},
+				});
+			},
+			getType() {
+				let that = this;
+				this.API.requestData({
+					method: "GET",
+					baseURL: "http://10.155.32.14:9090/",
+					subUrl: "api/coordinate/algorithm",
+					data: {
+						type: 1,
+					},
+					success(res) {
+						if (res) {
+							that.algorithm = res;
+							that.chooseAlgorithm = res[0].name;
+						}
+					},
+				});
+			},
+			TypeClick(btnType) {
+				if (btnType === "sjfl") {
+					this.display = true;
+				} else if (btnType === "mxjl") {
+					this.showBarList.push(this.ceshiList);
+					this.recordsDisplay = true;
+				} else if (btnType === "jcjl") {
+					this.myData = {
+						station: this.selectValue,
+						model: this.selectMoudle,
+						st: new Date(this.timeValue[0]).formatDate("yyyy-MM-dd hh:mm:ss"),
+						et: new Date(this.timeValue[1]).formatDate("yyyy-MM-dd hh:mm:ss"),
+					};
+					this.detectionDisplay = true;
+				}
+			},
+			selectSearch() {
+				this.allData.forEach((item) => {
+					if (item.modelId.indexOf(this.selectMoudle) != -1) {
+						this.dataList.push(item);
+					}
+				});
+			},
+			search() {
+				let select = this.options.filter(
+					(item) => item.value === this.selectValue
+				)[0];
+				this.selectMoudle = select.station[0].lable;
+				this.moudleList = select.station;
+			},
+			showDetials() {
+				this.detialsDisplay = true;
+			},
+			getFaultList() {
+				this.dataList = [];
+				let that = this;
+				this.API.requestData({
+					method: "GET",
+					subUrl: "http://192.168.1.18:9002/case/fault/list",
+					data: {
+						station: this.selectValue,
+						model: this.selectMoudle,
+						st: new Date(this.timeValue[0]).formatDate("yyyy-MM-dd hh:mm:ss"),
+						et: new Date(this.timeValue[1]).formatDate("yyyy-MM-dd hh:mm:ss"),
+						category: this.category
+					},
+					success(res) {
+						if (res) {
+							that.allData = res.data;
+							res.data.forEach((item) => {
+								let array = that.dataList.filter(
+									(val) => val.code === item.faultcode
+								);
+								item.stationcn = that.options.filter(
+									(items) => items.value === item.stationen
+								)[0]?.label;
+								if (array.length > 0) {
+									array[0].children.push(item);
+								} else {
+									let obj = {
+										name: that.faultLists.filter(
+											(items) => items.faultcode === item.faultcode
+										)[0]?.faulttype,
+										code: item.faultcode,
+										children: [],
+									};
+									obj.children.push(item);
+									that.dataList.push(obj);
+								}
+							});
+						}
+					},
+				});
+			},
+			handleClick() {
+				this.lastTraining = false;
+				this.barList = [];
+				this.handleTraining();
+			},
+			handleTraining() {
+				let that = this;
+				that.resultList = [];
+				this.API.requestData({
+					method: "GET",
+					baseURL: "http://10.155.32.14:9090/",
+					subUrl: "api/supervised/",
+					success(res) {
+						if (res.value.length > 0) {
+
+							let arr = JSON.parse(res.value);
+							that.ceshiList = arr;
+
+							that.lossList.loss = arr.loss;
+							that.lossList.val_loss = arr.val_loss;
+							that.accuracyList.accuracy = arr.accuracy;
+							that.accuracyList.val_accuracy = arr.val_accuracy;
+							if (arr.bar) {
+								arr.bar = JSON.parse(arr.bar);
+								arr.bar?.sort(that.Compare("value"));
+								that.barList = arr.bar?.slice(0, 5);
+							}
+						}
+					},
+				});
+				this.API.requestData({
+					method: "GET",
+					baseURL: "http://10.155.32.14:9090/",
+					subUrl: "api/supervised/progress",
+					success(res) {
+						that.showTraining = true;
+						if (res) {
+							that.trainingFlag = res.value === -1 ? false : true;
+							that.width = res.value === -1 ? 0 : (res.value * 100).toFixed(2);
+							if (that.width < 100) {
+								setTimeout(() => {
+									that.handleTraining();
+								}, 1000);
+							} else {
+								if (!that.lastTraining) {
+									that.lastTraining = true;
+									that.handleTraining();
+								}
+							}
+						}
+					},
+				});
+			},
+			handleClose() {
+				this.barList = this.ceshiList.bar.slice(0, 5);
+			},
+			algorithmChange(val) {
+				this.chooseAlgorithm = this.algorithm.filter(
+					(item) => item.name === val
+				)[0].name;
+			},
+			// clear() {
+			//   this.chooseAlgorithm = '';
+			// },
+			Compare(property) {
+				return function(a, b) {
+					var value1 = a[property];
+					var value2 = b[property];
+					return value2 - value1;
+				};
+			},
+		},
+	};
 </script>
 <style lang="less" scoped>
-.dataTitle {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 20px;
-  margin-top: 10px;
+	.dataTitle {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+		margin-bottom: 20px;
+		margin-top: 10px;
+
+		.chooses {
+			display: flex;
+			flex-direction: row;
+			align-items: center;
+		}
+
+		.timeInput {
+			width: 30px;
+		}
+
+		.contents {
+			display: flex;
+			flex-direction: row;
+			align-items: center;
+			margin-left: 30px;
+		}
+	}
+
+	.faultTitle {
+		font-size: 18px;
+		margin-bottom: 20px;
+	}
+
+	.fault {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		flex-wrap: wrap;
+
+		.faultBlock {
+			width: 220px;
+			height: 90px;
+			border: 1px solid #05bb4c;
+			display: flex;
+			flex-direction: row;
+			align-items: center;
+			justify-content: space-between;
+			margin-right: 20px;
+			margin-bottom: 20px;
+
+			.left {
+				line-height: 19px;
+				margin-left: 10px;
+				font-size: 16px;
+			}
 
-  .chooses {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-  }
+			.right {
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				height: 100%;
+				border-left: 1px solid #05bb4c;
 
-  .timeInput {
-    width: 30px;
-  }
+				.imgs {
+					margin: 0px 10px;
+					width: 40px;
+					height: 40px;
+				}
+			}
+		}
+	}
 
-  .contents {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    margin-left: 30px;
-  }
-}
-.faultTitle {
-  font-size: 18px;
-  margin-bottom: 20px;
-}
-.fault {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  flex-wrap: wrap;
+	.bodys {
+		display: flex;
+		flex-direction: column;
+		overflow-y: auto;
+		height: 75vh;
+	}
 
-  .faultBlock {
-    width: 220px;
-    height: 90px;
-    border: 1px solid #05bb4c;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-    margin-right: 20px;
-    margin-bottom: 20px;
+	.none {
+		width: 100%;
+		display: flex;
+		justify-content: center;
+		margin-top: 150px;
+		color: #999999;
+	}
 
-    .left {
-      line-height: 19px;
-      margin-left: 10px;
-      font-size: 16px;
-    }
+	.results {
+		margin-left: 35px;
+	}
 
-    .right {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      height: 100%;
-      border-left: 1px solid #05bb4c;
-      .imgs {
-        margin: 0px 10px;
-        width: 40px;
-        height: 40px;
-      }
-    }
-  }
-}
-.bodys {
-  display: flex;
-  flex-direction: column;
-  overflow-y: auto;
-  height: 75vh;
-}
-.none {
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  margin-top: 150px;
-  color: #999999;
-}
-.results {
-  margin-left: 35px;
-}
-.box {
-  width: 80%;
-  margin-top: 20px;
-  height: 20px;
-  display: flex;
-  align-items: center;
+	.box {
+		width: 80%;
+		margin-top: 20px;
+		height: 20px;
+		display: flex;
+		align-items: center;
 
-  .progress {
-    background: linear-gradient(to right, #0d692c, #6df0a0);
-    height: 16px;
-    z-index: 1;
-  }
+		.progress {
+			background: linear-gradient(to right, #0d692c, #6df0a0);
+			height: 16px;
+			z-index: 1;
+		}
 
-  .line {
-    width: 1px;
-    height: 70px;
-    z-index: 2;
-    background: linear-gradient(
-      to bottom,
-      rgba(158, 151, 151, 0) 0%,
-      rgba(0, 0, 0, 0) 10%,
-      rgba(255, 255, 255, 0.3) 20%,
-      rgba(255, 255, 255, 0.6) 30%,
-      rgba(255, 255, 255, 0.8) 40%,
-      rgba(255, 255, 255, 1) 50%,
-      rgba(255, 255, 255, 0.8) 60%,
-      rgba(255, 255, 255, 0.6) 70%,
-      rgba(255, 255, 255, 0.3) 80%,
-      rgba(0, 0, 0, 0) 90%,
-      rgba(0, 0, 0, 0) 100%
-    );
-    transition: width 0.2s linear;
-  }
+		.line {
+			width: 1px;
+			height: 70px;
+			z-index: 2;
+			background: linear-gradient(to bottom,
+					rgba(158, 151, 151, 0) 0%,
+					rgba(0, 0, 0, 0) 10%,
+					rgba(255, 255, 255, 0.3) 20%,
+					rgba(255, 255, 255, 0.6) 30%,
+					rgba(255, 255, 255, 0.8) 40%,
+					rgba(255, 255, 255, 1) 50%,
+					rgba(255, 255, 255, 0.8) 60%,
+					rgba(255, 255, 255, 0.6) 70%,
+					rgba(255, 255, 255, 0.3) 80%,
+					rgba(0, 0, 0, 0) 90%,
+					rgba(0, 0, 0, 0) 100%);
+			transition: width 0.2s linear;
+		}
 
-  .unprogress {
-    background: linear-gradient(to right, #41acec, #003e7a);
-    height: 16px;
-    z-index: 1;
-  }
-}
-</style>
+		.unprogress {
+			background: linear-gradient(to right, #41acec, #003e7a);
+			height: 16px;
+			z-index: 1;
+		}
+	}
+</style>

src/views/specific/ztfx.vue

@@ -1806,7 +1806,7 @@ export default {
         },
       });
     },
-    getMonthList(showLoading) {
+    async getMonthList(showLoading) {
       let _this = this;
       let months = "";
       if (typeof this.monthValue === "string") {
@@ -1814,7 +1814,7 @@ export default {
       } else {
         months = this.monthChange(this.monthValue);
       }
-      _this.API.requestData({
+      await _this.API.requestData({
         showLoading,
         method: "GET",
         baseURL: "http://10.155.32.4:8034",