Browse Source

modify business space canvas version

haojianlong 5 years ago
parent
commit
d951d9ddd0

+ 1 - 1
package.json

@@ -23,7 +23,7 @@
         "vue-axios": "^2.1.4",
         "vue-router": "^3.0.1",
         "vuex": "^3.1.0",
-        "cad-engine": "2.0.56"
+        "cad-engine": "2.0.176"
     },
     "devDependencies": {
         "ajv": "^6.9.1",

+ 7 - 0
src/api/scan/request.js

@@ -1194,6 +1194,13 @@ export function updateZone(param, success) {
     http.postJson(url, data, success)
 }
 
+//根据条件查询统计数量
+export function countZone(param, success) {
+    let data = param.data
+    let url = `${baseUrl}/datacenter/${zone[param.zone]}/count`;
+    http.postJson(url, data, success)
+}
+
 //动态数据关联-查询对应关系(删除提示页)
 export function dynamicQueryPrompt(param, success) {
     let url = `${baseUrl}/pointconfig/dynamic/query-prompt`;

+ 99 - 50
src/components/business_space/newGraphy/graphy.vue

@@ -1,58 +1,71 @@
 <template>
-  <div id="graphy">
-    <div class="canvas-box">
-      <canvas id="canvas" :width="canvasWidth" :height="canvasHeight"></canvas>
-    </div>
-    <!-- 初始两个按钮 -->
-    <el-row class="buttons-box">
-      <div>
-        <el-autocomplete popper-class="my-autocomplete" v-model="search" :fetch-suggestions="querySearch" placeholder="输入平面图中已有的业务空间名称进行查找"
-          width="180px" @select="handleSelect">
-          <i class="el-icon-search el-input__icon" slot="suffix" @click="handleIconClick"></i>
-          <template slot-scope="{ item }">
-            <div class="name" style="position: relative;">
-              {{ item.infos.RoomLocalName | cutString(8) }}
-              <span class="addr" style="position: absolute;right:10px;color:#409EFF;">定位</span>
-            </div>
-          </template>
-        </el-autocomplete>
+  <div id="graphy" ref="graphy">
+    <div v-show="!FloorMap">
+      <div class="center" v-show="1" style="height: 400px;padding-top:182px;box-sizing:border-box;">
+        <i class="icon-wushuju iconfont"></i>
+        暂无数据
       </div>
-      <div class="button-group">
-        <!-- 默认操作模式 -->
-        <div v-show="type==1">
-          <el-button @click="1">创建业务空间</el-button>
-        </div>
-        <!-- 点击已经关联的业务空间 -->
-        <div v-show="type==2">
-          <el-button type="primary" plain>重新划分业务空间</el-button>
-          <el-button type="primary">编辑空间详情</el-button>
-          <el-button plain>取 消</el-button>
+    </div>
+    <div class="canvas-box" v-show="FloorMap">
+      <canvas id="canvas" :width="canvasWidth" :height="canvasHeight"></canvas>
+      <!-- 初始两个按钮 -->
+      <el-row class="buttons-box">
+        <div>
+          <el-autocomplete popper-class="my-autocomplete" v-model="search" :fetch-suggestions="querySearch" placeholder="输入平面图中已有的业务空间名称进行查找"
+            width="180px" @select="handleSelect">
+            <i class="el-icon-search el-input__icon" slot="suffix" @click="handleIconClick"></i>
+            <template slot-scope="{ item }">
+              <div class="name" style="position: relative;">
+                {{ item.infos.RoomLocalName | cutString(8) }}
+                <span class="addr" style="position: absolute;right:10px;color:#409EFF;">定位</span>
+              </div>
+            </template>
+          </el-autocomplete>
         </div>
-        <!-- 点击未关联的业务空间 -->
-        <div v-show="type==3">
-          <el-button plain>创建业务空间</el-button>
-          <el-button type="primary">从未关联元空间的业务空间中选择</el-button>
+        <div class="button-group">
+          <!-- 默认操作模式 -->
+          <div v-show="type==1">
+            <el-button @click="1">创建业务空间</el-button>
+          </div>
+          <!-- 点击已经关联的业务空间 -->
+          <div v-show="type==2">
+            <el-button type="primary" plain>重新划分业务空间</el-button>
+            <el-button type="primary">编辑空间详情</el-button>
+            <el-button plain>取 消</el-button>
+          </div>
+          <!-- 点击未关联的业务空间 -->
+          <div v-show="type==3">
+            <el-button plain>创建业务空间</el-button>
+            <el-button type="primary">从未关联元空间的业务空间中选择</el-button>
+          </div>
+          <!-- 重新划分业务空间 -->
+          <div v-show="type==4">
+            <el-button type="primary" plain>从未关联元空间的业务空间中选择</el-button>
+            <el-button plain>取 消</el-button>
+            <el-button type="primary">保存</el-button>
+          </div>
         </div>
-        <!-- 重新划分业务空间 -->
-        <div v-show="type==4">
-          <el-button type="primary" plain>从未关联元空间的业务空间中选择</el-button>
-          <el-button plain>取 消</el-button>
-          <el-button type="primary">保存</el-button>
+        <div style="position: absolute;right: 0;">
+          <el-button type="text">未关联平面图的业务空间 {{num}} 条</el-button>
         </div>
-      </div>
-      <div style="position: absolute;right: 0;">
-        <el-button type="text">未关联元空间的业务空间 {{num}} 条</el-button>
-      </div>
-    </el-row>
-    <!-- 底部操作按钮 -->
-    <el-row class="canvas-actions-box">
-      <canvasFun></canvasFun>
-    </el-row>
+      </el-row>
+      <!-- 底部操作按钮 -->
+      <el-row class="canvas-actions-box">
+        <canvasFun></canvasFun>
+      </el-row>
+    </div>
     <!--  -->
   </div>
 </template>
 <script>
 import canvasFun from "./canvasFun"
+import { mapGetters, mapActions } from "vuex";
+import {
+  countZone,
+  queryZone,
+  updateZone,
+  createZone
+} from "@/api/scan/request"
 export default {
   components: {
     canvasFun
@@ -63,16 +76,46 @@ export default {
       canvasHeight: 600,
       type: 1, // 默认操作模式
       search: '',//搜索
+      num: 0, // 未关联空间的业务空间条数
+      FloorMap: '',
     }
   },
+  computed: {
+    ...mapGetters('layout', ['projectId'])
+  },
   created() {
-
+  },
+  mounted() {
+    this.canvasWidth = this.$refs.graphy.clientWidth;
+    this.canvasHeight = this.$refs.graphy.clientHeight;
   },
   methods: {
     // 搜索
     querySearch() { },
     // 选中
-    handleSelect() { }
+    handleSelect() { },
+    // 
+    handleIconClick() { },
+    // 
+    getData(buildFloor, FloorMap, tab) {
+      this.FloorMap = FloorMap;
+      this.tab = tab;
+      this.buildFloor = buildFloor;
+      this.getUnrelateCount()
+    },
+    // 获取未关联平面图的业务空间统计
+    getUnrelateCount() {
+      let pa = {
+        data: {
+          Filters: `BuildingId='${this.buildFloor[0]}';FloorId='${this.buildFloor[1]}';Outline isNull`
+        },
+        zone: this.tab.code
+      }
+      countZone(pa, res => {
+        this.num = res.Count
+      })
+    },
+
   },
   filters: {
     cutString: function (str, len) {
@@ -84,6 +127,12 @@ export default {
       }
     }
   },
+  watch: {
+    projectId() {
+      this.FloorMap = '';
+      this.tab = {};
+    }
+  }
 }
 </script>
 <style lang="less" scoped>
@@ -99,16 +148,16 @@ export default {
     position: absolute;
     top: 0;
     width: 100%;
-    z-index: 99999999;
+    z-index: 999;
     & > div {
       float: left;
     }
-    /deep/ .el-autocomplete{
+    /deep/ .el-autocomplete {
       display: block;
       width: 320px;
       margin-right: 10px;
     }
-    .button-group button{
+    .button-group button {
       display: block;
       float: left;
     }

+ 3 - 2
src/views/ledger/spacelist/index.vue

@@ -112,6 +112,7 @@ export default {
         children: "Floor"
       },
       floorToMap: {}, //楼层及其对应的模型图
+      FloorMap: "", //当前选中的楼层平面图
       buildFloorSelectd: [], //当前所选的建筑楼层
     };
   },
@@ -188,6 +189,7 @@ export default {
       if (!this.floorToMap[val[1]]) {
         this.isMyTab = 2;
       }
+      this.FloorMap = this.floorToMap[val[1]];
       this.changeGraphyOrTable(this.isMyTab)
     },
     // 判断切换至图还是表
@@ -200,8 +202,7 @@ export default {
       if (num == 2) {
         this.initMessage();
       } else {
-        let data = this.getItemForType()
-        this.$refs["graphy"].getData(this.buildMess.map, this.buildMess, this.activeTabType);
+        this.$refs.graphy.getData(this.buildFloorSelectd, this.FloorMap, this.activeTabType);
       }
     },
     // 触发获取表头-获取初始化信息点