隔离折叠面板的状态

src/views/components/foldpanelLeft/index.vue

@@ -1,7 +1,12 @@
 <template>
   <div class="fold-panel">
     <div class="panel-container">
-      <div :class="['panel-main', { collapsed: panel.leftPanel }]">
+      <div
+        :class="[
+          'panel-main',
+          { collapsed: isShare ? panel.leftPanel : panelSate },
+        ]"
+      >
         <div class="panel-box">
           <introduceTitle
             :title="title"
@@ -11,14 +16,7 @@
         </div>
       </div>
       <div class="fold-btn" @click="togglePanel()">
-        <img
-          :src="
-            panel.leftPanel
-              ? require('@/assets/images/ui/arrow_left.jpg')
-              : require('@/assets/images/ui/arrow_right.jpg')
-          "
-          alt=""
-        />
+        <img :src="filterImage" alt="" />
       </div>
     </div>
   </div>
@@ -33,19 +31,39 @@ export default {
       type: String,
       default: "标题",
     },
+    // 是否共享
+    isShare: {
+      type: Boolean,
+      default: false,
+    },
   },
   components: {
     introduceTitle,
   },
   data() {
-    return {};
+    return {
+      panelSate: false,
+    };
   },
+
   computed: {
     ...mapGetters(["panel"]),
+    filterImage() {
+      let isTrue = this.isShare ? this.panel.leftPanel : this.panelSate;
+      if (isTrue) {
+        return require("@/assets/images/ui/arrow_right.jpg");
+      } else {
+        return require("@/assets/images/ui/arrow_left.jpg");
+      }
+    },
   },
   methods: {
     togglePanel() {
-      this.$store.commit("SET_PANEL", { leftPanel: !this.panel.leftPanel });
+      if (this.isShare) {
+        this.$store.commit("SET_PANEL", { leftPanel: !this.panel.leftPanel });
+      } else {
+        this.panelSate = !this.panelSate;
+      }
     },
   },
 };

src/views/components/foldpanelRight/index.vue

@@ -3,7 +3,10 @@
     <div class="panel-container">
       <div
         class="panel-main"
-        :class="['panel-main', { collapsed: panel.rightPanel }]"
+        :class="[
+          'panel-main',
+          { collapsed: isShare ? panel.rightPanel : panelSate },
+        ]"
       >
         <div class="panel-box">
           <introduceTitle
@@ -14,14 +17,7 @@
         </div>
       </div>
       <div class="fold-btn" @click="togglePanel()">
-        <img
-          :src="
-            panel.rightPanel
-              ? require('@/assets/images/ui/arrow_right.jpg')
-              : require('@/assets/images/ui/arrow_left.jpg')
-          "
-          alt=""
-        />
+        <img :src="filterImage" alt="" />
       </div>
     </div>
   </div>
@@ -31,17 +27,38 @@
 import { mapGetters } from "vuex";
 import introduceTitle from "@/views/components/introduceTitle";
 export default {
+  props: {
+    // 是否共享
+    isShare: {
+      type: Boolean,
+      default: false,
+    },
+  },
   components: { introduceTitle },
   data() {
-    return {};
+    return {
+      panelSate: false,
+    };
   },
   computed: {
     ...mapGetters(["panel"]),
+    filterImage() {
+      let isTrue = this.isShare ? this.panel.rightPanel : this.panelSate;
+      if (isTrue) {
+        return require("@/assets/images/ui/arrow_right.jpg");
+      } else {
+        return require("@/assets/images/ui/arrow_left.jpg");
+      }
+    },
   },
 
   methods: {
     togglePanel() {
-      this.$store.commit("SET_PANEL", { rightPanel: !this.panel.rightPanel });
+      if (this.isShare) {
+        this.$store.commit("SET_PANEL", { rightPanel: !this.panel.rightPanel });
+      } else {
+        this.panelSate = !this.panelSate;
+      }
     },
   },
 };

