LifePaymentFront.git

			@@ -6,68 +6,88 @@
			label-position="top"
			class="order-bill-recharge phone"
			>
			<NutFormItem class="bole-form-item" prop="currentUserAccountId">
			<NutRadioGroup
			v-model="form.currentUserAccountId"
			direction="horizontal"
			class="par-account-list"
			v-if="userAccountAllList.length > 0"
			@change="handleUserAccountChange"
			>
			<NutRadio
			:label="item.id"
			shape="button"
			v-for="item in userAccountAllList"
			:key="item.id"
			>{{ item.content }}</NutRadio
			<Chunk borderRadiusSmall :hasPaddingBottom="false">
			<NutFormItem class="bole-form-item user-account-form-item" prop="currentUserAccountId">
			<NutRadioGroup
			v-model="form.currentUserAccountId"
			direction="horizontal"
			class="par-account-list"
			v-if="userAccountAllList.length > 0"
			@change="handleUserAccountChange"
			>
			</NutRadioGroup>
			<AccountCard
			v-if="userAccountAllList.length > 0"
			title="充值手机号"
			:content="form.phone"
			:remark="form.remark"
			>
			<template #action>
			<div class="account-card-action" @click="handleAddUserAccount">新增</div>
			</template>
			</AccountCard>
			<AccountAddCard v-else @click="handleAddUserAccount" />
			</NutFormItem>
			<NutRadio
			:label="item.id"
			shape="button"
			v-for="item in userAccountAllList"
			:key="item.id"
			>{{ addStarForPhone(item.content) }}</NutRadio
			>
			</NutRadioGroup>
			<AccountCardV2
			v-if="userAccountAllList.length > 0"
			:content="StringUtils.phoneNumberAddSpace(form.phone)"
			:remark="form.remark"
			:showEditBtn="!!form.currentUserAccountId"
			@add="handleAddUserAccount"
			@edit="emit('editUserAccount', form.currentUserAccountId)"
			>
			</AccountCardV2>
			<AccountAddCardV2
			content="去添加充值号码"
			remark="添加号码将保存在生活缴费进行管理"
			tip="添加正确号码"
			v-else
			@add="handleAddUserAccount"
			/>
			</NutFormItem>
			</Chunk>

			<NutFormItem label="选择充值金额" class="bole-form-item" prop="parValue" required>
			<NutRadioGroup v-model="form.parValue" direction="horizontal" class="parValue-radio-group">
			<NutRadio
			:label="Number(item)"
			:key="item"
			shape="button"
			v-for="item in parValueList"
			class="parValue-item"
			>
			<div class="parValue-item-inner">
			<div class="amount-wrapper">
			<div class="amount">{{ item }}</div>
			<div class="unit">元</div>
			</div>
			<div class="price-wrapper">
			<div class="price-text">折后</div>
			<div class="price">
			{{ blLifeRecharge.getRechargeParValue(item, lifePayPhoneRate) }}元
			<Chunk borderRadiusSmall :hasPaddingBottom="false" title="选择充值金额">
			<NutFormItem class="bole-form-item" prop="parValue" required>
			<NutRadioGroup v-model="form.parValue" direction="horizontal" class="parValue-radio-group">
			<NutRadio
			:label="Number(item)"
			:key="item"
			shape="button"
			v-for="item in parValueList"
			class="parValue-item"
			>
			<div class="parValue-item-inner">
			<div class="amount-wrapper">
			<div class="amount">{{ item }}</div>
			<div class="unit">元</div>
			</div>
			<div class="price-wrapper">
			<div class="price-text">折后</div>
			<div class="price">
			{{ blLifeRecharge.getRechargeParValue(item, lifePayPhoneRate) }}元
			</div>
			</div>
			<div class="discountTag" v-if="lifePayPhoneRate > 0">{{ lifePayPhoneRate }}折</div>
			<img :src="IconSelect" class="discount-icon" />
			</div>
			<div class="discountTag">{{ lifePayPhoneRate }}折</div>
			</div>
			</NutRadio>
			</NutRadioGroup>
			</NutFormItem>
			</NutRadio>
			</NutRadioGroup>
			</NutFormItem>
			</Chunk>

			<SelectPayTypeFormItem
			v-model="form.lifePayType"
			:showWeixinPay="showWeixinPay"
			:showAliPay="showAliPay"
			></SelectPayTypeFormItem>
			<div class="common-content">
			<nut-button class="recharge-button" type="primary" @click="handleSubmit">
			<nut-button
			class="recharge-button recharge-button-linear"
			type="primary"
			@click="handleSubmit"
			>
			<div class="recharge-button-inner">
			<div>￥{{ realParValue }}</div>
			<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 +97,7 @@
			<ConfirmDialogInfoItem label="实付金额" :content="`￥${realParValue}`" danger />
			</template>
			</ConfirmDialog>
			<NutToast :msg="state.msg" v-model:visible="state.show" type="warn" cover />
			</NutForm>
			</template>

			@@ -88,10 +109,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, addStarForPhone, StringUtils } from '../../utils';
			import {
			useLifeRechargeContext,
			BlLifeRecharge,
			@@ -102,20 +124,20 @@
			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 AccountAddCardV2 from '../../components/Card/AccountAddCardV2.vue';
			import AccountCardV2 from '../../components/Card/AccountCardV2.vue';
			import { usePhoneBillRechargeContext, PhoneUserAccountExtraProperties } from './context';
			import SelectPayTypeFormItem from '../../components/SelectPayTypeFormItem/SelectPayTypeFormItem.vue';
			import { useSelectPayType, useGetPayStatusByOrderNo } from '../../hooks/selectPayType';
			import { RechargeProps } from './types';
			import Chunk from '../../components/Layout/Chunk.vue';
			import IconSelect from '../../assets/recharge/icon-select.png';

			defineOptions({
			name: 'PhoneBillRechargeStep2',
			});

			type Props = {
			isDev?: boolean;
			};

			const props = withDefaults(defineProps<Props>(), {
			const props = withDefaults(defineProps<RechargeProps>(), {
			isDev: false,
			});

			@@ -128,6 +150,7 @@
			name: '',
			currentUserAccountId: '',
			remark: '',
			lifePayType: initLifePayType(props.isInWeChat, props.isInAlipay),
			});

			const { userAccountAllList, handleUserAccountChange } = useSetUserAccountBySelect({
			@@ -153,6 +176,9 @@

			const emit = defineEmits<{
			(e: 'goPay', orderNo: string): void;
			(e: 'paySuccess', orderNo: string): void;
			(e: 'missName', userAccountId: string): void;
			(e: 'editUserAccount', userAccountId: string): void;
			}>();

			const { lifePayPhoneRate } = useGetRate();
			@@ -183,27 +209,25 @@
			{ required: true, message: '请选择充值金额', validator: FormValidator.validatorNumberNotNull },
			],
			currentUserAccountId: [{ required: true, message: '请选择充值手机号' }],
			lifePayType: [{ required: true, message: '请选择支付方式' }],
			});

			const formRef = ref<any>(null);

			function handleSubmit() {
			if (!formRef.value) return;
			console.log('form: ', form, formRef.value);
			formRef.value.validate().then(({ valid, errors }: any) => {
			console.log('errors: ', errors);
			if (valid) {
			if (!form.name) {
			emit('missName', form.currentUserAccountId);
			return;
			}
			recharge();
			}
			});
			}

			const tips = [
			'平台提供慢充服务，订单提交后，话费将于0 - 24小时内到账。若未能按时到账，系统将自动发起退款。',
			'充值期间，若同一号码款项未到账，请勿在其他平台重复充值；主副卡不可同时充值。因上述操作导致的资金损失，由用户自行承担。',
			'本平台话费充值服务不适用于已停机号码。电信号码若有欠费，也无法完成充值。电信已完成维护的区域包括：广东、江苏、湖北、四川、江西、河北、河南、福建、辽宁。其它区域正在分批次进行维护中，在此期间可能会出现充值不成功并自动退款的情况，请您谅解。',
			'如接到陌生来电，对方以缴费或误操作等理由要求处理款项，务必立即拉黑，谨防诈骗。',
			'充值发票由运营商提供，您可登录网上营业厅下载电子发票。',
			CustomerServiceTips,
			];

			const confirmDialogVisible = ref(false);

			@@ -211,19 +235,49 @@
			confirmDialogVisible.value = true;
			}

			const { state, invokeAliPay, invokeWeixinPay } = useSelectPayType({
			getOpenId: toRef(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>