Преглед на файлове

业务空间台账-辅助屏

yangjunjing преди 5 години
родител
ревизия
6e188591ab

+ 12 - 5
src/components/business_space/newTables/eqToSpaceTable.vue

@@ -1,12 +1,12 @@
 <template>
   <div id="eqInSp">
-    <el-row>
+    <el-row v-show="hidden">
       <el-button type="primary" @click="add">添加{{inSpaceType}}</el-button>
       <el-tooltip class="item" effect="dark" :content="`可前往“全部关系总览”中,按坐标计算${typeToTips[type]}`" placement="right">
         <el-button>按空间计算</el-button>
       </el-tooltip>
     </el-row>
-    <div class="table-box">
+    <div class="table-box" :style="heightData">
       <el-table :data="tableData" style="width: 100%" height="100%" v-loading="loading" :header-cell-style="headerStyle">
         <el-table-column :label="`${inSpaceType}名称`" show-overflow-tooltip min-width="100">
           <template slot-scope="scope">
@@ -31,7 +31,7 @@
           </template>
         </el-table-column>
         <template slot="empty">
-          <div style="height: 60%;transform: translateY(50%);">
+          <div style="height: 60%;transform: translateY(50%);lineHeight:20px;">
             <i class="icon-wushuju iconfont"></i>
             可前往“全部关系总览”中,按坐标计算{{typeToTips[type]}}
           </div>
