123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899 |
- <template>
- <div class='floorFunc-box'>
- <div class='lcgn-title'>
- <span class='span1'>{{floorInfo.code}}</span>
- </div>
- <floorMap ref='floorMap' :loadName='loadName' :type='"floor"'></floorMap>
- <!-- 图例 -->
- <div class='legend-boxs'>
- <Legend :floors='floorsArr' type='1' :editTips='`编辑${floorInfo.code}层楼层功能平面图`'></Legend>
- <floor-list v-if='floorsArr.length>0' :floorsArr='floorsArr' :type='1' @emitFloor='emitFloor' :id='"floor"'></floor-list>
- </div>
- </div>
- </template>
- <script>
- import floorMap from '@/components/floorMap/index.vue'
- import floorList from '@/components/floorList.vue'
- import { mapGetters } from 'vuex'
- export default {
- components: { floorMap, floorList },
- data() {
- return {
- show: true,
- floorInfo: {},
- loadName: '',
- type: '',
- }
- },
- computed: {
- ...mapGetters(['floorsArr', 'floorObj']),
- },
- methods: {
- emitFloor(item) {
- console.log(item)
- this.floorInfo = item
- this.$refs.floorMap.init(this.floorInfo.gname)
- this.init()
- },
- additionalColl() {
- this.show = !this.show
- },
- init() {
- this.loadName = `楼层功能-${this.floorInfo.code}`
- console.log(this.floorsArr.length)
- console.log(this.$cookie.get('currentFloorId'))
- if (this.floorsArr.length > 0 && this.$cookie.get('currentFloorId')) {
- this.floorInfo = this.floorsArr.find((item) => {
- return this.$cookie.get('currentFloorId') == item.seq
- })
- } else {
- }
- },
- },
- mounted() {
- console.log(this.floorInfo)
- this.init()
- this.$refs.floorMap.init(this.floorInfo.gname)
- },
- }
- </script>
- <style lang="less">
- .floorFunc-box {
- background: rgba(242, 245, 247, 1);
- height: calc(100vh - 48px);
- flex: 1;
- .lcgn-title {
- position: fixed;
- z-index: 2;
- display: block;
- top: 120px;
- left: 146px;
- width: 140px;
- height: 32px;
- background: linear-gradient(270deg, rgba(199, 217, 234, 0) 0%, rgba(199, 217, 234, 1) 100%);
- box-shadow: -6px 2px 8px 0px rgba(31, 36, 41, 0.1);
- color: #025baa;
- font-size: 16px;
- &::before {
- width: 2px;
- height: 16px;
- background: rgba(2, 91, 170, 1);
- display: inline-block;
- content: '';
- margin-right: 10px;
- margin-top: 8px;
- }
- .span1 {
- position: absolute;
- top: 3px;
- }
- }
- .legend-boxs {
- position: fixed;
- z-index: 9;
- right: 32px;
- top: 142px;
- }
- }
- </style>
|