竖井业务空间类型

src/components/ledger/cenote/dialog/addSpaceDialog.vue

@@ -0,0 +1,225 @@
+
+<template>
+  <el-dialog :title="title" :visible.sync="dialog" :before-close="handleClose" width="900px" id="addEqDialog">
+    <el-row class="filters">
+      <el-col :span="7" style="width:268px;padding:0px;">
+        <el-input style placeholder="输入业务空间名称、本地编码进行查询" v-model="keycode" clearable @keyup.enter.native="getTableData">
+          <i slot="suffix" class="el-input__icon el-icon-search" @click="getTableData"></i>
+        </el-input>
+      </el-col>
+      <el-col :span="8.5" style="padding:0 0;margin-left:-2px">
+        <floor-cascader ref="floorcas" @change="changeFloor"></floor-cascader>
+      </el-col>
+      <el-col :span="7.5" style="padding:0 0;">
+        <space-select ref="spacesel" @change="changeSpace"></space-select>
+      </el-col>
+    </el-row>
+    <el-row class="filters" :gutter="20"></el-row>
+    <div class="table-box">
+      <el-table :data="tableData" style="width: 100%" height="350" v-loading="loading" :header-cell-style="headerStyle" ref="multipleTable"
+        @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55"></el-table-column>
+        <el-table-column :label="`${inSpaceType}本地名称`" show-overflow-tooltip min-width="100">
+          <template slot-scope="scope">
+            {{scope.row.RoomLocalName||scope.row.RoomName||''}}
+          </template>
+        </el-table-column>
+        <el-table-column prop="RoomLocalID" :label="`${inSpaceType}本地编码`" show-overflow-tooltip min-width="100"></el-table-column>
+        <el-table-column prop :label="`所属建筑楼层`" show-overflow-tooltip min-width="100">
+          <template slot-scope="scope">
+            {{ scope.row.BuildingId && floorType[scope.row.BuildingId]? ((floorType[scope.row.BuildingId] || '') + (scope.row.FloorId && floorType[scope.row.FloorId] ? (' - ' + floorType[scope.row.FloorId] || '') : '')) : ''}}
+          </template>
+        </el-table-column>
+        <el-table-column prop="ObjectType" :label="`空间类型`" show-overflow-tooltip min-width="100">
+          <template slot-scope="scope">
+            {{spaceType[scope.row.ObjectType] || ''}}
+          </template>
+        </el-table-column>
+        <el-table-column prop="action" label="操作" min-width="100">
+          <template slot-scope="scope">
+            <el-button size="mini" @click="toDetail(scope.$index, scope.row)" plain>查看详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <el-pagination class="fr" v-show="tableData && tableData.length" @size-change="handleSizeChange" @current-change="handleCurrentChange"
+        :current-page="page.pageNumber" :page-sizes="page.pageSizes" :page-size="page.pageSize" layout="total, sizes, prev, pager, next, jumper"
+        :total="page.total"></el-pagination>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button size="small" @click="handleClose">取 消</el-button>
+      <el-button size="small" type="primary" @click="savaRelation">确 定</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import {
+  unSysZoneSpace,
+  linkSysSp,
+  queryDictionaryHead
+} from "@/api/scan/request";
+import floorCascader from "@/components/ledger/lib/floorCascader";
+import dictionaryCas from "@/components/config_point/dictionaryCascader";
+import spaceSelect from "@/components/ledger/lib/spaceSelect";
+import { mapGetters } from "vuex";
+export default {
+  components: {
+    floorCascader,
+    dictionaryCas,
+    spaceSelect
+  },
+  computed: {
+    ...mapGetters("layout", ["projectId"]),
+    dialog() {
+      return this.dialogVisible;
+    }
+  },
+  data() {
+    return {
+      title: "添加系统所在业务空间",
+      keycode: "", //输入查询条件
+      inSpaceType: "业务空间",
+      Buildfloor: ["all"], // 选中的建筑楼层
+      Spacecategory: null, // 选中的业务空间类型
+      tableData: [],
+      floorData: {}, //楼层
+      spaceData: {}, //业务空间分区
+      loading: false,
+      selections: [], // 选中项
+      page: {
+        pageSize: 50,
+        pageSizes: [10, 20, 50, 100],
+        pageNumber: 1,
+        total: 0
+      },
+      headerStyle: {
+        backgroundColor: "#e1e4e5",
+        color: "#2b2b2b",
+        lineHeight: "30px"
+      } // 列表样式
+    };
+  },
+  props: {
+    params: Object, //查看的竖井关系信息
+    spaceType: Object,
+    dialogVisible: Boolean,
+    floorType: Object
+  },
+  mounted() { },
+  methods: {
+    // 显示弹窗
+    showDialog() {
+      this.dialogVisible = true;
+    },
+    //修改建筑楼层
+    changeFloor(value) {
+      this.Buildfloor = value;
+      this.getTableData();
+    },
+    //修改空间类型
+    changeSpace(value) {
+      this.Spacecategory = value;
+      this.getTableData();
+    },
+    getTableData() {
+      let params = {
+        data: {
+          Filters: "not RoomID isNull",
+          Orders: "RoomLocalName desc",
+          PageNumber: this.page.pageNumber,
+          PageSize: this.page.pageSize
+        },
+        shaftId: this.params.ShaftID,
+        sysId: this.$route.query.SysID
+      };
+      if (this.Buildfloor[0] == "noKnow") {
+        params.data.Filters += `;buildingId isNull`;
+      } else if (this.Buildfloor[0] && this.Buildfloor[0] != "all") {
+        params.data.Filters += `;buildingId='${this.Buildfloor[0]}'`;
+      }
+      if (this.Buildfloor[1] == "noKnow") {
+        params.data.Filters += `;floorId isNull`;
+      } else if (this.Buildfloor[1] && this.Buildfloor[1] != "all") {
+        params.data.Filters += `;floorId='${this.Buildfloor[1]}'`;
+      }
+      if (this.Spacecategory) {
+        params.data.Filters += `;ObjectType='${this.Spacecategory}'`;
+      }
+      if (this.keycode != "") {
+        params.data.Filters += `;RoomName contain '${this.keycode}' or RoomLocalName contain '${this.keycode}'`;
+      }
+
+      unSysZoneSpace(params, res => {
+        this.tableData = res.Content;
+        this.page.total = res.Total;
+      });
+    },
+    handleClose() {
+      this.$emit("update:dialogVisible", false);
+    },
+    //选中项修改
+    handleSelectionChange(val) {
+      this.selections = val;
+    },
+    savaRelation() {
+      if (this.selections.length) {
+        let params = {
+          Content: this.selections.map(item => {
+            return {
+              SpaceID: item.RoomID,
+              SysID: this.$route.query.SysID,
+              ObjectType: item.ObjectType
+            };
+          })
+        };
+        linkSysSp(params, res => {
+          this.$message.success("关联成功！");
+          this.$emit("refresh");
+        });
+      } else {
+        this.$message("请选择要关联的设备");
+      }
+    },
+    //改变pagesize
+    handleSizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+      this.getTableData();
+    },
+    //改变pageno
+    handleCurrentChange(pageNo) {
+      this.page.pageNumber = pageNo;
+      this.getTableData();
+    },
+    // 查看详情
+    toDetail() {
+      this.$message("开发中");
+    }
+  },
+  watch: {
+    dialogVisible: {
+      handler() {
+        if (this.dialogVisible) {
+          this.page.pageNumber = 1;
+          this.tableData = [];
+          this.getTableData();
+        }
+      },
+      immediate: true
+    }
+  }
+};
+</script>
+<style lang="less" scoped>
+#addEqDialog {
+  .filters {
+    margin: 0 0 10px 0;
+  }
+  .table-box {
+    height: 370px;
+    .fr {
+      margin-top: 10px;
+    }
+  }
+}
+</style>

