|  |  | 
 |  |  | <template> | 
 |  |  |   <div class="mine-page-top-view"> | 
 |  |  |     <slot name="avatar"></slot> | 
 |  |  |     <div class="setting-wrapper" v-if="showUserHomePageBtn" @click="goUserHomePage"> | 
 |  |  |       <div class="setting-text">我的主页</div> | 
 |  |  |     <div class="setting-wrapper" v-if="showUserHomePageBtn" @click="goMineCurriculumVitae"> | 
 |  |  |       <div class="setting-text"> | 
 |  |  |         我的简历<IconFont name="rect-right" size="16" color="#6D6E6E"></IconFont> | 
 |  |  |       </div> | 
 |  |  |     </div> | 
 |  |  |   </div> | 
 |  |  |   <div class="mine-page-operation-wrapper" v-if="showOperation"> | 
 |  |  |     <div class="mine-page-operation-item" @click="goEditProfile"> | 
 |  |  |       <img class="mine-page-operation-item-icon" :src="IconEdit" /> | 
 |  |  |       <div class="mine-page-operation-item-text">编辑资料</div> | 
 |  |  |       <img class="mine-page-operation-item-arrow" :src="IconArrow" /> | 
 |  |  |     </div> | 
 |  |  |     <button class="mine-page-operation-item share" open-type="share"> | 
 |  |  |       <!-- <div class="mine-page-operation-item-inner"> --> | 
 |  |  |       <img class="mine-page-operation-item-icon" :src="IconCard" /> | 
 |  |  |       <div class="mine-page-operation-item-text">发送名片</div> | 
 |  |  |       <img class="mine-page-operation-item-arrow" :src="IconArrow" /> | 
 |  |  |       <!-- </div> --> | 
 |  |  |     </button> | 
 |  |  |   </div> | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | <script setup lang="ts"> | 
 |  |  | import { useUser, useIsLogin } from '@/hooks'; | 
 |  |  | import { useUser } from '@/hooks'; | 
 |  |  | import Taro from '@tarojs/taro'; | 
 |  |  | import IconEdit from '@/assets/mine/icon-edit.png'; | 
 |  |  | import IconCard from '@/assets/mine/icon-card.png'; | 
 |  |  | import IconArrow from '@/assets/mine/icon-arrow.png'; | 
 |  |  | import { RouterPath } from '@/constants'; | 
 |  |  |  | 
 |  |  | defineOptions({ | 
 |  |  |   name: 'UserHomeTopView', | 
 |  |  | 
 |  |  |  | 
 |  |  | const { userDetail } = useUser(); | 
 |  |  |  | 
 |  |  | function goUserHomePage() { | 
 |  |  | function goMineCurriculumVitae() { | 
 |  |  |   Taro.navigateTo({ | 
 |  |  |     url: `${RouterPath.userHomePage}?userId=${userDetail.value?.userId}`, | 
 |  |  |   }); | 
 |  |  | } | 
 |  |  |  | 
 |  |  | function goEditProfile() { | 
 |  |  |   Taro.navigateTo({ | 
 |  |  |     url: RouterPath.userInfo, | 
 |  |  |     url: RouterPath.mineCurriculumVitae, | 
 |  |  |   }); | 
 |  |  | } | 
 |  |  | </script> | 
 |  |  | 
 |  |  |   margin-bottom: 20px; | 
 |  |  |  | 
 |  |  |   .setting-wrapper { | 
 |  |  |     height: 56px; | 
 |  |  |     background: rgba(#000, $alpha: 0.15); | 
 |  |  |     border-radius: 200px 0px 0px 200px; | 
 |  |  |     align-self: center; | 
 |  |  |     align-self: flex-start; | 
 |  |  |     display: flex; | 
 |  |  |     align-items: center; | 
 |  |  |     margin-top: 8px; | 
 |  |  |     margin-right: calc(boleGetCssVar('size', 'body-padding-h') * -1); | 
 |  |  |     padding-left: 24px; | 
 |  |  |     padding-right: 16px; | 
 |  |  |  | 
 |  |  |     .setting-icon { | 
 |  |  |       width: 32px; | 
 |  |  |       height: 32px; | 
 |  |  |       margin-right: 4px; | 
 |  |  |       margin-left: 32px; | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     .setting-text { | 
 |  |  |       font-weight: 400; | 
 |  |  |       font-size: 24px; | 
 |  |  |       color: #ffffff; | 
 |  |  |       line-height: 34px; | 
 |  |  |       font-size: 28px; | 
 |  |  |       line-height: 40px; | 
 |  |  |       display: flex; | 
 |  |  |       align-items: center; | 
 |  |  |       color: boleGetCssVar('text-color', 'primary'); | 
 |  |  |       padding-right: 20px; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } |