宅基地调查优化

src/views/homesteadSurvey/list.vue

@@ -1,39 +1,39 @@
 <template>
   <div class="app-container">
     <van-sticky>
-    <div class="bannerBg" style="">
-      <van-nav-bar
-        style="background:transparent;border-bottom-width:0;"
-        @click-left="onClickLeft"
-      >
-        <template #left>
-          <van-icon name="arrow-left" size=".5rem" color="#fff" />
-        </template>
-        <template #title>
-          <p style="color:#fff">{{item.deptName}}</p>
-        </template>
-      </van-nav-bar>
-      <div style="display:flex;width:94%;margin:0 auto;justify-content:space-between;padding: 10px 0">
-        <div style="display:flex;width:90%;margin:0 auto;">
-          <div :class="{activeBtn : activeBtn==1,disactiveBtn :activeBtn!=1 }" @click="activeBtn=1"
-          ><van-icon size=".3rem" style="vertical-align:middle;" :name="require('../../assets/images/housesteadSurvey/btn1'+(activeBtn!=1?'1':'')+'.png')" />
-            入户核查
-          </div>
-          <div :class="{activeBtn : activeBtn==2,disactiveBtn :activeBtn!=2 }" @click="activeBtn=2,getNh()">
-            <van-icon size=".3rem" style="vertical-align:middle;" :name="require('../../assets/images/housesteadSurvey/btn2'+(activeBtn!=2?'2':'')+'.png')" />
-            农户信息
-          </div>
-          <div :class="{activeBtn : activeBtn==3,disactiveBtn :activeBtn!=3 }" @click="activeBtn=3,getSyqr()">
-            <van-icon size=".3rem" style="vertical-align:middle;" :name="require('../../assets/images/housesteadSurvey/btn3'+(activeBtn!=3?'3':'')+'.png')" />
-            所有权人
-          </div>
-          <div :class="{activeBtn : activeBtn==4,disactiveBtn :activeBtn!=4 }"  @click="activeBtn=4,mapShow()">
-            <van-icon size=".3rem" style="vertical-align:middle;" :name="require('../../assets/images/housesteadSurvey/btn4'+(activeBtn!=4?'4':'')+'.png')" />
-            切换地图
+      <div class="bannerBg" style="">
+        <van-nav-bar
+          style="background:transparent;border-bottom-width:0;"
+          @click-left="onClickLeft"
+        >
+          <template #left>
+            <van-icon name="arrow-left" size=".5rem" color="#fff" />
+          </template>
+          <template #title>
+            <p style="color:#fff">{{item.deptName}}</p>
+          </template>
+        </van-nav-bar>
+        <div style="display:flex;width:94%;margin:0 auto;justify-content:space-between;padding: 10px 0">
+          <div style="display:flex;width:90%;margin:0 auto;">
+            <div :class="{activeBtn : activeBtn==1,disactiveBtn :activeBtn!=1 }" @click="activeBtn=1"
+            ><van-icon size=".3rem" style="vertical-align:middle;" :name="require('../../assets/images/housesteadSurvey/btn1'+(activeBtn!=1?'1':'')+'.png')" />
+              入户核查
+            </div>
+            <div :class="{activeBtn : activeBtn==2,disactiveBtn :activeBtn!=2 }" @click="activeBtn=2,getNh()">
+              <van-icon size=".3rem" style="vertical-align:middle;" :name="require('../../assets/images/housesteadSurvey/btn2'+(activeBtn!=2?'2':'')+'.png')" />
+              农户信息
+            </div>
+            <div :class="{activeBtn : activeBtn==3,disactiveBtn :activeBtn!=3 }" @click="activeBtn=3,getSyqr()">
+              <van-icon size=".3rem" style="vertical-align:middle;" :name="require('../../assets/images/housesteadSurvey/btn3'+(activeBtn!=3?'3':'')+'.png')" />
+              所有权人
+            </div>
+            <div :class="{activeBtn : activeBtn==4,disactiveBtn :activeBtn!=4 }"  @click="activeBtn=4,mapShow()">
+              <van-icon size=".3rem" style="vertical-align:middle;" :name="require('../../assets/images/housesteadSurvey/btn4'+(activeBtn!=4?'4':'')+'.png')" />
+              切换地图
+            </div>
           </div>
         </div>
       </div>
-    </div>
       <div style="background:#fff;padding:10px 0;">
         <div style="border:1px solid rgb(122, 201, 67);width:90%;margin:0 auto;border-radius:15px;height:.8rem;display:flex;font-size:.3rem;">
           <div style="flex:1;text-align:center;">
@@ -452,7 +452,7 @@
               <template #action>
               </template>
             </van-search>-->
-      <div id="mapWrapAll" style="width: 100%;height: 80vh"></div>
+      <div id="mapWrapAll" style="width: 100%;height: calc(100vh - 247px);"></div>
       <div id="info" style="display: none"></div>
       <div id="deleteHistory" style="display: none"></div>
       <van-overlay :show="showSearch" @click="closeSearchBox" />
@@ -5195,6 +5195,8 @@
     z-index: 9;
 
     .searchBox{
+      height: 40vh;
+      overflow-y: scroll;
       .van-cell{
         /*&:first-child{*/
         /*  box-shadow: none;*/
@@ -5202,7 +5204,12 @@
         /*}*/
         box-shadow: 0px 0px 5px #cccccc;
         border-radius: 15PX;
+        width: 98%;
+        margin: 0 auto;
         margin-bottom: 0.35rem;
+        &:first-child{
+          margin-top: 5px;
+        }
       }
       .van-cell__title{
         flex: 0.8;
@@ -5213,11 +5220,18 @@
           }
           span{
             vertical-align: middle;
+            &:nth-child(2){
+              overflow: hidden;
+              white-space: nowrap;
+              text-overflow: ellipsis;
+              display: inline-block;
+              width: 60%;
+            }
             &:nth-child(3){
               font-size: 0.25rem;
               border-radius: 5PX;
               padding: 5PX 15PX;
-              margin-left: 50%;
+              margin-left: 5%;
             }
           }
         }
@@ -5229,7 +5243,7 @@
           display: inline-block;
           border-radius: 1rem;
           line-height: 1;
-          padding: 15PX 20PX;
+          padding: 10%;
         }
       }
     }