From e0cb82c8dbf83fabc0cab548abc873926366fb75 Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期三, 21 五月 2025 17:29:15 +0800 Subject: [PATCH] fix: 修改ui --- packages/components/src/views/userAccount/UserAccountListView.vue | 69 ++++++++++++++++++++++++++++------ 1 files changed, 56 insertions(+), 13 deletions(-) diff --git a/packages/components/src/views/userAccount/UserAccountListView.vue b/packages/components/src/views/userAccount/UserAccountListView.vue index 68ee021..c8fcb43 100644 --- a/packages/components/src/views/userAccount/UserAccountListView.vue +++ b/packages/components/src/views/userAccount/UserAccountListView.vue @@ -4,24 +4,35 @@ v-bind="infiniteLoadingProps" > <template #renderItem="{ item }"> - <AccountCard + <UserAccountCard :title="TitleMap[item.lifePayType]" + :icon="TitleIconMap[item.lifePayType]" :content=" item.lifePayType === LifeRechargeConstants.LifePayOrderTypeEnum.璇濊垂璁㈠崟 - ? item.content + ? `${ + BlLifeRecharge.constants.IspCodeText[ + JSON.parse(item?.extraProperties)?.ispCode ?? '' + ] + }-${item.content}` : `${item.city}-${item.content}` " :remark="item.remark" :style="{ - marginBottom: Taro.pxTransform(20), + marginBottom: Taro.pxTransform(32), backgroundColor: '#ffffff', }" > <template #action> - <div class="account-card-action" @click="handleEditUserAccount">缂栬緫</div> - <div class="account-card-action" @click="handleEditUserAccount">鍒犻櫎</div> + <div class="user-account-card-action" @click="handleEditUserAccount(item)"> + <img :src="IconAccountEdit" class="user-account-card-action-icon" /> + <span class="user-account-card-action-text">缂栬緫</span> + </div> + <div class="user-account-card-action" @click="handleDeleteUserAccount(item)"> + <img :src="IconAccountDelete" class="user-account-card-action-icon" /> + <span class="user-account-card-action-text">鍒犻櫎</span> + </div> </template> - </AccountCard> + </UserAccountCard> </template> </InfiniteLoading> </template> @@ -33,31 +44,45 @@ useLifeRechargeContext, QueryUserAccountListInput, LifeRechargeConstants, + UserAccountListOutput, } from '@life-payment/core-vue'; import { useInfiniteLoading } from '../../hooks/infiniteLoading'; import { OrderInputType } from '../../constants'; -import AccountCard from '../../components/Card/AccountCard.vue'; +import UserAccountCard from '../../components/Card/UserAccountCard.vue'; +import IconAccountDelete from '../../assets/account/icon-account-delete.png'; +import IconAccountEdit from '../../assets/account/icon-account-edit.png'; +import { OssAssets } from '../../constants'; import Taro from '@tarojs/taro'; defineOptions({ name: 'UserAccountListView', }); +const emit = defineEmits<{ + (e: 'goEdit', row: UserAccountListOutput): void; +}>(); + const { blLifeRecharge } = useLifeRechargeContext(); const TitleMap = { - [LifeRechargeConstants.LifePayOrderTypeEnum.璇濊垂璁㈠崟]: '鎵嬫満鍙�', - [LifeRechargeConstants.LifePayOrderTypeEnum.鐢佃垂璁㈠崟]: '鐢佃垂鎴峰彿', - [LifeRechargeConstants.LifePayOrderTypeEnum.鐕冩皵璁㈠崟]: '鐕冩皵鎴峰彿', + [LifeRechargeConstants.LifePayOrderTypeEnum.璇濊垂璁㈠崟]: '璇濊垂', + [LifeRechargeConstants.LifePayOrderTypeEnum.鐢佃垂璁㈠崟]: '鐢佃垂', + [LifeRechargeConstants.LifePayOrderTypeEnum.鐕冩皵璁㈠崟]: '鐕冩皵璐�', }; -const { infiniteLoadingProps } = useInfiniteLoading( +const TitleIconMap = { + [LifeRechargeConstants.LifePayOrderTypeEnum.璇濊垂璁㈠崟]: OssAssets.accountCard.Phone, + [LifeRechargeConstants.LifePayOrderTypeEnum.鐢佃垂璁㈠崟]: OssAssets.accountCard.Electric, + [LifeRechargeConstants.LifePayOrderTypeEnum.鐕冩皵璁㈠崟]: OssAssets.accountCard.Gas, +}; + +const { infiniteLoadingProps, invalidateQueries } = useInfiniteLoading( ({ pageParam }) => { let params: QueryUserAccountListInput = { pageModel: { rows: 20, page: pageParam, - orderInput: [{ property: 'id', order: OrderInputType.Desc }], + orderInput: [{ property: 'creationTime', order: OrderInputType.Desc }], }, userId: blLifeRecharge.accountModel.userId, }; @@ -71,5 +96,23 @@ } ); -function handleEditUserAccount() {} +function handleEditUserAccount(row: UserAccountListOutput) { + emit('goEdit', row); +} + +async function handleDeleteUserAccount(row: UserAccountListOutput) { + try { + const res = await Taro.showModal({ + title: '鎻愮ず', + content: '纭畾瑕佸垹闄よ鏁版嵁鍚�?', + confirmColor: '#028CFF', + }); + if (res.confirm) { + await blLifeRecharge.services.deleteUserAccount({ + id: row.id, + }); + invalidateQueries(); + } + } catch (error) {} +} </script> -- Gitblit v1.9.1