| | |
| | | label-position="top" |
| | | class="order-bill-recharge phone" |
| | | > |
| | | <NutFormItem class="bole-form-item"> |
| | | <!-- <AccountAddCard /> --> |
| | | <NutRadioGroup v-model="val1" direction="horizontal" class="par-account-list"> |
| | | <NutRadio label="1" shape="button">Option 1</NutRadio> |
| | | <NutRadio label="2" shape="button">Option 2</NutRadio> |
| | | <NutRadio label="3" shape="button">Option 3</NutRadio> |
| | | <NutRadio label="4" shape="button">Option 4</NutRadio> |
| | | <NutRadio label="5" shape="button">Option 5</NutRadio> |
| | | <NutRadio label="6" shape="button">Option 6</NutRadio> |
| | | <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 |
| | | > |
| | | </NutRadioGroup> |
| | | <AccountCard title="充值手机号" content="18858418480" remark="的地方骄傲的开始和"> |
| | | <AccountCard |
| | | v-if="userAccountAllList.length > 0" |
| | | title="充值手机号" |
| | | :content="form.phone" |
| | | :remark="form.remark" |
| | | > |
| | | <template #action> |
| | | <div class="account-card-action">新增</div> |
| | | <div class="account-card-action" @click="handleAddUserAccount">新增</div> |
| | | </template> |
| | | </AccountCard> |
| | | <AccountAddCard v-else @click="handleAddUserAccount" /> |
| | | </NutFormItem> |
| | | |
| | | <NutFormItem label="选择充值金额" class="bole-form-item" prop="parValue" required> |
| | |
| | | {{ blLifeRecharge.getRechargeParValue(item, lifePayPhoneRate) }}元 |
| | | </div> |
| | | </div> |
| | | <div class="discountTag">{{ lifePayPhoneRate * 100 }}折</div> |
| | | <div class="discountTag">{{ lifePayPhoneRate }}折</div> |
| | | </div> |
| | | </NutRadio> |
| | | </NutRadioGroup> |
| | |
| | | import RechargeTipsView from '../../components/RechargeTipsView/RechargeTipsView.vue'; |
| | | import ConfirmDialog from '../../components/Dialog/ConfirmDialog.vue'; |
| | | import ConfirmDialogInfoItem from '../../components/Dialog/ConfirmDialogInfoItem.vue'; |
| | | import { useGetRate, useGetPhoneParValue } from '../../hooks'; |
| | | 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'; |
| | | |
| | | defineOptions({ |
| | | name: 'PhoneBillRechargeStep2', |
| | |
| | | isDev: false, |
| | | }); |
| | | |
| | | const { goTo } = usePhoneBillRechargeContext(); |
| | | |
| | | const form = reactive({ |
| | | ispCode: '', |
| | | phone: '', |
| | | parValue: 0, |
| | | name: '', |
| | | currentUserAccountId: '', |
| | | remark: '', |
| | | }); |
| | | |
| | | const val1 = ref(''); |
| | | const { userAccountAllList, handleUserAccountChange } = useSetUserAccountBySelect({ |
| | | lifePayOrderType: LifeRechargeConstants.LifePayOrderTypeEnum.话费订单, |
| | | onSetUserAccount(currentUserAccount) { |
| | | const currentUserAccountExtraProperties = JSON.parse( |
| | | currentUserAccount.extraProperties |
| | | ) as PhoneUserAccountExtraProperties; |
| | | form.currentUserAccountId = currentUserAccount.id; |
| | | form.phone = currentUserAccount.content; |
| | | form.ispCode = currentUserAccountExtraProperties.ispCode; |
| | | form.name = currentUserAccountExtraProperties.name; |
| | | |
| | | form.remark = currentUserAccount.remark; |
| | | |
| | | changeIspCode(form.ispCode as any); |
| | | }, |
| | | }); |
| | | |
| | | function handleAddUserAccount() { |
| | | goTo('step1'); |
| | | } |
| | | |
| | | const emit = defineEmits<{ |
| | | (e: 'goPay', orderNo: string): void; |
| | |
| | | |
| | | function changeIspCode(val: LifeRechargeConstants.IspCode) { |
| | | const phoneParValueItem = phoneParValueList.value.find((x) => x.ispCode === val); |
| | | if (phoneParValueItem.parValue.every((x) => Number(x) !== form.parValue)) { |
| | | if (phoneParValueItem && phoneParValueItem.parValue.every((x) => Number(x) !== form.parValue)) { |
| | | form.parValue = 0; |
| | | } |
| | | } |
| | |
| | | parValue: [ |
| | | { required: true, message: '请选择充值金额', validator: FormValidator.validatorNumberNotNull }, |
| | | ], |
| | | currentUserAccountId: [{ required: true, message: '请选择充值手机号' }], |
| | | }); |
| | | |
| | | const formRef = ref<any>(null); |