Browse Source

Merge branch 'dev' of http://39.106.8.246:3003/web/ibms into dev

shaun-sheep 4 years ago
parent
commit
a869315140

+ 3 - 3
src/components/ledger/details/detail/exhibitionBaseInformation.vue

@@ -86,7 +86,6 @@
     methods: {
       downloadFile(key) {
         window.open("/image-service/common/file_get/" + key + "?systemId=dataPlatform")
-
       },
       handleCopy(data) {
         let oInput = document.createElement('input')
@@ -98,8 +97,8 @@
         oInput.remove()
       },
       handleName(infoPoint, val) {
-        let text = `${infoPoint}:${val}`
-        return text.length > 22 ? val.substring(0, 22-`${infoPoint}:`.length) + '...' : val
+        let text = `${infoPoint}:${val}`;
+        return text.length > 22 ? val.substring(0, 22-`${infoPoint}:`.length) + '...' : val;
       }
     }
   }
@@ -133,6 +132,7 @@
       width: 335px;
       display: inline-block;
       margin-left: 20px;
+      vertical-align: text-top;
     }
   }
 </style>

+ 40 - 10
src/components/ledger/details/detail/exhibitionCrux.vue

@@ -9,7 +9,7 @@
         <div class="crux-list" v-for="(item,index) in exhibitionCrux.cruxArray" :key="index">{{item.InfoPointName}}:
 
         <el-popover
-          v-if="item.value && item.value.length && item.value.length>12 && item.Path=='EquipQRCode'"
+          v-if="item.Path == 'EquipQRCode' || item.Path == 'RoomQRCode' || item.Path == 'ShaftQRCode'"
           placement="top"
           width="360"
           trigger="hover">
@@ -26,14 +26,38 @@
               <span>{{item.value}}</span>
             </div>
           </div>
-
           <div style="text-align: center; margin: 0">
             <el-button type="text" size="mini" @click="handleCopy(item.value)">复制</el-button>
           </div>
           <el-button slot="reference" type="text">{{item.value ? '有' :'-'}}</el-button>
         </el-popover>
         <el-popover
-          v-else-if="item.value && item.value.length && item.value.length>12"
+          v-else-if="Array.isArray(item.value) && item.InputMode== 'F2'"
+          placement="right"
+          width="250"
+          trigger="hover">
+          <p style="border-bottom: 1px solid #eee;padding:2px 0 4px 0;'">{{item.InfoPointName}}</p>
+          <div v-for="(pic,index) in item.value">
+            <div>图纸名称:{{pic.Name}}
+                <el-button style="" type="text" size="mini" @click="downloadFile(pic.Key)">下载</el-button>
+            </div>
+          </div>
+          <el-button slot="reference" type="text">{{item.value? '有':'-'}}</el-button>
+        </el-popover>
+        <el-popover
+          v-else-if="Array.isArray(item.value) && item.InputMode=='N2'"
+          placement="right"
+          width="600"
+          trigger="hover">
+          <p style="border-bottom: 1px solid #eee;padding:2px 0 4px 0;'">{{item.InfoPointName}}</p>
+          <p style="height: 300px;overflow: auto">{{item.value}}</p>
+          <div style="text-align: center; margin: 0">
+            <el-button type="text" size="mini" @click="handleCopy(item.value)">复制</el-button>
+          </div>
+          <el-button slot="reference" type="text">{{item.value ? '有' :'-'}}</el-button>
+        </el-popover>
+        <el-popover
+          v-else-if="item.value && item.value.length && `${item.InfoPointName}:${item.value}`.length>22"
           placement="top"
           width="160"
           trigger="hover">
@@ -42,12 +66,12 @@
           <div style="text-align: center; margin: 0">
             <el-button type="text" size="mini" @click="handleCopy(item.value)">复制</el-button>
           </div>
-          <el-button slot="reference" type="text">{{handleName(item.value)}}</el-button>
+          <el-button slot="reference" type="text">{{handleName(item.InfoPointName, item.value)}}</el-button>
         </el-popover>
         <span v-else>{{item.value}}</span>
         </div>
       </div>
-      <div style="text-align: center" v-else>暂无数据</div>
+      <!-- <div style="text-align: center" v-else>暂无数据</div> -->
     </div>
     <cruxDialog
       ref="setting"
@@ -72,6 +96,9 @@
       }
     },
     methods: {
+      downloadFile(key) {
+        window.open("/image-service/common/file_get/" + key + "?systemId=dataPlatform")
+      },
       setting() {
         this.$refs.setting.dialogOpen()
       },
@@ -87,8 +114,9 @@
         this.$message.success('复制成功')
         oInput.remove()
       },
-      handleName(val) {
-        return val.length > 10 ? val.substring(0, 10) + '...' : val
+      handleName(infoPoint, val) {
+        let text = `${infoPoint}:${val}`;
+        return text.length > 22 ? val.substring(0, 22-`${infoPoint}:`.length) + '...' : val;
       }
     }
   }
@@ -96,13 +124,14 @@
 
 <style lang="less" scoped>
   .exhibition-crux {
+    padding: 10px 0;
     /deep/ .el-button--text {
       color: #555 !important;
       font-size: 14px;
     }
     .title {
       /*border-left: 8px solid black;*/
-      margin: 10px 40px 0 10px;
+      margin: 0 20px 0 10px;
       font-weight: 600;
       text-indent: 10px;
       display: block;
@@ -115,8 +144,9 @@
     }
       .crux-list {
         display: inline-block;
-        width: 25%;
-        margin-left: 28px;
+        width: 335px;
+        margin-left: 20px;
+        vertical-align: text-top;
       }
   }
 </style>

+ 1 - 1
src/components/ledger/details/detail/exhibitionEnergy.vue

@@ -13,7 +13,7 @@
             </div>
           </div>
         </div>
-        <div v-else style="text-align: center;margin-top: 200px">暂无数据</div>
+        <!-- <div v-else style="text-align: center;margin-top: 200px">暂无数据</div> -->
       </section>
     </div>
   </div>

+ 1 - 0
src/views/ledger/cenotelist/cenoteDetail/index.vue

@@ -69,6 +69,7 @@
         ], //tab页
         activeTab: 'detail', //当前选中的tab
         pointData: [], //信息点数据
+        currentRadio: '1',//当前选中的select
         exampleData: {}, //实例数据
         exhibitionBaseInformation: {
           information: {}

+ 147 - 101
src/views/ledger/facility/details/index.vue

@@ -5,57 +5,77 @@
       <span :title="`${name} - ${code}`" class="details-title"><b>{{name}} - {{code}}</b></span>
     </div>
     <div class="content">
-      <div class="content-left">
-        <div class="content-keyPoint">
-          <exhibitionCrux :exhibitionCrux="exhibitionCrux" :type="type" @cruxSuccess="cruxSuccess"/>
-        </div>
-        <div class="content-showType">
-          <selectRadio
-            :selectRadio="selectRadio"
-            @changeRadio="changeRadio"
-          />
-        </div>
-        <div class="content-point">
-          <div class="content-point-left">
-            <el-scrollbar style="height:100%;">
-              <div>
-                <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+      <el-scrollbar style="height:100%;">
+        <div class="content-scrollbar">
+          <div class="content-left">
+            <div class="content-keyPoint">
+              <exhibitionCrux :exhibitionCrux="exhibitionCrux" :type="type" @cruxSuccess="cruxSuccess"/>
+            </div>
+            <div class="content-showType">
+              <selectRadio
+                :selectRadio="selectRadio"
+                @changeRadio="changeRadio"
+              />
+            </div>
+            <div class="content-point">
+              <div class="content-point-left">
+                <!-- <el-scrollbar style="height:100%;"> -->
+                  <!-- <div> -->
+                    <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+                  <!-- </div> -->
+                <!-- </el-scrollbar> -->
               </div>
-            </el-scrollbar>
-          </div>
-          <div class="content-point-right">
-            <el-scrollbar style="height:100%;">
-              <div>
-                <exhibitionEnergy :exhibitionEnergy="exhibitionEnergy"/>
+              <div class="content-point-right">
+                <!-- <el-scrollbar style="height:100%;"> -->
+                  <!-- <div> -->
+                    <exhibitionEnergy :exhibitionEnergy="exhibitionEnergy"/>
+                  <!-- </div> -->
+                <!-- </el-scrollbar> -->
               </div>
-            </el-scrollbar>
+            </div>
           </div>
-        </div>
-      </div>
-      <div class="content-right">
-        <div class="content-repair">
-          <exhibitionMaintain :exhibitionMaintain="exhibitionMaintain"/>
-        </div>
-        <div class="content-media">
-          <el-scrollbar style="height:100%;">
-            <div>
-              <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
-              <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
-              <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+          <div class="content-right">
+            <div class="content-repair">
+              <exhibitionMaintain :exhibitionMaintain="exhibitionMaintain"/>
+            </div>
+            <div class="content-media">
+              <!-- <el-scrollbar style="height:100%;"> -->
+                <!-- <div> -->
+                  <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
+                  <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
+                  <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+                <!-- </div> -->
+              <!-- </el-scrollbar> -->
             </div>
-          </el-scrollbar>
+          </div>
         </div>
-      </div>
+      </el-scrollbar>
     </div>
     <div class="footer">
-      <el-select size="mini" style="float:right;margin:7px 30px 0 0" v-model="id" @change="handleChangeExample" placeholder="请选择">
-        <el-option
-          v-for="item in list"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value">
-        </el-option>
-      </el-select>
+      <el-button-group style="float:right;margin:8px 10px 0 0">
+        <el-button 
+          :disabled="list.findIndex(item => item.value == id) == 0"
+          @click="handleClickPrev"
+          size="mini" 
+          icon="el-icon-arrow-left">
+          上一页
+        </el-button>
+        <el-select size="mini" style="float:left;margin:0 10px;" v-model="id" @change="handleChangeExample" placeholder="请选择">
+          <el-option
+            v-for="item in list"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+        <el-button 
+          :disabled="list.findIndex(item => item.value == id) == list.length-1"
+          @click="handleClickNext"
+          size="mini">
+          下一页
+          <i class="el-icon-arrow-right el-icon--right"></i>
+        </el-button>
+      </el-button-group>
     </div>
   </div>
 </template>
@@ -106,7 +126,7 @@
         list: [], //设备列表
         pointData: [], //信息点数据
         exampleData: {}, //实例数据
-        currentRadio: '',//当前选中的select
+        currentRadio: '1',//当前选中的select
         criterias: [], //动态参数
         selectRadio: {
           information: '设备信息点',
@@ -189,6 +209,10 @@
             resolve(res)
           })
         })
