From 63a31a1382fb5330dd618e8f8a57520be6b6f839 Mon Sep 17 00:00:00 2001
From: Jafeng <2998840497@qq.com>
Date: Tue, 3 Feb 2026 15:42:32 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E9=A6=96=E9=A1=B5UI=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/home/article-list.vue                   |  48 +++--
 pages/home/consult.vue                        |  34 ++--
 pages/home/customer-archive.vue               | 167 ++++++++++++------
 pages/home/home.vue                           |  28 ++-
 pages/home/team-head.vue                      |  69 ++++++--
 pages/home/team-mate.vue                      |  43 +++--
 .../home/{档案管理.png => archive-manage.png} | Bin
 .../{右箭头-蓝色.png => arrow-right-blue.png} | Bin
 .../{右箭头-灰色.png => arrow-right-gray.png} | Bin
 .../{个人基本信息bg.svg => basic-info-bg.svg} |   0
 .../home/{聊天咨询.png => chat-consult.png}   | Bin
 static/home/female.svg                        |   1 +
 .../{健康宣教.png => health-education.png}    | Bin
 .../{健康信息bg.svg => health-info-bg.svg}    |   0
 static/home/male.svg                          |   1 +
 .../home/{我的宣教.png => my-education.png}   | Bin
 .../{我的问卷.png => my-questionnaire.png}    | Bin
 .../home/{服务评价.png => service-rating.png} | Bin
 .../home/{喇叭介绍.png => speaker-intro.png}  | Bin
 static/home/{切换团队.png => switch-team.png} | Bin
 static/home/女性图标.png                      | Bin 947 -> 0 bytes
 21 files changed, 279 insertions(+), 112 deletions(-)
 rename static/home/{档案管理.png => archive-manage.png} (100%)
 rename static/home/{右箭头-蓝色.png => arrow-right-blue.png} (100%)
 rename static/home/{右箭头-灰色.png => arrow-right-gray.png} (100%)
 rename static/home/{个人基本信息bg.svg => basic-info-bg.svg} (100%)
 rename static/home/{聊天咨询.png => chat-consult.png} (100%)
 create mode 100644 static/home/female.svg
 rename static/home/{健康宣教.png => health-education.png} (100%)
 rename static/home/{健康信息bg.svg => health-info-bg.svg} (100%)
 create mode 100644 static/home/male.svg
 rename static/home/{我的宣教.png => my-education.png} (100%)
 rename static/home/{我的问卷.png => my-questionnaire.png} (100%)
 rename static/home/{服务评价.png => service-rating.png} (100%)
 rename static/home/{喇叭介绍.png => speaker-intro.png} (100%)
 rename static/home/{切换团队.png => switch-team.png} (100%)
 delete mode 100644 static/home/女性图标.png

diff --git a/pages/home/article-list.vue b/pages/home/article-list.vue
index fd028f5..79e85d7 100644
--- a/pages/home/article-list.vue
+++ b/pages/home/article-list.vue
@@ -1,22 +1,22 @@
 <template>
   <view v-if="articles.length" class="article-container">
     <view class="flex items-center justify-between">
-      <view class="text-lg font-semibold text-dark">健康宣教</view>
+      <view class="module-title">健康宣教</view>
       <view class="flex items-center" @click="toList()">
         <view class="mr-5 text-base text-gray">更多</view>
-        <image class="arrow-icon" src="/static/home/右箭头-灰色.png" mode="aspectFit"></image>
+        <image class="arrow-icon" src="/static/home/arrow-right-gray.png" mode="aspectFit"></image>
       </view>
     </view>
     <view class="mt-10">
       <view v-for="(article, index) in articles" :key="article._id"
-        class="article-card flex px-20 py-20"
+        class="article-card flex"
         :class="{'mb-15': index < articles.length - 1}">
-        <image class="flex-shrink-0 mr-15 cover" :src="article.cover || '/static/home/健康宣教.png'" mode="aspectFill" />
+        <image class="flex-shrink-0 cover" :src="article.cover || '/static/home/health-education.png'" mode="aspectFill" />
         <view class="w-0 flex-grow">
-          <view class="text-base leading-normal font-semibold truncate mb-10 text-dark">
+          <view class="article-title truncate mb-10">
             {{ article.title }}
           </view>
