|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
- <div class="space-index">
|
|
|
- <statistics :statistics-msg="statisticsMsg" />
|
|
|
+ <div class="adm-space">
|
|
|
+ <statistics :statistics-msg="statisticsMsg"/>
|
|
|
<el-divider class="small-divider"></el-divider>
|
|
|
<div class="tabs">
|
|
|
<el-tabs v-model="activeName" type="card" @tab-click="tabChange">
|
|
@@ -9,64 +9,73 @@
|
|
|
</el-tabs>
|
|
|
<div class="tab-content">
|
|
|
<div class="search" :class="{ 'borderBottom': activeName==='picture' }">
|
|
|
- <el-cascader clearable ref="floorCascader" placeholder="请选择建筑楼层" :options="options" v-model="building" filterable size="small"
|
|
|
- @change="changeCascader" style="margin-right: 12px" v-if="activeName==='table'"></el-cascader>
|
|
|
- <admSearch @SearchValue="searchValue" class="item" v-if="activeName==='table'" />
|
|
|
+ <el-cascader clearable ref="floorCascader" placeholder="请选择建筑楼层" :options="options"
|
|
|
+ v-model="building" filterable size="small"
|
|
|
+ @change="changeCascader" style="margin-right: 12px"
|
|
|
+ v-if="activeName==='table'"></el-cascader>
|
|
|
+ <admSearch @SearchValue="searchValue" class="item" v-if="activeName==='table'"/>
|
|
|
|
|
|
- <el-cascader clearable ref="graphCascader" placeholder="请选择建筑楼层" :options="graphOptions" v-model="graphBuilding" filterable
|
|
|
- size="small" @change="changeGraphCascader" style="margin-right: 12px" v-if="activeName==='picture'" :props="graphProps">
|
|
|
+ <el-cascader clearable ref="graphCascader" placeholder="请选择建筑楼层" :options="graphOptions"
|
|
|
+ v-model="graphBuilding" filterable
|
|
|
+ size="small" @change="changeGraphCascader" style="margin-right: 12px"
|
|
|
+ v-if="activeName==='picture'" :props="graphProps">
|
|
|
</el-cascader>
|
|
|
- <el-cascader v-model="zoneTypeVal" :options="zoneTypeOption" @change="changeZoneType" placeholder="请选择分区" class="item"
|
|
|
- v-if="activeName==='picture'"></el-cascader>
|
|
|
+ <el-cascader v-model="zoneTypeVal" :options="zoneTypeOption" @change="changeZoneType"
|
|
|
+ placeholder="请选择分区" class="item"
|
|
|
+ v-if="activeName==='picture'"></el-cascader>
|
|
|
</div>
|
|
|
<div v-if="activeName==='table'" v-loading="loading" style="height: calc(100% - 100px);padding: 0 12px">
|
|
|
<template style="height: 100%;" v-if="building.length > 0">
|
|
|
- <admMultiTable :currentHeader="currentHeader" :headersStage="headersStage" :tableData="tableData" />
|
|
|
- <Pagination v-if="tableData.length > 0" :paginationList="paginationList" @handleCurrentChange="handleCurrentChange"
|
|
|
- @handleSizeChange="handleSizeChange" />
|
|
|
+ <admMultiTable
|
|
|
+ @handleCurrentEdit="handleCurrentEdit"
|
|
|
+ :currentHeader="currentHeader"
|
|
|
+ :headersStage="headersStage"
|
|
|
+ :tableData="tableData"/>
|
|
|
+ <Pagination v-if="tableData.length > 0" :paginationList="paginationList"
|
|
|
+ @handleCurrentChange="handleCurrentChange"
|
|
|
+ @handleSizeChange="handleSizeChange"/>
|
|
|
</template>
|
|
|
<div v-else class="void align">
|
|
|
- <svg-icon name="void" :width="String(120)" :height="String(123)" />
|
|
|
+ <svg-icon name="void" :width="String(120)" :height="String(123)"/>
|
|
|
<p class="void-title">暂无内容</p>
|
|
|
<p class="void-tips">可点击左上角选择设备类型</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="graph" v-if="activeName==='picture'">
|
|
|
- <spaceGraph ref="spaceGraph" />
|
|
|
+ <spaceGraph ref="spaceGraph"/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <el-dialog title="编辑空间信息" :visible.sync="dialogVisible" @close="close">
|
|
|
+ <baseDataForm :objectHeaders="spaceHeaders"
|
|
|
+ :currRowContent="currRowContent"
|
|
|
+ ref="baseDataForm"/>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="handleDataForm">完成</el-button>
|
|
|
+ <el-button @click="dialogVisible = false">取消</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
import { Component, Vue } from "vue-property-decorator";
|
|
|
-import {
|
|
|
- AdmMultiTable,
|
|
|
- AdmSearch,
|
|
|
- Pagination,
|
|
|
- Statistics,
|
|
|
-} from "../components/index";
|
|
|
+import { AdmMultiTable, AdmSearch, baseDataForm, Pagination, Statistics } from "../components/index";
|
|
|
import spaceGraph from "./components/spaceGraph.vue";
|
|
|
-import {
|
|
|
- buildingQuery,
|
|
|
- dictQuery,
|
|
|
- floorQuery,
|
|
|
- queryCountSpace,
|
|
|
- queryZone,
|
|
|
-} from "@/api/datacenter";
|
|
|
+import { buildingQuery, dictQuery, floorQuery, queryCountSpace, queryZone, updateZone } from "@/api/datacenter";
|
|
|
import tools from "@/utils/maintain";
|
|
|
import { BeatchQueryParam } from "@/api/equipComponent";
|
|
|
import { UserModule } from "@/store/modules/user";
|
|
|
|
|
|
@Component({
|
|
|
- name: "space-index",
|
|
|
+ name: "adm-space",
|
|
|
components: {
|
|
|
Statistics,
|
|
|
AdmSearch,
|
|
|
AdmMultiTable,
|
|
|
spaceGraph,
|
|
|
Pagination,
|
|
|
+ baseDataForm
|
|
|
},
|
|
|
})
|
|
|
export default class spaceIndex extends Vue {
|
|
@@ -128,6 +137,11 @@ export default class spaceIndex extends Vue {
|
|
|
children: "floor",
|
|
|
};
|
|
|
graphBuilding = [];
|
|
|
+ spaceHeaders = {}
|
|
|
+ // 当前行数据
|
|
|
+ currRowContent = {}
|
|
|
+ // 弹窗开关
|
|
|
+ dialogVisible = false
|
|
|
//
|
|
|
// 项目id
|
|
|
private get projectId(): string {
|
|
@@ -262,7 +276,6 @@ export default class spaceIndex extends Vue {
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
-
|
|
|
//改变楼层
|
|
|
changeCascader(value) {
|
|
|
//todo delete
|
|
@@ -286,7 +299,7 @@ export default class spaceIndex extends Vue {
|
|
|
zoneType: "GeneralZone",
|
|
|
pageNumber: this.paginationList.page,
|
|
|
pageSize: this.paginationList.size,
|
|
|
- orders: "createTime desc, localName desc, localId desc, id asc",
|
|
|
+ orders: "createTime asc, localName asc, localId desc, id asc",
|
|
|
};
|
|
|
|
|
|
if (this.building.length === 1) {
|
|
@@ -340,7 +353,6 @@ export default class spaceIndex extends Vue {
|
|
|
}
|
|
|
});
|
|
|
dictStages.map((val, index) => {
|
|
|
- val.name = val.unit ? `${val.name}(${val.unit})` : val.name;
|
|
|
if (val.path == "outline") {
|
|
|
dictStages.splice(index, 1);
|
|
|
}
|
|
@@ -381,15 +393,26 @@ export default class spaceIndex extends Vue {
|
|
|
if (item.outline) {
|
|
|
delete item.outline;
|
|
|
}
|
|
|
+ // const category = ['ENUM', 'MENUM', 'BOOLEAN']
|
|
|
+ // if (item.category == 'STATIC' && item.dataType.includes(category) && item.dataSource) {
|
|
|
+ // console.log(item, item.path)
|
|
|
+ // }
|
|
|
+
|
|
|
// item = {
|
|
|
// ...item,
|
|
|
// outline: JSON.stringify(item.outline),
|
|
|
// };
|
|
|
+
|
|
|
return item;
|
|
|
});
|
|
|
// 列表信息展示,获取动态数据
|
|
|
this.codeToDataSource = {};
|
|
|
this.all.forEach((item) => {
|
|
|
+ const category = ['ENUM', 'MENUM', 'BOOLEAN']
|
|
|
+ console.log(item.category,item.dataType)
|
|
|
+ if (item.category == 'STATIC' && item.dataType.includes(category) && item.dataSource) {
|
|
|
+ console.log(21)
|
|
|
+ }
|
|
|
if (item.dataSource) {
|
|
|
try {
|
|
|
this.codeToDataSource[item.code] = {};
|
|
@@ -401,6 +424,7 @@ export default class spaceIndex extends Vue {
|
|
|
console.log(e);
|
|
|
}
|
|
|
}
|
|
|
+ console.log(this.codeToDataSource,' this.codeToDataSource')
|
|
|
});
|
|
|
this.getBatch(this.tableData);
|
|
|
});
|
|
@@ -442,14 +466,8 @@ export default class spaceIndex extends Vue {
|
|
|
this.all.map((head) => {
|
|
|
if (head.code == child.infoCode) {
|
|
|
let contentVal = child.data;
|
|
|
- if (
|
|
|
- this.codeToDataSource[
|
|
|
- child.infoCode
|
|
|
- ]
|
|
|
- ) {
|
|
|
- contentVal = this.codeToDataSource[
|
|
|
- child.infoCode
|
|
|
- ][child.data];
|
|
|
+ if (this.codeToDataSource[child.infoCode]) {
|
|
|
+ contentVal = this.codeToDataSource[child.infoCode][child.data];
|
|
|
}
|
|
|
tools.setDataForKey(
|
|
|
item,
|
|
@@ -476,6 +494,7 @@ export default class spaceIndex extends Vue {
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
// 修改分区类型
|
|
|
changeZoneType(val) {
|
|
|
this.toGraph();
|
|
@@ -487,6 +506,27 @@ export default class spaceIndex extends Vue {
|
|
|
this.changeCascader();
|
|
|
}
|
|
|
|
|
|
+ // close
|
|
|
+ close() {
|
|
|
+ // this.next = true;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 添加/编辑 事件处理
|
|
|
+ handleDataForm() {
|
|
|
+ let from = tools.formatData(this.$refs.baseDataForm.form)
|
|
|
+ let param = {
|
|
|
+ content: [from]
|
|
|
+ }
|
|
|
+ updateZone(param).then(res => {
|
|
|
+ res.result == 'success' && this.$message.success('更新成功')
|
|
|
+ this.dialogVisible = false
|
|
|
+ // this.getData();
|
|
|
+ // this.dataCount();
|
|
|
+ // 默认显示全部建筑信息
|
|
|
+ this.changeCascader();
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
handleSizeChange(val: number) {
|
|
|
this.paginationList.size = val;
|
|
|
this.changeCascader();
|
|
@@ -498,6 +538,15 @@ export default class spaceIndex extends Vue {
|
|
|
this.changeCascader();
|
|
|
}
|
|
|
|
|
|
+ // 编辑当前行
|
|
|
+ handleCurrentEdit(val) {
|
|
|
+ // this.next = false
|
|
|
+ this.currRowContent = val
|
|
|
+ this.spaceHeaders = this.headersStage
|
|
|
+ // this.handleNext()
|
|
|
+ this.dialogVisible = true
|
|
|
+ }
|
|
|
+
|
|
|
// tab页切换
|
|
|
tabChange() {
|
|
|
if (this.activeName == "picture") {
|
|
@@ -541,7 +590,7 @@ export default class spaceIndex extends Vue {
|
|
|
flex-wrap: wrap;
|
|
|
}
|
|
|
|
|
|
-.space-index {
|
|
|
+.adm-space {
|
|
|
background: #fff;
|
|
|
padding: 12px;
|
|
|
height: 100%;
|
|
@@ -587,3 +636,19 @@ export default class spaceIndex extends Vue {
|
|
|
}
|
|
|
}
|
|
|
</style>
|
|
|
+<style lang="scss">
|
|
|
+.adm-space {
|
|
|
+ .el-dialog {
|
|
|
+ .el-dialog__body {
|
|
|
+ max-height: 500px !important;
|
|
|
+ min-height: 100px;
|
|
|
+ overflow-y: auto;
|
|
|
+ overflow-x: hidden;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-select, .el-date-editor.el-input, .el-date-editor.el-input__inner {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|