From 60b9c62a3165f304a933cbac304ac3d43a24f722 Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期四, 17 四月 2025 09:25:09 +0800 Subject: [PATCH] fix: 优化 --- packages/components/src/views/electricBillRecharge/ElectricBillRechargeStep2.vue | 75 +++++++++++++++++++++++++++---------- 1 files changed, 54 insertions(+), 21 deletions(-) diff --git a/packages/components/src/views/electricBillRecharge/ElectricBillRechargeStep2.vue b/packages/components/src/views/electricBillRecharge/ElectricBillRechargeStep2.vue index 0fabeac..c3c7a81 100644 --- a/packages/components/src/views/electricBillRecharge/ElectricBillRechargeStep2.vue +++ b/packages/components/src/views/electricBillRecharge/ElectricBillRechargeStep2.vue @@ -57,11 +57,18 @@ {{ blLifeRecharge.getRechargeParValue(item, lifePayElectricRate) }}鍏� </div> </div> - <div class="discountTag">{{ lifePayElectricRate }}鎶�</div> + <div class="discountTag" v-if="lifePayElectricRate > 0"> + {{ lifePayElectricRate }}鎶� + </div> </div> </NutRadio> </NutRadioGroup> </NutFormItem> + <SelectPayTypeFormItem + v-model="form.lifePayType" + :showWeixinPay="showWeixinPay" + :showAliPay="showAliPay" + ></SelectPayTypeFormItem> <div class="common-content"> <nut-button class="recharge-button" type="primary" @click="handleSubmit"> <div class="recharge-button-inner"> @@ -69,7 +76,7 @@ <div class="recharge-button-text">绔嬪嵆鍏呭��</div> </div> </nut-button> - <RechargeTipsView :tips="tips" /> + <RechargeTipsView :lifePayOrderType="LifeRechargeConstants.LifePayOrderTypeEnum.鐢佃垂璁㈠崟" /> </div> <ConfirmDialog v-model:visible="confirmDialogVisible" @ok="goPay"> <template #tips> @@ -89,6 +96,7 @@ 鍚屼竴鐢佃垂璐︽埛鍦ㄥ厖鍊兼湡闂达紝鏈埌璐﹀墠鍒囧嬁鍦ㄥ叾浠栦换浣曞钩鍙板啀娆″厖鍊笺�傚洜姝ら�犳垚鐨勮祫閲戞崯澶遍』鐢ㄦ埛鑷鎵挎媴锛侊紒锛� </template> </ConfirmDialog> + <NutToast :msg="state.msg" v-model:visible="state.show" type="warn" cover /> </NutForm> </template> @@ -99,9 +107,10 @@ RadioGroup as NutRadioGroup, Radio as NutRadio, Button as NutButton, + Toast as NutToast, } from '@nutui/nutui-taro'; import { FormRules } from '@nutui/nutui-taro/dist/types/__VUE/form/types'; -import { reactive, ref, computed } from 'vue'; +import { reactive, ref, computed, toRef } from 'vue'; import { useLifeRechargeContext, LifeElectricDataCreateLifePayOrderInput, @@ -112,26 +121,26 @@ import ConfirmDialog from '../../components/Dialog/ConfirmDialog.vue'; import ConfirmDialogInfoItem from '../../components/Dialog/ConfirmDialogInfoItem.vue'; import { useGetRate, useGetElectricParValue, useSetUserAccountBySelect } from '../../hooks'; -import { FormValidator } from '../../utils'; -import { CustomerServiceTips } from '../../constants'; +import { FormValidator, initLifePayType } from '../../utils'; import AccountAddCard from '../../components/Card/AccountAddCard.vue'; import AccountCard from '../../components/Card/AccountCard.vue'; import { useElectricBillRechargeContext, ElectricUserAccountExtraProperties } from './context'; +import SelectPayTypeFormItem from '../../components/SelectPayTypeFormItem/SelectPayTypeFormItem.vue'; +import { useSelectPayType, useGetPayStatusByOrderNo } from '../../hooks/selectPayType'; +import { RechargeProps } from '../PhoneBillRecharge/types'; defineOptions({ name: 'ElectricBillRechargeStep2', }); -type Props = { - isDev?: boolean; -}; - -const props = withDefaults(defineProps<Props>(), { +const props = withDefaults(defineProps<RechargeProps>(), { isDev: false, }); const emit = defineEmits<{ (e: 'goPay', orderNo: string): void; + (e: 'paySuccess', orderNo: string): void; + (e: 'missName', userAccountId: string): void; }>(); const { goTo } = useElectricBillRechargeContext(); @@ -146,6 +155,8 @@ sixID: '', currentUserAccountId: '', remark: '', + lifePayType: initLifePayType(props.isInWeChat, props.isInAlipay), + name: '', }); const { userAccountAllList, handleUserAccountChange } = useSetUserAccountBySelect({ @@ -163,6 +174,7 @@ form.electricAccountType = currentUserAccountExtraProperties.electricAccountType; form.sixID = currentUserAccountExtraProperties.sixID; form.remark = currentUserAccount.remark; + form.name = currentUserAccountExtraProperties.name ?? ''; const electricParValueItem = electricParValueList.value.find( (x) => x.cityName === form.province ); @@ -200,6 +212,7 @@ { required: true, message: '璇烽�夋嫨鍏呭�奸噾棰�', validator: FormValidator.validatorNumberNotNull }, ], currentUserAccountId: [{ required: true, message: '璇烽�夋嫨鍏呭�兼埛鍙�' }], + lifePayType: [{ required: true, message: '璇烽�夋嫨鏀粯鏂瑰紡' }], }); const formRef = ref<any>(null); @@ -208,19 +221,14 @@ if (!formRef.value) return; formRef.value.validate().then(({ valid, errors }: any) => { if (valid) { + if (!form.name) { + emit('missName', form.currentUserAccountId); + return; + } recharge(); } }); } - -const tips = [ - '骞冲彴鎻愪緵鎱㈠厖鏈嶅姟锛岃鍗曟彁浜ゅ悗锛岀數璐瑰皢浜�0 - 72 灏忔椂鍐呭埌璐︼紝鑻ユ湭鑳芥寜鏃跺埌璐︼紝绯荤粺灏嗚嚜鍔ㄥ彂璧烽��娆俱��', - '鍏呭�兼湡闂达紝鑻ュ悓涓�璐︽埛鐨勫厖鍊兼鏈埌璐︼紝璇峰嬁鍦ㄥ叾浠栧钩鍙伴噸澶嶅厖鍊硷紝鍥犱笂杩版搷浣滃鑷寸殑璧勯噾鎹熷け锛岀敱鐢ㄦ埛鑷鎵挎媴銆�', - '涓虹‘淇濆厖鍊奸『鍒╄繘琛岋紝鐩墠骞冲彴涓嶆敮鎸佸娆犳閲戦瓒呰繃1000鍏冪殑璐︽埛杩涜鍏呭�硷紝涓旀瘡娆″厖鍊奸噾棰濆繀椤婚珮浜庢瑺璐规�婚銆�', - '濡傛帴鍒伴檶鐢熸潵鐢碉紝瀵规柟浠ョ即璐规垨璇搷浣滅瓑鐞嗙敱瑕佹眰澶勭悊娆鹃」锛屽姟蹇呯珛鍗虫媺榛戯紝璋ㄩ槻璇堥獥銆�', - '涓嬪崟鏃讹紝璇锋偍鍔″繀鍑嗙‘濉啓瀹屾暣鐨勭渷甯傚強鎴峰彿淇℃伅銆傚厖鍊煎畬鎴愬悗锛屽彂绁ㄧ敱杩愯惀鍟嗘彁渚涳紝鎮ㄥ彲鐧诲綍缃戜笂钀ヤ笟鍘呬笅杞藉搴旂殑鐢靛瓙鍙戠エ銆�', - CustomerServiceTips, -]; const confirmDialogVisible = ref(false); @@ -228,23 +236,48 @@ confirmDialogVisible.value = true; } +const { state, invokeAliPay, invokeWeixinPay } = useSelectPayType({ + isInWeChat: toRef(props, 'isInWeChat'), + isH5: toRef(props, 'isH5'), + appId: toRef(props, 'appId'), + getOpenId: toRef(props, 'getOpenId'), +}); + +const currentOrderNo = ref(''); + async function goPay() { try { let params: LifeElectricDataCreateLifePayOrderInput = { userId: blLifeRecharge.accountModel.userId, channelId: blLifeRecharge.accountModel.channlesNum, productData: { - parValue: props.isDev ? 0.1 : form.parValue, + parValue: form.parValue, electricType: form.electricType, electricAccountType: form.electricAccountType, electricAccount: form.electricAccount, province: form.province, city: form.city, sixID: form.sixID, + // name: form.name, }, }; let res = await blLifeRecharge.services.createLifePayElectricOrder(params); - emit('goPay', res.orderNo); + // emit('goPay', res.orderNo); + if (form.lifePayType === LifeRechargeConstants.LifePayTypeEnum.WxPay) { + await invokeWeixinPay(res.orderNo); + } else { + await invokeAliPay(res.orderNo); + } + currentOrderNo.value = res.orderNo; } catch (error) {} } + +useGetPayStatusByOrderNo({ + orderNo: currentOrderNo, + enabled: computed(() => props.isFocus && !!currentOrderNo.value), + onPaySuccess: (orderNo) => { + emit('paySuccess', orderNo); + currentOrderNo.value = ''; + }, +}); </script> -- Gitblit v1.9.1