+        // 数据初始化
+        this.exhibitionEnergy.dynamic = [];
+        this.criterias = [];
+
         Promise.all([promise1, promise2]).then(values => {
           this.pointData = values[0].Content;
           this.exampleData = values[1].Content[0];
@@ -197,7 +221,7 @@
           let obj = this.deepCopy(values[1].Content[0]);
           obj = tools.flattenKeys(obj);
           this.instance = obj;
-          this.handleRadios(1)
+          this.handleRadios(this.currentRadio)
           this.handleEnclosure() //处理图片视频文件信息
           this.pointData.forEach(item => {
             if (item.InputMode == "L" || item.InputMode == "L1" || item.InputMode == "L2" || item.InputMode == "M") {
@@ -227,8 +251,8 @@
 
                 this.pointData.forEach(head => {
                   if (head.InfoPointCode == child.code) {
-                    console.log(head.FirstName, child, '==')
-                    this.exhibitionEnergy.firstName = head.FirstName
+                    console.log(head.FirstName,child,'==')
+                    this.exhibitionEnergy.firstName = head.FirstName;
                     this.exhibitionEnergy.dynamic.push({
                       FirstName: head.FirstName,
                       InfoPointCode: head.InfoPointCode,
@@ -494,9 +518,21 @@
       },
       // 切换实例
       handleChangeExample() {
-        this.selectRadio.initRadio = '1'
+        this.selectRadio.initRadio = '1';
+        this.currentRadio = '1';
         this.getData();
-        this.exhibitionEnergy.dynamic = []
+      },
+      // 切换上一个实例
+      handleClickPrev() {
+        let index = this.list.findIndex(item => item.value == this.id);
+        this.id = this.list[index-1].value;
+        this.handleChangeExample();
+      },
+      // 切换下一个实例
+      handleClickNext() {
+        let index = this.list.findIndex(item => item.value == this.id);
+        this.id = this.list[index+1].value;
+        this.handleChangeExample();
       },
     },
     watch: {
@@ -525,73 +561,83 @@
     }
 
     .content {
-      display: flex;
-      flex-direction: row;
-      box-sizing: border-box;
-      height: calc(100% - 95px);
-      .content-left {
+      height: calc(100% - 77px);
+      .content-scrollbar {
         display: flex;
-        flex-direction: column;
-        flex: 1;
-        .content-keyPoint {
-          border: 1px solid #ccc;
-          box-sizing: border-box;
-          height: 100px;
-          margin-bottom: 10px;
-          overflow: hidden;
-          background: @bgc;
-        }
-        .content-showType {
-          height: 50px;
-          border: 1px solid #ccc;
-          border-bottom: none;
-          box-sizing: border-box;
-          background: @bgc;
-        }
-        .content-point {
+        height: 100%;
+        flex-direction: row;
+        box-sizing: border-box;
+        background-color: #f2f2f2;
+        .content-left {
           display: flex;
-          flex-direction: row;
-          height: calc(100% - 160px);
-          border: 1px solid #ccc;
+          flex-direction: column;
+          flex: 1;
           box-sizing: border-box;
-          background: @bgc;
-
-          .content-point-left {
-            flex: 1;
+          .content-keyPoint {
+            border: 1px solid #ccc;
+            box-sizing: border-box;
+            // height: 100px;
+            margin-bottom: 10px;
+            overflow: hidden;
+            background: @bgc;
+          }
+          .content-showType {
+            height: 50px;
+            border: 1px solid #ccc;
+            border-bottom: none;
+            box-sizing: border-box;
+            background: @bgc;
           }
+          .content-point {
+            display: flex;
+            flex-direction: row;
+            // height: calc(100% - 160px);
+            border: 1px solid #ccc;
+            box-sizing: border-box;
+            background: @bgc;
+
+            .content-point-left {
+              flex: 1;
+            }
 
-          .content-point-right {
-            width: 300px;
-            border-left: 1px solid #ccc;
+            .content-point-right {
+              width: 300px;
+              border-left: 1px solid #ccc;
+            }
           }
         }
-      }
-      .content-right {
-        width: 400px;
-        margin-left: 10px;
-        .content-repair {
-          height: 50px;
-          line-height: 50px;
-          margin-bottom: 10px;
-          border: 1px solid #ccc;
-          background: @bgc;
-          box-sizing: border-box;
-        }
-        .content-media {
-          height: calc(100% - 60px);
-          background: @bgc;
-          border: 1px solid #ccc;
+        .content-right {
+          width: 400px;
+          margin-left: 10px;
           box-sizing: border-box;
+          .content-repair {
+            height: 50px;
+            line-height: 50px;
+            margin-bottom: 10px;
+            border: 1px solid #ccc;
+            background: @bgc;
+            box-sizing: border-box;
+          }
+          .content-media {
+            // height: calc(100% - 60px);
+            // background: @bgc;
+            // border: 1px solid #ccc;
+            box-sizing: border-box;
+          }
         }
       }
     }
 
     .footer {
-      margin-top: 5px;
+      position: fixed;
+      bottom: 0;
+      left: 235px;
+      // margin-top: 5px;
+      width: calc(100% - 235px);
       height: 45px;
       background-color: #fff;
       box-sizing: border-box;
-      border: 1px solid #ccc;
+      // border: 1px solid #ccc;
     }
   }
 

+ 599 - 0
src/views/ledger/facility/details/index_old.vue

@@ -0,0 +1,599 @@
+<template>
+  <div class="tableDisplay">
+    <div class="header">
+      <el-button style="float:left;" size="small" type="default" icon="el-icon-back" @click="goBack"></el-button>
+      <span :title="`${name} - ${code}`" class="details-title"><b>{{name}} - {{code}}</b></span>
+    </div>
+    <div class="content">
+      <div class="content-left">
+        <div class="content-keyPoint">
+          <exhibitionCrux :exhibitionCrux="exhibitionCrux" :type="type" @cruxSuccess="cruxSuccess"/>
+        </div>
+        <div class="content-showType">
+          <selectRadio
+            :selectRadio="selectRadio"
+            @changeRadio="changeRadio"
+          />
+        </div>
+        <div class="content-point">
+          <div class="content-point-left">
+            <el-scrollbar style="height:100%;">
+              <div>
+                <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+              </div>
+            </el-scrollbar>
+          </div>
+          <div class="content-point-right">
+            <el-scrollbar style="height:100%;">
+              <div>
+                <exhibitionEnergy :exhibitionEnergy="exhibitionEnergy"/>
+              </div>
+            </el-scrollbar>
+          </div>
+        </div>
+      </div>
+      <div class="content-right">
+        <div class="content-repair">
+          <exhibitionMaintain :exhibitionMaintain="exhibitionMaintain"/>
+        </div>
+        <div class="content-media">
+          <el-scrollbar style="height:100%;">
+            <div>
+              <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
+              <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
+              <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+            </div>
+          </el-scrollbar>
+        </div>
+      </div>
+    </div>
+    <div class="footer">
+      <el-select size="mini" style="float:right;margin:7px 30px 0 0" v-model="id" @change="handleChangeExample" placeholder="请选择">
+        <el-option
+          v-for="item in list"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+    </div>
+  </div>
+</template>
+
+<script>
+  import exhibitionBaseInformation from "@/components/ledger/details/detail/exhibitionBaseInformation";
+  import exhibitionFile from "@/components/ledger/details/detail/exhibitionFile";
+  import exhibitionImage from "@/components/ledger/details/detail/exhibitionImage";
+  import exhibitionVideo from "@/components/ledger/details/detail/exhibitionVideo";
+  import exhibitionCrux from "@/components/ledger/details/detail/exhibitionCrux";
+  import exhibitionEnergy from "@/components/ledger/details/detail/exhibitionEnergy";
+  import exhibitionMaintain from "@/components/ledger/details/detail/exhibitionMaintain";
+  import selectRadio from "@/components/ledger/details/detail/selectRadio";
+  import tools from "@/utils/scan/tools"
+  import {BeatchQueryParam, getDataDictionary, queryEquip} from "@/api/scan/request";
+  import {mapGetters} from "vuex";
+
+  export default {
+    name: "deviceDetails",
+    components: {
+      exhibitionBaseInformation,
+      exhibitionFile,
+      exhibitionVideo,
+      exhibitionImage,
+      exhibitionMaintain,
+      selectRadio,
+      exhibitionCrux,
+      exhibitionEnergy
+    },
+    created() {
+      this.id = this.$route.query.equipId;
+      this.name = this.$route.query.equipName;
+      this.code = this.$route.query.equipCode;
+      this.type = this.$route.query.type;
+      this.list = this.$route.query.data;
+      this.getData();
+      console.log(this.$route.query)
+    },
+    computed: {
+      ...mapGetters("layout", ["projectId", "secret", "userId"])
+    },
+    data() {
+      return {
+        id: '', //当前设备id
+        name: '', //当前设备本地名称
+        code: '', //当前设备的本地编码
+        type: '', //设备类型
+        list: [], //设备列表
+        pointData: [], //信息点数据
+        exampleData: {}, //实例数据
+        currentRadio: '',//当前选中的select
+        criterias: [], //动态参数
+        selectRadio: {
+          information: '设备信息点',
+          initRadio: '1',
+          radioList: [
+            {
+              value: '显示需采集信息点',
+              label: '1'
+            },
+            {
+              value: '显示有值信息点',
+              label: '2'
+            },
+            {
+              value: '显示全部信息点',
+              label: '3'
+            }
+          ]
+        },
+        exhibitionBaseInformation: {
+          information: {}
+        },
+        exhibitionEnergy: {
+          title: '能耗信息',
+          firstName:'',
+          dynamic: [],
+        },
+        exhibitionMaintain: {
+          title: '维修/维保记录'
+        },
+        exhibitionFile: {
+          title: '文件',
+          list: {}
+        },
+        exhibitionCrux: {
+          title: '关键信息点:',
+          cruxArray: [],
+          allMessage: [],//全部信息点
+        },
+        exhibitionImage: {
+          title: '图片',
+          list: {}
+        },
+        exhibitionVideo: {
+          title: '视频',
+          list: []
+        },
+        instance: {},//实例信息处理
+        isShowImage: true,
+        isShowVideo: true,
+        isShowFile: true,
+      }
+    },
+    methods: {
+      deepCopy(obj) {
+        return JSON.parse(JSON.stringify(obj))
+      },
+      cruxSuccess(){
+        this.getData()
+      },
+      // 获取表头和实例数据(动态数据在组件中获取,在此格式化请求参数)
+      getData() {
+        let params1 = {
+          data: {
+            Orders: "sort asc",
+            PageNumber: 1,
+            PageSize: 1000
+          },
+          type: this.type
+        }, params2 = {
+          Filters: `EquipID='${this.id}'`,
+        };
+        let promise1 = new Promise((resolve, reject) => {
+          getDataDictionary(params1, res => {
+            resolve(res)
+          })
+        })
+        let promise2 = new Promise((resolve, reject) => {
+          queryEquip(params2, res => {
+            resolve(res)
+          })
+        })
+        Promise.all([promise1, promise2]).then(values => {
+          this.pointData = values[0].Content;
+          this.exampleData = values[1].Content[0];
+          this.name = this.exampleData.EquipLocalName?this.exampleData.EquipLocalName:this.exampleData.EquipName?this.exampleData.EquipName:'';
+          this.code = this.exampleData.EquipLocalID?this.exampleData.EquipLocalID:'';
+          let obj = this.deepCopy(values[1].Content[0]);
+          obj = tools.flattenKeys(obj);
+          this.instance = obj;
+          this.handleRadios(1)
+          this.handleEnclosure() //处理图片视频文件信息
+          this.pointData.forEach(item => {
+            if (item.InputMode == "L" || item.InputMode == "L1" || item.InputMode == "L2" || item.InputMode == "M") {
+              let cur = tools.dataForKey(this.exampleData, item.Path);
+              if (cur) {
+                this.criterias.push({
+                  id: this.exampleData.EquipID,
+                  code: item.InfoPointCode
+                })
+
+              }
+            }
+          })
+
+          let params = { //获取动态参数
+            secret: this.secret,
+            ProjId: this.projectId,
+            data: {
+              criterias: this.criterias
+            }
+          }
+          if (this.criterias.length) {
+            BeatchQueryParam(params, res => {
+              res.Content && res.Content.map(child => {
+                this.pointData.forEach(head => {
+                  if (head.InfoPointCode == child.code) {
+                    console.log(head.FirstName,child,'==')
+                    this.exhibitionEnergy.firstName = head.FirstName
+                    this.exhibitionEnergy.dynamic.push({
+                      FirstName:head.FirstName,
+                      InfoPointCode: head.InfoPointCode,
+                      InfoPointName: head.InfoPointName,
+                      Path: head.Path,
+                      value: child.value,
+                      data: child.data || '--',
+                      receivetime: child.receivetime || '',
+                      error: child.error || '',
+                      Unit: head.Unit || ''
+                    })
+                  }
+                })
+              });
+            })
+          }
+
+        })
+      },
+      handleEnclosure() {
+        //图片文件处理,脱离radio控制
+        let isList = this.pointData
+        let isArr = []
+        isList.map(j => {
+          if (this.instance.hasOwnProperty(j.Path)) {
+            return {
+              ...j,
+              value: this.instance[j.Path]
+            }
+          }
+        })
+        isArr = isList.filter(k => k.value)
+        this.handlePicList(isArr)
+        this.handleFileList(isArr)
+      },
+      handleRadios(val) { //判断radio的值显示关键信息,基本信息,图片,文件
+        let arr = []
+        //关键信息点
+        this.exhibitionCrux.cruxArray = this.pointData.filter(i => i.KeyWord)
+        this.exhibitionCrux.cruxArray.map(i => {
+          if (this.instance.hasOwnProperty(i.Path)) {
+            return {
+              ...i,
+              value: this.instance[i.Path]
+            }
+          }
+        })
+
+        if (val == 1) { //需采集信息
+          arr = this.pointData.filter(i => i.Visible)
+          // //  图片和的处理
+          // this.handlePicList(arr)
+          // //  文件处理
+          // this.handleFileList(arr)
+
+        } else if (val == 2) { //有值信息点
+          let list = this.pointData
+          list.map(j => {
+            if (this.instance.hasOwnProperty(j.Path)) {
+              return {
+                ...j,
+                value: this.instance[j.Path]
+              }
+            }
+          })
+          arr = list.filter(k => k.value)
+          // this.handlePicList(arr, 2)
+          // this.handleFileList(arr, 2)
+
+        } else { //全部信息点
+          arr = this.pointData
+          // this.handlePicList(arr)
+          // this.handleFileList(arr)
+        }
+        this.displayData(arr)
+      },
+      handlePicList(arr) {
+        let picObject = {}
+        //处理数据格式
+        arr.map(i => {
+          if (i.InputMode == 'F2') {
+            switch (i.Path) {
+              case 'LedgerParam.PhotoDoc.Drawing':
+              case 'LedgerParam.Siteinstall.InstallPic':
+              case 'LedgerParam.Siteinstall.InstallDrawing':
+              case 'LedgerParam.PhotoDoc.Nameplate':
+                if (this.instance.hasOwnProperty(i.Path)) {
+                  i.PicList = this.instance[i.Path]
+                }
+                if (picObject[i.InfoPointName]) {
+
+                } else {
+                  picObject[i.InfoPointName] = []
+                }
+                picObject[i.InfoPointName].push({
+                  ...i,
+                })
+                break;
+
+            }
+          }
+
+        })
+        //展示图片
+        this.exhibitionImage.list = picObject
+        let isArray = [] //获取图片数组
+        for (let i in picObject) {
+          if (Array.isArray(picObject[i])) {
+            let list = picObject[i]
+            list.forEach(i => {
+              if (i.PicList) {
+                isArray.push(...i.PicList)
+              }
+            })
+          }
+        }
+        let video = isArray.filter(i => i.Type != 'image' &&i.type != 'image' )
+        this.exhibitionVideo.list = video
+          //判断是否显示图片组件
+          this.isShowImage = isArray.length ? true : false
+          //判断是否显示video组件
+          this.isShowVideo = video.length ? true : false
+
+      },
+      handleFileList(arr) {
+        let picObject = {}
+        //处理数据格式
+        arr.map(i => {
+          if (i.InputMode == 'F2') {
+            switch (i.Path) {
+              case 'LedgerParam.InsuranceDoc.InsuranceFile':
+              case 'LedgerParam.PhotoDoc.Archive':
+              case 'LedgerParam.Siteinstall.CheckReport':
+                if (this.instance.hasOwnProperty(i.Path)) {
+                  i.fileList = this.instance[i.Path]
+                }
+                if (picObject[i.InfoPointName]) {
+
+                } else {
+                  picObject[i.InfoPointName] = []
+                }
+                picObject[i.InfoPointName].push({
+                  ...i,
+                })
+                break
+            }
+          }
+        })
+        //展示文件
+        this.exhibitionFile.list = picObject
+        let isArray = [] //获取文件数组
+        for (let i in picObject) {
+          if (Array.isArray(picObject[i])) {
+            let list = picObject[i]
+            list.forEach(i => {
+              if (i.fileList) {
+                isArray.push(...i.fileList)
+              }
+            })
+          }
+        }
+          //判断是否显示文件组件
+          this.isShowFile = isArray.length ? true : false
+
+      },
+      changeRadio(val) { //1,需采集,2,有值,3,全部
+        this.handleRadios(val)
+        this.currentRadio = val
+      },
+      formatDate(str) {
+        if(str) {
+          if(str.includes('-')) {
+            return str
+          }else {
+            return  str.substr(0,4)+"-"+str.substr(4,2)+"-"+str.substr(6,2)+" "+str.substr(8,2) + ":" +str.substr(10,2) + ":"+str.substr(12,2)
+          }
+        } else {
+          return '--'
+        }
+      },
+      displayData(arr) {//对数据进行处理传给组件展示
+        const result = {}
+        arr.forEach(i => {
+          if (this.instance.hasOwnProperty(i.Path) && this.currentRadio != 2) {
+            i.value = this.instance[i.Path]
+          }
+          if (i.InputMode == 'C5') {
+            if (this.instance.hasOwnProperty(i.Path)) {
+              let time = this.instance[i.Path]
+              i.value = this.formatDate(time)
+            }
+          }
+          if (i.DataSource && i.DataSource.length) {
+            let source = JSON.parse(i.DataSource)
+            //判断输入类型
+            if (i.InputMode == 'D1L') {
+              let d1l = tools.formatDataSource(i.DataSource)
+              d1l.forEach(k => {
+                if (k.Code == this.instance[i.Path]) {
+                  i.value = k.Name
+                }
+              })
+            } else if (i.InputMode == 'D2' || i.InputMode == 'C6') {
+              if (this.instance.hasOwnProperty(i.Path)) {
+                if (!Array.isArray(this.instance[i.Path])) {
+                  let transArray = this.instance[i.Path].split(',')
+                  i.value = source.filter(item => transArray.includes(item.Code)).map(item => item.Name).join(',')
+                }
+              }
+            }
+            source.forEach(j => {
+              if (j.Code == this.instance[i.Path]) {
+                console.log(j.Name)
+                i.value = j.Name
+              }
+            })
+          }
+          switch (i.InputMode) {
+            case "L":
+            case "L1":
+            case "L2":
+            case "M":
+              break;
+            default:
+              if (result[`${i.FirstName}${i.SecondName ? '/' + i.SecondName : ''}`]) {
+                result[`${i.FirstName}${i.SecondName ? '/' + i.SecondName : ''}`].paths.push({
+                  Path: i.Path,
+                  InfoPointName: i.InfoPointName,
+                  InfoPointCode: i.InfoPointCode,
+                  Value: i.value,
+                  Visible: i.Visible,
+                  KeyWord: i.KeyWord,
+                  InputMode:i.InputMode
+                })
+              } else {
+                result[`${i.FirstName}${i.SecondName ? '/' + i.SecondName : ''}`] = {
+                  paths: [{
+                    Path: i.Path,
+                    InfoPointName: i.InfoPointName,
+                    InfoPointCode: i.InfoPointCode,
+                    Value: i.value,
+                    Visible: i.Visible,
+                    KeyWord: i.KeyWord,
+                    InputMode:i.InputMode
+                  }]
+                }
+              }
+
+          }
+
+
+        })
+        this.exhibitionBaseInformation.information = result
+        this.exhibitionCrux.allMessage = result
+      },
+      goBack() {
+        this.$router.push({
+          name: "facilityLedger",
+          params: {
+            deviceId: this.type
+          }
+        })
+      },
+      // 切换实例
+      handleChangeExample() {
+        this.selectRadio.initRadio = '1'
+        this.getData();
+        this.exhibitionEnergy.dynamic = []
+      },
+    },
+    watch: {
+      projectId() {
+        this.$router.push({path: "/ledger/facility"})
+      }
+    }
+  }
+</script>
+
+<style scoped lang="less">
+  @bgc: #fff;
+  .tableDisplay {
+    .header {
+      padding-bottom: 10px;
+      overflow: hidden;
+      text-overflow:ellipsis;
+      white-space: nowrap;
+      .details-title {
+        color: #333;
+        font-size: 16px;
+        margin-left: 20px;
+        line-height: 32px;
+        cursor: pointer;
+      }
+    }
+
+    .content {
+      display: flex;
+      flex-direction: row;
+      box-sizing: border-box;
+      height: calc(100% - 95px);
+      .content-left {
+        display: flex;
+        flex-direction: column;
+        flex: 1;
+        .content-keyPoint {
+          border: 1px solid #ccc;
+          box-sizing: border-box;
+          height: 100px;
+          margin-bottom: 10px;
+          overflow: hidden;
+          background: @bgc;
+        }
+        .content-showType {
+          height: 50px;
+          border: 1px solid #ccc;
+          border-bottom: none;
+          box-sizing: border-box;
+          background: @bgc;
+        }
+        .content-point {
+          display: flex;
+          flex-direction: row;
+          height: calc(100% - 160px);
+          border: 1px solid #ccc;
+          box-sizing: border-box;
+          background: @bgc;
+
+          .content-point-left {
+            flex: 1;
+          }
+
+          .content-point-right {
+            width: 300px;
+            border-left: 1px solid #ccc;
+          }
+        }
+      }
+      .content-right {
+        width: 400px;
+        margin-left: 10px;
+        .content-repair {
+          height: 50px;
+          line-height: 50px;
+          margin-bottom: 10px;
+          border: 1px solid #ccc;
+          background: @bgc;
+          box-sizing: border-box;
+        }
+        .content-media {
+          height: calc(100% - 60px);
+          background: @bgc;
+          border: 1px solid #ccc;
+          box-sizing: border-box;
+        }
+      }
+    }
+
+    .footer {
+      margin-top: 5px;
+      height: 45px;
+      background-color: #fff;
+      box-sizing: border-box;
+      border: 1px solid #ccc;
+    }
+  }
+
+  /deep/ .el-scrollbar__wrap {
+    overflow-x: hidden;
+  }
+
+</style>

+ 120 - 78
src/views/ledger/property/details/index.vue

@@ -5,48 +5,67 @@
       <span :title="`${name} - ${code}`" class="details-title"><b>{{name}} - {{code}}</b></span>
     </div>
     <div class="content">
-      <div class="content-left">
-        <div class="content-keyPoint">
-          <exhibitionCrux :exhibitionCrux="exhibitionCrux" :type="type" @cruxSuccess="cruxSuccess"/>
-
-        </div>
-        <div class="content-showType">
-          <selectRadio
-            :selectRadio="selectRadio"
-            @changeRadio="changeRadio"
-          />
-        </div>
-        <div class="content-point">
-          <div class="content-point-left">
-            <el-scrollbar style="height:100%;">
-              <div>
-                <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+      <el-scrollbar style="height:100%;">
+        <div class="content-scrollbar">
+          <div class="content-left">
+            <div class="content-keyPoint">
+              <exhibitionCrux :exhibitionCrux="exhibitionCrux" :type="type" @cruxSuccess="cruxSuccess"/>
+            </div>
+            <div class="content-showType">
+              <selectRadio
+                :selectRadio="selectRadio"
+                @changeRadio="changeRadio"
+              />
+            </div>
+            <div class="content-point">
+              <div class="content-point-left">
+                <!-- <el-scrollbar style="height:100%;"> -->
+                  <!-- <div> -->
+                    <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+                  <!-- </div> -->
+                <!-- </el-scrollbar> -->
               </div>
-            </el-scrollbar>
+            </div>
           </div>
-        </div>
-      </div>
-      <div class="content-right">
-        <div class="content-media">
-          <el-scrollbar style="height:100%;">
-            <div>
-              <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
-              <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
-              <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+          <div class="content-right">
+            <div class="content-media">
+              <!-- <el-scrollbar style="height:100%;"> -->
+                <!-- <div> -->
+                  <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
+                  <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
+                  <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+                <!-- </div> -->
+              <!-- </el-scrollbar> -->
             </div>
-          </el-scrollbar>
+          </div>
         </div>
-      </div>
+      </el-scrollbar>
     </div>
     <div class="footer">
-      <el-select size="mini" style="float:right;margin:7px 30px 0 0" v-model="id" @change="handleChangeExample" placeholder="请选择">
-        <el-option
-          v-for="item in list"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value">
-        </el-option>
-      </el-select>
+      <el-button-group style="float:right;margin:8px 10px 0 0">
+        <el-button 
+          :disabled="list.findIndex(item => item.value == id) == 0"
+          @click="handleClickPrev"
+          size="mini" 
+          icon="el-icon-arrow-left">
+          上一页
+        </el-button>
+        <el-select size="mini" style="float:left;margin:0 10px;" v-model="id" @change="handleChangeExample" placeholder="请选择">
+          <el-option
+            v-for="item in list"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+        <el-button 
+          :disabled="list.findIndex(item => item.value == id) == list.length-1"
+          @click="handleClickNext"
+          size="mini">
+          下一页
+          <i class="el-icon-arrow-right el-icon--right"></i>
+        </el-button>
+      </el-button-group> 
     </div>
   </div>
 </template>
@@ -94,7 +113,7 @@
         type: '', //资产类型
         list: [], //资产列表
         pointData: [], //信息点数据
-        currentRadio: '',//当前选中的select
+        currentRadio: '1',//当前选中的select
         selectRadio: {
           information: '设备信息点',
           initRadio: '1',
@@ -176,7 +195,7 @@
           let obj = this.deepCopy(values[1].Content[0]);
           obj = tools.flattenKeys(obj);
           this.instance = obj;
-          this.handleRadios(1)
+          this.handleRadios(this.currentRadio)
           this.handleEnclosure() //处理图片视频文件信息
         })
       },
@@ -425,9 +444,22 @@
       },
       // 切换实例
       handleChangeExample() {
-        this.selectRadio.initRadio = '1'
+        this.selectRadio.initRadio = '1';
+        this.currentRadio = '1';
         this.getData();
       },
+      // 切换上一个实例
+      handleClickPrev() {
+        let index = this.list.findIndex(item => item.value == this.id);
+        this.id = this.list[index-1].value;
+        this.handleChangeExample();
+      },
+      // 切换下一个实例
+      handleClickNext() {
+        let index = this.list.findIndex(item => item.value == this.id);
+        this.id = this.list[index+1].value;
+        this.handleChangeExample();
+      },
     },
     watch: {
       projectId() {
@@ -455,59 +487,69 @@
     }
 
     .content {
-      display: flex;
-      flex-direction: row;
-      box-sizing: border-box;
-      height: calc(100% - 95px);
-      .content-left {
+      height: calc(100% - 77px);
+      .content-scrollbar {
         display: flex;
-        flex-direction: column;
-        flex: 1;
-        .content-keyPoint {
-          border: 1px solid #ccc;
-          box-sizing: border-box;
-          height: 100px;
-          margin-bottom: 10px;
-          overflow: hidden;
-          background: @bgc;
-        }
-        .content-showType {
-          height: 50px;
-          border: 1px solid #ccc;
-          border-bottom: none;
-          box-sizing: border-box;
-          background: @bgc;
-        }
-        .content-point {
+        height: 100%;
+        flex-direction: row;
+        box-sizing: border-box;
+        background-color: #f2f2f2;
+        .content-left {
           display: flex;
-          flex-direction: row;
-          height: calc(100% - 160px);
-          border: 1px solid #ccc;
+          flex-direction: column;
+          flex: 1;
           box-sizing: border-box;
-          background: @bgc;
-          .content-point-left {
-            flex: 1;
+          .content-keyPoint {
+            border: 1px solid #ccc;
+            box-sizing: border-box;
+            // height: 100px;
+            margin-bottom: 10px;
+            overflow: hidden;
+            background: @bgc;
+          }
+          .content-showType {
+            height: 50px;
+            border: 1px solid #ccc;
+            border-bottom: none;
+            box-sizing: border-box;
+            background: @bgc;
+          }
+          .content-point {
+            display: flex;
+            flex-direction: row;
+            // height: calc(100% - 160px);
+            border: 1px solid #ccc;
+            box-sizing: border-box;
+            background: @bgc;
+            .content-point-left {
+              flex: 1;
+            }
           }
         }
-      }
-      .content-right {
-        width: 400px;
-        margin-left: 10px;
-        .content-media {
-          height: 100%;
-          background: @bgc;
-          border: 1px solid #ccc;
+        .content-right {
+          width: 400px;
+          margin-left: 10px;
           box-sizing: border-box;
+          .content-media {
+            // height: 100%;
+            // background: @bgc;
+            // border: 1px solid #ccc;
+            box-sizing: border-box;
+          }
         }
       }
     }
 
     .footer {
-      margin-top: 5px;
+      position: fixed;
+      bottom: 0;
+      left: 235px;
+      // margin-top: 5px;
+      width: calc(100% - 235px);
       height: 45px;
       background-color: #fff;
       box-sizing: border-box;
-      border: 1px solid #ccc;
+      // border: 1px solid #ccc;
     }
   }
 

+ 518 - 0
src/views/ledger/property/details/index_old.vue

@@ -0,0 +1,518 @@
+<template>
+  <div class="tableDisplay">
+    <div class="header">
+      <el-button style="float:left;" size="small" type="default" icon="el-icon-back" @click="goBack"></el-button>
+      <span :title="`${name} - ${code}`" class="details-title"><b>{{name}} - {{code}}</b></span>
+    </div>
+    <div class="content">
+      <div class="content-left">
+        <div class="content-keyPoint">
+          <exhibitionCrux :exhibitionCrux="exhibitionCrux" :type="type" @cruxSuccess="cruxSuccess"/>
+
+        </div>
+        <div class="content-showType">
+          <selectRadio
+            :selectRadio="selectRadio"
+            @changeRadio="changeRadio"
+          />
+        </div>
+        <div class="content-point">
+          <div class="content-point-left">
+            <el-scrollbar style="height:100%;">
+              <div>
+                <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+              </div>
+            </el-scrollbar>
+          </div>
+        </div>
+      </div>
+      <div class="content-right">
+        <div class="content-media">
+          <el-scrollbar style="height:100%;">
+            <div>
+              <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
+              <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
+              <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+            </div>
+          </el-scrollbar>
+        </div>
+      </div>
+    </div>
+    <div class="footer">
+      <el-select size="mini" style="float:right;margin:7px 30px 0 0" v-model="id" @change="handleChangeExample" placeholder="请选择">
+        <el-option
+          v-for="item in list"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+    </div>
+  </div>
+</template>
+
+<script>
+  import exhibitionBaseInformation from "@/components/ledger/details/detail/exhibitionBaseInformation";
+  import exhibitionFile from "@/components/ledger/details/detail/exhibitionFile";
+  import exhibitionImage from "@/components/ledger/details/detail/exhibitionImage";
+  import exhibitionVideo from "@/components/ledger/details/detail/exhibitionVideo";
+  import exhibitionCrux from "@/components/ledger/details/detail/exhibitionCrux";
+  import selectRadio from "@/components/ledger/details/detail/selectRadio";
+
+  import {getDataDictionary, queryProperty} from "@/api/scan/request";
+  import {mapGetters} from "vuex";
+  import tools from "@/utils/scan/tools"
+
+
+  export default {
+    name: "propertyDetails",
+    components: {
+      exhibitionBaseInformation,
+      exhibitionFile,
+      exhibitionImage,
+      selectRadio,
+      exhibitionCrux,
+      exhibitionVideo
+    },
+    created() {
+      this.id = this.$route.query.equipId;
+      this.name = this.$route.query.equipName;
+      this.code = this.$route.query.equipCode;
+      this.type = this.$route.query.type;
+      this.list = this.$route.query.data;
+      this.getData();
+      console.log(this.$route.query)
+    },
+    computed: {
+      ...mapGetters("layout", ["projectId", "secret", "userId"])
+    },
+    data() {
+      return {
+        id: '', //当前资产id
+        name: '', //当前资产本地名称
+        code: '', //当前资产的本地编码
+        type: '', //资产类型
+        list: [], //资产列表
+        pointData: [], //信息点数据
+        currentRadio: '',//当前选中的select
+        selectRadio: {
+          information: '设备信息点',
+          initRadio: '1',
+          radioList: [
+            {
+              value: '显示需采集信息点',
+              label: '1'
+            },
+            {
+              value: '显示有值信息点',
+              label: '2'
+            },
+            {
+              value: '显示全部信息点',
+              label: '3'
+            }
+          ]
+        },
+        exhibitionBaseInformation: {
+          information: {}
+        },
+        exhibitionFile: {
+          title: '文件',
+          list: {}
+        },
+        exhibitionCrux: {
+          title: '关键信息点:',
+          cruxArray: [],
+          allMessage: [],//全部信息点
+        },
+        exhibitionImage: {
+          title: '图片',
+          list: {}
+        },
+        exhibitionVideo: {
+          title: '视频',
+          list: {}
+        },
+        instance: {},//实例信息处理
+        isShowImage: true,
+        isShowVideo: true,
+        isShowFile: true,
+      }
+    },
+    methods: {
+      deepCopy(obj) {
+        return JSON.parse(JSON.stringify(obj))
+      },
+      cruxSuccess(){
+        this.getData()
+      },
+      // 获取表头和实例数据
+      getData () {
+        let params1 = {
+          data: {
+            Orders: "sort asc",
+            PageNumber: 1,
+            PageSize: 1000
+          },
+          type: this.type
+        }, params2 = {
+          Filters: `EquipID='${this.id}'`,
+        };
+        let promise1 = new Promise((resolve, reject) => {
+          getDataDictionary(params1, res => {
+            resolve(res)
+          })
+        })
+        let promise2 = new Promise((resolve, reject) => {
+          queryProperty(params2, res => {
+            resolve(res)
+          })
+        })
+        Promise.all([promise1, promise2]).then(values => {
+          this.pointData = values[0].Content;
+          this.exampleData = values[1].Content[0];
+          this.name = this.exampleData.EquipLocalName?this.exampleData.EquipLocalName:this.exampleData.EquipName?this.exampleData.EquipName:'';
+          this.code = this.exampleData.EquipLocalID?this.exampleData.EquipLocalID:'';
+          let obj = this.deepCopy(values[1].Content[0]);
+          obj = tools.flattenKeys(obj);
+          this.instance = obj;
+          this.handleRadios(1)
+          this.handleEnclosure() //处理图片视频文件信息
+        })
+      },
+      handleEnclosure() {
+        //图片文件处理,脱离radio控制
+        let isList = this.pointData
+        let isArr = []
+        isList.map(j => {
+          if (this.instance.hasOwnProperty(j.Path)) {
+            return {
+              ...j,
+              value: this.instance[j.Path]
+            }
+          }
+        })
+        isArr = isList.filter(k => k.value)
+        this.handlePicList(isArr)
+        this.handleFileList(isArr)
+      },
+      handleRadios(val) { //判断radio的值显示关键信息,基本信息,图片,文件
+        let arr = []
+        //关键信息点
+        this.exhibitionCrux.cruxArray = this.pointData.filter(i => i.KeyWord)
+        this.exhibitionCrux.cruxArray.map(i => {
+          if (this.instance.hasOwnProperty(i.Path)) {
+            return {
+              ...i,
+              value: this.instance[i.Path]
+            }
+          }
+        })
+        if (val == 1) { //需采集信息
+          arr = this.pointData.filter(i => i.Visible)
+
+          //  图片和的处理
+          // this.handlePicList(arr)
+          // //  文件处理
+          // this.handleFileList(arr)
+
+        } else if (val == 2) { //有值信息点
+          let list = this.pointData
+          list.map(j => {
+            if (this.instance.hasOwnProperty(j.Path)) {
+              return {
+                ...j,
+                value: this.instance[j.Path]
+              }
+            }
+            arr = list.filter(k => k.value)
+            // this.handlePicList(arr)
+            // this.handleFileList(arr)
+          })
+        } else { //全部信息点
+          arr = this.pointData
+          // this.handlePicList(arr)
+          // this.handleFileList(arr)
+        }
+        this.displayData(arr)
+      },
+      handlePicList(arr) {
+        let picObject = {}
+        //处理数据格式
+        arr.map(i => {
+          if(i.InputMode == 'F2') {
+            switch (i.Path) {
+              case 'LedgerParam.PhotoDoc.Drawing':
+              case 'LedgerParam.Siteinstall.InstallPic':
+              case 'LedgerParam.Siteinstall.InstallDrawing':
+              case 'LedgerParam.PhotoDoc.Nameplate':
+                if (this.instance.hasOwnProperty(i.Path)) {
+                  i.PicList = this.instance[i.Path]
+                }
+                if (picObject[i.InfoPointName]) {
+
+                } else {
+                  picObject[i.InfoPointName] = []
+                }
+                picObject[i.InfoPointName].push({
+                  ...i,
+                })
+                break;
+
+            }
+          }
+
+        })
+        //展示图片
+        this.exhibitionImage.list = picObject
+        let isArray = [] //获取图片数组
+        for (let i in picObject) {
+          if (Array.isArray(picObject[i])) {
+            let list = picObject[i]
+            list.forEach(i => {
+              if (i.PicList) {
+                isArray.push(...i.PicList)
+              }
+            })
+          }
+        }
+        let video = isArray.filter(i => i.Type =='video' && i.type == 'video' )
+        this.exhibitionVideo.list = video
+        //判断是否显示图片组件
+        this.isShowImage = isArray.length ? true : false
+        //判断是否显示video组件
+        this.isShowVideo = video.length ? true : false
+      },
+      handleFileList(arr) {
+        let picObject = {}
+        //处理数据格式
+        arr.map(i => {
+          if (i.InputMode == 'F2') {
+            switch (i.Path) {
+              case 'LedgerParam.InsuranceDoc.InsuranceFile':
+              case 'LedgerParam.PhotoDoc.Archive':
+              case 'LedgerParam.Siteinstall.CheckReport':
+                if (this.instance.hasOwnProperty(i.Path)) {
+                  i.fileList = this.instance[i.Path]
+                }
+                if (picObject[i.InfoPointName]) {
+
+                } else {
+                  picObject[i.InfoPointName] = []
+                }
+
+                picObject[i.InfoPointName].push({
+                  ...i,
+                })
+                break
+            }
+          }
+
+        })
+        //展示文件
+        this.exhibitionFile.list = picObject
+        let isArray = [] //获取文件数组
+        for (let i in picObject) {
+          if (Array.isArray(picObject[i])) {
+            let list = picObject[i]
+            list.forEach(i => {
+              if (i.fileList) {
+                isArray.push(...i.fileList)
+              }
+            })
+          }
+        }
+        //判断是否显示文件组件
+        this.isShowFile = isArray.length ? true : false
+      },
+      changeRadio(val) { //1,需采集,2,有值,3,全部
+        this.handleRadios(val)
+        this.currentRadio = val
+      },
+      formatDate(str) {
+        if(str) {
+          if(str.includes('-')) {
+            return str
+          }else {
+            return  str.substr(0,4)+"-"+str.substr(4,2)+"-"+str.substr(6,2)+" "+str.substr(8,2) + ":" +str.substr(10,2) + ":"+str.substr(12,2)
+          }
+        } else {
+          return '--'
+        }
+      },
+      displayData(arr) {//对数据进行处理传给组件展示
+        const result = {}
+        arr.forEach(i => {
+          if (this.instance.hasOwnProperty(i.Path) && this.currentRadio != 2) {
+            i.value = this.instance[i.Path]
+          }
+          if (i.InputMode == 'C5') {
+            if (this.instance.hasOwnProperty(i.Path)) {
+             let time = this.instance[i.Path]
+              i.value = this.formatDate(time)
+            }
+          }
+          if (i.DataSource && i.DataSource.length) {
+            let source = JSON.parse(i.DataSource)
+            //判断输入类型
+            if (i.InputMode == 'D1L') {
+              let d1l = tools.formatDataSource(i.DataSource)
+              d1l.forEach(k => {
+                if (k.Code == this.instance[i.Path]) {
+                  i.value = k.Name
+                }
+              })
+            } else if (i.InputMode == 'D2' || i.InputMode == 'C6') {
+              if (this.instance.hasOwnProperty(i.Path)) {
+                if (!Array.isArray(this.instance[i.Path])) {
+                  let transArray = this.instance[i.Path].split(',')
+                  i.value = source.filter(item => transArray.includes(item.Code)).map(item => item.Name).join(',')
+                }
+              }
+            }
+            source.forEach(j => {
+              if (j.Code == this.instance[i.Path]) {
+                console.log(j.Name)
+                i.value = j.Name
+              }
+            })
+          }
+          switch (i.InputMode) {
+            case "L":
+            case "L1":
+            case "L2":
+            case "M":
+              break;
+            default:
+              if (result[`${i.FirstName}${i.SecondName ? '/' + i.SecondName : ''}`]) {
+                result[`${i.FirstName}${i.SecondName ? '/' + i.SecondName : ''}`].paths.push({
+                  Path: i.Path,
+                  InfoPointName: i.InfoPointName,
+                  InfoPointCode: i.InfoPointCode,
+                  Value: i.value,
+                  Visible: i.Visible,
+                  KeyWord: i.KeyWord,
+                  InputMode:i.InputMode
+                })
+              } else {
+                result[`${i.FirstName}${i.SecondName ? '/' + i.SecondName : ''}`] = {
+                  paths: [{
+                    Path: i.Path,
+                    InfoPointName: i.InfoPointName,
+                    InfoPointCode: i.InfoPointCode,
+                    Value: i.value,
+                    Visible: i.Visible,
+                    KeyWord: i.KeyWord,
+                    InputMode:i.InputMode
+                  }]
+                }
+              }
+
+          }
+
+
+        })
+        this.exhibitionBaseInformation.information = result
+        this.exhibitionCrux.allMessage = result
+      },
+      goBack () {
+        this.$router.push({
+          name: 'propertyLedger',
+          params: {
+            Family: this.type
+          }
+        })
+      },
+      // 切换实例
+      handleChangeExample() {
+        this.selectRadio.initRadio = '1'
+        this.getData();
+      },
+    },
+    watch: {
+      projectId() {
+        this.$router.push({path: "/ledger/property"})
+      }
+    }
+  }
+</script>
+
+<style scoped lang="less">
+  @bgc: #fff;
+  .tableDisplay {
+    .header {
+      padding-bottom: 10px;
+      overflow: hidden;
+      text-overflow:ellipsis;
+      white-space: nowrap;
+      .details-title {
+        color: #333;
+        font-size: 16px;
+        margin-left: 20px;
+        line-height: 32px;
+        cursor: pointer;
+      }
+    }
+
+    .content {
+      display: flex;
+      flex-direction: row;
+      box-sizing: border-box;
+      height: calc(100% - 95px);
+      .content-left {
+        display: flex;
+        flex-direction: column;
+        flex: 1;
+        .content-keyPoint {
+          border: 1px solid #ccc;
+          box-sizing: border-box;
+          height: 100px;
+          margin-bottom: 10px;
+          overflow: hidden;
+          background: @bgc;
+        }
+        .content-showType {
+          height: 50px;
+          border: 1px solid #ccc;
+          border-bottom: none;
+          box-sizing: border-box;
+          background: @bgc;
+        }
+        .content-point {
+          display: flex;
+          flex-direction: row;
+          height: calc(100% - 160px);
+          border: 1px solid #ccc;
+          box-sizing: border-box;
+          background: @bgc;
+          .content-point-left {
+            flex: 1;
+          }
+        }
+      }
+      .content-right {
+        width: 400px;
+        margin-left: 10px;
+        .content-media {
+          height: 100%;
+          background: @bgc;
+          border: 1px solid #ccc;
+          box-sizing: border-box;
+        }
+      }
+    }
+
+    .footer {
+      margin-top: 5px;
+      height: 45px;
+      background-color: #fff;
+      box-sizing: border-box;
+      border: 1px solid #ccc;
+    }
+  }
+
+  /deep/ .el-scrollbar__wrap {
+    overflow-x: hidden;
+  }
+
+</style>

+ 90 - 71
src/views/ledger/spacelist/spaceDetail/index.vue

@@ -19,45 +19,48 @@
       </el-row>
       <div v-if="activeTab=='detail'"  class="content">
         <iframe v-if="params.isMyTab == 1" height="100%" width="100%" :src="iframeSrc"></iframe>
-        <div v-else class="content-left">
-          <div class="content-showType">
-            <selectRadio
-              :selectRadio="selectRadio"
-              @changeRadio="changeRadio"
-            />
-          </div>
-          <div class="content-point">
-            <div class="content-point-left">
-              <el-scrollbar style="height:100%;">
-                <div >
-                  <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+        <el-scrollbar v-else style="height:100%;">
+          <div class="content-scrollbar">
+            <div class="content-left">
+              <div class="content-showType">
+                <selectRadio
+                  :selectRadio="selectRadio"
+                  @changeRadio="changeRadio"
+                />
+              </div>
+              <div class="content-point">
+                <div class="content-point-left">
+                  <!-- <el-scrollbar style="height:100%;"> -->
+                    <!-- <div > -->
+                      <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+                    <!-- </div> -->
+                  <!-- </el-scrollbar> -->
                 </div>
-              </el-scrollbar>
-            </div>
-            <div class="content-point-right">
-              <el-scrollbar style="height:100%;">
-                <div>
-                  <exhibitionEnergy :exhibitionEnergy="exhibitionEnergy" />
+                <div class="content-point-right">
+                  <!-- <el-scrollbar style="height:100%;"> -->
+                    <!-- <div> -->
+                      <exhibitionEnergy :exhibitionEnergy="exhibitionEnergy" />
+                    <!-- </div> -->
+                  <!-- </el-scrollbar> -->
                 </div>
-              </el-scrollbar>
+              </div>
             </div>
-          </div>
-        </div>
-        <div class="content-right">
-          <div class="content-repair">
-            <exhibitionMaintain :exhibitionMaintain="exhibitionMaintain"/>
-
-          </div>
-          <div class="content-media">
-            <el-scrollbar style="height:100%;">
-              <div >
-                <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
-                <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
-                <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+            <div class="content-right">
+              <div class="content-repair">
+                <exhibitionMaintain :exhibitionMaintain="exhibitionMaintain"/>
+              </div>
+              <div class="content-media">
+                <!-- <el-scrollbar style="height:100%;"> -->
+                  <!-- <div > -->
+                    <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
+                    <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
+                    <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+                  <!-- </div> -->
+                <!-- </el-scrollbar> -->
               </div>
-            </el-scrollbar>
+            </div>
           </div>
-        </div>
+        </el-scrollbar>
       </div>
       <!-- 空间内设备列表--服务于空间的设备 -->
       <eqToSpaceTable v-else-if="activeTab=='Equipment' || activeTab=='EquipmentFor'" :params="params" :type="activeTab"></eqToSpaceTable>
@@ -98,6 +101,7 @@
         activeTab: 'detail', //当前选中的tab
         pointData: [], //信息点数据
         exampleData: {}, //实例数据
+        currentRadio: '1',//当前选中的select
         criterias: [], //动态参数
         instance: {},
         iframeSrc: '', //空间详情iframe
@@ -124,6 +128,7 @@
         },
         exhibitionEnergy: {
           title: '能耗信息',
+          firstName:'',
           dynamic: [],
         },
         exhibitionMaintain: {
@@ -209,6 +214,10 @@
           resolve(res)
         })
       })
+      // 数据初始化
+      this.exhibitionEnergy.dynamic = [];
+      this.criterias = [];
+
       Promise.all([promise1, promise2]).then(values => {
         this.pointData = values[0].Content;
         this.exampleData = values[1].Content[0];
@@ -216,7 +225,7 @@
         let obj = this.deepCopy(values[1].Content[0]);
         obj = tools.flattenKeys(obj);
         this.instance = obj;
-        this.handleRadios(1)
+        this.handleRadios(this.currentRadio)
         this.handleEnclosure() //处理图片视频文件信息
         this.pointData.forEach(item => {
           if (item.InputMode == "L" || item.InputMode == "L1" || item.InputMode == "L2" || item.InputMode == "M") {
@@ -241,6 +250,7 @@
             res.Content.map(child => {
               this.pointData.forEach(head => {
                 if (head.InfoPointCode == child.code) {
+                  this.exhibitionEnergy.firstName = head.FirstName;
                   this.exhibitionEnergy.dynamic.push({
                     InfoPointCode: head.InfoPointCode,
                     InfoPointName: head.InfoPointName,
@@ -522,6 +532,7 @@
 </script>
 
 <style scoped lang='less'>
+@bgc: #fff;
 .box {
   .condition {
     padding: 10px;
@@ -559,49 +570,57 @@
     }
 
     .content {
-      display: flex;
-      flex-direction: row;
-      box-sizing: border-box;
       height: calc(100% - 99px);
-      .content-left {
+      .content-scrollbar {
         display: flex;
-        flex-direction: column;
-        flex: 1;
-        .content-showType {
-          height: 50px;
-          border: 1px solid #ccc;
-          border-bottom: none;
-          box-sizing: border-box;
-        }
-        .content-point {
+        height: 100%;
+        flex-direction: row;
+        box-sizing: border-box;
+        background-color: @bgc;
+        .content-left {
           display: flex;
-          flex-direction: row;
-          height: calc(100% - 50px);
-          border: 1px solid #ccc;
-          box-sizing: border-box;
-          .content-point-left {
-            flex: 1;
+          flex-direction: column;
+          flex: 1;
+          .content-showType {
+            height: 50px;
+            border: 1px solid #ccc;
+            border-bottom: none;
+            box-sizing: border-box;
+            background: @bgc;
           }
-          .content-point-right {
-            width: 300px;
-            border-left: 1px solid #ccc;
+          .content-point {
+            display: flex;
+            flex-direction: row;
+            // height: calc(100% - 50px);
+            border: 1px solid #ccc;
+            box-sizing: border-box;
+            background: @bgc;
+            .content-point-left {
+              flex: 1;
+            }
+            .content-point-right {
+              width: 300px;
+              border-left: 1px solid #ccc;
+            }
           }
         }
-      }
-      .content-right {
-        width: 400px;
-        margin-left: 10px;
-        .content-repair {
-          height: 50px;
-          line-height: 50px;
-          margin-bottom: 10px;
-          border: 1px solid #ccc;
-          box-sizing: border-box;
-        }
-        .content-media {
-          height: calc(100% - 60px);
-          border: 1px solid #ccc;
+        .content-right {
+          width: 400px;
+          margin-left: 10px;
           box-sizing: border-box;
+          .content-repair {
+            height: 50px;
+            line-height: 50px;
+            margin-bottom: 10px;
+            border: 1px solid #ccc;
+            background: @bgc;
+            box-sizing: border-box;
+          }
+          .content-media {
+            // height: calc(100% - 60px);
+            // border: 1px solid #ccc;
+            box-sizing: border-box;
+          }
         }
       }
     }

+ 75 - 62
src/views/ledger/system/systemDetail/index.vue

@@ -18,37 +18,41 @@
         </div>
       </el-row>
       <div v-if="activeTab=='detail'" class="content">
-        <div class="content-left">
-          <div class="content-showType">
-            <selectRadio
-              :selectRadio="selectRadio"
-              @changeRadio="changeRadio"
-            />
-          </div>
-          <div class="content-point">
-            <div class="content-point-left">
-              <el-scrollbar style="height:100%;">
-                <div>
-                  <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+        <el-scrollbar style="height:100%;">
+          <div class="content-scrollbar">
+            <div class="content-left">
+              <div class="content-showType">
+                <selectRadio
+                  :selectRadio="selectRadio"
+                  @changeRadio="changeRadio"
+                />
+              </div>
+              <div class="content-point">
+                <div class="content-point-left">
+                  <!-- <el-scrollbar style="height:100%;"> -->
+                    <!-- <div> -->
+                      <exhibitionBaseInformation :exhibitionBaseInformation="exhibitionBaseInformation"/>
+                    <!-- </div> -->
+                  <!-- </el-scrollbar> -->
                 </div>
-              </el-scrollbar>
+              </div>
             </div>
-          </div>
-        </div>
-        <div class="content-right">
-          <div class="content-repair">
-            <exhibitionMaintain :exhibitionMaintain="exhibitionMaintain"/>
-          </div>
-          <div class="content-media">
-            <el-scrollbar style="height:100%;">
-              <div>
-                <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
-                <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
-                <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+            <div class="content-right">
+              <div class="content-repair">
+                <exhibitionMaintain :exhibitionMaintain="exhibitionMaintain"/>
+              </div>
+              <div class="content-media">
+                <!-- <el-scrollbar style="height:100%;"> -->
+                  <!-- <div> -->
+                    <exhibitionImage :exhibitionImage="exhibitionImage" v-show="isShowImage"/>
+                    <exhibitionVideo :exhibitionVideo="exhibitionVideo" v-show="isShowVideo"/>
+                    <exhibitionFile :exhibitionFile="exhibitionFile" v-show="isShowFile"/>
+                  <!-- </div> -->
+                <!-- </el-scrollbar> -->
               </div>
-            </el-scrollbar>
+            </div>
           </div>
-        </div>
+        </el-scrollbar>
       </div>
       <!-- 系统内设备 -->
       <deviceTable v-if="activeTab=='Equipment'" :params="params" :type="activeTab"></deviceTable>
@@ -97,7 +101,7 @@
         exampleData: {}, //实例数据
         spaceType: {},//空间种类
         floorType: {},
-        currentRadio: '',//当前选中的select
+        currentRadio: '1',//当前选中的select
         selectRadio: {
           information: '设备信息点',
           initRadio: '1',
@@ -239,7 +243,7 @@
         let obj = this.deepCopy(values[1].Content[0]);
         obj = tools.flattenKeys(obj);
         this.instance = obj;
-        this.handleRadios(1)
+        this.handleRadios(this.currentRadio)
         this.handleEnclosure() //处理图片视频文件信息
       })
     },
@@ -496,6 +500,7 @@
 </script>
 
 <style scoped lang='less'>
+@bgc: #fff;
 .box {
   .condition {
     padding: 10px;
@@ -532,45 +537,53 @@
       }
     }
     .content {
-      display: flex;
-      flex-direction: row;
-      box-sizing: border-box;
       height: calc(100% - 99px);
-      .content-left {
+      .content-scrollbar {
         display: flex;
-        flex-direction: column;
-        flex: 1;
-        .content-showType {
-          height: 50px;
-          border: 1px solid #ccc;
-          border-bottom: none;
-          box-sizing: border-box;
-        }
-        .content-point {
+        height: 100%;
+        flex-direction: row;
+        box-sizing: border-box;
+        background-color: @bgc;
+        .content-left {
           display: flex;
-          flex-direction: row;
-          height: calc(100% - 50px);
-          border: 1px solid #ccc;
-          box-sizing: border-box;
-          .content-point-left {
-            flex: 1;
+          flex-direction: column;
+          flex: 1;
+          .content-showType {
+            height: 50px;
+            border: 1px solid #ccc;
+            border-bottom: none;
+            box-sizing: border-box;
+            background: @bgc;
+          }
+          .content-point {
+            display: flex;
+            flex-direction: row;
+            // height: calc(100% - 50px);
+            border: 1px solid #ccc;
+            box-sizing: border-box;
+            background: @bgc;
+            .content-point-left {
+              flex: 1;
+            }
           }
         }
-      }
-      .content-right {
-        width: 400px;
-        margin-left: 10px;
-        .content-repair {
-          height: 50px;
-          line-height: 50px;
-          margin-bottom: 10px;
-          border: 1px solid #ccc;
-          box-sizing: border-box;
-        }
-        .content-media {
-          height: calc(100% - 60px);
-          border: 1px solid #ccc;
+        .content-right {
+          width: 400px;
+          margin-left: 10px;
           box-sizing: border-box;
+          .content-repair {
+            height: 50px;
+            line-height: 50px;
+            margin-bottom: 10px;
+            border: 1px solid #ccc;
+            background: @bgc;
+            box-sizing: border-box;
+          }
+          .content-media {
+            // height: calc(100% - 60px);
+            // border: 1px solid #ccc;
+            box-sizing: border-box;
+          }
         }
       }
     }

+ 1 - 1
src/views/model/report/index.vue

@@ -228,7 +228,7 @@
     },
     getModelFloorCount() {// 获取楼层模型文件数量,计算出检查出问题的模型文件
       let promise1 = new Promise(resolve => {
-        queryFloorList({}, res => {
+        queryFloorList({Filters:"Status=4"}, res => {
           resolve(res);
         })
       })