From 4c2d937a853e8e08d2d928cbf170d24fcbee8071 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8A=B1=E6=9C=89=E6=B8=85=E9=A6=99=E6=9C=88=E6=9C=89?=
 =?UTF-8?q?=E9=98=B4?= <185154740@qq.com>
Date: Fri, 14 Jan 2022 16:20:09 +0800
Subject: [PATCH] css

---
 src/apps/AppEpidemicSituation/Health.vue | 93 +++++++++++++-----------
 1 file changed, 52 insertions(+), 41 deletions(-)

diff --git a/src/apps/AppEpidemicSituation/Health.vue b/src/apps/AppEpidemicSituation/Health.vue
index 5ceb6968..43616888 100644
--- a/src/apps/AppEpidemicSituation/Health.vue
+++ b/src/apps/AppEpidemicSituation/Health.vue
@@ -1,47 +1,49 @@
 <template>
   <div class="Health">
-    <div class="header">
-      <div class="tab-item">
-        <h2 style="color: #2c51ce">{{ userList.total }}</h2>
-        <p>上报人员</p>
-      </div>
-      <div class="tab-item">
-        <h2 style="color: #5aad6a">{{ userList.today }}</h2>
-        <p>今日上报</p>
-      </div>
-      <div class="tab-item">
-        <h2 style="color: #f5a319">{{ userList.unReport }}</h2>
-        <p>今日未报</p>
-      </div>
-      <div class="tab-item">
-        <h2 style="color: #cd413a; border-right: 0">{{ userList.unusual }}</h2>
-        <p>今日异常</p>
-      </div>
-    </div>
-
-    <div class="line1"></div>
-
-    <div class="middle">
-      <div class="left">
-        <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>
-          <u-icon name="arrow-down" color="#666" size="28" style="margin-left: 4px" />
-        </AiAreaPicker>
+    <AiTopFixed>
+      <div class="header">
+        <div class="tab-item">
+          <h2 style="color: #2c51ce">{{ userList.total }}</h2>
+          <p>上报人员</p>
+        </div>
+        <div class="tab-item">
+          <h2 style="color: #5aad6a">{{ userList.today }}</h2>
+          <p>今日上报</p>
+        </div>
+        <div class="tab-item">
+          <h2 style="color: #f5a319">{{ userList.unReport }}</h2>
+          <p>今日未报</p>
+        </div>
+        <div class="tab-item">
+          <h2 style="color: #cd413a; border-right: 0">{{ userList.unusual }}</h2>
+          <p>今日异常</p>
+        </div>
       </div>
 
-      <u-search v-model="keyword" :clearabled="true" placeholder="请输入姓名" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="handerSearch" @clear="handerClear"></u-search>
-    </div>
+      <div class="line1"></div>
 
-    <div class="line2"></div>
+      <div class="middle">
+        <div class="left">
+          <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>
+            <u-icon name="arrow-down" color="#666" size="28" style="margin-left: 4px" />
+          </AiAreaPicker>
+        </div>
+
+        <u-search v-model="keyword" :clearabled="true" placeholder="请输入姓名" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="handerSearch" @clear="handerClear"></u-search>
+      </div>
+
+      <div class="line2"></div>
+
+      <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#fff" inactive-color="#333" bar-width="192" active-color="#135AB8 " @change="change"></u-tabs>
+    </AiTopFixed>
 
     <div class="bottoms">
-      <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#fff" inactive-color="#333" bar-width="192" active-color="#135AB8 " @change="change"></u-tabs>
-
-      <div class="line3"></div>
-
       <template v-if="data.length">
+        <div class="line3"></div>
+
         <div class="templates" v-for="(item, i) in data" :key="i" @click="goDetail(item)">
           <img :src="item.avatar" alt="" v-if="item.avatar" />
           <img src="./components/img/user-img.png" alt="" v-else />
@@ -196,6 +198,19 @@ export default {
 .Health {
   height: 100%;
   background: #fff;
+  ::v-deep .AiTopFixed {
+    .placeholder {
+      .content {
+        padding: 0 !important;
+      }
+    }
+    .fixed {
+      margin: 0 !important;
+      .content {
+        padding: 0 !important;
+      }
+    }
+  }
 
   .header {
     padding: 54px 32px 48px 32px;
@@ -256,12 +271,8 @@ export default {
   }
 
   .bottoms {
-    .u-tabs {
-      margin-bottom: -8px;
-    }
-
     .line3 {
-      height: 4px;
+      height: 6px;
       background: #f3f6f9;
     }