update

src/components/BasicInformationDetail.vue

@@ -87,33 +87,25 @@
           </div>
         </div>
         <div class="records">
-          <el-scrollbar style="height:99%;">
-            <div class="tables">
-                <el-table :data="recordData" class="table" style=" width:100%" height="22vh" :header-cell-style="{
-                    background: 'rgb(30,30,30)',
-                    color: 'rgb(220,220,220)',
-                    padding: '4px',
-                    fontSize: '14px',
-                    'border-bottom': 'solid 1px rgba(77, 77, 77, 1)',
-                  }" :cell-style="{
-                    height: '40px',
-                    background: 'rgb(30,30,30)',
-                    color: 'rgb(220,220,220)',
-                    padding: '3px',
-                    fontSize: '12px',
-                    'border-bottom': '1px solid #000000'
-                  }">
-                    <el-table-column prop="time" label="日期" width="120" align="center">
-                    </el-table-column>
-                    <el-table-column prop="controls" label="控制命令" width="120" align="center">
-                    </el-table-column>
-                    <el-table-column prop="result" label="操作结果" align="center">
-                    </el-table-column>
-                    <el-table-column prop="userName" label="操作人" width="120" align="center">
-                    </el-table-column>
-                </el-table>
-            </div>
-        </el-scrollbar>
+          <div class="recordList">
+            <el-scrollbar class="recordsScorll">
+              <el-table stripe="true" border-color="#141414" :data="recordData" style="width: 100%" :header-cell-style="{
+            background: '#141414',
+            color: '#B3B3B3',
+            'border-bottom':'solid 1px #242424',
+            'text-align':'center'
+          }" :cell-style="{ background: '#141414', color: '#B3B3B3', 'border-bottom': 'solid 1px #242424','text-align':'center' }">
+                <el-table-column prop="time" label="日期" width="120" align="center">
+                </el-table-column>
+                <el-table-column prop="controls" label="控制命令" width="120" align="center">
+                </el-table-column>
+                <el-table-column prop="result" label="操作结果" align="center">
+                </el-table-column>
+                <el-table-column prop="userName" label="操作人" width="120" align="center">
+                </el-table-column>
+              </el-table>
+            </el-scrollbar>
+          </div>
         </div>
         <div class="showDate">
           <div class="label1">
@@ -141,7 +133,7 @@
     <el-row class="datas">
       <el-col :span="12">
         <div class="dataList">
-          <div class="dataTitle">
+          <div class="dataTitles">
             <div style="margin-left: 24px;">部件主要参数</div>
           </div>
           <div class="dataContent">
@@ -157,7 +149,7 @@
       </el-col>
       <el-col :span="12">
         <div class="dataLists">
-          <div class="dataTitle">
+          <div class="dataTitles">
             <div style="margin-left: 24px;">报警记录</div>
           </div>
           <el-scrollbar class="scorll">
@@ -214,13 +206,8 @@
 
     data() {
       return {
-        // warnList: [],
         display: false,
         BasicInfo: {},
-        // temperatureInfo: new Array() /* 温度信息 */,
-        // pitchInfo: new Array() /* 变桨信息 */,
-        // generalInfo: new Array() /* 基本信息 */,
-        // powerGridInfo: new Array() /* 电网信息 */,
         restaurants: [],
         lockValues: [],
         windDetails: [],
@@ -294,10 +281,9 @@
             this.healthInfo = msg.data.data;
           }
 
-        })
-          .catch(err => {
-            console.log(err);
-          });
+        }).catch(err => {
+          console.log(err);
+        });
       },
       getDetial() {
         api.getDetial(this.windturbine.windturbineId).then(msg => {
@@ -351,7 +337,7 @@
           }
         })
       },
