guoxiaohuan 4 jaren geleden
bovenliggende
commit
4610fbfe8e

+ 4 - 0
src/api/public.js

@@ -45,3 +45,7 @@ export function readGroup(postParams) {
 export function queryDraftNum(data) {
     return httputils.postJson(`/serve/topology-wanda/graph/query`, data)
 }
+// 查询铺位名称
+export function queryBrand({ data, postParams }) {
+    return httputils.fetchJson(`/data/data/tb_brand_intentiondetail/query`, data, postParams)
+}

BIN
src/assets/imgs/bjs.png


BIN
src/assets/imgs/iconBlackBottom.png


BIN
src/assets/imgs/iconBlackTop.png


BIN
src/assets/imgs/iconLightBottom.png


BIN
src/assets/imgs/iconLightTop.png


+ 30 - 9
src/components/Legend/src/legend.vue

@@ -6,8 +6,9 @@
 <template>
     <div>
         <div class='legend-container'>
-            <div class='legend' @click='showTl' v-if='(type==1 || floors.length>0)&& isMessage'>图例</div>
-            <el-collapse-transition>
+            <div v-show='!show' class='legend' @click='showTl' v-if='(type==1 || floors.length>0)&& isMessage'>图例</div>
+            <div v-show='show' class='legend2' @click='showTl' v-if='(type==1 || floors.length>0)&& isMessage'>图例</div>
+            <el-collapse-transition v-if='(type==1 || floors.length>0)&& isMessage'>
                 <div class='legend-tab' v-if='show'>
                     <div class='legend-table'>
                         <lengend-view
@@ -67,11 +68,11 @@
             <!-- 编辑分布图 -->
             <el-tooltip v-if='editPmt' class='bjpmt' effect='dark' :content='editTips' placement='left'>
                 <span class='edit-icon' @click='goToEditer'>
-                    <i class='el-icon-edit' style='color:#fff;font-size:16px;'></i>
+                    <img src='@/assets/imgs/bjs.png' alt />
                 </span>
             </el-tooltip>
             <span v-else class='edit-icon2'>
-                <i class='el-icon-edit' style='color:#fff;font-size:16px;'></i>
+                <img src='@/assets/imgs/bjs.png' alt />
             </span>
         </div>
         <div class='select-floor' v-if='isFloor'>
@@ -104,7 +105,7 @@ export default {
                 '<p>1.主要设备房包括:冷源机房,热源机房,开闭站,配变电所(室),发电机房,消防水泵房,消防高位水箱间,生活水泵房,慧云机房,垃圾房。</p>',
             // text2: '<p>2.图例后×的数字,代表此位置的数量。</p>',
             text2: '',
-            show: false,
+            show: true,
             show2: false,
             loading: true,
             loading1: true,
@@ -131,7 +132,7 @@ export default {
     props: {
         floors: {
             default: () => {
-                []
+                ;[]
             },
             type: Array
         },
@@ -178,7 +179,6 @@ export default {
             queryRead({ data, postParams }).then(res => {
                 if (res.data.Data && res.data.Data[0].Note) {
                     let note = res.data.Data[0].Note
-                    console.log('notenotenote', note)
                     if (this.planNum > 0) {
                         this.remarksText = `${this.text1}${note}`
                     }
@@ -205,7 +205,6 @@ export default {
             if (this.show) {
                 this.show2 = false
             }
-            this.queryView(false)
         },
         cance() {
             this.show2 = false
@@ -338,7 +337,9 @@ export default {
             this.goToEditer()
         }
     },
-    mounted() {}
+    mounted() {
+        this.queryView(false)
+    }
 }
 </script>
 <style lang="less" scoped>
@@ -360,6 +361,20 @@ export default {
         line-height: 44px;
         text-align: center;
     }
+    .legend2 {
+        text-align: center;
+        line-height: 44px;
+        cursor: pointer;
+        line-height: 44px;
+        text-align: center;
+        width: 44px;
+        height: 44px;
+        background: linear-gradient(180deg, rgba(54, 156, 247, 1) 0%, rgba(2, 91, 170, 1) 100%);
+        border-radius: 2px;
+        font-size: 14px;
+        font-family: MicrosoftYaHei;
+        color: rgba(255, 255, 255, 1);
+    }
 
     .legend-tab {
         position: absolute;
@@ -399,6 +414,12 @@ export default {
         text-align: center;
         line-height: 48px;
         display: inline-block;
+        img {
+            line-height: 48px;
+            width: 20px;
+            height: 20px;
+            margin-top: -4px;
+        }
     }
     .edit-icon {
         cursor: pointer;

+ 1 - 1
src/components/editLengend.vue

@@ -251,7 +251,7 @@ export default {
     }
     .legend-container .el-table td,
     .legend-container .el-table th {
-        padding: 6px 0 !important;
+        padding: 3px 0 !important;
     }
     .nullData {
         .el-input__inner {

+ 45 - 45
src/components/floorList.vue

@@ -6,16 +6,17 @@
 <template>
     <div class='floor-box'>
         <div class='floor-list'>
-            <div v-if='floorsArr.length>8'>
-                <i
-                    class='el-icon-caret-top icon-top'
+            <div class='icon-top' v-if='floorsArr.length>8'>
+                <img
                     :class='{disabled:currentFloorId == floorsArr[0].seq }'
                     v-if='showT'
                     @click='changeFloor(1)'
                     @mousedown='mousedown'
                     @mouseup='mouseup'
-                ></i>
-                <i class='el-icon-caret-top icon-top' :class='{disabled:currentFloorId == floorsArr[0].seq }' v-else style='color:#ccc'></i>
+                    src='@/assets/imgs/iconBlackTop.png'
+                    alt
+                />
+                <img :class='{disabled:currentFloorId == floorsArr[0].seq }' v-else src='@/assets/imgs/iconLightTop.png' alt />
             </div>
             <div class='floor-out'>
                 <!-- :style='{ marginTop : marginTop }' -->
@@ -29,19 +30,15 @@
                     >{{item.code}}</div>
                 </div>
             </div>
-            <div v-if='floorsArr.length>8'>
-                <i
-                    class='el-icon-caret-bottom icon-bottom'
+            <div class='icon-bottom' v-if='floorsArr.length>8'>
+                <img
                     :class='{disabled:currentFloorId == floorsArr[floorsArr.length-1].seq }'
                     v-if='showB'
                     @click='changeFloor(-1)'
-                ></i>
-                <i
-                    class='el-icon-caret-bottom icon-bottom'
-                    :class='{disabled:currentFloorId == floorsArr[floorsArr.length-1].seq }'
-                    v-else
-                    style='color:#ccc'
-                ></i>
+                    src='@/assets/imgs/iconBlackBottom.png'
+                    alt
+                />
+                <img :class='{disabled:currentFloorId == floorsArr[floorsArr.length-1].seq }' v-else src='@/assets/imgs/iconLightBottom.png' alt />
             </div>
         </div>
     </div>
@@ -77,7 +74,6 @@ export default {
         }
     },
     mounted() {
-        console.log(this.floorsArr)
         this.init()
     },
     watch: {
@@ -92,7 +88,6 @@ export default {
     methods: {
         mousedown() {
             this.startTime = new Date()
-            console.log()
         },
         mouseup() {
             this.endTime = new Date()
@@ -170,7 +165,6 @@ export default {
         handleCookie() {
             // return true
             let currentFloor = this.floorsArr.filter(item => item.seq == this.currentFloorId)[0]
-            console.log(currentFloor)
             if (currentFloor) {
                 this.$cookie.set('floorNow', currentFloor.code || '', 3)
                 this.$cookie.set('floorMapId', currentFloor.gname, 3)
@@ -234,10 +228,10 @@ export default {
         box-shadow: 0px 2px 15px 0px rgba(31, 36, 41, 0.08);
         border-radius: 2px;
         position: relative;
-        padding: 28px 4px;
+        padding: 6px 4px;
         text-align: center;
         .floor-out {
-            max-height: 260px;
+            // max-height: 260px;
             overflow: hidden;
             // overflow-y: auto;
             position: relative;
@@ -248,44 +242,50 @@ export default {
             .floor-center {
                 transition: all linear 0.8s;
                 .floor-item {
-                    width: 36px;
-                    height: 32px;
+                    // border: 1px solid blue;
+                    // width: 36px;
+                    line-height: 28px;
+                    height: 28px;
                     cursor: pointer;
+                    position: relative;
+                    &::after {
+                        position: absolute;
+                        left: 50%;
+                        margin-left: -20%;
+                        bottom: -6px;
+                        content: '';
+                        width: 14px;
+                        height: 1px;
+                        background: rgba(195, 199, 203, 1);
+                        border: 0px solid rgba(228, 229, 231, 1);
+                    }
+                    & + .floor-item {
+                        margin-top: 10px;
+                    }
                 }
             }
         }
 
         .icon-top {
-            text-align: center;
-            font-size: 18px;
-            margin: 0 auto;
-            display: flex;
-            justify-content: center;
-            position: absolute;
-            top: 0;
-            right: 0;
-            width: 100%;
-            cursor: pointer;
-            line-height: 26px;
+            height: 18px;
+            img {
+                width: 18px;
+                height: 100%;
+                margin-top: -10px;
+            }
         }
         .icon-bottom {
-            text-align: center;
-            font-size: 18px;
-            margin: 0 auto;
-            display: flex;
-            justify-content: center;
-            position: absolute;
-            bottom: 0;
-            right: 0;
-            width: 100%;
-            cursor: pointer;
-            line-height: 26px;
+            height: 18px;
+            img {
+                width: 18px;
+                height: 100%;
+                margin-top: -10px;
+            }
         }
         .isActive {
             border-radius: 4px;
             color: #025baa;
             background: #e1f2ff;
-            line-height: 32px;
         }
     }
     .disabled {

+ 0 - 1
src/components/floorMap/index.vue

@@ -138,7 +138,6 @@ export default {
                 if (this.$cookie.get('categoryId') == 'SCPZ') {
                     let scpzTable = []
                     scpzTable = data.Data[0].Elements.Nodes || []
-                    console.log(scpzTable)
                     this.$store.commit('SETSCPZTABLE', scpzTable)
                 }
                 // 放到后边 $cookie graphId

+ 24 - 0
src/components/viewLengend.vue

@@ -147,5 +147,29 @@ export default {
     }
 }
 </style>
+<style lang="less">
+.view {
+    .el-input--mini .el-input__inner {
+        width: 50px;
+    }
+    .el-input__inner {
+        padding: 0 5px;
+    }
+    /deep/ .legend-container .el-table td,
+    .legend-container .el-table th {
+        padding: 3px 0 !important;
+    }
+    .nullData {
+        .el-input__inner {
+            color: #ccc !important;
+        }
+    }
+    .redData {
+        .el-input__inner {
+            border: 1px solid rgba(255, 77, 79, 0.5) !important;
+        }
+    }
+}
+</style>
 
 

+ 8 - 3
src/store/index.js

@@ -12,14 +12,15 @@ export default new Vuex.Store({
             orgCode: '',
             username: 'lengqiang', //账户名称
         },
-        plazaId: '1000423',
+        plazaId: '1000423', //项目Id
         projectName: '', //全局项目名称
         floorsArr: [], //楼层数组
         floorSelect: [], //楼层下拉框
         fmapID: '',
         haveFengMap: false, //是否有蜂鸟地图的数据
-        isMessage: true,
-        scpzTable: [],
+        isMessage: true, //是否有发布的图
+        scpzTable: [], //土建系统图例展示
+        legendTable: [], //除土建系统图例展示
     },
     getters: {
         floorsArr: (state) => state.floorsArr,
@@ -30,6 +31,7 @@ export default new Vuex.Store({
         haveFengMap: (state) => state.haveFengMap,
         isMessage: (state) => state.isMessage,
         scpzTable: (state) => state.scpzTable,
+        legendTable: (state) => state.legendTable,
     },
     mutations: {
         // 设置是否登陆校验
@@ -69,6 +71,9 @@ export default new Vuex.Store({
         SETSCPZTABLE(state, data) {
             state.scpzTable = data
         },
+        SETLEGENDTABLE(state, data) {
+            state.legendTable = data
+        },
     },
     actions: {
         // 获取项目列表、userId

+ 36 - 17
src/views/equipment/index.vue

@@ -28,12 +28,15 @@
                             <Legend :systemName='systemName' :floors='floorsArr' type='1' :editTips='`编辑${floorInfo.code}层${systemName}平面图`'></Legend>
                         </div>
                         <floorMap ref='floorMap' :id='"equip"' :loadName='loadName' :type='"system"'></floorMap>
+                        <!--  -->
                         <div class='additional-box' v-if='fqPic.length>0'>
                             <div class='additional' @click='additionalColl'>
                                 <img src='../../assets/imgs/bg.png' alt />
                             </div>
                             <el-collapse-transition>
-                                <div v-if='show' class='add-img'>图</div>
+                                <div v-if='show' class='add-img'>
+                                    <img :src='fqPic[0].url' alt />
+                                </div>
                             </el-collapse-transition>
                         </div>
                     </div>
@@ -51,7 +54,7 @@ import floorMap from '@/components/floorMap/index.vue'
 import eqDialog from './eqDialog'
 import editList from '@/components/edit.vue'
 import { system } from '@/utils/plugins/components.js'
-import { queryPic } from '@/api/public.js'
+import { queryPic, queryBrand } from '@/api/public.js'
 import { mapGetters } from 'vuex'
 
 export default {
@@ -70,7 +73,7 @@ export default {
             dialogInfo: {},
             brand: [], //品牌
             manufacturer: [],
-            show: false,
+            show: true,
             fqPic: [],
             loadName: '',
             type: '',
@@ -79,19 +82,30 @@ export default {
     },
     components: { floorList, eqDialog, floorMap, editList },
     methods: {
+        query() {
+            let data = {
+                plazaId: '1000423'
+            }
+            let postParams = []
+            queryBrand({ data, postParams }).then(res => {
+                console.log(res)
+            })
+        },
         // 查询tab页
         tabSyatem(item) {
-            console.log(item)
             this.systemId = item.id
             this.everySystem = item.children
             this.systemName = item.name
             this.smsxt = item.smsxt
             this.$cookie.set('categoryId', item.categoryId, 3)
             this.$refs.floorMap.init(this.floorInfo.gname)
+            this.querySmsxt()
+        },
+        querySmsxt() {
+            // 目前消防和弱电下面有特殊的数据表格
             if (this.smsxt == '1003' || this.smsxt == '1004') {
-                this.Index()
+                this.queryTable(this.smsxt)
             }
-            this.init()
         },
         //判断有没有原理图,如果没有则不出现系统原理图列表li
         emitCount(objCount) {
@@ -101,6 +115,7 @@ export default {
             this.floorInfo = item
             this.$refs.floorMap.init(this.floorInfo.gname)
             this.init()
+            this.querySmsxt()
         },
         dialogVisible(eve) {
             this.$refs.dialog.showModal(eve)
@@ -108,19 +123,20 @@ export default {
         additionalColl() {
             this.show = !this.show
         },
-        Index() {
+        // 查询附加数据图片
+        queryTable(system) {
+            this.fqPic = []
             let picFloor = this.$cookie.get('floorNow')
             let getParams = {
                 module: '1003',
                 floor: picFloor,
-                plazaId: this.$store.state.plazaId
-            }
-            if (this.smsxt) {
-                getParams.system = this.smsxt
+                system: system,
+                plazaId: this.plazaId
             }
             queryPic({ getParams }).then(res => {
-                //console.log('分区图', res)
+                console.log('附加数据', res)
                 this.fqPic = res.data
+                console.log(this.fqPic)
             })
         },
         init() {
@@ -129,11 +145,9 @@ export default {
         // 从设备设施进入的机房
         queryType(val) {
             this.type = val
-            console.log(this.type)
         }
     },
     mounted() {
-        console.log('smsxtsmsxtsmsxt', this.$route.query.smsxt)
         if (this.$route.query.smsxt) {
             this.smsxt = this.$route.query.smsxt
             this.system.forEach(el => {
@@ -147,9 +161,10 @@ export default {
         this.everySystem = this.system[0].children
         this.init()
         this.$refs.floorMap.init(this.floorInfo.gname)
+        this.query()
     },
     computed: {
-        ...mapGetters(['floorsArr'])
+        ...mapGetters(['floorsArr', 'plazaId'])
     }
 }
 </script>
@@ -270,7 +285,7 @@ export default {
                             border-radius: 2px;
                             position: fixed;
                             right: 32px;
-                            top: 420px;
+                            top: 471px;
                             z-index: 2;
                             display: flex;
                             justify-content: center;
@@ -291,8 +306,12 @@ export default {
                             border: 1px solid #e4e5e7;
                             position: absolute;
                             right: 77px;
-                            top: 93px;
+                            bottom: 421px;
                             z-index: 2;
+                            img {
+                                width: 100%;
+                                height: 100%;
+                            }
                         }
                     }
                 }

+ 1 - 44
src/views/floorFunc/index.vue

@@ -8,14 +8,6 @@
             <Legend :floors='floorsArr' type='1' :editTips='`编辑${floorInfo.code}层楼层功能平面图`'></Legend>
         </div>
         <floor-list v-if='floorsArr.length>0' :floorsArr='floorsArr' :type='1' @emitFloor='emitFloor' :id='"floor"'></floor-list>
-        <!-- <div class='additional-box'>
-            <div class='additional' @click='additionalColl'>
-                <img src='../../assets/imgs/bg.png' alt />
-            </div>
-            <el-collapse-transition>
-                <div v-if='show' class='add-img'>我是放附加数据图片哒。。。</div>
-            </el-collapse-transition>
-        </div>-->
         <floorMap ref='floorMap' :loadName='loadName' :type='"floor"'></floorMap>
     </div>
 </template>
@@ -28,7 +20,7 @@ export default {
     components: { floorMap, floorList },
     data() {
         return {
-            show: false,
+            show: true,
             floorInfo: {
                 gname: 'f1',
                 code: 'F1'
@@ -91,40 +83,5 @@ export default {
         right: 32px;
         top: 155px;
     }
-    .additional-box {
-        position: relative;
-        .additional {
-            width: 44px;
-            height: 44px;
-            background: rgba(255, 255, 255, 1);
-            box-shadow: 0px 2px 15px 0px rgba(31, 36, 41, 0.08);
-            border-radius: 2px;
-            position: fixed;
-            right: 32px;
-            top: 420px;
-            z-index: 2;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            cursor: pointer;
-            img {
-                width: 20px;
-                height: 20px;
-            }
-        }
-        .add-img {
-            width: 560px;
-            height: 325px;
-            background: #ffffff;
-            -webkit-box-shadow: 0px 2px 8px 0px rgba(31, 36, 41, 0.06);
-            box-shadow: 0px 2px 8px 0px rgba(31, 36, 41, 0.06);
-            border-radius: 2px;
-            border: 1px solid #e4e5e7;
-            position: absolute;
-            right: 77px;
-            top: 93px;
-            z-index: 2;
-        }
-    }
 }
 </style>