From c0bcba49bef43b880978ff63b2ac00f1ba5c5c6a Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期三, 21 五月 2025 16:13:59 +0800 Subject: [PATCH] fix: 修改ui --- apps/taro/src/pages/mine/index.vue | 144 ++++++++++++++++++++++++++++++----------------- 1 files changed, 91 insertions(+), 53 deletions(-) diff --git a/apps/taro/src/pages/mine/index.vue b/apps/taro/src/pages/mine/index.vue index 260ba75..ca824f6 100644 --- a/apps/taro/src/pages/mine/index.vue +++ b/apps/taro/src/pages/mine/index.vue @@ -1,29 +1,75 @@ <template> - <PageLayoutWithBg class="mine-page-wrapper" title="鎴戠殑" :need-auth="false"> + <PageLayoutWithBg class="mine-page-wrapper" :need-auth="false"> <template #navigationBar> - <TransparentNavigationBar - title="涓汉涓績" - :is-absolute="false" - mode="dark" - ></TransparentNavigationBar> + <TransparentNavigationBar :title="'涓汉涓績'" :is-absolute="false"> + </TransparentNavigationBar> </template> <template #bg> - <img :src="OssAssets.mine.Bg" class="mine-page-bg" :style="{ height: `${bgHeight}px` }" /> + <img :src="OssAssets.common.MinePageBg" class="mine-page-bg" /> </template> + <div class="mine-page-top-view" @click="goLogin"> + <img class="mine-avatar" :src="DefaultAvatar" alt="" /> + <div class="user-info"> + <div class="user-info-name" v-if="isLogin"> + {{ hiddenPhoneNumber(virtualPhoneNumber) }} + </div> + <div class="mine-go-login" v-else>鐧诲綍</div> + </div> + </div> + <ContentScrollView style="background-color: transparent"> + <List class="mine-list-wrapper"> + <ListItemV2 :icon="IconMineOrder" title="璁㈠崟绠$悊" @click="goOrderManage"></ListItemV2> + <ListItemV2 :icon="IconMineUserId" title="鎴峰彿绠$悊" @click="goUserAccountList"></ListItemV2> + <template v-if="isChannelAccount"> + <ListItemV2 :icon="IconMineDataBoard" title="鏁版嵁鐪嬫澘" @click="goDashboard"></ListItemV2> + <ListItemV2 + :icon="IconMinePromotion" + title="鎺ㄥ箍浜岀淮鐮�" + @click="goShareQrcode" + ></ListItemV2> + </template> + <ListItemV2 + :icon="IconMineCustomerService" + v-if="isWeb && !isInAlipay" + title="鍦ㄧ嚎瀹㈡湇" + @click="handleChat" + ></ListItemV2> + <ListItemV2 + v-if="isLogin" + title="閫�鍑虹櫥褰�" + @click="goLogout" + :icon="IconMineExist" + ></ListItemV2> + </List> + </ContentScrollView> </PageLayoutWithBg> </template> <script setup lang="ts"> -import { TransparentNavigationBar, ContentScrollView } from '@/components'; -import { useUser, useIsLogin, useGoLogin } from '@/hooks'; +import { TransparentNavigationBar, List, ListItemV2 } from '@/components'; +import { useUser, useIsLogin, useGoLogin, useAccessLogin, useOnlineService } from '@/hooks'; import Taro from '@tarojs/taro'; import { RouterPath, OssAssets } from '@/constants'; +import DefaultAvatar from '@/assets/components/icon-default-avatar.png'; +import IconMineOrder from '@/assets/mine/icon-mine-order.png'; +import IconMineUserId from '@/assets/mine/icon-mine-userId.png'; +import IconMineDataBoard from '@/assets/mine/icon-mine-data-board.png'; +import IconMinePromotion from '@/assets/mine/icon-mine-promotion.png'; +import IconMineCustomerService from '@/assets/mine/icon-mine-customer-service.png'; +import IconMineExist from '@/assets/mine/icon-mine-exist.png'; import { useSystemStore } from '@/stores/modules/system'; -import PageLayoutWithBg from '@/components/Layout/PageLayoutWithBg.vue'; +import { useUserStore } from '@/stores/modules/user'; +import { Message } from '@/utils'; +import { isWeb, isInAlipay } from '@/utils/env'; +import { useLifeRechargeContext } from '@life-payment/core-vue'; +import { hiddenPhoneNumber } from '@life-payment/utils'; -const { userDetail, isCertified } = useUser(); +const { userDetail, virtualPhoneNumber, isChannelAccount } = useUser(); + const isLogin = useIsLogin(); const systemStore = useSystemStore(); +const userStore = useUserStore(); +const { blLifeRecharge } = useLifeRechargeContext(); const { goLoginFn } = useGoLogin(); const bgHeight = computed(() => 133 + systemStore.navHeight); @@ -35,59 +81,51 @@ } function goPage(routeName: string) { - Taro.navigateTo({ + RouteHelper.navigateTo({ url: routeName, }); } -function goSetting() { - goPage(RouterPath.setting); +// Taro.showShareMenu({ +// showShareItems: ['shareAppMessage'], +// }); +// Taro.useShareAppMessage((res) => { +// return { +// title: `${userDetail.value?.contacter}鍚嶇墖`, +// // path: `${RouterPath.userHomePage}?userId=${userDetail.value?.userId}`, +// imageUrl: userDetail.value?.avatarUrl, +// }; +// }); + +const goOrderManage = useAccessLogin(() => goPage(RouterPath.order)); +const goUserAccountList = useAccessLogin(() => goPage(RouterPath.userAccountList)); +const goShareQrcode = useAccessLogin(() => goPage(RouterPath.shareQrcode)); +const goDashboard = useAccessLogin(() => goPage(RouterPath.dashboard)); + +async function goLogout() { + try { + await Message.confirm({ + message: '纭畾瑕侀��鍑虹櫥褰曞悧锛�', + }); + userStore.logout(); + blLifeRecharge.loginout(); + } catch (error) {} } -Taro.showShareMenu({ - showShareItems: ['shareAppMessage'], -}); +const { onlineServiceLink } = useOnlineService(); -Taro.useShareAppMessage((res) => { - return { - title: `${userDetail.value?.contacter}鍚嶇墖`, - // path: `${RouterPath.userHomePage}?userId=${userDetail.value?.userId}`, - imageUrl: userDetail.value?.avatarUrl, - }; -}); - -function goAuthentication() { - goPage(RouterPath.authenticationHome); -} -function goMineSign() { - goPage(RouterPath.mineSign); -} -function goMineHire() { - goPage(RouterPath.mineHire); -} -function goMineCancel() { - goPage(RouterPath.mineCancel); -} -function goMineCollectTask() { - goPage(RouterPath.mineCollectTask); -} -function goMineAgreementSign() { - goPage(RouterPath.mineAgreementSign); +function handleChat() { + if (isWeb && onlineServiceLink.value) { + if (isInAlipay) { + Message.warning('璇峰湪寰俊涓墦寮�浣跨敤璇ュ姛鑳�'); + } else { + window.open(onlineServiceLink.value, '_blank'); + } + } } </script> <style lang="scss"> @import '@/styles/common.scss'; @import './index.scss'; - -.mine-setting-badge { - margin-right: 20px; -} - -.mine-setting-list { - .pro-list-item-icon { - width: 48px; - height: 48px; - } -} </style> -- Gitblit v1.9.1