-      getWarning() {
+      async getWarning() {
         let parts = ''
         switch (this.showIndex) {
           case 1:
@@ -370,7 +356,7 @@
             parts = 'yy'
             break;
         }
-        api.getWarning(this.windturbine.stationId, this.windturbine.windturbineId, parts).then(msg => {
+        await api.getWarning(this.windturbine.stationId, this.windturbine.windturbineId, parts).then(msg => {
           if (msg.data.code === 200) {
             msg.data.data && msg.data.data.forEach(item => {
               item.time = dayjs(item.time).format('MM-DD HH:mm:ss')
@@ -378,32 +364,31 @@
             this.warning = msg.data.data;
           }
 
-        })
-          .catch(err => {
-            console.log(err);
-          });
-      },
-      chooseInfo(value) {
-        this.showIndex = value
-        switch (this.showIndex) {
-          case 1:
-            this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part6")[0]?.param
-            break;
-          case 2:
-            this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part8")[0]?.param
-            break;
-          case 3:
-            this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part7")[0]?.param
-            break;
-          case 4:
-            this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part10")[0]?.param
-            break;
-          case 5:
-            this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part9")[0]?.param
-            break;
-        }
-        this.getWarning()
+        }).catch(err => {
+          console.log(err);
+        });
       },
+      // chooseInfo(value) {
+      //   this.showIndex = value
+      //   switch (this.showIndex) {
+      //     case 1:
+      //       this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part6")[0]?.param
+      //       break;
+      //     case 2:
+      //       this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part8")[0]?.param
+      //       break;
+      //     case 3:
+      //       this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part7")[0]?.param
+      //       break;
+      //     case 4:
+      //       this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part10")[0]?.param
+      //       break;
+      //     case 5:
+      //       this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === "part9")[0]?.param
+      //       break;
+      //   }
+      //   this.getWarning()
+      // },
       listedChange() {
         switch (this.selectValue) {
           case '8':
@@ -453,9 +438,7 @@
       refreshData() {
         let bg = BackgroundData.getInstance();
         let mark = BackgroundData.getInstance().Marks;
-        console.log(mark);
         bg.initWinturbineBaseData(this.BasicInfo, this.onMessage);
-
       },
 
       /* 获得数据 */
@@ -504,25 +487,6 @@
       //     }
       //   });
       // },
-      querySearch(queryString, cb) {
-        let restaurants = this.restaurants;
-        let results = queryString
-          ? restaurants.filter(this.createFilter(queryString))
-          : restaurants;
-        // 调用 callback 返回建议列表的数据
-        cb(results);
-      },
-      createFilter(queryString) {
-        return (restaurant) => {
-          return (
-            restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
-            0
-          );
-        };
-      },
-      handleSelect(item) {
-        console.log(item);
-      },
       selectSvg(index) {
         this.showIndex = index;
         // this.showData = this.BasicInfo.BasicInfo.filter(item => item.index === `part${this.showIndex+5}`)[0]?.param
@@ -630,7 +594,6 @@
       },
       /* 控制成功 */
       controlSuccess(msg) {
-        console.log(msg);
         let mss = '';     // 信息
         let iserror = false;// 是否有控制错误的风机
         for (let v in msg.data) {
@@ -968,7 +931,7 @@
     flex-direction: column;
   }
 
-  .dataTitle {
+  .dataTitles {
     display: flex;
     height: 37px;
     width: 100%;
@@ -1021,7 +984,7 @@
   }
 
   .scorll {
-    height: 212px;
+    height: 23vh;
   }
 
   .showDate {
@@ -1030,9 +993,12 @@
     justify-content: space-between;
     align-items: center;
   }
+
   .el-table {
-        background-color: #141414 !important;
-    }
+    background-color: #141414 !important;
+    min-height: 22vh !important;
+  }
+
   .el-table::before {
     width: 0;
   }
@@ -1078,9 +1044,14 @@
     height: 16px;
     margin-left: 10px;
   }
-  .records{
+
+  .recordList {
     width: 98%;
     height: 22vh;
     margin-top: 16px;
   }
+
+  .recordsScorll {
+    height: 22vh;
+  }
 </style>

src/components/WindturbineDetailPages.vue

@@ -30,46 +30,6 @@
 					<div>{{baseDate.generatorSpeed.value}}{{baseDate.generatorSpeed.unit}}</div>
 				</div>
 			</div>
-			<!-- <table style="border-bottom: 1px solid #242424;" width="99.8%">
-				<tr>
-					<td style="width: 20%;">
-						<div class="chunkdiv">
-							<div class="title">风机号：&emsp;</div>
-							<div>{{ windturbine.windturbineId }}</div>
-						</div>
-					</td>
-					<td style="width: 20%;">
-						<div class="chunkdiv" @dblclick="dbClicks(baseDate.windSpeed)">
-							<div class="title">{{baseDate.windSpeed.name}}：&emsp;</div>
-							<div>{{baseDate.windSpeed.value}}{{baseDate.windSpeed.unit}}</div>
-						</div>
-					</td>
-					<td style="width: 20%;">
-						<div class="chunkdiv" @dblclick="dbClicks({code: 'YDPJFS5M',name: '五分钟平均风速'})">
-							<div class="title">五分钟平均风速：&emsp;</div>
-							<div>{{healthInfo?.averageWindSpeed5?.toFixed(2)}}m/s</div>
-						</div>
-					</td>
-					<td style="width: 20%;">
-						<div class="chunkdiv" @dblclick="dbClicks(theoreticalPower)">
-							<div class="title">理论功率：&emsp;</div>
-							<div>{{healthInfo?.theoreticalPower?.toFixed(2)}}Kw</div>
-						</div>
-					</td>
-					<td style="width: 20%;">
-						<div class="chunkdiv" @dblclick="dbClicks(baseDate.power)">
-							<div class="title">{{baseDate.power.name}}：&emsp;</div>
-							<div>{{baseDate.power.value}}{{baseDate.power.unit}}</div>
-						</div>
-					</td>
-					<td style="width: 20%;">
-						<div class="chunkdiv" @dblclick="dbClicks(baseDate.generatorSpeed)">
-							<div class="title">{{baseDate.generatorSpeed.name}}：&emsp;</div>
-							<div>{{baseDate.generatorSpeed.value}}{{baseDate.generatorSpeed.unit}}</div>
-						</div>
-					</td>
-				</tr>
-			</table> -->
 			<BasicInformationDetail ref="BasicInfo" :types="types" @health-click="handleHealth" :windturbine="windturbine"></BasicInformationDetail>
 		</div>
 	</el-dialog>

src/components/basicDataDetails.vue

@@ -23,7 +23,7 @@
             <div class="dataTitle">
                 <div class="operate">
                     <el-date-picker class="picker" @change="changes" v-model="timeValue" type="datetimerange"
-                    range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
+                        range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
                     </el-date-picker>
                     <div class="buttons" @click="search()">查询</div>
                 </div>
@@ -60,13 +60,13 @@
             if ((this.timeValue[1] - this.timeValue[0]) <= 86400000) {
                 this.datas.map(item => {
                     this.xdata.push(dayjs(item.ts).format('HH:mm'))
-                    this.values.push(item.doubleValue?item.doubleValue.toFixed(2):item.doubleValue===0?item.doubleValue:item.longValue)
+                    this.values.push(item.doubleValue ? item.doubleValue.toFixed(2) : item.doubleValue === 0 ? item.doubleValue : item.longValue)
                 })
                 console.log(this.values)
             } else {
                 this.datas.map(item => {
                     this.xdata.push(dayjs(item.ts).format('MM-DD HH:mm'))
-                    this.values.push(item.doubleValue?item.doubleValue.toFixed(2):item.doubleValue===0?item.doubleValue:item.longValue)
+                    this.values.push(item.doubleValue ? item.doubleValue.toFixed(2) : item.doubleValue === 0 ? item.doubleValue : item.longValue)
                 })
             }
             this.getEcharts()
@@ -163,25 +163,20 @@
                 // 下载的路径
                 let fileName = `${this.partsName}.xlsx`
                 let filePath = '/root/' + fileName
-
                 // 新建workbook
                 const wb = XLSX.utils.book_new()
-
                 // 新建worksheet，并载入数据
                 const ws = XLSX.utils.json_to_sheet(data)
-
                 // 设置每列的列宽，10代表10个字符，注意中文占2个字符
                 ws['!cols'] = [
                     { wch: 30 },
                     { wch: 30 },
                 ]
-
                 // 生成xlsx文件(workbook，worksheet数据，sheet命名)
                 XLSX.utils.book_append_sheet(wb, ws, 'Sheet1')
 
                 // 写文件(workbook，xlsx文件路径+文件名)
                 XLSX.writeFile(wb, filePath)
-                // XLSX.writeFile(wb, "/root/ceshi.xlsx")
                 this.$message({
                     showClose: true,
                     message: '下载成功',
@@ -190,7 +185,6 @@
                 });
             },
             getEcharts() {
-                console.log(document.getElementById(this.echartsId));
                 let chartDom = document.getElementById(this.echartsId);
                 let myChart = echarts.init(chartDom, '#ffffff');
                 let option;
@@ -252,14 +246,13 @@
                         type: 'line'
                     }]
                 };
-
                 option && myChart.setOption(option);
             },
             closed() {
                 this.chooseTime = []
                 this.timeValue = []
-                this.switchFlag = false,
-                    this.selectValue = '60'
+                this.switchFlag = false
+                this.selectValue = '60'
                 this.$emit('closed');
             },
         },
@@ -277,13 +270,16 @@
         color: #FFFFFF;
         height: 40px;
     }