src/components/ledger/system/table/spaceTable.vue

@@ -35,7 +35,7 @@
       </el-table>
     </div>
     <!-- 添加空间弹窗 -->
-    <addSpaceDialog :dialogVisible.sync="dialogVisible" ref="addSpaceDialog" @refresh="refresh" :type="type" :params="params" :spaceType="spaceType"
+    <addSpaceDialog :dialogVisible.sync="dialogVisible" ref="addSpaceDialog" @refresh="refresh" :params="params" :spaceType="spaceType"
       :floorType="floorType"></addSpaceDialog>
   </div>
 </template>

src/views/ledger/cenotelist/index.vue

@@ -347,10 +347,9 @@ export default {
       this.shaftId = infos.ShaftID //要操作的数据id
       //点击关联的元空间
       if (val === "SpaceCount") {
-        infos.onlyRead = this.onlyRead;
         this.$router.push({
           path:'/ledger/relatedSpace',
-          query:{infos: infos}
+          query:{ShaftId: this.shaftId,name:name,onlyRead:this.onlyRead}
         })
         return false
       } else if (val === "OtheRelations") {

src/views/ledger/cenotelist/relatedSpace.vue

@@ -3,14 +3,15 @@
     <div class="condition">
       <div class="header">
         <el-button style="float:left;" size="small" type="default" icon="el-icon-back" @click="goBack"></el-button>
-        <span style="float:left;">{{ cenoteObj.ShaftLocalName || cenoteObj.ShaftName || '' }}</span>
+        <span style="float:left;">{{ cenoteObj.name || '' }}</span>
         <div class="edit-tool" v-if="!cenoteObj.onlyRead">
-          <el-button v-if="isMyTab == 2" size="small" style="float:right">添加</el-button>
+          <el-button v-if="isMyTab == 2" size="small" style="float:right" @click="dialogVisible = true">添加</el-button>
           <div v-else>
             <el-button v-show="!isEdit" @click="isEdit = true" size="small" style="float:right">编辑</el-button>
             <el-button v-show="isEdit" size="small" style="float:right">保存</el-button>
             <el-button v-show="isEdit" size="small" @click="isEdit = false" style="float:right">取消</el-button>
           </div>
+          <addSpaceDialog :dialogVisible.sync="dialogVisible" ref="addSpaceDialog" @refresh="refresh" :params="cenoteObj" :spaceType="spaceType" :floorType="floorType"></addSpaceDialog>
         </div>
         <space-select @change="changeSpace"></space-select>
       </div>
@@ -21,9 +22,19 @@
         </el-radio-group>
       </div>
       <div v-show="isMyTab == 1" class="data-item">
-        <el-select v-model="floor" placeholder="请选择楼层" >
-          <el-option v-for="item in floorList" :key="item.value" :label="item.label" :value="item.value"></el-option>
+        <el-select v-model="building" placeholder="请选择建筑" @change="changeBuilding">
+          <el-option v-for="item in buildingList" :key="item.value" :label="item.BuildLocalName" :value="item.BuildID"></el-option>
         </el-select>
+        <div style="height:calc(100% - 42px);margin:10px 0 0 0;width:100%;position:relative;">
+          <el-scrollbar style="height:100%;width:149px;border-right:1px solid;margin:0px;">
+          <div class="floor" style="width:149px;height:100%;">
+            <span class="floor-item">楼 层</span>
+            <div v-if="building">
+            <span class="floor-item" @click="changeFloor(item.FloorID)" :class="{floorItemChoose:(item.FloorID == floor)}" v-for="item in buildingObj.Floor" :key="item.FloorID">{{ item.FloorLocalName }}</span>
+            </div>
+          </div>
+          </el-scrollbar>
+        </div>
       </div>
       <div v-show="isMyTab == 2" class="data-item">
         <related-spaceList :space="space" ref="spacelist"></related-spaceList>
@@ -34,31 +45,77 @@
 
 <script>
 import spaceSelect from "@/components/ledger/lib/spaceSelect";
-import relatedSpaceList from "@/views/ledger/cenotelist/relatedSpaceList"
+import relatedSpaceList from "@/views/ledger/cenotelist/relatedSpaceList";
+import addSpaceDialog from '@/components/ledger/cenote/dialog/addSpaceDialog';
+import { queryDictionaryHead, buildingQuery } from '@/api/scan/request'
 export default {
   data() {
     return {
       isMyTab: 1,//默认平面图
       isEdit: false,//是否正在编辑
-      floor:'',//楼层
-      floorList:[],
-      space:'',//当前业务空间
+      building: '',//当前建筑id
+      buildingObj:{},//当前建筑obj
+      buildingList: [],
+      space: '',//当前业务空间
+      floor: '',//当前楼层
+      dialogVisible: false,//添加空间弹窗
+      spaceType: {},//空间种类
+      floorType: {},//子组件楼层信息
     }
   },
   computed: {
     cenoteObj() {
-      return this.$route.query.infos;
+      return this.$route.query;
     }
   },
   props: {
-    showIt: Boolean
+
   },
   components: {
     spaceSelect,
-    relatedSpaceList
+    relatedSpaceList,
+    addSpaceDialog
   },
   created() {
     this.load();
+    let pa = {
+      Filters: `parentId='Space'`
+    }
+    queryDictionaryHead(pa, res => {
+      res.Content.map(t => {
+        if (t.Name != "元空间") {
+          this.spaceType[t.Code] = t.Name;
+        }
+      })
+    });
+
+    let param = {
+      Cascade: [
+        { Name: "floor" }
+      ]
+    };
+    buildingQuery(param, res => {
+      this.buildingList = res.Content;
+      if(this.buildingList.length > 0){
+        this.building = this.buildingList[0].BuildID;
+        this.buildingObj = this.buildingList[0];
+        if(this.buildingObj.Floor.length > 0){
+          this.floor = this.buildingObj.Floor[0].FloorID;
+        }
+      }
+      res.Content.map(item => {
+        if (item.BuildID && item.BuildLocalName) {
+          this.floorType[item.BuildID] = item.BuildLocalName;
+          if (item.Floor instanceof Array) {
+            item.Floor.map(f => {
+              if (f.FloorID && f.FloorLocalName) {
+                this.floorType[f.FloorID] = f.FloorLocalName;
+              }
+            })
+          }
+        }
+      });
+    });
   },
   methods: {
     //更改业务空间类型
@@ -68,13 +125,27 @@ export default {
     },
     //加载数据
     load() {
-      if(this.isMyTab == 1){
+      if (this.isMyTab == 1) {
 
       }
-      else{
+      else {
         this.$refs.spacelist.getSpaceList();
       }
     },
+    //更换建筑
+    changeBuilding(bid){
+      this.buildingList.map(item => {
+        if(item.BuildID == bid){
+          this.buildingObj = item;
+        }
+      })
+      this.load();
+    },
+    //更换楼层
+    changeFloor(fid){
+      this.floor = fid;
+      this.load();
+    },
     //更换列表或平面图
     changeRadio(val) {
       this.isMyTab = val;
@@ -85,6 +156,10 @@ export default {
       this.$router.push({
         name: 'cenotelist'
       })
+    },
+    //更新
+    refresh() {
+      this.load();
     }
   },
   watch: {
@@ -170,4 +245,16 @@ export default {
   height: calc(100% - 44px);
   padding: 10px 0px;
 }
+.floor-item {
+  padding: 10px 10px;
+  display: block;
+  margin: 0px;
+  cursor: pointer;
+}
+.floorItemChoose {
+  background: rgba(0,0,0,0.2);
+}
+/deep/ .el-scrollbar__wrap {
+    overflow-x: hidden;
+  }
 </style>

src/views/ledger/cenotelist/relatedSpaceList.vue

@@ -1,14 +1,10 @@
 <template>
   <div id="relatedSpaceList" style="height:100%;">
     <div class="query">
-      <el-input v-model="keyword" placeholder="请输入关键词" @keyup.enter.native="getSpaceList" style="width:240px;">
+      <el-input v-model="keyword" placeholder="请输入关键词" @keyup.enter.native="getSpaceList" style="width:240px;margin:0 0 0 10px;">
         <i slot="suffix" class="el-input__icon el-icon-search" @click="getSpaceList"></i>
       </el-input>
-      <span style="padding-left:40px;">所属建筑楼层</span>
-      <el-select v-model="floor" placeholder="请选择楼层" @change="getSpaceList">
-        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
-        </el-option>
-      </el-select>
+      <floorCascader @change="changeCascader"></floorCascader>
     </div>
     <div class="table-area" style="height:calc(100% - 52px)">
       <el-scrollbar style="height:calc(100% - 40px);">
@@ -37,6 +33,7 @@
 </template>
 
 <script>
+import floorCascader from "@/components/ledger/lib/floorCascader";
 export default {
   data() {
     return {
@@ -56,10 +53,16 @@ export default {
       loading: false,//加载
     }
   },
+  components:{
+    floorCascader
+  },
   methods: {
     getSpaceList() {
       console.log(111)
     },
+    changeCascader(val){
+      console.log(val);
+    }
   },
   props: {
     space: '',//空间id