chenzhen2 1 год назад
Родитель
Сommit
c80bd79048

+ 9 - 23
src/packagesEnv/pages/intelligentControl/components/floor/floor.wpy

@@ -96,45 +96,31 @@
 
 <template>
   <!-- && selectedFloor == item.id -->
+  <!-- :class="{'selected' :selectedBuilding == item.id}" -->
   <div class="{{'component-floor '+status}}">
     <div class="component-wrapper">
       <div class="building-wrapper">
-      <div class="building-item" 
-      :key="index+'building-map'"
-      :class="{'selected' :selectedBuilding == item.id}"
-      v-if="status=='expand' || (status=='fold' && selectedBuilding == item.id)"
-      v-for="(item,index) in buildings">
-      {{item.localName}}
-      </div>
-    </div>
+        <div class="building-item" 
+        :key="index+'building-map'"
+        v-for="(item,index) in buildings">
+        {{item.localName}}
+        </div>
+     </div>
 
+     <!-- :class="{'selected' :selectedFloor == item.id}" -->
       <div class="floor-wrapper">
         <div
           class="floor-item"
-          :class="{'selected' :selectedFloor == item.id}"
           :key="index+'map'"
           v-for="(item,index) in floors"
           v-on:click.stop="changeFloor(item.id)"
           v-if="status=='expand' || (status=='fold' && selectedFloor == item.id)"
         >
         {{item.localName}}
-      </div>
+       </div>
 
       </div>
     </div>
-    <div class="icon-arrow" 
-         wx:if="{{status=='expand'}}">
-         <div class="icon-arrow-box">
-          <label>收起</label>
-          <image
-            mode="scaleToFill"
-            class="icon"
-            src="{{h5StaticPath+ 'icon-floor-arrow.svg'}}"
-            v-on:click.stop="flodFloor"
-          />
-         </div>
-         
-  </div>
   </div>
 </template>
 

+ 137 - 23
src/packagesEnv/pages/intelligentControl/home2.wpy

@@ -10,6 +10,65 @@
     background: #f7f8fa;
   }
 }
+.tool-box {
+  position: fixed;
+  bottom: 272rpx;
+  right: 40rpx;
+  z-index: 333;
+  .search-btn-box {
+    overflow: hidden;
+    text-align: right;
+    image {
+      float: right;
+      width: 88rpx;
+      height: 88rpx;
+    }
+  }
+  .search-btn {
+    margin-bottom: 16rpx;
+    width: 88rpx;
+    height: 88rpx;
+    display: block;
+    border-radius: 16rpx;
+  }
+  .now-floor {
+    box-sizing: border-box;
+    padding: 20rpx 0;
+    background: #ffffff;
+    border-radius: 16rpx;
+    box-shadow: 0px 4px 12px 0px #00000008;
+    .select-building {
+      display: inline-block;
+      vertical-align: middle;
+      padding-left: 28rpx;
+      padding-right: 24rpx;
+      font-family: PingFang SC;
+      font-size: 32rpx;
+      font-weight: 500;
+      line-height: 44rpx;
+      text-align: center;
+    }
+
+    .line {
+      display: inline-block;
+      vertical-align: middle;
+      height: 36rpx;
+      width: 1px;
+      background: #e1e5eb;
+    }
+    .select-floor {
+      display: inline-block;
+      vertical-align: middle;
+      padding: 0 24rpx;
+      font-family: PingFang SC;
+      font-size: 32rpx;
+      font-weight: 500;
+      line-height: 44rpx;
+      text-align: center;
+      background: #fff;
+    }
+  }
+}
 
 .page-intelligent-control .map-contanier {
   //   height: 100%;
@@ -21,30 +80,16 @@
 }
 
 .page-intelligent-control .location-wrapper {
-  position: absolute;
-  bottom: 36rpx;
-  right: 32rpx;
+  position: fixed;
+  bottom: 272rpx;
+  right: 40rpx;
+  z-index: 444;
   &.fold {
   }
   &.building {
   }
 }
 
