|
@@ -1,11 +1,15 @@
|
|
<template>
|
|
<template>
|
|
- <div>
|
|
|
|
- <div class="floor" style="border-bottom:1px solid #cccccc;"><span class="m-20">RF</span></div>
|
|
|
|
- <div style="border-bottom:1px solid #cccccc;" v-for="(val,key,index) in elevationData" :key="key">
|
|
|
|
- <span class="m-20">{{key}}</span>
|
|
|
|
- <template v-for="i in val">
|
|
|
|
- <div class="relate block" v-if="i.name">{{i.name}}</div>
|
|
|
|
- </template>
|
|
|
|
|
|
+ <div class="saga-elevation">
|
|
|
|
+ <div v-if="elevationData.length" class="saga-floor">
|
|
|
|
+ <div class="saga-rf"><p class="saga-floorName">RF</p><div class="saga-spaceList"></div></div>
|
|
|
|
+ <div class="saga-floor-item" v-for="floor in elevationData" :key="floor.FloorSequenceID">
|
|
|
|
+ <p class="saga-floorName">{{floor.FloorLocalName}}<i class="el-icon-right"></i></p>
|
|
|
|
+ <div class="saga-spaceList"></div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div v-else class="saga-center">
|
|
|
|
+ <i class="icon-wushuju iconfont"></i>
|
|
|
|
+ 数据暂无
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
@@ -17,106 +21,156 @@
|
|
export default {
|
|
export default {
|
|
data () {
|
|
data () {
|
|
return {
|
|
return {
|
|
- elevationData: {
|
|
|
|
- 'F5': [{
|
|
|
|
- id: 'f5-001',
|
|
|
|
- name: '业务空间f5-001',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: ['f4-002']
|
|
|
|
- }],
|
|
|
|
- 'F4': [{
|
|
|
|
- id: 'f4-001',
|
|
|
|
- name: '业务空间f4-001',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: ['f3-002']
|
|
|
|
- }, {
|
|
|
|
- id: 'f4-002',
|
|
|
|
- name: '业务空间f4-002',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: ['f5-001']
|
|
|
|
- }],
|
|
|
|
- 'F3': [{
|
|
|
|
- id: 'f3-001',
|
|
|
|
- name: '业务空间f3-001',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: ['f2-002']
|
|
|
|
- }, {
|
|
|
|
- id: 'f3-002',
|
|
|
|
- name: '业务空间f3-002',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: ['f2-002','f4-001']
|
|
|
|
- }],
|
|
|
|
- 'F2': [{
|
|
|
|
- id: 'f2-001',
|
|
|
|
- name: '业务空间f2-001',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: ['f1-001']
|
|
|
|
- }, {
|
|
|
|
- id: 'f2-002',
|
|
|
|
- name: '业务空间f2-002',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: ['f3-001','f3-002']
|
|
|
|
- }, {
|
|
|
|
- id: 'f2-003',
|
|
|
|
- name: '业务空间f2-003',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: []
|
|
|
|
- }],
|
|
|
|
- 'F1': [
|
|
|
|
- {
|
|
|
|
- id: 'f1-001',
|
|
|
|
- name: '业务空间f1-001',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: ['f2-001']
|
|
|
|
- }, {
|
|
|
|
- id: 'f1-002',
|
|
|
|
- name: '业务空间f1-002',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: []
|
|
|
|
- }, {
|
|
|
|
- id: 'f1-003',
|
|
|
|
- name: '业务空间f1-003',
|
|
|
|
- isAI: false,
|
|
|
|
- breakthrough: []
|
|
|
|
- }]
|
|
|
|
- }
|
|
|
|
|
|
+ elevationData: [
|
|
|
|
+ {
|
|
|
|
+ FloorSequenceID: 5,
|
|
|
|
+ FloorLocalName: 'F5',
|
|
|
|
+ ZoneSpaceList: [
|
|
|
|
+ {
|
|
|
|
+ RoomID: 'f5-001',
|
|
|
|
+ RoomLocalName: '业务空间f5-001',
|
|
|
|
+ SpaceIdList: ['f4-002']
|
|
|
|
+ }
|
|
|
|
+ ]
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ FloorSequenceID: 4,
|
|
|
|
+ FloorLocalName: 'F4',
|
|
|
|
+ ZoneSpaceList: [{
|
|
|
|
+ RoomID: 'f4-001',
|
|
|
|
+ RoomLocalName: '业务空间f4-001',
|
|
|
|
+ SpaceIdList: ['f3-002']
|
|
|
|
+ }, {
|
|
|
|
+ RoomID: 'f4-002',
|
|
|
|
+ RoomLocalName: '业务空间f4-002',
|
|
|
|
+ SpaceIdList: ['f5-001']
|
|
|
|
+ }]
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ FloorSequenceID: 3,
|
|
|
|
+ FloorLocalName: 'F3',
|
|
|
|
+ ZoneSpaceList: [{
|
|
|
|
+ RoomID: 'f3-001',
|
|
|
|
+ RoomLocalName: '业务空间f3-001',
|
|
|
|
+ SpaceIdList: ['f2-002']
|
|
|
|
+ }, {
|
|
|
|
+ RoomID: 'f3-002',
|
|
|
|
+ RoomLocalName: '业务空间f3-002',
|
|
|
|
+ SpaceIdList: ['f2-002','f4-001']
|
|
|
|
+ }]
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ FloorSequenceID: 2,
|
|
|
|
+ FloorLocalName: 'F2',
|
|
|
|
+ ZoneSpaceList: [{
|
|
|
|
+ RoomID: 'f2-001',
|
|
|
|
+ RoomLocalName: '业务空间f2-001',
|
|
|
|
+ SpaceIdList: ['f1-001']
|
|
|
|
+ }, {
|
|
|
|
+ RoomID: 'f2-002',
|
|
|
|
+ RoomLocalName: '业务空间f2-002',
|
|
|
|
+ SpaceIdList: ['f3-001','f3-002']
|
|
|
|
+ }, {
|
|
|
|
+ RoomID: 'f2-003',
|
|
|
|
+ RoomLocalName: '业务空间f2-003',
|
|
|
|
+ SpaceIdList: []
|
|
|
|
+ }]
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ FloorSequenceID: 1,
|
|
|
|
+ FloorLocalName: 'F1',
|
|
|
|
+ ZoneSpaceList: [{
|
|
|
|
+ RoomID: 'f1-001',
|
|
|
|
+ RoomLocalName: '业务空间f1-001',
|
|
|
|
+ SpaceIdList: ['f2-001']
|
|
|
|
+ }, {
|
|
|
|
+ RoomID: 'f1-002',
|
|
|
|
+ RoomLocalName: '业务空间f1-002',
|
|
|
|
+ SpaceIdList: []
|
|
|
|
+ }, {
|
|
|
|
+ RoomID: 'f1-003',
|
|
|
|
+ RoomLocalName: '业务空间f1-003',
|
|
|
|
+ SpaceIdList: []
|
|
|
|
+ }]
|
|
|
|
+ }
|
|
|
|
+ ]
|
|
}
|
|
}
|
|
},
|
|
},
|
|
computed: {
|
|
computed: {
|
|
...mapGetters("layout", ["projectId"])
|
|
...mapGetters("layout", ["projectId"])
|
|
},
|
|
},
|
|
props: {
|
|
props: {
|
|
-
|
|
|
|
- },
|
|
|
|
- created () {
|
|
|
|
- this.init()
|
|
|
|
|
|
+ params: Object
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
init () {
|
|
init () {
|
|
- let params = {
|
|
|
|
- BuildingId: '', // 建筑Id
|
|
|
|
- ObjectType: '', // 空间类型
|
|
|
|
- ShaftId: '' // 竖井Id
|
|
|
|
- }
|
|
|
|
|
|
+ console.log(this.params)
|
|
// 查询竖井关联的空间垂直交通关系
|
|
// 查询竖井关联的空间垂直交通关系
|
|
- shaftVerticalSpace(params, (res) => {
|
|
|
|
-
|
|
|
|
- })
|
|
|
|
- console.log('数据获取-数据格式化')
|
|
|
|
|
|
+ // shaftVerticalSpace(this.params, (res) => {
|
|
|
|
+ // this.elevationData = res.Content
|
|
|
|
+ // })
|
|
}
|
|
}
|
|
},
|
|
},
|
|
watch: {
|
|
watch: {
|
|
projectId() {
|
|
projectId() {
|
|
- this.init();
|
|
|
|
|
|
+ if (this.params.buildingId && this.params.objectType && this.params.shaftId) {
|
|
|
|
+ this.init();
|
|
|
|
+ }
|
|
console.log(this.projectId)
|
|
console.log(this.projectId)
|
|
|
|
+ },
|
|
|
|
+ params: {
|
|
|
|
+ handler(val) {
|
|
|
|
+ if (this.params.buildingId && this.params.objectType && this.params.shaftId) {
|
|
|
|
+ this.init();
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ immediate: true,
|
|
|
|
+ deep: true,
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|
|
<style lang="less">
|
|
- .m-20 {
|
|
|
|
- margin: 0 20px;
|
|
|
|
|
|
+ .saga-elevation {
|
|
|
|
+ height: 100%;
|
|
|
|
+ position: relative;
|
|
|
|
+ .saga-center{
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 50%;
|
|
|
|
+ left: 50%;
|
|
|
|
+ transform: translate(-50%,-60%);
|
|
|
|
+ text-align: center;
|
|
|
|
+ }
|
|
|
|
+ .saga-floor {
|
|
|
|
+ display: flex;
|
|
|
|
+ height: 100%;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ justify-content: flex-end;
|
|
|
|
+ padding-bottom: 60px;
|
|
|
|
+ .saga-rf {
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-direction: row;
|
|
|
|
+ font-size: 12px;
|
|
|
|
+ color: blue;
|
|
|
|
+ }
|
|
|
|
+ .saga-floor-item {
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-direction: row;
|
|
|
|
+ font-size: 12px;
|
|
|
|
+ height: 60px;
|
|
|
|
+ line-height: 60px;
|
|
|
|
+ }
|
|
|
|
+ .saga-floorName {
|
|
|
|
+ width: 50px;
|
|
|
|
+ text-align: right;
|
|
|
|
+ }
|
|
|
|
+ .saga-spaceList {
|
|
|
|
+ flex: 1;
|
|
|
|
+ border-bottom: 2px solid #c1c6d2;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
.block {
|
|
.block {
|
|
@@ -136,6 +190,5 @@
|
|
|
|
|
|
.space {
|
|
.space {
|
|
background-color: #999;
|
|
background-color: #999;
|
|
-
|
|
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|