@@ -71,7 +71,9 @@ export default {
       typeToTips: {
         Equipment: '空间内的设备',
         EquipmentFor: '服务于空间的设备',
-      }
+      },
+      hidden: true,
+      heightData: "height:calc(100% - 50px)"
     };
   },
   props: {
@@ -80,6 +82,7 @@ export default {
   },
   created() {
     this.getTableData()
+    this.changeContentStyle();
   },
   methods: {
     // 删除关系
@@ -152,6 +155,11 @@ export default {
     add() {
       this.$refs.addEqDialog.floor = [this.params.BuildingId, this.params.FloorId];
       this.$refs.addEqDialog.showDialog()
+    },
+    changeContentStyle(){
+      // 在辅助屏不显示添加按钮,动态设置高度
+      this.$route.query.isMyTab?this.hidden = true:this.hidden = false;
+      this.heightData = "height:750px";
     }
   },
   watch: {
@@ -166,7 +174,6 @@ export default {
   height: 100%;
   .table-box {
     margin-top: 10px;
-    height: calc(100% - 50px);
   }
 }
 </style>

+ 13 - 5
src/components/business_space/newTables/syInSpaceTable.vue

@@ -1,12 +1,12 @@
 <template>
   <div id="eqInSp">
-    <el-row>
+    <el-row v-show="hidden">
       <el-button type="primary" @click="add">添加{{inSpaceType}}</el-button>
       <el-tooltip class="item" effect="dark" :content="`可前往“全部关系总览”中,按坐标计算${typeToTips[type]}`" placement="right">
         <el-button>按空间计算</el-button>
       </el-tooltip>
     </el-row>
-    <div class="table-box">
+    <div class="table-box" :style="heightData">
       <el-table :data="tableData" style="width: 100%" height="100%" v-loading="loading" :header-cell-style="headerStyle">
         <el-table-column :label="`${inSpaceType}名称`" show-overflow-tooltip min-width="100">
           <template slot-scope="scope">
@@ -24,7 +24,7 @@
           </template>
         </el-table-column>
         <template slot="empty">
-          <div style="height: 60%;transform: translateY(50%);">
+          <div style="height: 60%;transform: translateY(50%);lineHeight:20px;">
             <i class="icon-wushuju iconfont"></i>
             可前往“全部关系总览”中,按坐标计算{{typeToTips[type]}}
           </div>
@@ -61,7 +61,9 @@ export default {
       tableData: [], //列表数据
       typeToTips: {
         generalSystem: '空间内的系统',
-      }
+      },
+      hidden: true,
+      heightData: "height:calc(100% - 50px)"
     };
   },
   props: {
@@ -69,7 +71,8 @@ export default {
     type: {}
   },
   created() {
-    this.getTableData()
+    this.getTableData();
+     this.changeContentStyle();
   },
   methods: {
     // 删除关系
@@ -115,6 +118,11 @@ export default {
     // 添加系统
     add() {
       this.$refs.addSyDialog.showDialog()
+    },
+    changeContentStyle(){
+      // 在辅助屏不显示添加按钮,动态设置高度
+      this.$route.query.isMyTab?this.hidden = true:this.hidden = false;
+      this.heightData = "height:750px";
     }
   },
   watch: {

+ 50 - 13
src/views/screen/splitscreen/spaceledger/index.vue

@@ -19,13 +19,14 @@
             </div>
             <div class="aside-top-right">
               <p><b>空间二维码:</b><span v-if="!spaceDetails.RoomQRCode">-</span></p>
-              <!-- <img src="./1.png" alt="" v-if="spaceDetails.QrCode"> -->
               <img :src="'/image-service/common/file_get/'+ spaceDetails.RoomQRCode +'?systemId=dataPlatform'" alt="二维码图片"
                 v-if="spaceDetails.RoomQRCode">
             </div>
           </div>
-          <div>
+          <div v-if="spaceDetails.Outline && spaceDetails.Outline.length">
             <p><b>位置图片:</b></p>
+            <!-- <graphy @getSp="checkSpace" @dimension="checkSpace" @businessDetails="getBuinessDetails" ref="graphy"></graphy> -->
+            <graphy ref="graphy"></graphy>
           </div>
         </el-aside>
         <el-main>
@@ -41,10 +42,19 @@
                   <!-- <iframe height="100%" width="100%" :src="iframeSrc"></iframe> -->
                 </div>
                 <!-- 对象关系 -->
-                <div v-if="activeTab === 'objectRelationship'" style="width:100%">
-                  <!-- <iframe height="100%" width="100%" :src="iframeSrc"></iframe>
-                  <iframe height="100%" width="100%" :src="iframeSrc"></iframe>
-                  <iframe height="100%" width="100%" :src="iframeSrc"></iframe> -->
+                <div v-if="activeTab === 'objectRelationship'" class="objectRelationship">
+                  <div class="objectRelationship-left">
+                    <h5>空间内设备:</h5>
+                    <eqToSpaceTable :params="params" type="Equipment"></eqToSpaceTable>
+                  </div>
+                  <div class="objectRelationship-center">
+                    <h5>服务于空间的设备:</h5>
+                    <eqToSpaceTable :params="params" type="EquipmentFor"></eqToSpaceTable>
+                  </div>
+                  <div class="objectRelationship-right">
+                    <h5>空间内系统:</h5>
+                    <syInSpaceTable :params="params" type="generalSystem"></syInSpaceTable>
+                  </div>
                 </div>
               </el-tab-pane>
             </template>
@@ -58,6 +68,9 @@
 <script>
 import { mapGetters } from 'vuex'
 import { queryZone, getAllbusiness } from '@/api/scan/request'
+import graphy from "@/components/business_space/newGraphy/graphy";
+import eqToSpaceTable from '@/components/business_space/newTables/eqToSpaceTable'
+import syInSpaceTable from '@/components/business_space/newTables/syInSpaceTable'
 
 export default {
   data() {
@@ -70,12 +83,19 @@ export default {
       activeTab: 'staticData',
       spaceDetails: {},
       iframeSrc: '',
-      projectId: ''
+      projectId: '',
+      params: {}
     }
   },
+  components: {
+    graphy,
+    eqToSpaceTable,
+    syInSpaceTable
+  },
   created() {
-    if (this.$route.query.RoomID && this.$route.query.zone) {
+    if (this.$route.query.RoomID && this.$route.query.zone && !this.$route.query.isMyTab) {
       this.getData();
+      this.params = this.$route.query;
     }
   },
   computed: {
@@ -83,7 +103,7 @@ export default {
   },
   methods: {
     getData() {
-      // 获取空间信息
+      // 获取空间数据
       let params = {
         data: {
           Filters: `RoomID="${this.$route.query.RoomID}"`
@@ -91,22 +111,28 @@ export default {
         zone: this.$route.query.zone
       }
       queryZone(params, res => {
+        console.log(res, 1111111)
         this.spaceDetails = res.Content[0];
         if (this.$route.query.RoomID && this.$route.query.zone) {
           this.setFrame();
+          this.getSpaceImg();
         }
       })
     },
-    // 设置静态数据tab的iframe地址
     setFrame() {
+      // 设置静态数据tab的iframe地址
       this.projectId = localStorage.getItem('projectId');
-      document.getElementById("staticData").contentWindow.location.reload(true);
+      // document.getElementById("staticData").contentWindow.location.reload(true);
       this.iframeSrc = `${process.env.BASE_URL}:8889/#/details?perjectId=${this.projectId}&secret=${this.secret}&FmId=${this.$route.query.RoomID}&type=0&code=${this.$route.query.zone}`
+    },
+    getSpaceImg() {
+      // 获取空间位置图片
+      console.log(this.spaceDetails, 222222)
     }
   },
   watch: {
-    // 监听路由地址,并判断有RoomID和zone,重新请求空间
-    "$route"(){
+    // 监听路由地址,并判断有RoomID和zone,重新请求空间数据
+    "$route"() {
       if (this.$route.query.RoomID && this.$route.query.zone) {
         this.getData();
       }
@@ -164,6 +190,17 @@ export default {
   color: #333;
   text-align: center;
 }
+.objectRelationship {
+  display: flex;
+  .objectRelationship-left,
+  .objectRelationship-center,
+  .objectRelationship-right {
+    flex: 1;
+    margin-right: 10px;
+    text-align: left;
+    height: 100%;
+  }
+}
 .el-tabs__content {
   height: 750px;
 }