Przeglądaj źródła

'风机绩效榜更改'

蒋珅 1 rok temu
rodzic
commit
c15e2baa5b

+ 1 - 0
package.json

@@ -34,6 +34,7 @@
     "jszip-utils": "^0.1.0",
     "papaparse": "^5.3.1",
     "pizzip": "^3.1.4",
+    "sortable.js": "^0.3.0",
     "stompjs": "^2.3.3",
     "three": "^0.129.0",
     "three-collada-loader": "^0.0.1",

+ 133 - 1
src/components/coms/table/table3.vue

@@ -3,12 +3,13 @@
     class="custom-table"
     stripe
     :data="data.data"
+    row-key="id" 
     :height="height"
     style="width: 100%"
     @cell-click="onClick"
     v-if="data && data.data"
   >
-    <el-table-column
+    <el-table-column 
       v-for="col in data.column"
       :key="col"
       :prop="col.field"
@@ -23,6 +24,7 @@
       :align="'center'"
       :resizable="col.resizable"
       :header-align="'center'"
+      sortable
     >
       <template v-if="col.slot == true" #default="item">
         <slot
@@ -48,6 +50,8 @@
 </template>
 
 <script>
+import { moveArr } from './util'
+import Sortable from 'sortablejs';
 export default {
   // 名称
   name: "ComTable",
@@ -105,15 +109,94 @@ export default {
   data() {
     return {
       currentPage: 1,
+       tableData: {
+        column: [
+          {
+            name: "风机编号",
+            field: "name",
+          },
+          {
+            name: "主轴温度温差大于8度",
+            field: "v1",
+            align: "left",
+            slot: true,
+          },
+          {
+            name: "浆叶角过小",
+            field: "v2",
+            align: "left",
+            slot: true,
+          },
+        ],
+        data: [
+          {
+            name: "MG01_01",
+            v1: {
+              count: 12,
+              time: 0,
+            },
+          },
+        ],
+      },
+       columnObj: [
+        {
+          name: "风机编号",
+          field: "name",
+          width: "100px",
+          minWidth: "100px",
+        },
+        {
+          name: "风机偏航过程震动",
+          field: "风机偏航过程震动",
+          align: "left",
+          slot: true,
+          sortable: true,
+          minWidth: "200px",
+        },
+        {
+          name: "齿轮箱轴承温升超过40度",
+          field: "齿轮箱轴承温升超过40度",
+          align: "left",
+          slot: true,
+          sortable: true,
+          minWidth: "200px",
+        },
+        {
+          name: "三相电流不平衡",
+          field: "三相电流不平衡",
+          align: "left",
+          slot: true,
+          sortable: true,
+          minWidth: "200px",
+        },
+        {
+          name: "断轴或联轴器打滑",
+          field: "断轴或联轴器打滑",
+          align: "left",
+          slot: true,
+          sortable: true,
+          minWidth: "200px",
+        },
+        {
+          name: "风速突变",
+          align: "left",
+          field: "风速突变",
+          slot: true,
+          sortable: true,
+          minWidth: "200px",
+        },
+      ],
     };
   },
   computed: {
     tableData() {
+      
       let that = this;
       if (this.sortCol == "") {
         return this.data.data;
       } else {
         let data = this.data.data;
+        // console.log('data',this.data.data);
 
         data.sort((a, b) => {
           let rev = 1;
@@ -151,6 +234,48 @@ export default {
   },
   // 函数
   methods: {
+     //行拖拽
+    rowDrop() {
+            let that = this;
+            // 首先获取需要拖拽的dom节点
+            const el1 = document.querySelectorAll('.el-table__body-wrapper')[0].querySelectorAll('table > tbody')[0];
+            Sortable.create(el1, {
+                disabled: false, // 是否开启拖拽
+                ghostClass: 'sortable-ghost', //拖拽样式
+                animation: 150, // 拖拽延时,效果更好看
+                group: { // 是否开启跨表拖拽
+                    pull: false,
+                    put: false
+                },
+                onEnd: (e) => {
+                    // 这里主要进行数据的处理,拖拽实际并不会改变绑定数据的顺序,这里需要自己做数据的顺序更改
+                    console.log(e);
+                }
+            });
+        },
+        //列拖拽
+    columnDrop() {
+            const wrapperTr = document.querySelector('.el-table__header-wrapper tr')
+            this.sortable = Sortable.create(wrapperTr, {
+                animation: 180,
+                delay: 0,
+                onEnd: evt => {
+                    console.log(evt.oldIndex,evt.newIndex);
+                    if (evt.oldIndex === evt.newIndex) return;
+                    //表头排序
+                    // 这里-2是因为表格头前两列是上面HTML中自己定义的序号列和勾选列,tableHeader数据中没有定义该两列,所以操作数组的时候要排除掉这两项
+                    moveArr(this.columnObj, evt.newIndex-2, evt.oldIndex-2)
+                    // const oldItem = this.columnObj[evt.oldIndex];
+                    // const newItem = this.columnObj[evt.newIndex];
+                    // this.$set(this.columnsConfig, evt.newIndex, oldItem);
+                    // this.$set(this.columnsConfig, evt.oldIndex, newItem);
+                }
+            })
+        },
+  
+     
+
+
     onClick(row, column, cell, event) {
       if (column.rawColumnKey.click) column.rawColumnKey.click(event, row);
     },
@@ -177,6 +302,13 @@ export default {
   },
   mounted() {
     // 渲染后
+    this.$nextTick(()=>{
+      setTimeout(()=>{
+      this.rowDrop();
+      this.columnDrop();
+      },100)
+    })
+       
   },
   beforeUpdate() {},
   updated() {},

+ 8 - 0
src/components/coms/table/util.js

@@ -0,0 +1,8 @@
+//移动数组元素至某个指定位置
+export function moveArr(arr, newIndex, oldIndex) {
+    // console.log('arr', arr, oldIndex, newIndex);
+    arr.splice(newIndex, 0, arr.splice(oldIndex, 1)[0])
+        /** splice 会更改原来数组的数据 */
+        /**  list.splice(oldIndex, 1)[0] 删除旧数据位置返回删除的数据 */
+        /** list.splice(newIndex, 0, old)  相当于把删除的旧数据插入到新的位置上去 */
+}

+ 9 - 9
src/views/Decision/Decision1.vue

@@ -341,10 +341,10 @@ import { cacher } from '@antv/x6/lib/util/function/function';
 				var date = new Date();
 				var year = date.getFullYear(),
 					month = date.getMonth() + 1,
-					day = date.getDate();
+					day = date.getDate()-1;
 				month >= 1 && month <= 9 ? (month = "0" + month) : "";
 				day >= 0 && day <= 9 ? (day = "0" + day) : "";
-				var begin = year + "-" + month + "-01";
+				var begin = year + "-" + month +"-" + day;
 				var end = year + "-" + month + "-" + day;
 				if (val == 1) {
 					return begin;
@@ -386,11 +386,11 @@ import { cacher } from '@antv/x6/lib/util/function/function';
 							});
 						})
 				},
-				fail(error){
-					console.log('01',error);
-					that.nbdata=null
-				}
-                  },)
+				// fail(error){
+				// 	console.log('01',error);
+				// 	that.nbdata=null
+				// }
+                  })
 				that.API.requestData({
 					method: "GET",
 					baseURL: "http://10.155.32.4:9001/",
@@ -407,7 +407,7 @@ import { cacher } from '@antv/x6/lib/util/function/function';
 					},
 					success(res) {
 						console.log('666',res);
-						if(that.nbdata!=null){
+						// if(that.nbdata!=null){
 							res.data.forEach((item1)=>{
                             that.nbdata.forEach((item2)=>{
 							if(item1.name === item2.uniformCode){
@@ -423,7 +423,7 @@ import { cacher } from '@antv/x6/lib/util/function/function';
 							}
 							})
 							})
-							}
+							// }
 						var name = [],
 							data = [],
 							llfdl = [],

+ 1 - 0
src/views/Home/Home.vue

@@ -1429,6 +1429,7 @@ export default {
         },
         success(res) {
           console.log(123,res);
+          console.log('bba',res);
           that.dialogShow = true;
           that.dialogData = res.data;
           that.dialogType = dialogType;

+ 46 - 5
src/views/NewPages/alarm-center-1.vue

@@ -62,7 +62,8 @@
         </div>
         <div class="query-actions">
           <button class="btn green" @click="searchData">搜索</button>
-          <button class="btn green" @click="searchTree">筛选</button>
+          <button class="btn" @click="searchTree">筛选</button>
+          <button class="btn" @click="exportExcel()">导出</button>
           <!-- <button class="btn green" @click="fx">分析</button> -->
         </div>
       </div>
@@ -144,6 +145,7 @@ import Table3 from "../../components/coms/table/table3.vue";
 import MultipleYLineChartNormal from "./multiple-y-line-chart-normal.vue";
 import FX from "./alarm-center-yjfx.vue";
 import BASE from "@tools/basicTool.js";
+import XLSX from 'xlsx'
 export default {
   components: {
     Panel3,
@@ -153,6 +155,7 @@ export default {
   },
   data() {
     return {
+      nb:[],
       dialogTitleFX: "",
       dialogVisibleFX: false,
       dialogTitle: "",
@@ -576,8 +579,8 @@ export default {
           enddate: enddate,
         },
       });
-
-      ////////
+      console.log('123',data);
+      this.nb=data.data
       this.tableData = [];
       const resData = data.data;
       // const resData =this.resdata;
@@ -610,8 +613,8 @@ export default {
 
       this.tableData.column = column;
       this.tableData.data = dataAll;
-
-      ///////////////////// 获取规则list
+      console.log('表头',this.tableData.column);
+      console.log('表格数据',this.tableData.data);
       const map = {};
       var windNum = [];
       for (let i in resData) {
@@ -676,6 +679,44 @@ export default {
       this.dialogTitleFX = "预警分析";
       this.dialogVisibleFX = true;
     },
+    exportExcel() {
+     let that = this;
+      const headers = ['机组编号', '报警描述', '数量', '时间(m)']
+      var resultArray = [];
+ for (var i = 0; i < that.nb.length; i++) {
+  var obj = that.nb[i];
+  for (var key in obj) {
+    if (Array.isArray(obj[key])) {
+      var innerArray = obj[key];
+      for (var j = 0; j < innerArray.length; j++) {
+        var innerObj = innerArray[j];
+        // 在这里处理最里面的数据
+        var alertText = innerObj.alertText;
+        var count = innerObj.count;
+        var windturbineId = innerObj.windturbineId;
+        var time = innerObj.time;
+        // 其他属性的处理...
+        console.log(windturbineId,alertText, count,time);
+         resultArray.push({
+          windturbineId: windturbineId,
+          alertText: alertText,
+          count: count,
+          time: time
+        });
+        console.log('resultArray',resultArray);
+      }
+    }
+  }
+}
+
+      const data = resultArray.map(item => [item.windturbineId, item.alertText, item.count, item.time])
+      const worksheet = XLSX.utils.aoa_to_sheet([headers, ...data])
+      const workbook = XLSX.utils.book_new()
+      XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1')
+      XLSX.writeFile(workbook, '报警描述.xlsx')
+
+    }
+      
   },
 };
 </script>

+ 2 - 2
src/views/sisView/index.vue

@@ -285,7 +285,7 @@
           <div class="itemNum">{{ items.hzjgl }}</div>
           <div class="itemUnit">MW</div>
         </div>
-         <div class="contentItem">
+         <!-- <div class="contentItem">
           <div class="itemName">埃发电量</div>
           <div class="itemNum">{{ little.akfdl }}</div>
           <div class="itemUnit">万kWh</div>
@@ -295,7 +295,7 @@
           <div class="itemName">埃功率</div>
           <div class="itemNum">{{ items.akgl }}</div>
           <div class="itemUnit">MW</div>
-        </div>
+        </div> -->
       </div>
     </div>
   </div>