From aa45de802c9980656dc6a85dd3417cd0f77f7292 Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期五, 21 三月 2025 15:49:55 +0800 Subject: [PATCH] fix: 三期需求 --- packages/components/src/views/PhoneBillRecharge/PhoneBillRechargeStep2.vue | 76 +++++++++++++++++++++++++++---------- 1 files changed, 55 insertions(+), 21 deletions(-) diff --git a/packages/components/src/views/PhoneBillRecharge/PhoneBillRechargeStep2.vue b/packages/components/src/views/PhoneBillRecharge/PhoneBillRechargeStep2.vue index 73fd93e..89f670a 100644 --- a/packages/components/src/views/PhoneBillRecharge/PhoneBillRechargeStep2.vue +++ b/packages/components/src/views/PhoneBillRecharge/PhoneBillRechargeStep2.vue @@ -60,6 +60,11 @@ </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"> @@ -67,7 +72,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 #info> @@ -77,6 +82,7 @@ <ConfirmDialogInfoItem label="瀹炰粯閲戦" :content="`锟�${realParValue}`" danger /> </template> </ConfirmDialog> + <NutToast :msg="state.msg" v-model:visible="state.show" type="warn" cover /> </NutForm> </template> @@ -88,10 +94,11 @@ Radio as NutRadio, Input as NutInput, 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, provide } from 'vue'; -import { FormValidator } from '../../utils'; +import { reactive, ref, computed, toRef } from 'vue'; +import { FormValidator, initLifePayType } from '../../utils'; import { useLifeRechargeContext, BlLifeRecharge, @@ -102,20 +109,18 @@ import ConfirmDialog from '../../components/Dialog/ConfirmDialog.vue'; import ConfirmDialogInfoItem from '../../components/Dialog/ConfirmDialogInfoItem.vue'; import { useGetRate, useGetPhoneParValue, useSetUserAccountBySelect } from '../../hooks'; -import { CustomerServiceTips } from '../../constants'; import AccountAddCard from '../../components/Card/AccountAddCard.vue'; import AccountCard from '../../components/Card/AccountCard.vue'; import { usePhoneBillRechargeContext, PhoneUserAccountExtraProperties } from './context'; +import SelectPayTypeFormItem from '../../components/SelectPayTypeFormItem/SelectPayTypeFormItem.vue'; +import { useSelectPayType, useGetPayStatusByOrderNo } from '../../hooks/selectPayType'; +import { RechargeProps } from './types'; defineOptions({ name: 'PhoneBillRechargeStep2', }); -type Props = { - isDev?: boolean; -}; - -const props = withDefaults(defineProps<Props>(), { +const props = withDefaults(defineProps<RechargeProps>(), { isDev: false, }); @@ -128,6 +133,7 @@ name: '', currentUserAccountId: '', remark: '', + lifePayType: initLifePayType(props.isInWeChat, props.isInAlipay), }); const { userAccountAllList, handleUserAccountChange } = useSetUserAccountBySelect({ @@ -153,6 +159,7 @@ const emit = defineEmits<{ (e: 'goPay', orderNo: string): void; + (e: 'paySuccess', orderNo: string): void; }>(); const { lifePayPhoneRate } = useGetRate(); @@ -183,11 +190,17 @@ { required: true, message: '璇烽�夋嫨鍏呭�奸噾棰�', validator: FormValidator.validatorNumberNotNull }, ], currentUserAccountId: [{ required: true, message: '璇烽�夋嫨鍏呭�兼墜鏈哄彿' }], + lifePayType: [{ required: true, message: '璇烽�夋嫨鏀粯鏂瑰紡' }], }); const formRef = ref<any>(null); function handleSubmit() { + if (!form.name) { + state.show = true; + state.msg = '璇峰厛瀹屽杽鎵嬫満鍙锋墍灞炴満涓诲鍚�'; + return; + } if (!formRef.value) return; formRef.value.validate().then(({ valid, errors }: any) => { if (valid) { @@ -196,34 +209,55 @@ }); } -const tips = [ - '骞冲彴鎻愪緵鎱㈠厖鏈嶅姟锛岃鍗曟彁浜ゅ悗锛岃瘽璐瑰皢浜�0 - 24灏忔椂鍐呭埌璐︺�傝嫢鏈兘鎸夋椂鍒拌处锛岀郴缁熷皢鑷姩鍙戣捣閫�娆俱��', - '鍏呭�兼湡闂达紝鑻ュ悓涓�鍙风爜娆鹃」鏈埌璐︼紝璇峰嬁鍦ㄥ叾浠栧钩鍙伴噸澶嶅厖鍊硷紱涓诲壇鍗′笉鍙悓鏃跺厖鍊笺�傚洜涓婅堪鎿嶄綔瀵艰嚧鐨勮祫閲戞崯澶憋紝鐢辩敤鎴疯嚜琛屾壙鎷呫��', - '鏈钩鍙拌瘽璐瑰厖鍊兼湇鍔′笉閫傜敤浜庡凡鍋滄満鍙风爜銆傜數淇″彿鐮佽嫢鏈夋瑺璐癸紝涔熸棤娉曞畬鎴愬厖鍊笺�傜數淇″凡瀹屾垚缁存姢鐨勫尯鍩熷寘鎷細骞夸笢銆佹睙鑻忋�佹箹鍖椼�佸洓宸濄�佹睙瑗裤�佹渤鍖椼�佹渤鍗椼�佺寤恒�佽窘瀹併�傚叾瀹冨尯鍩熸鍦ㄥ垎鎵规杩涜缁存姢涓紝鍦ㄦ鏈熼棿鍙兘浼氬嚭鐜板厖鍊间笉鎴愬姛骞惰嚜鍔ㄩ��娆剧殑鎯呭喌锛岃鎮ㄨ皡瑙c��', - '濡傛帴鍒伴檶鐢熸潵鐢碉紝瀵规柟浠ョ即璐规垨璇搷浣滅瓑鐞嗙敱瑕佹眰澶勭悊娆鹃」锛屽姟蹇呯珛鍗虫媺榛戯紝璋ㄩ槻璇堥獥銆�', - '鍏呭�煎彂绁ㄧ敱杩愯惀鍟嗘彁渚涳紝鎮ㄥ彲鐧诲綍缃戜笂钀ヤ笟鍘呬笅杞界數瀛愬彂绁ㄣ��', - CustomerServiceTips, -]; - const confirmDialogVisible = ref(false); function recharge() { confirmDialogVisible.value = true; } +const { state, invokeAliPay, invokeWeixinPay } = useSelectPayType({ + getOpenId: props.getOpenId, + isInWeChat: toRef(props, 'isInWeChat'), + isH5: toRef(props, 'isH5'), + appId: toRef(props, 'appId'), +}); + +const currentOrderNo = ref(''); + async function goPay() { try { let params: LifePhoneDataCreateLifePayOrderInput = { userId: blLifeRecharge.accountModel.userId, + channelId: blLifeRecharge.accountModel.channlesNum, productData: { ispCode: form.ispCode, - parValue: props.isDev ? 0.1 : form.parValue, + parValue: form.parValue, phone: form.phone, - name: form.ispCode === BlLifeRecharge.constants.IspCode.dianxin ? form.name : '', + name: form.name, }, }; let res = await blLifeRecharge.services.createLifePayPhoneOrder(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( + () => + form.lifePayType === LifeRechargeConstants.LifePayTypeEnum.WxPay && + props.isFocus && + !!currentOrderNo.value + ), + onPaySuccess: (orderNo) => { + emit('paySuccess', orderNo); + currentOrderNo.value = ''; + }, +}); </script> -- Gitblit v1.9.1