src/views/components/xiaoqu/building.vue

@@ -220,9 +220,9 @@ export default {
     background-size: cover;
     .building-name {
       position: absolute;
-      left: 130px;
+      left: 100px;
       top: 25px;
-      min-width: 135px;
+      min-width: 170px;
       height: 32px;
       text-align: center;
       line-height: 32px;

src/views/components/xiaoqu/house.vue

@@ -7,7 +7,7 @@
             <div class="house-main-row">
               <div class="house-name">
                 <span class="number-font">{{ houseItem.name }}</span>
-                室（共<span class="number-font"> {{ total }} </span>人）
+                （共<span class="number-font"> {{ total }} </span>人）
               </div>
               <div class="house-type">{{ houseData.typename }}</div>
               <ColorCell :item="houseData"
@@ -60,7 +60,11 @@
               <div class="btn-close" @click="handleClose()">关闭</div>
             </div>
           </div>
-          <div class="house-address">公安地址：{{ houseData.address }}</div>
+          <div class="house-address">
+            公安地址：{{ publicAddress[houseData.xiaoquId]
+            }}{{ houseData.deptname }}{{ houseData.buildingname
+            }}{{ houseItem.name }}
+          </div>
         </div>
         <div class="house-list" v-if="total > 0">
           <div class="list-item" v-for="item in list" :key="item.id">
@@ -277,7 +281,9 @@
             <imageButton size="small" @handlerClcik="confirm()"
               >确 定</imageButton
             >
-            <imageButton size="small">取 消</imageButton>
+            <imageButton size="small" @handlerClcik="open = false"
+              >取 消</imageButton
+            >
           </div>
         </el-form>
       </div>
@@ -311,6 +317,13 @@ export default {
       }
     };
     return {
+      publicAddress: {
+        202: "滨河路大庆锦绣新城",
+        215: "常胜路景瑞荣御蓝湾",
+        242: "东仓路星雨华府",
+        235: "兰州路华盛六园",
+        267: "太平北路森茂汽车城",
+      },
       houseData: {},
       form: {
         name: undefined,

src/views/components/xiaoqu/map/index.vue

@@ -107,9 +107,7 @@ export default {
     },
     addMapLayer() {
       this.mapGraphicLayer();
-      if (this.xiaoquId == 267) {
-        this.addshop();
-      }
+
       if (
         this.xiaoquId === 202 ||
         this.xiaoquId === 245 ||
@@ -120,102 +118,7 @@ export default {
       }
       this.addbuildingLayer();
     },
-    //商铺面
-    addshop() {
-      this.mapLayer.shopLayer = new mars3d.layer.GraphicLayer();
-      this.map.addLayer(this.mapLayer.shopLayer);
-      mars3d.Util.fetchJson({
-        url: this.configUrl + `lib/geoJson/xiaoqu/shop${this.xiaoquId}.json`,
-      }).then((res) => {
-        const arr = mars3d.Util.geoJsonToGraphics(res);
-        arr.map((item, index) => {
-          const polygon = new mars3d.graphic.PolygonEntity({
-            positions: item.positions,
-            style: {
-              color: "#062F63",
-              opacity: 0.6,
-              outline: true,
-              outlineWidth: 2,
 
-              highlight: {
-                type: "click",
-                color: "#FD873F",
-                label: {
-                  color: "black",
-                },
-              },
-              label: {
-                text: item.attr.TextString,
-                color: "#fff",
-                font_size: 12,
-                outline: false,
-                scaleByDistance: true,
-                scaleByDistance_far: 20000000,
-                scaleByDistance_farValue: 0.1,
-                scaleByDistance_near: 1000,
-                scaleByDistance_nearValue: 1,
-              },
-            },
-            attr: item.attr,
-          });
-          polygon.bindPopup(function (event) {
-            const item = event.graphic?.attr;
-            if (!item || item.TextString == " ") {
-              return false;
-            }
-            const inthtml = `
-                <div class="shop-dialog">
-                  <div class="shop-item">
-                      <div class="shop-lable">楼号:</div>
-                      <div class="shop-value">${item["楼号"]}</div>
-                    </div>
-                     <div class="shop-item">
-                      <div class="shop-lable">门牌号:</div>
-                      <div class="shop-value">${item.TextString}</div>
-                    </div>
-                     <div class="shop-item">
-                      <div class="shop-lable">房间号:</div>
-                      <div class="shop-value">${item["房间号"]}</div>
-                    </div>
-                     <div class="shop-item">
-                      <div class="shop-lable">招牌名称:</div>
-                      <div class="shop-value">${item["招牌名称"]}</div>
-                    </div>
-                     <div class="shop-item">
-                      <div class="shop-lable">商铺面积:</div>
-                      <div class="shop-value">${item["商铺面积"]}㎡</div>
-                    </div>
-                     <div class="shop-item">
-                      <div class="shop-lable">负责人姓名:</div>
-                      <div class="shop-value">${item["负责人姓名"]}</div>
-                    </div>
-                     <div class="shop-item">
-                      <div class="shop-lable">电话:</div>
-                      <div class="shop-value">${item["联系电话"]}</div>
-                    </div>
-                     <div class="shop-item">
-                      <div class="shop-lable">经营类别:</div>
-                      <div class="shop-value">${item["经营类别"]}</div>
-                    </div>
-                     <div class="shop-item">
-                      <div class="shop-lable">经营状态:</div>
-                      <div class="shop-value">${item["经营状态"]}</div>
-                    </div>
-                    <div class="shop-item">
-                      <div class="shop-lable">备注:</div>
-                      <div class="shop-value">${item["备注"]}</div>
-                    </div>
-                    <div class="shop-item">
-                      <div class="shop-lable">企业营业执照名称:</div>
-                      <div class="shop-value">${item["企业营业执"]}</div>
-                    </div>
-                </div>`;
-            return inthtml;
-          });
-          this.mapLayer.shopLayer.addGraphic(polygon);
-        });
-      });
-    },
     //苑图层
     addGardenLayer() {
       const data = garden[this.xiaoquId];

src/views/components/xiaoqu/mapSearchBox.vue

@@ -41,7 +41,7 @@
       ></el-checkbox>
       <!-- disabled -->
     </el-checkbox-group>
-    <el-checkbox label="三维图层" @change="handleMapLayer"></el-checkbox>
+    <!-- <el-checkbox label="三维图层" @change="handleMapLayer"></el-checkbox> -->
   </div>
 </template>
 

src/views/xiaoqu.vue

@@ -7,7 +7,7 @@
     <mapSearchBox />
     <mars-map ref="map" :xiaoquId="queryParamsXiaoqu.xiaoquId"></mars-map>
 
-    <foldpanelLeft :title="filterTitle()">
+    <foldpanelLeft :title="filterTitle()" :isShare="true">
       <!-- 左侧显示逻辑 1.小区简介 < 2.网格简介 < 3.楼栋统计分析  -->
       <xiaoquInfo
         v-if="
@@ -21,13 +21,15 @@
       />
       <buildingStatistics v-if="queryParamsXiaoqu.buildingId" />
     </foldpanelLeft>
-    <foldpanelRight>
+    <foldpanelRight :isShare="true">
       <xiaoquRight v-if="!queryParamsXiaoqu.buildingId" />
     </foldpanelRight>
-    <foldPaneBottom>
+    <!-- 森茂汽配城不展示 -->
+    <foldPaneBottom v-if="queryParamsXiaoqu.xiaoquId != 267">
       <bottomList />
     </foldPaneBottom>
-    <building />
+    <!-- 森茂汽配城不展示 -->
+    <building v-if="queryParamsXiaoqu.xiaoquId != 267" />
     <house />
   </div>
 </template>