-    .titles{
+
+    .titles {
         font-size: 16px;
         color: #FFFFFF;
     }
-    .el-dialog__body{
+
+    .el-dialog__body {
         padding: 30px 10px 10px 10px;
     }
+
     .bodys {
         display: flex;
         flex-direction: column;
@@ -319,9 +315,11 @@
         border: none;
         color: #ffffff !important;
     }
-    .el-input__inner{
+
+    .el-input__inner {
         background-color: rgba(26, 26, 26, 1) !important;
     }
+
     .el-date-editor .el-range-separator {
         color: #ffffff !important;
     }
@@ -397,6 +395,7 @@
         border-top-left-radius: 12.5px;
         border-bottom-left-radius: 12.5px;
     }
+
     .interval_on {
         width: 50%;
         height: 100%;
@@ -408,6 +407,7 @@
         border-top-left-radius: 12.5px;
         border-bottom-left-radius: 12.5px;
     }
+
     .original {
         width: 50%;
         height: 100%;
@@ -418,6 +418,7 @@
         border-top-right-radius: 12.5px;
         border-bottom-right-radius: 12.5px;
     }
+
     .original_on {
         width: 50%;
         height: 100%;
@@ -429,6 +430,7 @@
         border-top-right-radius: 12.5px;
         border-bottom-right-radius: 12.5px;
     }
+
     .inputs {
         border: none;
         width: 110px !important;