bug

src/apps/AppEpidemicSituation/Health.vue

@@ -23,7 +23,7 @@
 
     <div class="middle">
       <div class="left">
-        <AiAreaPicker v-model="areaId" all :areaId="user.areaId" @select="areaSelect" :name.sync="areaName" style="color: #666">
+        <AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="areaSelect" :name.sync="areaName" style="color: #666">
           <u-icon name="map-fill" color="#3192F4" size="20px" style="vertical-align: text-bottom"></u-icon>
           <span style="margin-left: 4px" v-if="areaName">{{ areaName }}</span>
           <span v-else>请选择</span>

src/components/AiAreaPicker.vue

@@ -22,20 +22,20 @@
                 @click="selectNode(area, i)"/>
         </div>
         <!--用来作为占位的-->
-        <div class="fixedPlaceholder" style="line-height: 120px;">
+        <div class="fixedPlaceholder" style="line-height: 60px;" v-if="false">
           <b>选择地区</b>
           <em>选择区域</em>
           <div class="selectedArea" v-if="hasSelected"/>
-          <!-- <span v-text="'行政区域'"/> -->
+          <span v-text="'行政区域'"/>
         </div>
         <!--end-->
       </div>
-      <div class="fill pendingList">
+      <scroll-view class="fill pendingList" scroll-y :style="{height: height}">
         <div class="pendingItem flexRow" flex v-for="op in pending" :key="op.id" @tap="getChild(op)">
           <div class="fill" :class="{ self: index == op.id }" v-html="op.name"/>
           <u-icon v-if="index == op.id" name="checkbox-mark" color="#4181FF"/>
         </div>
-      </div>
+      </scroll-view>
       <div class="bottomBtns">
         <div @click="closePopup">取消</div>
         <div class="primary fill" @click="handleSelect">确定</div>
@@ -92,7 +92,8 @@ export default {
       index: '',
       list: [],
       levelLabels: ["省", "市", "县/区", "镇/街道", "村/社区"],
-      selected: {}
+      selected: {},
+      height: '500px'
     }
   },
   watch: {
@@ -108,6 +109,9 @@ export default {
       this.handleInit()
       this.$refs.areaSelector.showPopup()
     },
+    scrollHeight () {
+      return this.height = `calc(100% - ${document.querySelector('.areaSelector').offsetHeight}px)`
+    },
     getFullArea() {
       let areaId = this.areaId || (this.all ? '' : this.$areaId)
       return this.$http.post('/admin/area/getAllParentAreaId', null, {
@@ -138,6 +142,7 @@ export default {
           if (self.id) {
             this.list.unshift(self)
           }
+        this.scrollHeight()
         }
       })
     },
@@ -172,6 +177,11 @@ export default {
         this.selected = op
         this.index = op.id
       }
+
+      this.$nextTick(() => {
+        
+        this.scrollHeight()
+      })
     },
     selectNode(area, i) {
       this.fullArea.splice(i + 1, this.fullArea.length - i)
@@ -270,7 +280,7 @@ export default {
     }
 
     .fixedTop {
-      position: fixed;
+      // position: fixed;
       top: 0;
       width: 100%;
       left: 0;
@@ -292,7 +302,10 @@ export default {
   }
 
   ::v-deep .pendingList {
+    height: 500px;
+    overflow-y: auto;
     padding: 0 32px 120px;
+    box-sizing: border-box;
 
     .pendingItem {
       color: #333;