| <template> | 
|   <PageLayout title="设置" class="setting-page-wrapper" hasBorder> | 
|     <List> | 
|       <!-- <ListItem title="登录账号"> | 
|         <template #extra> | 
|           <div class="user-account"> | 
|             {{ userAccount }} | 
|           </div> | 
|         </template> | 
|       </ListItem> --> | 
|       <ListItem title="用户协议" @click="goMineUserPolicy"></ListItem> | 
|       <ListItem title="隐私政策" @click="goPrivacyPolicy"></ListItem> | 
|       <ListItem title="退出登录" @click="handleLoginout"></ListItem> | 
|       <!-- <ListItem title="人工客服" @click="goMineService"></ListItem> --> | 
|       <nut-button :open-type="'contact'" class="setting-page-service">人工客服</nut-button> | 
|     </List> | 
|   </PageLayout> | 
| </template> | 
|   | 
| <script setup lang="ts"> | 
| import { PageLayout } from '@/components'; | 
| import { List, ListItem } from '@12333/components'; | 
| import { addStarForString, Message } from '@12333/utils'; | 
| import { useUserStore } from '@/stores/modules/user'; | 
| import { useQueryClient } from '@tanstack/vue-query'; | 
| import Taro from '@tarojs/taro'; | 
|   | 
| defineOptions({ | 
|   name: 'setting', | 
| }); | 
|   | 
| const userStore = useUserStore(); | 
| const queryClient = useQueryClient(); | 
|   | 
| const userAccount = computed(() => { | 
|   return addStarForString(userStore?.userDetail?.name, 4, 8); | 
| }); | 
|   | 
| function goMineUserPolicy() { | 
|   Taro.navigateTo({ | 
|     url: RouterPath.mineUserPolicy, | 
|   }); | 
| } | 
| function goPrivacyPolicy() { | 
|   Taro.navigateTo({ | 
|     url: RouterPath.privacyPolicy, | 
|   }); | 
| } | 
|   | 
| async function handleLoginout() { | 
|   try { | 
|     await Message.confirm({ | 
|       message: '确定要退出登录吗?', | 
|     }); | 
|     userStore.logoutAndToHome(); | 
|     queryClient.removeQueries({ | 
|       predicate: (query) => !query.queryKey.includes('taskServices/getOpenTaskInfos'), | 
|     }); | 
|   } catch (error) {} | 
| } | 
|   | 
| function goMineService() { | 
|   // const encodedUrl = encodeURIComponent('https://work.weixin.qq.com/kfid/kfcd24e0c60fd91099'); | 
|   Taro.openCustomerServiceChat({ | 
|     extInfo: { | 
|       // url: 'https://work.weixin.qq.com/kfid/kfcd24e0c60fd91099', | 
|       url: `${RouterPath.setting}`, | 
|     }, | 
|     corpId: 'wwc84cb8e0525c772f', | 
|     // corpId: 'kfc2335f41fb4f0c0bc', | 
|     fail: (res) => { | 
|       Taro.showToast({ | 
|         title: res.errMsg, | 
|         icon: 'none', | 
|       }); | 
|     }, | 
|   }); | 
| } | 
| </script> | 
|   | 
| <style lang="scss"> | 
| @import '@/styles/common.scss'; | 
|   | 
| .setting-page-wrapper { | 
|   .user-account { | 
|     color: boleGetCssVar('text-color', 'regular'); | 
|     font-size: 24px; | 
|   } | 
|   | 
|   .setting-page-service { | 
|     height: 104px; | 
|     padding-left: 28px; | 
|     color: boleGetCssVar('text-color', 'primary'); | 
|     width: 100%; | 
|   | 
|     &::before { | 
|       display: none; | 
|     } | 
|   | 
|     &::after { | 
|       display: none; | 
|     } | 
|   | 
|     .nut-button__wrap { | 
|       justify-content: flex-start; | 
|     } | 
|   } | 
| } | 
| </style> |