From cefbc4b3e4e91ec059636b726a0fd0c88070c866 Mon Sep 17 00:00:00 2001
From: weipengfei <2187978347@qq.com>
Date: Sat, 22 Jul 2023 14:41:42 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E4=BA=BA=E5=91=98=E8=AF=A6?=
 =?UTF-8?q?=E7=BB=86=E4=BF=A1=E6=81=AF=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/company.js                               |  12 +-
 pages/oaHome/oaHome.vue                      |   4 +-
 pages/oaManager/oaManager.vue                |   5 +-
 static/icons/man.png                         | Bin 0 -> 1083 bytes
 static/icons/woman.png                       | Bin 0 -> 1049 bytes
 subpkg/personnel/personnel.vue               |  92 +++---
 subpkg/personnelDetails/personnelDetails.vue | 277 ++++++++++++++++++-
 7 files changed, 342 insertions(+), 48 deletions(-)
 create mode 100644 static/icons/man.png
 create mode 100644 static/icons/woman.png

diff --git a/api/company.js b/api/company.js
index 49f306d..503f529 100644
--- a/api/company.js
+++ b/api/company.js
@@ -18,4 +18,14 @@ export const companyView = (data) => oahttp.get('/company/view', data)
 /**
  * 公司详情
  */
-export const companyAreaManager = (data) => oahttp.get('/company/areaManager', data)
\ No newline at end of file
+export const companyAreaManager = (data) => oahttp.get('/company/areaManager', data)
+
+/**
+ * 人员列表
+ */
+export const companyUser = (data) => oahttp.get('/company/users', data)
+
+/**
+ * 人员详情
+ */
+export const companyUserDetail = (data) => oahttp.get('/company/user', data)
\ No newline at end of file
diff --git a/pages/oaHome/oaHome.vue b/pages/oaHome/oaHome.vue
index ef8cce5..af5b6ae 100644
--- a/pages/oaHome/oaHome.vue
+++ b/pages/oaHome/oaHome.vue
@@ -105,9 +105,9 @@
     </view>
     
     <view class="no_login" v-if="!$store.state.app.token">
-      <view class="view">
+      <view class="view" @click="login()">
         <view class="text">登录里海OA,开启线上便捷办公</view>
-        <button class="btn" @click="login">立即登录</button>
+        <button class="btn">立即登录</button>
       </view>
     </view>
     <!-- <tabbar></tabbar> -->
diff --git a/pages/oaManager/oaManager.vue b/pages/oaManager/oaManager.vue
index 057c7ee..a296b63 100644
--- a/pages/oaManager/oaManager.vue
+++ b/pages/oaManager/oaManager.vue
@@ -44,7 +44,7 @@
           <view class="bottom">
             <view class="circle"></view>
             <view class="green">所属片区</view>
-            <view>{{item.area}}</view>
+            <view>{{item.city_name+item.area_name+item.street_name}}</view>
           </view>
         </view>
         <view class="right">
