From e7b532e0514eae9c426465da6e6f922e6e9a0696 Mon Sep 17 00:00:00 2001 From: wupengfei <834520024@qq.com> Date: 星期二, 25 二月 2025 15:13:03 +0800 Subject: [PATCH] fix: bug --- packages/components/src/views/electricBillRecharge/electricBillRecharge.vue | 140 +++++++++++++++++++++++++++++++++------------- 1 files changed, 101 insertions(+), 39 deletions(-) diff --git a/packages/components/src/views/electricBillRecharge/electricBillRecharge.vue b/packages/components/src/views/electricBillRecharge/electricBillRecharge.vue index 752316a..bc8a618 100644 --- a/packages/components/src/views/electricBillRecharge/electricBillRecharge.vue +++ b/packages/components/src/views/electricBillRecharge/electricBillRecharge.vue @@ -1,5 +1,5 @@ <template> - <Form + <NutForm :model-value="form" ref="formRef" :rules="rules" @@ -10,16 +10,18 @@ <ChooseInputWithPicker v-model="form.province" placeholder="璇烽�夋嫨鍩庡競" - :value-enum="IspCodeText" + :value-enum="electricParValueList" + enum-label-key="areaName" + enum-value-key="areaName" /> </FormItem> - <FormItem label="鐢电綉绫诲瀷" class="bole-form-item" prop="electricType" required> + <!-- <FormItem label="鐢电綉绫诲瀷" class="bole-form-item" prop="electricType" required> <ChooseInputWithPicker v-model="form.electricType" placeholder="璇烽�夋嫨鐢电綉绫诲瀷" :value-enum="blLifeRecharge.constants.ElectricTypeText" /> - </FormItem> + </FormItem> --> <FormItem label="鐢佃垂绫诲瀷" class="bole-form-item" prop="electricAccountType" required> <ChooseInputWithPicker v-model="form.electricAccountType" @@ -28,11 +30,11 @@ /> </FormItem> <FormItem label="鐢电綉鎴峰彿" class="bole-form-item" prop="electricAccount" required> - <Input + <NumberInput v-model.trim="form.electricAccount" class="bole-input-text" placeholder="璇疯緭鍏�13浣嶆暟瀛楃紪鍙�" - type="text" + max-length="13" /> </FormItem> <FormItem @@ -42,17 +44,24 @@ prop="sixID" required > - <Input + <NutInput v-model.trim="form.sixID" class="bole-input-text" placeholder="璇疯緭鍏ヨ韩浠借瘉鍚庡叚浣�" type="text" + max-length="6" /> </FormItem> - <FormItem label="閫夋嫨鍏呭�奸噾棰�" class="bole-form-item" prop="parValue" required> - <RadioGroup v-model="form.parValue" direction="horizontal" class="parValue-radio-group"> - <Radio - :label="item" + <FormItem + v-if="!!form.province" + 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" @@ -71,13 +80,13 @@ </div> <div class="discountTag">{{ lifePayElectricRate * 100 }}鎶�</div> </div> - </Radio> - </RadioGroup> + </NutRadio> + </NutRadioGroup> </FormItem> <div class="common-content"> - <nut-button class="recharge-button" type="primary" @click="recharge"> + <nut-button class="recharge-button" type="primary" @click="handleSubmit"> <div class="recharge-button-inner"> - <div>锟{ realParValue }}</div> + <div>锟{ form.parValue }}</div> <div class="recharge-button-text">绔嬪嵆鍏呭��</div> </div> </nut-button> @@ -88,7 +97,10 @@ 璇ヤ骇鍝佷负鎱㈠厖妯″紡锛�0-72灏忔椂鍐呭埌璐︼紝浠嬫剰璇峰嬁浠樻锛佸厖鍊煎墠璇蜂粩缁嗛槄璇诲厖鍊奸』鐭ワ紒 </template> <template #info> - <ConfirmDialogInfoItem label="鐢电綉绫诲瀷" content="鍥藉鐢电綉" /> + <ConfirmDialogInfoItem + label="鐢电綉绫诲瀷" + :content="blLifeRecharge.constants.ElectricTypeText[form.electricType]" + /> <ConfirmDialogInfoItem label="鐢佃垂绫诲瀷" content="浣忓畢" /> <ConfirmDialogInfoItem label="鍏呭�奸噾棰�" :content="`锟�${form.parValue.toFixed(2)}`" danger /> <ConfirmDialogInfoItem label="浼樻儬閲戦" :content="`锟�${discountParValue.toFixed(2)}`" /> @@ -98,32 +110,51 @@ 鍚屼竴鐢佃垂璐︽埛鍦ㄥ厖鍊兼湡闂达紝鏈埌璐﹀墠鍒囧嬁鍦ㄥ叾浠栦换浣曞钩鍙板啀娆″厖鍊笺�傚洜姝ら�犳垚鐨勮祫閲戞崯澶遍』鐢ㄦ埛鑷鎵挎媴锛侊紒锛� </template> </ConfirmDialog> - </Form> + </NutForm> </template> <script setup lang="ts"> -import { Form, FormItem, RadioGroup, Radio, Input, Button as NutButton } from '@nutui/nutui-taro'; +import { + Form as NutForm, + FormItem, + RadioGroup as NutRadioGroup, + Radio as NutRadio, + Input as NutInput, + Button as NutButton, +} from '@nutui/nutui-taro'; import { FormRules } from '@nutui/nutui-taro/dist/types/__VUE/form/types'; -import { reactive, ref, computed } from 'vue'; -import { IspCodeText, IspCode } from '../../constants'; -import { useLifeRechargeContext } from '@life-payment/core-vue'; +import { reactive, ref, computed, watch } from 'vue'; +import { + useLifeRechargeContext, + BlLifeRecharge, + LifeElectricDataCreateLifePayOrderInput, +} from '@life-payment/core-vue'; import RechargeTipsView from '../../components/RechargeTipsView/RechargeTipsView.vue'; import ConfirmDialog from '../../components/Dialog/ConfirmDialog.vue'; import ConfirmDialogInfoItem from '../../components/Dialog/ConfirmDialogInfoItem.vue'; import ChooseInputWithPicker from '../../components/Input/ChooseInputWithPicker.vue'; +import NumberInput from '../../components/Input/NumberInput.vue'; import { useGetRate, useGetElectricParValue } from '../../hooks'; +import { FormValidator } from '../../utils'; defineOptions({ name: 'electricBillRecharge', }); +type Props = { + isDev?: boolean; +}; + +const props = withDefaults(defineProps<Props>(), { + isDev: false, +}); + const emit = defineEmits<{ - (e: 'goPay'): void; + (e: 'goPay', orderNo: string): void; }>(); const form = reactive({ - ispCode: IspCode.yidong, - parValue: 100, + parValue: 0, electricAccount: '', electricType: '', electricAccountType: '', @@ -134,7 +165,19 @@ const { lifePayElectricRate } = useGetRate(); const { electricParValueList } = useGetElectricParValue(); -const parValueList = [100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1500, 2000, 3000]; +const parValueList = computed( + () => electricParValueList.value.find((x) => x.areaName === form.province)?.parValue ?? [] +); + +watch( + () => form.province, + (provinceName) => { + const electricParValue = electricParValueList.value.find( + (item) => item.areaName === provinceName + ); + form.electricType = electricParValue.electricType; + } +); const realParValue = computed(() => blLifeRecharge.getRechargeParValue(form.parValue, lifePayElectricRate.value) @@ -143,7 +186,21 @@ const { blLifeRecharge } = useLifeRechargeContext(); -const rules = reactive<FormRules>({}); +const rules = reactive<FormRules>({ + province: [{ required: true, message: '璇烽�夋嫨鎵�鍦ㄥ煄甯�' }], + electricAccountType: [{ required: true, message: '璇烽�夋嫨鐢佃垂绫诲瀷' }], + electricAccount: [{ required: true, message: '璇疯緭鍏ョ數缃戞埛鍙�', regex: /^\d{13}$/ }], + sixID: [ + { + required: true, + message: '璇疯緭鍏ヨ韩浠借瘉鍚庡叚浣�', + validator: FormValidator.validatorIDNumberSix, + }, + ], + parValue: [ + { required: true, message: '璇烽�夋嫨鍏呭�奸噾棰�', validator: FormValidator.validatorNumberNotNull }, + ], +}); const formRef = ref<any>(null); @@ -151,6 +208,7 @@ if (!formRef.value) return; formRef.value.validate().then(({ valid, errors }: any) => { if (valid) { + recharge(); } }); } @@ -169,18 +227,22 @@ confirmDialogVisible.value = true; } -function goPay() { - emit('goPay'); +async function goPay() { + try { + let params: LifeElectricDataCreateLifePayOrderInput = { + userId: blLifeRecharge.accountModel.userId, + productData: { + parValue: props.isDev ? 0.1 : form.parValue, + electricType: form.electricType, + electricAccountType: form.electricAccountType, + electricAccount: form.electricAccount, + province: form.province, + city: '', + sixID: form.sixID, + }, + }; + let res = await blLifeRecharge.services.createLifePayElectricOrder(params); + emit('goPay', res.orderNo); + } catch (error) {} } </script> -<style lang="scss"> -.order-bill-recharge { - &.electric { - .nut-dialog { - .nut-dialog__content { - max-height: 700px; - } - } - } -} -</style> -- Gitblit v1.9.1