-.search-btn-box {
-  display: flex;
-  justify-content: flex-end;
-}
-.page-intelligent-control .location-wrapper .search-btn {
-  // position: absolute;
-  // right: 0;
-  margin-bottom: 16rpx;
-  width: 96rpx;
-  height: 96rpx;
-  display: block;
-  background: #ffffff;
-  border-radius: 16rpx;
-}
-
 .page-intelligent-control .location-wrapper.expand {
   bottom: 658rpx;
 }
@@ -207,6 +252,36 @@ movable-view {
     border-radius: 60rpx;
   }
 }
+.icon-arrow {
+  text-align: right;
+  .icon-arrow-box {
+    margin-top: 8rpx;
+    box-sizing: border-box;
+    padding: 22rpx;
+    border-radius: 8px;
+    display: inline-block;
+    height: 44px;
+    line-height: 44px;
+    width: 60px;
+    background: #fff;
+    box-shadow: 0px 4px 12px 0px #00000008;
+    label {
+      display: inline-block;
+      vertical-align: middle;
+      font-family: PingFang SC;
+      font-size: 32rpx;
+      font-weight: 500;
+      letter-spacing: 0px;
+    }
+    image {
+      display: inline-block;
+      vertical-align: middle;
+      margin-left: 16rpx;
+      width: 24rpx;
+      height: 24rpx;
+    }
+  }
+}
 </style>
 <template>
   <div class="page-intelligent-control" v-on:click="flodFloorFun">
@@ -278,15 +353,25 @@ movable-view {
                 />
           </div>
         </movable-view>
-        <div class="{{'location-wrapper ' + foldStatus}}">
+
+        <div class="tool-box" v-if="foldStatus!=='expand'">
           <div class="search-btn-box">
             <image
             v-on:click="toSearchPage"
             class="search-btn"
             src="{{h5StaticPath}}icon-search-big.svg"
             />
+         </div>
+         <div class="now-floor" 
+             v-on:click="changeBuilding">
+            <div class="select-building">东南栋</div>
+            <div class="line"></div>
+            <div class="select-floor">F1</div>
           </div>
-          
+        </div>
+        
+        <div v-if="foldStatus=='expand'" class="location-wrapper">
+          <!--楼层和建筑数据-->
           <floor
             status="{{floorStatus}}"
             :floors="floors"
@@ -297,6 +382,19 @@ movable-view {
             @component-floor-change="changeFloorFun($event)"
             @component-floor-click="toggleFloorStatus"
           ></floor>
+
+         <!--查看更多 -->
+        <div class="icon-arrow">
+         <div class="icon-arrow-box">
+          <label>收起</label>
+          <image
+            mode="scaleToFill"
+            class="icon"
+            src="{{h5StaticPath+ 'icon-floor-arrow.svg'}}"
+            v-on:click.stop="flodFloor"
+          />
+         </div> 
+         </div>
         </div>
       </movable-area>
     </div>
@@ -423,6 +521,10 @@ wepy.component({
       this.projectId = 'Pj1101080259';
       this.getPageBuildingList();
     },
+    // 展开建筑
+    changeBuilding() {
+      this.foldStatus = 'expand';
+    },
     //获取建筑数据
     getPageBuildingList() {
       let params = {
@@ -431,7 +533,20 @@ wepy.component({
         }
       };
       getBuildingList(params).then(res => {
-        this.buildingData = res.content || [];
+        // this.buildingData = res.content || [];
+        this.buildingData = [
+          {
+            id: 1,
+            localName: '冬暖冬冬'
+          },
+          {
+            id: 2,
+            localName: '冬暖冬冬暖冬冬暖冬'
+          },
+          {
+            localName: '冬暖冬冬暖冬冬暖冬冬暖冬冬暖冬冬暖冬'
+          }
+        ];
         this.buildingItem = this.buildingData[0];
         this.selectedBuilding = this.buildingItem.id;
         this.getFloorList();
@@ -684,8 +799,7 @@ wepy.component({
       });
     },
     toSearchPage() {
-      wx.uma.trackEvent('officeHome_map-find', { key: '环境调节-地图-找找' });
-
+      console.log('被点击了');
       wx.navigateTo({
         url: `/packagesEnv/pages/intelligentControl/search/search?canSearchPerson=${
           this.canSearchPerson