@@ -218,7 +218,7 @@
 
     .item {
       width: 694rpx;
-      height: 201rpx;
+      // height: 201rpx;
       background: #FFFFFF;
       border-radius: 14rpx 14rpx 14rpx 14rpx;
       opacity: 1;
@@ -270,6 +270,7 @@
           display: flex;
           justify-content: left;
           align-items: center;
+          margin-top: 20rpx;
 
           .circle {
             width: 11rpx;
diff --git a/static/icons/man.png b/static/icons/man.png
new file mode 100644
index 0000000000000000000000000000000000000000..503eeba9f2b9f09c2b1900f8f4b97c46d6f4209a
GIT binary patch
literal 1083
zcmV-B1jPG^P)<h;3K|Lk000e1NJLTq000>P000^Y1^@s6LVfqm00001b5ch_0Itp)
z=>Px&^+`lQR7gv$mR)EaMHI*XXFp~(F*LQcezYJ76|7cF?j|Cwr8EzMedvQ=`(mNi
zhk_Qw<Zf%N2zgLK%-*z8s1G6(u}={MQ3>cnu=oKrdt<EuY1$?zTB@NoiOHS)m?OL9
zrZ;VBlibYP&Yqdyoc}pz&Jb2$xL#=tFdhVW{%%BI<}YXk7|7+-q~(aZj6pyW#sKT`
z*72et&9Cxmb2Y-jPMW^c!CX)M24KUi-R&VQ2e>w=kM<Dj{icxHv(pej1Vl6HDuLc*
z=+nhQ%~%=Q@WN$h%{?1_1$Zq3qlRHMauP=ic*5j*>YyRy2^~ft!vx3xXBr?T({@rC
zCm~EB5SLW{wN>)j1`Nd4C%23e(RzT!17ECr;tl4c6wZfiY3G`fsYVHOFPQ=yha=3?
zTkI9@RZ7&9kG2`4yNQggnf8nXgbM&31~3tfiM8mX<QB+|PPQhd!bt!Q7*nLh*1==+
z)Bou|E6+DXhRd9!dQJy*c0D>N^%@yORe0ihY6QSW0AqnK8}1a`%Kz>m^$}n^pU$ni
z%d!V%A+1N4b)^2vVv@_3@?@AkSSNumt)&3Uwyvkn0%&FMS4H1>I-B3kW-40-X?cya
zD&k1(3VNN-mIF!S89B((J51E3bMH96l=q=r$IOd{Wq-g)d@(3E4=o2!UX$}mCkgZt
z7^j1R+&c$xJ@qMwcIiYP8tQfYY9LJ=Va^tIpyO~N@MZlCPx7TJrjYl=GiV$-PNUU8
z(zR}0X+sK%1@0c|q`$Koc0I*uQT_QlYDP~{X$2sc4O=usjK_ZLrk~4@*p$LN`*wO^
zR6krV{DDlnCDQTsb3OK%43hKIxM_<u)A2tK4ENMssTSjUr9TWy-k(I+TrAM=tS903
zWZF-1sCEX&oc?Mdtw)(tO)8a1W6}e_W8lN0FZWdg$>r5^hH3Y)4lf4&jdGx-cD31d
z#QF4|yFLwP<OHeZf?Q7xgXj@rK04^juDKNcFYQWaK(q~@_XA%XSUQBMxkK$VZTWfH
z0s>#oOQP)Kac`zkO6QV}0Ud|Civ{`dQb4)ad7Tj_SF?_mL<a{8&dJL4bHrR;9WgA?
z1)V_a<gH>szPT7svls0k=zanug9eJeXuEmcJh$Au>LyDZP8$*H_=1k3JwwOqh8BW7
z`ZCwa+OW?s#WSoUu;y=z1^LuMwzm{ub3WW>+4d<NhcGOW$~O+icT98%oJ@eMO$41Y
zgxILV5T+D}Rn%MbMgDf4FIeR*om{J@qAt_2UrC!l8qB#@1Z$+N*|2~_g`Y6%_R7b^
zqCC0TsO50frghu~(0Y);r1dp0zMhEWmy1pJe*yLF%bLj+$ff`Q002ovPDHLkV1oJ6
B1!DjJ

literal 0
HcmV?d00001

diff --git a/static/icons/woman.png b/static/icons/woman.png
new file mode 100644
index 0000000000000000000000000000000000000000..e28e133619eef0314548244a07dd06ce665a5d20
GIT binary patch
literal 1049
zcmV+!1m^pRP)<h;3K|Lk000e1NJLTq000*N0018d1^@s640%?~00001b5ch_0Itp)
z=>Px&(@8`@R7gw3l}%_|RTRg6=gmwL(<C!57{L%oG#~FKm1r9LMjMoZ1#63fLPc5;
zQK{%gi3<^3m_o61q3BNQ7g#H{XtgfH)`iq+Bc;vs-AM{ss0!M2GN}=5GVjP8Cqo)D
zWSRuLi&?z)KfnKZXU@4tD06;nZLRjJs@99h1{GP2Y6lP(_+24XI2ez`KCDZpPnKiI
zd@m-9*_?+#fu?eSrRS=<RpdF}+MniXFM|Kl)KpVbU;i#}Z$YS<7m@E!JunSFdobof
zD<ZuStes^(p;5HO9~s#@+n@y3=H|<CwYA>>y+!aBk>@?z5Qf9$vd;#=)1JtH!j(=V
zBAb(8_|A;J1kVP+UJ=>ovW-MuXs~v0!IA*kuC5kT_X}JDOi4a}TXJ;tNWskgoHJ&V
z2k#d%9!O;}+baRjXtJ%XDXFeL2DB)oQ!7{Y%Fxi19PR5%v`<c2;A(~azP0Nw1za-d
z=(tW|u_3@y)kpkH=1rL}=I#hS1)?dD>l?%HhsD5M%(yY`>o+N!@U88UtTAs1Y!Nt|
zwDy+8f?ZtJm^A{23XLYx>fk5bpP}%KZ|#nyz>5aw1!^OBP;$onrBD^AKGcxOytfSS
zVS!Z&FUhzu`tQ8x9eyTra2eo-1lAPbSz{&zY7`#!t=+X$__#5y^8(;;m$~bX-bnTN
zhD_$=rN9-uoH2g_Rj587<3aE`B2OqB_pQBlDezop=Q{Pg&mALq;X+DsL2#Ff94Oum
zHz&jJ+r=7WySny?>IUFQ%G#UU_`A9v6X*fHN?Cj7V&K`XuG>A;LkgmBpKtBQGk42+
z4?Zd0E!$I>%)q4>oNsHpBA-Z{0_uRHNo#KqH%Emw1XrFn5P7UHTv7B|a%AMGN(^#s
zZS5oyhZQad{+<%Ksxb_IE!~O*gTB5*ZgTQ7U~Lh4Iu?(ws~a8;%bAQD^9ryPsCJqd
z^w(MY^^E?aO{Cr3E5@T}hrp9X=REKm;M(<jM9zw8kHW1AEkJD%bT&3U-CuX=RC;zI
z|Jk80g10pYRwqRE;8xngXE5n`+vMcQKjup3UC>T+u)javbLLE^c-}pp=WPUTEC!!b
zk$sxae-uk3jwI9RbLITY!siBLjoBrzS>bKp+ARxzP;t%86{fqpS2Rb_HdQsHcOq^M
znt?N@9xpwQqMfPH(J$vSn>X{ZAh<s!vb&P(fYFq-ot4Ae+v{WTxLeYVvx55E0tQY4
zZdVqLi0ny*;RhAN=Myel&Hp#Jz^h4XE4msgZpE?g?p0ns|0tff(+@*e_XW>CBN=cq
Tn#Ui!00000NkvXXu0mjf&_DRD

literal 0
HcmV?d00001

diff --git a/subpkg/personnel/personnel.vue b/subpkg/personnel/personnel.vue
index 924c707..424ab86 100644
--- a/subpkg/personnel/personnel.vue
+++ b/subpkg/personnel/personnel.vue
@@ -2,47 +2,52 @@
   <view class="personnel">
     <!-- <button class="new_btn">创建</button> -->
     <view class="personnel_list">
-      <view class="personnel_item">
-        <view class="type">
-          <image src="../../static/icons/err_w.png"></image>
-          <!-- <image src="../../static/icons/ok_w.png"></image> -->
-          <text>未签约</text>
-        </view>
-        <view class="top">
-          <view class="left">
-            <u--image class="u_avatar" :showLoading="true" src="../../static/img/public/man.png" width="112.28rpx" height="112.28rpx" shape="circle"></u--image>
+      <block v-for="(item, index) in userList" :key="item.id">
+        <view class="personnel_item">
+          <view class="type" :class="item.is_contract?'type_blue':''">
+            <image v-if="item.is_contract" src="../../static/icons/ok_w.png"></image>
+            <image v-else src="../../static/icons/err_w.png"></image>
+            <text>{{item.is_contract?'已签约':'未签约'}}</text>
           </view>
-          <view class="right">
-            <view class="info_top">
-              <view class="info_name">人员名称</view>
-              <view>隶属乡镇公司名称</view>
+          <view class="top">
+            <view class="left">
+              <u--image class="u_avatar" :showLoading="true" :src="item.avatar||'../../static/img/public/man.png'" width="112.28rpx" height="112.28rpx" shape="circle"></u--image>
             </view>
-            <view class="info_bottom">
-              <view class="item phone">
-                <uni-icons type="phone" color="#999999FF"></uni-icons>
-                13546841564
+            <view class="right">
+              <view class="info_top">
+                <view class="info_name">{{item.name}}</view>
+                <view>{{item.company}}</view>
               </view>
-              <view class="item">
-                <uni-icons type="location" color="#999999FF"></uni-icons>
-                通滩镇
+              <view class="info_bottom">
+                <view class="item phone">
+                  <uni-icons type="phone" color="#999999FF"></uni-icons>
+                  {{item.phone}}
+                </view>
+                <view class="item">
+                  <uni-icons type="location" color="#999999FF"></uni-icons>
+                  <view class="location">{{item.city_name+item.area_name+item.street_name}}</view>
+                </view>
               </view>
             </view>
           </view>
-        </view>
-        <view class="center">
-          <view class="top">小组服务团队：<text class="green">管理人</text></view>
-          <view class="bottom">
-            <view><image src="../../static/icons/ok.png"></image>身份证</view>
-            <view><image src="../../static/icons/ok.png"></image>驾驶证</view>
-            <view><image src="../../static/icons/err.png"></image>银行卡</view>
+          <view class="center">
+            <view class="top" v-for="(role, roleIndex) in item.roles" :key="roleIndex">
+              {{role}}
+              <!-- <text class="green">管理人</text> -->
+            </view>
+            <view class="bottom">
+              <view><image :src="item.qualification.id_card?'../../static/icons/ok.png':'../../static/icons/err.png'"></image>身份证</view>
+              <view><image :src="item.qualification.car_card?'../../static/icons/ok.png':'../../static/icons/err.png'"></image>驾驶证</view>
+              <view><image :src="item.qualification.bank_account?'../../static/icons/ok.png':'../../static/icons/err.png'"></image>银行卡</view>
+            </view>
+          </view>
+          <u-line color="#999999FF"></u-line>
+          <view class="bottom" style="margin-top: 28rpx;">
+            <button class="look" @click="navTo('/subpkg/personnelDetails/personnelDetails?id='+item.id)">查看</button>
           </view>
         </view>
-        <u-line color="#999999FF"></u-line>
-        <view class="bottom" style="margin-top: 28rpx;">
-          <button class="look" @click="navTo('/subpkg/personnelDetails/personnelDetails')">查看</button>
-        </view>
-      </view>
-      <view class="personnel_item">
+      </block>
+      <!-- <view class="personnel_item">
         <view class="type type_blue">
           <image src="../../static/icons/ok_w.png"></image>
           <text>已签约</text>
@@ -80,13 +85,14 @@
         <view class="bottom" style="margin-top: 28rpx;">
           <button class="look" @click="navTo('/subpkg/personnelDetails/personnelDetails')">查看</button>
         </view>
-      </view>
+      </view> -->
     </view>
   </view>
 </template>
 
 <script>
 import { Toast } from '@/libs/uniApi.js'
+import {companyUser} from "@/api/company.js"
 export default {
   onReady() {
     uni.setNavigationBarColor({
@@ -96,11 +102,13 @@ export default {
   },
   data() {
     return {
-       
+      userList: []
     }
   },
   onLoad() {},
-  onShow() {},
+  onShow() {
+    this.loadUserList()
+  },
   methods: {
     navTo(url) {
       url ?
@@ -108,6 +116,15 @@ export default {
           url: url,
         }) : Toast('暂未开放')
     },
+    loadUserList(){
+      let that = this;
+      companyUser({
+        page: 1,
+        limit: 15
+      }).then(res=>{
+        that.userList = res.data.data;
+      })
+    }
   },
   onPullDownRefresh() {
       uni.stopPullDownRefresh()
@@ -179,6 +196,7 @@ export default {
           margin-left: 28rpx;
           font-size: 25rpx;
           font-weight: 400;
+          overflow: hidden;
           color: #999999;
           .info_top{
             display: flex;
@@ -203,7 +221,7 @@ export default {
               margin-right: 28rpx;
             }
             .location{
-              flex: 1;
+              width: 250rpx;
               white-space: nowrap; /* 不换行 */
               overflow: hidden; /* 将超出文本隐藏 */
               text-overflow: ellipsis; /* 使用省略号表示被隐藏的文本 */
diff --git a/subpkg/personnelDetails/personnelDetails.vue b/subpkg/personnelDetails/personnelDetails.vue
index 6653b60..2111c18 100644
--- a/subpkg/personnelDetails/personnelDetails.vue
+++ b/subpkg/personnelDetails/personnelDetails.vue
@@ -1,9 +1,95 @@
 <template>
-  <view class=""></view>
+  <view class="page">
+    <view class="basic">
+      <view class="title">人员基本信息</view>
+      <view class="card">
+        <view class="basic_top">
+          <image class="avatar" :src="userInfo.avatar"></image>
+          <view class="text">
+            <view class="basic_name">
+              <view class="name">{{userInfo.name}}</view>
+              <image class="icon" :src="userInfo.sex==1?'../../static/icons/man.png':'../../static/icons/woman.png'"></image>
+              <view class="role">{{userInfo.roles[0]}}</view>
+            </view>
+            <view class="id_card">
+              身份证号:{{userInfo.id_card}}
+            </view>
+            <view class="phone">
+              联系电话:{{userInfo.phone}}
+            </view>
+          </view>
+        </view>
+        <view class="bottom">
+          负责区域: {{userInfo.city_name+userInfo.area_name+userInfo.street_name}}{{userInfo.city_name+userInfo.area_name+userInfo.street_name}}
+        </view>
+      </view>
+    </view>
+    <view class="certification">
+      <view class="title">资质信息</view>
+      <view class="c_item">
+        <uni-section style="background-color: transparent;" title="身份证" titleFontSize="32rpx" type="line"></uni-section>
+        <view class="card_box">
+          <image :src="userInfo.qualification.id_card" 
+            @click="previewImg([userInfo.qualification.id_card,userInfo.qualification.id_card_b], 0)">
+          </image>
+          <image :src="userInfo.qualification.id_card_b"
+            @click="previewImg([userInfo.qualification.id_card,userInfo.qualification.id_card_b], 1)"></image>
+        </view>
+      </view>
+      <view class="c_item">
+        <uni-section style="background-color: transparent;" title="驾驶证" titleFontSize="32rpx" type="line"></uni-section>
+        <view class="card_box">
+          <image :src="userInfo.qualification.car_card"
+            @click="previewImg([userInfo.qualification.car_card,userInfo.qualification.car_card_b], 0)"></image>
+          <image :src="userInfo.qualification.car_card_b"
+            @click="previewImg([userInfo.qualification.car_card,userInfo.qualification.car_card_b], 1)"></image>
+        </view>
+      </view>
+      <view class="c_item">
+        <uni-section style="background-color: transparent;" title="银行卡照片" titleFontSize="32rpx" type="line"></uni-section>
+        <view class="card_box">
+          <image :src="userInfo.qualification.bank_account"
+            @click="previewImg([userInfo.qualification.bank_account,userInfo.qualification.bank_account_b], 0)"></image>
+          <image :src="userInfo.qualification.bank_account_b"
+            @click="previewImg([userInfo.qualification.bank_account,userInfo.qualification.bank_account_b], 1)"></image>
+        </view>
+      </view>
+    </view>
+    <view class="contract">
+      <view class="title">电子合同</view>
+      <view class="card">
+        <uni-section style="background-color: transparent;" :title="userInfo.name" titleFontSize="32rpx" type="line"></uni-section>
+        <view class="c_text">性别：{{userInfo.sex==1?'男':'女'}}</view>
+        <view class="c_text">身份证号码：{{userInfo.id_card}}</view>
+        <view class="c_text">联系电话：{{userInfo.phone}}</view>
+        <view class="c_text">合同类型：{{userInfo.contract.contract_type_name}}</view>
+        <view class="c_text">合同编号：{{userInfo.contract.contract_no}}</view>
+        <u-line v-if="userInfo.contract.file" color="#999999FF" style="margin: 31rpx 0;"></u-line>
+        <view v-if="userInfo.contract.file" class="contract_box">
+          <view class="left">
+            <image class="contract_img" src="../../static/img/contract/pdf.png"></image>
+            <view class="text">
+              <view class="name">合同</view>
+              <view>
+                <text>{{userInfo.contract.create_time}}</text>
+              </view>
+            </view>
+          </view>
+          <view class="right"
+            @click="naviTo('/subpkg/pdfView/pdfView?url=' + userInfo.contract.file)">
+            <!-- <image class="icon"></image> -->
+            <uni-icons type="paperclip" color="#3274F9"></uni-icons>
+            <view>查看</view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
 import { Toast } from '@/libs/uniApi.js'
+import {companyUserDetail} from "@/api/company.js"
 export default {
   onReady() {
     uni.setNavigationBarColor({
@@ -13,18 +99,41 @@ export default {
   },
   data() {
     return {
-       
+      id:'',
+      userInfo: {
+        qualification:{},
+        contract:{},
+        roles:{}
+      }
     }
   },
-  onLoad() {},
-  onShow() {},
+  onLoad(options) {
+    if(options.id)this.id=options.id;
+  },
+  onShow() {
+    this.loadUserDetail();
+  },
   methods: {
-    navTo(url) {
+    naviTo(url) {
       url ?
         uni.navigateTo({
           url: url,
         }) : Toast('暂未开放')
     },
+    loadUserDetail(){
+      if(!this.id) return;
+      companyUserDetail({
+        id: this.id
+      }).then(res=>{
+        this.userInfo = res.data;
+      })
+    },
+    previewImg(urls, index=0){
+      uni.previewImage({
+        urls:urls,
+        current:index
+      })
+    }
   },
   onPullDownRefresh() {
       uni.stopPullDownRefresh()
@@ -33,5 +142,161 @@ export default {
 </script>
 
 <style lang="scss">
-
+.page{
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.title{
+  font-size: 35rpx;
+  font-weight: 500;
+  color: #333333;
+  margin-bottom: 21rpx;
+}
+.card{
+  width: 694rpx;
+  background: #FFFFFF;
+  border-radius: 14rpx 14rpx 14rpx 14rpx;
+  padding: 28rpx;
+}
+.basic{
+  margin: 28rpx 0;
+  .card{
+    font-size: 28rpx;
+    color: #666666;
+    .basic_top{
+      display: flex;
+      margin-bottom: 28rpx;
+      .avatar{
+        width: 154rpx;
+        height: 154rpx;
+        background: #CCCCCC;
+        border-radius: 7rpx 7rpx 7rpx 7rpx;
+        margin-right: 28rpx;
+      }
+      .text{
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        .basic_name{
+          display: flex;
+          align-items: center;
+          .icon{
+            width: 21rpx;
+            height: 21rpx;
+            margin-left: 18rpx;
+            margin-right: 36rpx;
+          }
+          .name{
+            font-size: 32rpx;
+            font-weight: 500;
+            color: #000000CC;
+          }
+          .role{
+            width: 284rpx;
+            font-size: 28rpx;
+            font-weight: 500;
+            color: #3274F9;
+            // white-space: nowrap; /* 不换行 */
+            // overflow: hidden; /* 将超出文本隐藏 */
+            // text-overflow: ellipsis; /* 使用省略号表示被隐藏的文本 */
+          }
+        }
+        
+      }
+    }
+    .bottom{
+      // width: 640rpx;
+      // white-space: nowrap; /* 不换行 */
+      // overflow: hidden; /* 将超出文本隐藏 */
+      // text-overflow: ellipsis; /* 使用省略号表示被隐藏的文本 */
+    }
+  }
+}
+.certification{
+  margin-bottom: 28rpx;
+  .title{
+    margin-bottom: 0;
+  }
+  .c_item{
+    width: 694rpx;
+    .card_box{
+      display: flex;
+      justify-content: space-between;
+      image{
+        width: 336rpx;
+        height: 238rpx;
+        background: #FFFFFF;
+        border-radius: 14rpx 14rpx 14rpx 14rpx;
+        border: 2rpx solid #CCCCCC;
+      }
+    }
+  }
+}
+.contract{
+  margin-bottom: 28rpx;
+  .card{
+    padding-top: 0;
+    .contract_box{
+      display: flex;
+      justify-content: space-between;
+      .left {
+          display: flex;
+        
+          .contract_img {
+            width: 102rpx;
+            height: 102rpx;
+            background: #F5F5F5;
+            border-radius: 14rpx 14rpx 14rpx 14rpx;
+            margin-right: 21rpx;
+          }
+        
+          .text {
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+        
+            .name {
+              font-size: 32rpx;
+              ;
+              font-weight: 500;
+              color: rgba(0, 0, 0, 0.8);
+              line-height: 35rpx;
+            }
+        
+            .nickname {
+              margin-right: 35rpx;
+            }
+        
+            text {
+              height: 39rpx;
+              font-size: 28rpx;
+              font-weight: 400;
+              color: #666666;
+              line-height: 35rpx;
+            }
+          }
+        }
+        
+        .right {
+          font-size: 28rpx;
+          font-weight: 500;
+          color: #3274F9;
+          line-height: 35rpx;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+        
+          .icon {
+            width: 35rpx;
+            height: 39rpx;
+            background-color: #3274F9;
+            opacity: 1;
+            margin-right: 10rpx
+          }
+        }
+      
+    }
+  }
+}
 </style>