-          <view v-if="article.summary" class="text-sm text-gray line-clamp-2">
+          <view v-if="article.summary" class="article-summary line-clamp-2">
             {{ article.summary }}
           </view>
         </view>
@@ -75,13 +75,22 @@ watch(articleIds, n => {
   height: 32rpx;
 }
 
+.module-title {
+  color: #000000;
+  font-size: 36rpx;
+  font-style: normal;
+  font-weight: 600;
+  line-height: normal;
+}
+
 .article-card {
   background: white;
   border-radius: 16rpx;
-  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
+  box-shadow: 0 8rpx 10rpx 0 rgba(60, 169, 145, 0.06);
   transition: all 0.3s;
-  min-height: 168rpx;
-  align-items: center;
+  min-height: 188rpx;
+  padding: 20rpx;
+  align-items: flex-start;
 }
 
 .article-card:active {
@@ -90,9 +99,10 @@ watch(articleIds, n => {
 }
 
 .cover {
-  width: 160rpx;
-  height: 128rpx;
+  width: 272rpx;
+  height: 151rpx;
   border-radius: 12rpx;
+  margin-right: 20rpx;
   object-fit: cover;
 }
 
@@ -100,6 +110,22 @@ watch(articleIds, n => {
   margin-bottom: 20rpx;
 }
 
+.article-title {
+  color: #333333;
+  font-size: 32rpx;
+  font-weight: 500;
+  line-height: normal;
+}
+
+.article-summary {
+  max-width: 402rpx;
+  color: #666666;
+  text-align: justify;
+  font-size: 28rpx;
+  font-weight: 400;
+  line-height: normal;
+}
+
 .line-clamp-2 {
   display: -webkit-box;
   -webkit-box-orient: vertical;
diff --git a/pages/home/consult.vue b/pages/home/consult.vue
index 798e6b3..4e7fe79 100644
--- a/pages/home/consult.vue
+++ b/pages/home/consult.vue
@@ -58,25 +58,25 @@ const consultItems = ref([
   {
     id: "chat",
     label: "聊天咨询",
-    icon: "/static/home/聊天咨询.png",
+    icon: "/static/home/chat-consult.png",
     needSelectConsultant: true,
   },
   {
     id: "education",
     label: "我的宣教",
-    icon: "/static/home/我的宣教.png",
+    icon: "/static/home/my-education.png",
     path: "/pages/article/article-list",
   },
   {
     id: "survey",
     label: "我的问卷",
-    icon: "/static/home/我的问卷.png",
+    icon: "/static/home/my-questionnaire.png",
     path: "/pages/survey/survey-list",
   },
   {
     id: "rating",
     label: "服务评价",
-    icon: "/static/home/服务评价.png",
+    icon: "/static/home/service-rating.png",
     path: "",
   },
 ]);
@@ -156,20 +156,25 @@ function handleAddNewArchive() {
 }
 
 .consult-title {
+  color: #000000;
   font-size: 36rpx;
+  font-style: normal;
   font-weight: 600;
-  color: #333;
+  line-height: normal;
   margin-bottom: 24rpx;
 }
 
 .consult-grid {
+  height: 208rpx;
+  box-sizing: border-box;
   background: #fff;
-  border-radius: 32rpx;
+  border-radius: 16rpx;
   padding: 24rpx 30rpx;
   display: grid;
   grid-template-columns: repeat(4, 1fr);
+  align-items: center;
   gap: 32rpx;
-  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
+  box-shadow: 0 8rpx 10rpx 0 rgba(60, 169, 145, 0.06);
 }
 
 .consult-item {
@@ -181,9 +186,8 @@ function handleAddNewArchive() {
 }
 
 .item-icon {
-  width: 88rpx;
-  height: 88rpx;
-  border-radius: 50%;
+  width: 80rpx;
+  height: 80;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -196,14 +200,14 @@ function handleAddNewArchive() {
 }
 
 .icon-img {
-  width: 88rpx;
-  height: 88rpx;
+  width: 80rpx;
+  height: 80rpx;
 }
 
 .item-label {
-  font-size: 26rpx;
-  color: #333;
+  font-size: 28rpx;
+  color: #666d76;
   text-align: center;
-  font-weight: 500;
+  font-weight: 400;
 }
 </style>
diff --git a/pages/home/customer-archive.vue b/pages/home/customer-archive.vue
index f2b7826..6323910 100644
--- a/pages/home/customer-archive.vue
+++ b/pages/home/customer-archive.vue
@@ -1,12 +1,12 @@
 <template>
   <view class="archive-container">
     <view class="mb-10 flex items-center justify-between">
-      <view class="flex-shrink-0 text-lg font-semibold truncate text-dark">
+      <view class="module-title flex-shrink-0 truncate">
         成员档案
       </view>
-      <view class="flex items-center px-10 leading-normal text-base text-primary rounded-sm" @click="toManagePage()">
-        <image class="manage-icon mr-5" src="/static/home/档案管理.png" mode="aspectFit"></image>
-        <view>档案管理</view>
+      <view class="flex items-center px-10 leading-normal rounded-sm" @click="toManagePage()">
+        <image class="manage-icon mr-5" src="/static/home/archive-manage.png" mode="aspectFit"></image>
+        <view style="font-size: 28rpx; color: #065BD6;">档案管理</view>
       </view>
     </view>
     <view v-if="customers.length === 0" class="flex items-center justify-center h-80 border-dashed text-dark rounded">
@@ -16,8 +16,13 @@
     <scroll-view scroll-x="true">
       <view class="flex flex-nowrap pb-5 ">
         <view v-for="i in customers" :key="i._id"
-          class="customer-card flex-shrink-0 mr-15 p-15 rounded-lg relative"
+          class="customer-card flex-shrink-0 mr-15 relative"
           :class="current && i._id === current._id ? 'current-customer' : ''" @click="toggle(i)">
+          <!-- 关系标签 -->
+          <view v-if="i.relationship" class="relationship-tag"
+            :class="i.relationship === '本人' ? 'tag-blue' : 'tag-green'">
+            {{ i.relationship }}
+          </view>
           <view class="flex flex-col items-center">
             <view class="customer-name text-lg leading-normal font-semibold whitespace-nowrap mb-8"
               :class="current && i._id === current._id ? 'text-primary' : 'text-dark'">
@@ -27,14 +32,18 @@
               <image
                 v-if="i.sex"
                 class="sex-icon mr-5"
-                :src="i.sex === '男' ? '/static/icon/male.png' : '/static/home/女性图标.png'"
-                mode="aspectFit"
+                :src="i.sex === '男' ? '/static/home/male.svg' : '/static/home/female.svg'"
               />
               <view class="customer-age text-base leading-normal text-gray">
                 {{ i.age > 0 ? i.age + '岁' : '' }}
               </view>
             </view>
           </view>
+          <!-- 选中状态底部条和三角 -->
+          <view v-if="current && i._id === current._id" class="active-indicator">
+            <view class="active-bar"></view>
+            <view class="active-triangle"></view>
+          </view>
         </view>
       </view>
     </scroll-view>
@@ -52,7 +61,7 @@
         <view class="info-content">
           <view class="flex items-center justify-between mb-8">
             <view class="info-title">个人基本信息</view>
-            <image class="arrow-icon-small" src="/static/home/右箭头-蓝色.png" mode="aspectFit"></image>
+            <image class="arrow-icon-small" src="/static/home/arrow-right-blue.png" mode="aspectFit"></image>
           </view>
           <view class="info-subtitle">完善个人信息</view>
         </view>
@@ -62,7 +71,7 @@
         <view class="info-content">
           <view class="flex items-center justify-between mb-8">
             <view class="info-title">健康信息</view>
-            <image class="arrow-icon-small" src="/static/home/右箭头-蓝色.png" mode="aspectFit"></image>
+            <image class="arrow-icon-small" src="/static/home/arrow-right-blue.png" mode="aspectFit"></image>
           </view>
           <view class="info-subtitle">上传健康档案</view>
         </view>
@@ -173,9 +182,11 @@ watch(() => props.corpId, n => {
 .archive-container {
   padding: 24rpx 30rpx;
   margin: 0 30rpx;
-  background: linear-gradient(to bottom, #C2DCFF 0%, #C2DCFF 40%, #FFFFFF 100%);
-  border-radius: 32rpx;
-  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
+  background: linear-gradient(181deg, #C2DCFF 1.01%, #FFFFFF 43.31%);
+  border-radius: 16rpx;
+  box-shadow:
+    inset 0 2rpx 0 0 rgba(255, 255, 255, 0.82),
+    0 8rpx 10rpx 0 rgba(60, 169, 145, 0.06);
 }
 
 .manage-icon {
@@ -183,54 +194,103 @@ watch(() => props.corpId, n => {
   height: 32rpx;
 }
 
+.module-title {
+  color: #000000;
+  font-size: 36rpx;
+  font-weight: 600;
+  line-height: normal;
+}
+
 .customer-card {
-  background: linear-gradient(180deg, #FFFFFF 0%, #F2F6FF 100%);
-  border-radius: 16rpx;
-  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
-  transition: all 0.3s;
-  min-width: 180rpx;
+  width: 160rpx;
+  height: 160rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: linear-gradient(180deg, #FFFFFF 0%, #E6EFFB 100%);
+  border-radius: 12rpx;
+  border: 2rpx solid #AECAF2;
+  transition: all 0.2s;
   position: relative;
-  border: 2rpx solid transparent;
-  margin-bottom: 18rpx;
 }
 
 .current-customer {
   background: #FFFFFF;
-  border: 2rpx solid #5B9CFF;
-  box-shadow: 0 4rpx 12rpx rgba(91, 156, 255, 0.25);
-}
-
-.current-customer::after {
-  content: '';
-  position: absolute;
-  left: 50%;
-  bottom: -14rpx;
-  transform: translateX(-50%);
-  width: 0;
-  height: 0;
-  border-left: 14rpx solid transparent;
-  border-right: 14rpx solid transparent;
-  border-top: 14rpx solid #5B9CFF;
-}
-
-.current-customer::before {
-  content: '';
-  position: absolute;
-  left: 50%;
-  bottom: -12rpx;
-  transform: translateX(-50%);
-  width: 0;
-  height: 0;
-  border-left: 12rpx solid transparent;
-  border-right: 12rpx solid transparent;
-  border-top: 12rpx solid #FFFFFF;
-  z-index: 1;
+  border: 2rpx solid #065BD6;
 }
 
 .customer-name {
   margin-top: 12rpx;
 }
 
+.relationship-tag {
+  position: absolute;
+  top: -2rpx;
+  right: -10rpx;
+  padding: 4rpx 16rpx;
+  font-size: 20rpx;
+  line-height: normal;
+  color: #fff;
+  border-top-left-radius: 16rpx;
+  border-bottom-left-radius: 16rpx;
+  z-index: 10;
+}
+
+.relationship-tag::after {
+  content: '';
+  position: absolute;
+  right: 0;
+  bottom: -8rpx;
+  width: 0;
+  height: 0;
+  border-right: 10rpx solid transparent;
+}
+
+.tag-blue {
+  background: #065BD6;
+}
+
+.tag-blue::after {
+  border-top: 8rpx solid #003F96;
+}
+
+.tag-green {
+  background: #1DBF98;
+}
+
+.tag-green::after {
+  border-top: 8rpx solid #0F8C6D;
+}
+
+.active-indicator {
+  position: absolute;
+  bottom: -2rpx;
+  left: -2rpx;
+  right: -2rpx;
+  height: 10rpx;
+  z-index: 5;
+}
+
+.active-bar {
+  width: 100%;
+  height: 100%;
+  background: #065bd6;
+  border-bottom-left-radius: 12rpx;
+  border-bottom-right-radius: 12rpx;
+  box-sizing: border-box;
+}
+
+.active-triangle {
+  position: absolute;
+  top: 100%;
+  left: 50%;
+  transform: translateX(-50%) rotate(45deg);
+  width: 12rpx;
+  height: 12rpx;
+  background: #065BD6;
+  margin-top: -8rpx;
+}
+
 .customer-age {
   color: #999999;
 }
@@ -255,11 +315,12 @@ watch(() => props.corpId, n => {
 .info-card-new {
   position: relative;
   padding: 24rpx;
-  border-radius: 12rpx;
-  background: linear-gradient(135deg, #F0F7FF 0%, #FFFFFF 100%);
+  border-radius: 16rpx;
+  background: linear-gradient(115deg, #F4F9FF 14.74%, #DBEAFF 66.11%);
   box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
   overflow: hidden;
-  height: 140rpx;
+  width: 310rpx;
+  height: 94rpx;
   flex: 1;
 }
 
@@ -282,11 +343,11 @@ watch(() => props.corpId, n => {
 }
 
 .info-bg-base {
-  background-image: url('/static/home/个人基本信息bg.svg');
+  background-image: url('/static/home/basic-info-bg.svg');
 }
 
 .info-bg-health {
-  background-image: url('/static/home/健康信息bg.svg');
+  background-image: url('/static/home/health-info-bg.svg');
 }
 
 
diff --git a/pages/home/home.vue b/pages/home/home.vue
index 1ba8286..6807215 100644
--- a/pages/home/home.vue
+++ b/pages/home/home.vue
@@ -4,10 +4,18 @@
     <template #header>
       <team-head :team="team" :teams="teams" @changeTeam="changeTeam" />
     </template>
-    <customer-archive :corpId="corpId" :team="team" @update:customers="handleCustomersUpdate" />
-    <consult :corpId="corpId" :teamId="team.teamId" :customers="customers" />
-    <team-mate :team="team" />
-    <article-list :team="team" />
+    <view class="home-section home-section--first">
+      <customer-archive :corpId="corpId" :team="team" @update:customers="handleCustomersUpdate" />
+    </view>
+    <view class="home-section">
+      <consult :corpId="corpId" :teamId="team.teamId" :customers="customers" />
+    </view>
+    <view class="home-section">
+      <team-mate :team="team" />
+    </view>
+    <view class="home-section">
+      <article-list :team="team" />
+    </view>
   </full-page>
   <yc-home v-else />
 </template>
@@ -38,7 +46,9 @@ const customers = ref([]);
 
 const corpId = computed(() => team.value?.corpId);
 
-const pageStyle = 'background: linear-gradient(to bottom, #065BD6 0%, #F6FAFA 400rpx);';
+// UI 两段式背景：顶部 281px 渐变 + 下方纯色（按 375 设计稿，281px ≈ 562rpx）
+const pageStyle =
+  'background: linear-gradient(180deg, #065BD6 15.05%, #F6FAFA 95.37%) 0 0/100% 562rpx no-repeat, #F6FAFA;';
 
 function handleCustomersUpdate(newCustomers) {
   customers.value = newCustomers;
@@ -85,4 +95,12 @@ useShow(() => {
 .home-container {
   min-height: 100vh;
 }
+
+.home-section {
+  margin-top: 24rpx;
+}
+
+.home-section--first {
+  margin-top: 0;
+}
 </style>
diff --git a/pages/home/team-head.vue b/pages/home/team-head.vue
index a29e12a..62bf7bc 100644
--- a/pages/home/team-head.vue
+++ b/pages/home/team-head.vue
@@ -7,10 +7,10 @@
       </view>
       <view class="w-0 flex-grow ">
         <view class="flex items-center mb-10">
-          <view class="flex-shrink-0 text-lg font-semibold text-white">{{ team.name }}</view>
+          <view class="team-name flex-shrink-0">{{ team.name }}</view>
           <view v-if="teams.length > 1" class="flex-shrink-0 flex items-center switch-btn ml-10"
             @click="showDropDown = true">
-            <image class="switch-icon" src="/static/home/切换团队.png" mode="aspectFit"></image>
+            <image class="switch-icon" src="/static/home/switch-team.png" mode="aspectFit"></image>
           </view>
         </view>
         <view v-if="currentTeam" class="text-base text-white truncate">{{ currentTeam.corpName }}</view>
@@ -44,8 +44,12 @@
     </view>
     <view v-if="team.teamTroduce" class="team-introduce-wrapper">
       <view class="team-introduce flex items-center">
-        <image class="laba-icon flex-shrink-0 mr-8" src="/static/home/喇叭介绍.png" mode="aspectFit"></image>
-        <view class="flex-grow text-base text-dark leading-relaxed line-clamp-2">{{ team.teamTroduce }}</view>
+        <!-- 顶部小三角形 -->
+        <view class="triangle-wrapper">
+          <view class="team-triangle"></view>
+        </view>
+        <image class="laba-icon flex-shrink-0" src="/static/home/speaker-intro.png" mode="aspectFit"></image>
+        <view class="introduce-text flex-grow line-clamp-2">{{ team.teamTroduce }}</view>
       </view>
     </view>
   </view>
@@ -105,6 +109,16 @@ onMounted(() => {
 .laba-icon {
   width: 48rpx;
   height: 48rpx;
+  margin-left: 12rpx;
+  margin-right: 12rpx;
+}
+
+.team-name {
+  color: #ffffff;
+  font-size: 36rpx;
+  font-style: normal;
+  font-weight: 600;
+  line-height: normal;
 }
 
 .switch-icon {
@@ -129,25 +143,44 @@ onMounted(() => {
 }
 
 .team-introduce {
-  background: linear-gradient(135deg, #C2DCFF 0%, #E6F2FF 100%);
+  width: 690rpx;
+  min-height: 111rpx;
+  box-sizing: border-box;
+  background: linear-gradient(186deg, rgba(255, 255, 255, 0.4) 13.34%, rgba(255, 255, 255, 0.6) 99.17%);
   border-radius: 16rpx;
-  padding: 20rpx 24rpx;
+  padding: 20rpx 20rpx 20rpx 0;
   position: relative;
-  border: 2rpx solid rgba(255, 255, 255, 0.9);
-  box-shadow: 0 2rpx 8rpx rgba(6, 91, 214, 0.08);
+  overflow: visible;
 }
 
-.team-introduce::before {
-  content: '';
+.triangle-wrapper {
   position: absolute;
-  left: 30rpx;
-  top: -14rpx;
-  width: 0;
-  height: 0;
-  border-left: 14rpx solid transparent;
-  border-right: 14rpx solid transparent;
-  border-bottom: 14rpx solid #C2DCFF;
-  filter: drop-shadow(0 -2rpx 0 rgba(255, 255, 255, 0.9));
+  top: -12rpx;
+  left: 60rpx;
+  width: 24rpx;
+  height: 12rpx;
+  overflow: hidden;
+  z-index: 10;
+  transform: translateX(-50%);
+}
+
+.team-triangle {
+  position: absolute;
+  left: 50%;
+  bottom: -10rpx;
+  width: 16rpx;
+  height: 16rpx;
+  background: linear-gradient(186deg, rgba(255, 255, 255, 0.4) 13.34%, rgba(255, 255, 255, 0.6) 99.17%);
+  transform: translateX(-50%) rotate(45deg);
+}
+
+.introduce-text {
+  max-width: 594rpx;
+  color: #000000;
+  font-size: 24rpx;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
 }
 
 .line-clamp-2 {
diff --git a/pages/home/team-mate.vue b/pages/home/team-mate.vue
index f7d1589..16ef2c6 100644
--- a/pages/home/team-mate.vue
+++ b/pages/home/team-mate.vue
@@ -1,10 +1,10 @@
 <template>
   <view class="team-mate-container">
     <view class="flex items-center justify-between">
-      <view class="text-lg font-semibold text-dark">团队成员</view>
+      <view class="module-title">团队成员</view>
       <view class="flex items-center" @click="toTeamDetail()">
         <view class="mr-5 text-base text-gray">团队详情</view>
-        <image class="arrow-icon" src="/static/home/右箭头-灰色.png" mode="aspectFit"></image>
+        <image class="arrow-icon" src="/static/home/arrow-right-gray.png" mode="aspectFit"></image>
       </view>
     </view>
     <view class="mt-10">
@@ -16,10 +16,10 @@
             <image class="flex-shrink-0 avatar mr-10" :src="i.avatar || '/static/default-avatar.png'" />
             <view class="flex-grow flex flex-col justify-between">
               <view>
-                <view class="leading-normal h-24 text-base font-semibold text-dark whitespace-nowrap">
+                <view class="member-name leading-normal h-24 text-base font-semibold text-dark whitespace-nowrap">
                   {{ i.anotherName }}
                 </view>
-                <view class="max-w-100 h-21 leading-normal text-sm text-gray truncate">
+                <view class="member-job max-w-100 h-21 leading-normal text-sm text-gray truncate">
                   {{ memberJob[i.userid] }}
                 </view>
               </view>
@@ -101,13 +101,36 @@ watch(teamates, val => {
 }
 
 .add-friend-btn {
-  width: 144rpx;
-  padding: 10rpx 0;
-  background: #EAF2FF;
-  color: #2F6BFF;
-  border-radius: 12rpx;
+  width: 128rpx;
+  height: 48rpx;
+  line-height: 48rpx;
+  padding: 0;
+  background: rgba(6, 91, 214, 0.10);
+  color: #065BD6;
+  border-radius: 8rpx;
   margin-top: 10rpx;
-  font-weight: 500;
+  font-weight: 400;
+}
+
+.module-title {
+  color: #000000;
+  font-size: 36rpx;
+  font-style: normal;
+  font-weight: 600;
+  line-height: normal;
+}
+
+.member-job {
+  color: #999999;
+  font-size: 24rpx;
+  font-weight: 400;
+}
+
+.member-name {
+  color: #333333;
+  font-size: 32rpx;
+  font-weight: 600;
+  line-height: normal;
 }
 
 .h-24 {
diff --git a/static/home/档案管理.png b/static/home/archive-manage.png
similarity index 100%
rename from static/home/档案管理.png
rename to static/home/archive-manage.png
diff --git a/static/home/右箭头-蓝色.png b/static/home/arrow-right-blue.png
similarity index 100%
rename from static/home/右箭头-蓝色.png
rename to static/home/arrow-right-blue.png
diff --git a/static/home/右箭头-灰色.png b/static/home/arrow-right-gray.png
similarity index 100%
rename from static/home/右箭头-灰色.png
rename to static/home/arrow-right-gray.png
diff --git a/static/home/个人基本信息bg.svg b/static/home/basic-info-bg.svg
similarity index 100%
rename from static/home/个人基本信息bg.svg
rename to static/home/basic-info-bg.svg
diff --git a/static/home/聊天咨询.png b/static/home/chat-consult.png
similarity index 100%
rename from static/home/聊天咨询.png
rename to static/home/chat-consult.png
diff --git a/static/home/female.svg b/static/home/female.svg
new file mode 100644
index 0000000..386d349
--- /dev/null
+++ b/static/home/female.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1770103681929" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5978" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M877.714286 365.714286C877.714286 163.7504 713.963886 0 512 0S146.285714 163.7504 146.285714 365.714286c0 183.285029 134.999771 334.6432 310.857143 361.142857L457.142857 804.571429l-164.571429 0 0 109.714286 164.571429 0 0 109.714286 109.714286 0 0-109.714286 164.571429 0 0-109.714286-164.571429 0 0-77.714286C742.714514 700.357486 877.714286 548.999314 877.714286 365.714286zM256 365.714286c0-141.143771 114.856229-256 256-256s256 114.856229 256 256-114.856229 256-256 256S256 506.858057 256 365.714286z" fill="#F69661" p-id="5979"></path></svg>
\ No newline at end of file
diff --git a/static/home/健康宣教.png b/static/home/health-education.png
similarity index 100%
rename from static/home/健康宣教.png
rename to static/home/health-education.png
diff --git a/static/home/健康信息bg.svg b/static/home/health-info-bg.svg
similarity index 100%
rename from static/home/健康信息bg.svg
rename to static/home/health-info-bg.svg
diff --git a/static/home/male.svg b/static/home/male.svg
new file mode 100644
index 0000000..80c293b
--- /dev/null
+++ b/static/home/male.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1770103702423" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2069" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M914.285714 0 658.285714 0l0 109.714286 178.428343 0-160.393143 160.393143C605.429029 215.606857 516.928 182.857143 420.571429 182.857143 188.286171 182.857143 0 371.143314 0 603.428571s188.286171 420.571429 420.571429 420.571429 420.571429-188.286171 420.571429-420.571429c0-96.356571-32.749714-184.8576-87.250286-255.749486L914.285714 187.285943 914.285714 365.714286l109.714286 0L1024 109.714286 1024 0 914.285714 0zM420.571429 914.285714c-171.392 0-310.857143-139.465143-310.857143-310.857143s139.465143-310.857143 310.857143-310.857143 310.857143 139.465143 310.857143 310.857143S591.963429 914.285714 420.571429 914.285714z" fill="#1296db" p-id="2070"></path></svg>
\ No newline at end of file
diff --git a/static/home/我的宣教.png b/static/home/my-education.png
similarity index 100%
rename from static/home/我的宣教.png
rename to static/home/my-education.png
diff --git a/static/home/我的问卷.png b/static/home/my-questionnaire.png
similarity index 100%
rename from static/home/我的问卷.png
rename to static/home/my-questionnaire.png
diff --git a/static/home/服务评价.png b/static/home/service-rating.png
similarity index 100%
rename from static/home/服务评价.png
rename to static/home/service-rating.png
diff --git a/static/home/喇叭介绍.png b/static/home/speaker-intro.png
similarity index 100%
rename from static/home/喇叭介绍.png
rename to static/home/speaker-intro.png
diff --git a/static/home/切换团队.png b/static/home/switch-team.png
similarity index 100%
rename from static/home/切换团队.png
rename to static/home/switch-team.png
diff --git a/static/home/女性图标.png b/static/home/女性图标.png
deleted file mode 100644
index a2236733104435b60ba8b00ab6ee5eff9ddb813b..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 947
zcmV;k15EshP)<h;3K|Lk000e1NJLTq000~S000~a1^@s6at+^<000AMNkl<Zcmb?d
zT}u@~7=GSWD+mHT78VskL3af~QPf4yMf3v_L<PUHj~g$<kVq5?3_~Ialk%9LNz@OB
zE&?y2qUfTapo>UEMDh!Sz*5iKGdpwE_3T;Kq~(2PpLsv#*`1j)dpsmu+6hmaiuY?n
z=_O)_m?V}gQa`l5bVTb@wOU(N&fLO;;gBeZ@!}?|6pV17`$RRdn=k_tQVu~SMEX#$
zJcRL-i8CB;v4YyLql8c24JmlQ@>2u_*aFjRzd0CAimhx;Q~0qqmUf$3_VZe-AaqL`
z1Xn{<-vPZ&Uj@W-Km~obh_N6~StG0s9BWBL(5!=56As+U)a}GC4mgO#%uz|tc1i!t
zsPzB*Y(bu$ZO5V>@pAy?VmlPAT9>-Qu_EI~92hIx3y}s2In(FBQj0v9TX2rZ&Bm5m
zD9T(H7F1)hc(3aPx2T}EbcWGm1Wm{I^v#l9m}6&M^K%xpnMs^_wj#&5+0K)#v8W*A
z95c)&;0?p}=?zVW&DFHaG@I<S<H0Q|D0;$0r#ZE+9N+j&<Smn@31eqX6Gl`JlAU)>
zqeq0(H^TjzY~9Y>iadh3DgU>hPcS<jB|wJwS3$qV)#*fTbw0uDy6uGO$=rg(zN%R_
zJC!Q$a`W>EzGl)gL6ZipD%nA@A#=Ie^Yk~MFLMi{f(0ut_-5~2;sI=vd+VKzE)RYV
za{(!by*^+|(Ws@XZB%g2`~)QUEiqFr07X6S>DiB(jTQ9(CKvWnj!`x>VLPj>w@NLO
zPGlrKHvqvMdhFQ<spXq~(z?`5ehtoO<F3ONrR1qLZ1X<C<N)^UWvvX%4oWB7(jd4Z
zf<Z+8+~ykG4f<xPJh{Px`583h0N$mGIR^=Af?oKwwwv3=3YxQ#Ux#+6*0IQJByIvS
z!0f<7WCn(l@=a9VkW}$&a?R9|=QS^{H|*R$JB*^j8VX;g`zewAosz=vVa6_^FjI+r
zGbV2Qu}Bm&>mYqoWB!_?XDT_Ry}@XlK1t8i__2rc<IK$ju^5sl7*n@tccLKwooN`{
zy&Zv?q9YtLJcz}RM8TN4O}jTD_?4rFVKxd~z8M~l8SV$-nq)yQQ-Ls4R{ytvJRCDT
zPRaQb1?AD)moNY|Z)M9xr^7MBZ6Ll)6pSz3T;wkR00960Pg-WQ00006Nkl<Z0{}bx
VO&*d?l2HHv002ovPDHLkV1k<Ew;%uj