Kaynağa Gözat

设备报表接口联调

fujunwen 4 yıl önce
ebeveyn
işleme
ea20d5a292

+ 4 - 2
src/App.vue

@@ -228,7 +228,8 @@ body {
   }
   }
 }
 }
 // element表头背景颜色修改
 // element表头背景颜色修改
-.core-device-report{
+.core-device-report,
+.specification-update-record{
   .el-table thead th{
   .el-table thead th{
     background-color: #F8F9FA;
     background-color: #F8F9FA;
   }
   }
@@ -237,7 +238,8 @@ body {
   }
   }
 }
 }
 // 说明书更新记录 element 时间控件样式重写
 // 说明书更新记录 element 时间控件样式重写
-.specification-update-record{
+.specification-update-record,
+.core-device-report{
   .el-input__inner{
   .el-input__inner{
     height: 32px;
     height: 32px;
     line-height: 32px;
     line-height: 32px;

+ 11 - 0
src/api/coreDeviceReport.js

@@ -0,0 +1,11 @@
+// 核心设备报表 接口
+import httputils from "@/api/httputils";
+
+// 系统列表
+export function queryEquipmentList() {
+  return httputils.getJson(`/data/data/v_glsms_systemcfg/querySmsxt`);
+}
+// 表数据
+export function queryTableData(url, postParams) {
+  return httputils.postJson(url, postParams);
+}

+ 2 - 0
src/api/specificationUpdateRecord.js

@@ -0,0 +1,2 @@
+// 说明说更新记录 接口
+import httputils from "@/api/httputils";

+ 137 - 37
src/views/analysis/CoreDeviceReport.vue

@@ -8,20 +8,20 @@
         :isReadOnly="true" 
         :isReadOnly="true" 
         tipPlace="top" 
         tipPlace="top" 
         caption="系统名称:"
         caption="系统名称:"
-        @change="testClick" 
+        @change="changeCurSystem" 
         v-model="systemName" 
         v-model="systemName" 
-        :selectdata="systemList" 
+        :selectdata="systemList"
         :placeholder="'请选择'"
         :placeholder="'请选择'"
       />
       />
       <div class="system-content">
       <div class="system-content">
-        <div v-for="(item) in systemContentData" :key="'key_' + item.id" class="item-content" :class="{'active': item.isActive}">
+        <div v-for="(item) in systemContentData" :key="'key_' + item.id" class="item-content" :class="{'active': item.isActive}" @click="changeEquipment(item.id)">
           <div class="first-row">
           <div class="first-row">
             <div>{{item.name}}</div>
             <div>{{item.name}}</div>
             <div>{{item.isMaintenance?'维保中' : ''}}</div>
             <div>{{item.isMaintenance?'维保中' : ''}}</div>
           </div>
           </div>
           <div class="sec-row">
           <div class="sec-row">
             <div>{{item.num}}<span>台</span></div>
             <div>{{item.num}}<span>台</span></div>
-            <div :class="{'abnormal': item.abnormal}">{{item.status}}</div>
+            <span :class="{'abnormal': item.abnormal}">{{item.statusNum !== 0?item.statusNum : ''}}</span>
           </div>
           </div>
         </div>
         </div>
       </div>
       </div>
@@ -31,18 +31,34 @@
         <Input iconType="search" v-model="searchKey" placeholder="搜索" width="192"/>
         <Input iconType="search" v-model="searchKey" placeholder="搜索" width="192"/>
       </div>
       </div>
       <el-table :data="tableData" style="width: 100%;margin-bottom: 63px;" @row-click="showEquipmentStatus">
       <el-table :data="tableData" style="width: 100%;margin-bottom: 63px;" @row-click="showEquipmentStatus">
-        <el-table-column prop="serialNumber" label="序号"></el-table-column>
-        <el-table-column prop="equipmentName" label="设备简称"></el-table-column>
-        <el-table-column prop="equipmentNumber" label="设备编号"></el-table-column>
-        <el-table-column prop="status" label="状态"></el-table-column>
-        <el-table-column prop="photo" label="照片"></el-table-column>
-        <el-table-column prop="report" label="报告"></el-table-column>
+        <el-table-column label="序号" type="index" :index="indexMethod"></el-table-column>
+        <el-table-column prop="sbjc" label="设备简称"></el-table-column>
+        <el-table-column prop="assetnum" label="设备编号"></el-table-column>
+        <el-table-column prop="is_exception" label="状态">
+          <template slot-scope="scope">
+            <span style="display: inline-block;width: 6px;height:6px;border-radius: 3px;background: #0091FF;" :style="{'background': !scope.row.is_exception?'#0091FF' : '#F54E45'}"></span>
+            <span style="margin-left: 10px">{{ !scope.row.status?'正常' : '异常' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="photos_num" label="照片">
+          <template slot-scope="scope">
+            <span style="color: #025BAA">{{ scope.row.photos_num?scope.row.photos_num : 0 }}张</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="report" label="报告">
+          <template slot-scope="scope">
+            <span style="color: #025BAA">{{ scope.row.report }}</span>
+          </template>
+        </el-table-column>
       </el-table>
       </el-table>
       <div class="page">
       <div class="page">
         <el-pagination
         <el-pagination
           background
           background
           layout="prev, pager, next"
           layout="prev, pager, next"
-          :total="tatol">
+          :total="tatol"
+          :current-page="curPage"
+          :page-size="pageSize"
+          @current-change="changeTablePage">
         </el-pagination>
         </el-pagination>
       </div>
       </div>
       <el-dialog title="交换机-照明系统" :visible.sync="dialogTableVisible">
       <el-dialog title="交换机-照明系统" :visible.sync="dialogTableVisible">
@@ -58,8 +74,16 @@
           <el-table-column property="serialNumber" label="日期"></el-table-column>
           <el-table-column property="serialNumber" label="日期"></el-table-column>
           <el-table-column property="equipmentName" label="事项类型"></el-table-column>
           <el-table-column property="equipmentName" label="事项类型"></el-table-column>
           <el-table-column property="equipmentNumber" label="事项名称"></el-table-column>
           <el-table-column property="equipmentNumber" label="事项名称"></el-table-column>
-          <el-table-column property="photo" label="照片"></el-table-column>
-          <el-table-column property="report" label="报告"></el-table-column>
+          <el-table-column property="photos_num" label="照片">
+            <template slot-scope="scope">
+              <span style="color: #025BAA">{{ scope.row.photos_num?scope.row.photos_num : 0 }}张</span>
+            </template>
+          </el-table-column>
+          <el-table-column property="report" label="报告">
+            <template slot-scope="scope">
+              <span style="color: #025BAA">{{ scope.row.report }}</span>
+            </template>
+          </el-table-column>
         </el-table>
         </el-table>
         <div class="page">
         <div class="page">
           <el-pagination
           <el-pagination
@@ -75,25 +99,29 @@
 
 
 <script>
 <script>
 import { Select, Input } from 'meri-design';
 import { Select, Input } from 'meri-design';
+import { queryEquipmentList, queryTableData } from '../../api/coreDeviceReport';
+import _ from 'lodash';
 export default {
 export default {
   data () {
   data () {
     return {
     return {
       systemName: '', // 系统名称
       systemName: '', // 系统名称
       systemList: [], // 系统
       systemList: [], // 系统
       systemContentData: [
       systemContentData: [
-        {id: 1, name: '高压配电柜', isMaintenance: true, num: 95, status: '正常', abnormal: false, isActive: true},
-        {id: 2, name: '变压器', isMaintenance: false, num: 256, status: '异常: 323', abnormal: true, isActive: false},
-        {id: 3, name: '低压配电柜', isMaintenance: false, num: 354, status: '正常', abnormal: false, isActive: false},
-        {id: 4, name: '直流屏', isMaintenance: false, num: 175, status: '正常', abnormal: false, isActive: false},
-        {id: 5, name: '柴油发电机组', isMaintenance: false, num: 186, status: '正常', abnormal: false, isActive: false},
+        {id: 1, name: '高压配电柜', isMaintenance: true, num: 95, statusNum: 0, abnormal: false, isActive: true},
+        {id: 2, name: '变压器', isMaintenance: false, num: 256, statusNum: 12, abnormal: true, isActive: false},
+        {id: 3, name: '低压配电柜', isMaintenance: false, num: 354, statusNum: 0, abnormal: false, isActive: false},
+        {id: 4, name: '直流屏', isMaintenance: false, num: 175, statusNum: 0, abnormal: false, isActive: false},
+        {id: 5, name: '柴油发电机组', isMaintenance: false, num: 186, status: 0, abnormal: false, isActive: false},
       ], // 系统下的各种组成
       ], // 系统下的各种组成
       searchKey: '', // 搜索关键字
       searchKey: '', // 搜索关键字
       tableData: [
       tableData: [
-        {serialNumber: 1, equipmentName: 2, equipmentNumber: 3, status: 4, photo: 5, report: 6},
-        {serialNumber: 1, equipmentName: 2, equipmentNumber: 3, status: 4, photo: 5, report: 6},
-        {serialNumber: 1, equipmentName: 2, equipmentNumber: 3, status: 4, photo: 5, report: 6},
+        // {serialNumber: 1, equipmentName: 2, equipmentNumber: 3, status: '正常', photo: 5, report: 6},
+        // {serialNumber: 1, equipmentName: 2, equipmentNumber: 3, status: '异常', photo: 5, report: 6},
+        // {serialNumber: 1, equipmentName: 2, equipmentNumber: 3, status: '正常', photo: 5, report: 6},
       ], // 表数据
       ], // 表数据
-      tatol: 100, // 总数据
+      curPage: 1, // 当前页码
+      pageSize: 10, // 每页条数
+      tatol: 0, // 总数据
       dialogTableVisible: false, // 弹窗显示状态
       dialogTableVisible: false, // 弹窗显示状态
       dialogTime: '', // 弹框内的时间
       dialogTime: '', // 弹框内的时间
     }
     }
@@ -106,11 +134,72 @@ export default {
 
 
   computed: {},
   computed: {},
 
 
-  mounted() {},
+  mounted() {
+    this.getSystemList();
+    this.getTableData();
+  },
 
 
   methods: {
   methods: {
-    testClick() {
-
+    /**
+     * 获取系统列表数据
+     */
+    getSystemList() {
+      queryEquipmentList().then((res) => {
+        if (res.result === 'success') {
+          let data = res.data;
+          let newData = [];
+          _.forEach(data, (item) => {
+            newData.push({
+              id: item.code,
+              name: item.name
+            })
+          })
+          this.systemList = newData;
+        }
+      }).catch((err) => {
+        console.err(err)
+      });
+    },
+    /**
+     * 切换系统名称
+     */
+    changeCurSystem(val) {
+      console.log('val', val)
+    },
+    /**
+     * 切换系统下的设备
+     */
+    changeEquipment(id) {
+      _.map(this.systemContentData, (o) => {return o.isActive = o.id === id})
+    },
+    /**
+     * 获取表数据
+     */
+    getTableData() {
+      let query = {
+        category_code: 'gdc'
+      }
+      queryTableData(`/data/data/glsms_asset/query?plazaId=1000423&page=${this.curPage}&size=${this.pageSize}`, query).then((res) => {
+        console.log('res', res)
+        const { result, count, data } = res;
+        if (result === 'success') {
+          this.tatol = count;
+          this.tableData = data;
+        }
+      })
+    },
+    /**
+     * 表第一列序号
+     */
+    indexMethod(index) {
+      return index + 1;
+    },
+    /**
+     * 切换页码
+     */
+    changeTablePage(page) {
+      this.curPage = page;
+      this.getTableData();
     },
     },
     /**
     /**
      * 显示设备实例的维保、专维等状态
      * 显示设备实例的维保、专维等状态
@@ -118,7 +207,7 @@ export default {
     showEquipmentStatus(row, column, e) {
     showEquipmentStatus(row, column, e) {
       console.log('row', row)
       console.log('row', row)
       this.dialogTableVisible = true;
       this.dialogTableVisible = true;
-    }
+    },
   }
   }
 }
 }
 </script>
 </script>
@@ -144,11 +233,15 @@ export default {
       padding-right: 21px;
       padding-right: 21px;
       padding-top: 7px;
       padding-top: 7px;
       padding-bottom: 8px;
       padding-bottom: 8px;
+      border-bottom: 1px solid #E4E6E7;
+      cursor: pointer;
       >div{
       >div{
         display: flex;
         display: flex;
       }
       }
       .first-row{
       .first-row{
         margin-bottom: 6px;
         margin-bottom: 6px;
+        display: flex;
+        justify-content: space-between;
         >div:first-child{
         >div:first-child{
           font-size: 14px;
           font-size: 14px;
           color: #1F2429;
           color: #1F2429;
@@ -160,11 +253,10 @@ export default {
           color: #CD981D;
           color: #CD981D;
           line-height: 20px;
           line-height: 20px;
         }
         }
+        
       }
       }
       .sec-row{
       .sec-row{
         margin-bottom: 6px;
         margin-bottom: 6px;
-        display: flex;
-        justify-content: space-between;
         >div:first-child{
         >div:first-child{
           font-size: 14px;
           font-size: 14px;
           color: #1F2429;
           color: #1F2429;
@@ -174,17 +266,22 @@ export default {
             color: #646C73;
             color: #646C73;
           }
           }
         }
         }
-        >div:nth-of-type(2){
-          padding-left: 8px;
-          padding-right: 8px;
-          font-size: 12px;
-          color: #0065B3;
-          line-height: 22px;
-          background: #E1F2FF;
-        }
+        // >div:nth-of-type(2){
+        //   padding-left: 8px;
+        //   padding-right: 8px;
+        //   font-size: 12px;
+        //   color: #0065B3;
+        //   line-height: 22px;
+        //   background: #E1F2FF;
+        // }
         .abnormal{
         .abnormal{
+          margin-left: 11px;
+          padding-left: 3px;
+          padding-right: 3px;
+          font-size: 12px;
+          color: #F54E45!important;
           background: #FDE3E2!important;
           background: #FDE3E2!important;
-          color: #AC2F28!important;
+          border-radius:9px;
         }
         }
       }
       }
     }
     }
@@ -195,6 +292,9 @@ export default {
         .first-row>div:first-child,
         .first-row>div:first-child,
         .sec-row>div{
         .sec-row>div{
           color: #025BAA;
           color: #025BAA;
+          >span{
+            color: #025BAA;
+          }
         }
         }
       }
       }
     }
     }

+ 8 - 2
src/views/analysis/GanttChart.vue

@@ -8,7 +8,6 @@
         :isReadOnly="true" 
         :isReadOnly="true" 
         tipPlace="top" 
         tipPlace="top" 
         caption="系统名称:"
         caption="系统名称:"
-        @change="testClick" 
         v-model="systemName" 
         v-model="systemName" 
         :selectdata="systemList" 
         :selectdata="systemList" 
         :placeholder="'请选择'"
         :placeholder="'请选择'"
@@ -18,6 +17,12 @@
           <div :style="{'background': item.backgroundColor, 'border-color': item.borderColor}"></div>
           <div :style="{'background': item.backgroundColor, 'border-color': item.borderColor}"></div>
           <div>{{item.text}}</div>
           <div>{{item.text}}</div>
         </div>
         </div>
+        <div >
+          <el-radio-group v-model="timeType">
+            <el-radio style="line-height: 32px;margin-right: 16px;" label="month">月视图</el-radio>
+            <el-radio style="line-height: 32px;" label="day">日视图</el-radio>
+          </el-radio-group>
+        </div>
       </div>
       </div>
     </div>
     </div>
     <div class="main-gantt-container">
     <div class="main-gantt-container">
@@ -37,7 +42,8 @@ export default {
         {id: 2, text: '未开始/进行中', backgroundColor: 'rgba(91, 143, 249, 0.2)', borderColor: '#5B8FF9'},
         {id: 2, text: '未开始/进行中', backgroundColor: 'rgba(91, 143, 249, 0.2)', borderColor: '#5B8FF9'},
         {id: 3, text: '按时完成', backgroundColor: '#FBCE99', borderColor: '#F58300'},
         {id: 3, text: '按时完成', backgroundColor: '#FBCE99', borderColor: '#F58300'},
         {id: 4, text: '按时完成', backgroundColor: '#FBB8B5', borderColor: '#F54E45'},
         {id: 4, text: '按时完成', backgroundColor: '#FBB8B5', borderColor: '#F54E45'},
-      ]
+      ], // 图例
+      timeType: 'month', // 甘特图时间类型
     }
     }
   },
   },