Просмотр исходного кода

添加空间属于多个楼层弹窗

haojianlong 5 лет назад
Родитель
Сommit
76cec0d5d7

+ 111 - 0
src/components/business_space/newAddDialogs/roomInFloorDialog.vue

@@ -0,0 +1,111 @@
+<template>
+  <el-dialog :title="title" :visible.sync="dialogVisible" width="800px" id="addSyDialog">
+    <div class="table-box">
+      <el-table :data="tableData" style="width: 100%" height="100%" v-loading="loading" :header-cell-style="headerStyle" ref="multipleTable">
+        <el-table-column label="业务空间名称" show-overflow-tooltip min-width="100">
+          <template slot-scope="scope">
+            <div>
+              {{scope.row.SysLocalName||scope.row.SysName||''}}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="SysLocalID" label="所属建筑" show-overflow-tooltip min-width="100"></el-table-column>
+        <el-table-column prop="SysLocalID" label="所属楼层" show-overflow-tooltip min-width="100"></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)" type="primary" plain>查看详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button size="small" @click="dialogVisible = false">取 消</el-button>
+      <el-button size="small" type="primary" @click="savaRelation">确 定</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+
+<script>
+import {
+  notSyInSpaceQuery, //没有和当前空间绑定的系统
+  syInSpaceCreate, //系统所在业务空间--创建关系
+} from "@/api/scan/request";
+export default {
+  data() {
+    return {
+      title: '请选择业务空间所属建筑',
+      inSpaceType: '系统',
+      dialogVisible: false,
+      tableData: [],
+      loading: false,
+      headerStyle: {
+        backgroundColor: '#e1e4e5',
+        color: '#2b2b2b',
+        lineHeight: '30px'
+      }, // 列表样式
+      selections: [], // 选中项
+    }
+  },
+  props: {
+    type: {}, //equipment--equipmentFor
+    spaceId: {},
+    zone: {}, //分区类型 
+  },
+  methods: {
+    // 显示
+    showDialog() {
+      this.dialogVisible = true;
+      this.tableData = [];
+      this.getTableData();
+    },
+    // 选中项修改
+    handleSelectionChange(val) {
+      this.selections = val;
+    },
+    // 确认
+    savaRelation() {
+      let pa = {
+        data: {
+          SpaceId: this.spaceId,
+          SysIdList: []
+        },
+        type: this.zone
+      }
+      this.selections.map(t => {
+        pa.data.SysIdList.push(t.SysID)
+      })
+      syInSpaceCreate(pa, res => {
+        this.$message.success('关联成功');
+        this.$emit('refresh');
+        this.dialogVisible = false;
+      })
+    },
+    // 获取表格数据
+    getTableData() {
+      let pa = {
+        data: {
+          PageSize: 200,
+          Orders: 'SysID asc'
+        },
+        type: this.zone,
+        spaceId: this.spaceId
+      }
+      notSyInSpaceQuery(pa, res => {
+        this.tableData = res.Content;
+      })
+    },
+    // 查看详情
+    toDetail() {
+      this.$message('开发中')
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+#addSyDialog {
+  .table-box {
+    height: 350px;
+  }
+}
+</style>

+ 11 - 14
src/views/ledger/spacelist/index.vue

@@ -3,12 +3,8 @@
  -->
 <template>
   <div id="businessSpace">
-    <!------------------------    头部弹窗,选择楼层信息     -------------->
-    <!-- <influence-dialog ref="influence" :param="param" :tabsList="tabsList" title="受元空间变化影响的业务空间" :isShow="floor"></influence-dialog> -->
-    <!-- <details-dialog ref="details" @del="delSuccess" :param="param" :tabsList="tabsList" title="业务空间详情" :isShow="floor" :activeTabType="activeTabType">
-    </details-dialog> -->
-    <!-- <not-related ref="notRelated" @createSuccess="createSuccess" :isShow="floor"></not-related> -->
-    <!-- <facility-dialog ref="facility" :activeTabType="activeTabType" :isShow="floor"></facility-dialog> -->
+    <!-- 空间属于多个建筑楼层 -->
+    <!-- <roomInFloorDialog ref="roomInFloorDialog"></roomInFloorDialog> -->
     <!--------- 页面头部   -------------->
     <div class="saga-title" v-show="1">
       <div class="saga-build-mess">
@@ -20,7 +16,7 @@
           <el-radio-button label="2" class="space-own-radio" style="width: 68px;">列表</el-radio-button>
         </el-radio-group>
       </div>
-      <!-- <div class="saga-build-tips" v-if="1">有25个空间同时属于多个建筑楼层,点击处理</div> -->
+      <!-- <div class="saga-build-tips" v-if="1" @click="getTips">有25个空间同时属于多个建筑楼层,点击处理</div> -->
     </div>
     <div class="saga-business-sapce-main" v-show="1">
       <el-row class="spaceTypes">
@@ -56,6 +52,7 @@
 // import facilityDialog from "@/components/business_space/dialogs/facilityDialog";
 // import graphy from "@/components/business_space/graphy/business";
 import graphy from "@/components/business_space/newGraphy/graphy";
+import roomInFloorDialog from "@/components/business_space/newAddDialogs/roomInFloorDialog";
 import handsontableMain from "@/components/business_space/business/handsontable";
 import {
   getDataDictionary,
@@ -69,13 +66,9 @@ import floorCascader from "@/components/ledger/lib/floorCascader";
 import { mapGetters, mapActions } from "vuex";
 export default {
   components: {
-    // noModelDialog,
-    // influenceDialog,
-    // detailsDialog,
-    // notRelated,
     graphy,
     handsontableMain,
-    // facilityDialog,
+    roomInFloorDialog,
     floorCascader,
   },
   computed: {
@@ -277,6 +270,10 @@ export default {
       this.floor.facility = true
       this.$refs.facility.getData(infos, this.buildMess)
     },
+    // 空间属于多个建筑楼层
+    getTips() {
+      this.$refs.roomInFloorDialog.showDialog();
+    }
   },
   watch: {
     floor: {
@@ -367,11 +364,11 @@ export default {
         color: #fff;
       }
     }
-    .saga-build-tips{
+    .saga-build-tips {
       float: right;
       margin-right: 10px;
       font-size: 12px;
-      color: #409EFF;
+      color: #409eff;
       cursor: pointer;
     }
   }