From 03047a382e6f0f1945be32e28fd65e6b31817dfa Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期一, 24 二月 2025 17:52:47 +0800 Subject: [PATCH] fix: 对接 --- packages/components/src/views/electricBillRecharge/electricBillRecharge.vue | 133 +++++++++++++++++++++++++++++++++----------- 1 files changed, 100 insertions(+), 33 deletions(-) diff --git a/packages/components/src/views/electricBillRecharge/electricBillRecharge.vue b/packages/components/src/views/electricBillRecharge/electricBillRecharge.vue index 7348fbb..55fc42a 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,7 +30,7 @@ /> </FormItem> <FormItem label="鐢电綉鎴峰彿" class="bole-form-item" prop="electricAccount" required> - <Input + <NutInput v-model.trim="form.electricAccount" class="bole-input-text" placeholder="璇疯緭鍏�13浣嶆暟瀛楃紪鍙�" @@ -42,17 +44,23 @@ prop="sixID" required > - <Input + <NutInput v-model.trim="form.sixID" class="bole-input-text" placeholder="璇疯緭鍏ヨ韩浠借瘉鍚庡叚浣�" type="text" /> </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" @@ -65,17 +73,19 @@ </div> <div class="price-wrapper"> <div class="price-text">鎶樺悗</div> - <div class="price">{{ blLifeRecharge.getRechargeParValue(item, rate) }}鍏�</div> + <div class="price"> + {{ blLifeRecharge.getRechargeParValue(item, lifePayElectricRate) }}鍏� + </div> </div> - <div class="discountTag">{{ rate * 100 }}鎶�</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,40 +98,58 @@ <template #info> <ConfirmDialogInfoItem label="鐢电綉绫诲瀷" content="鍥藉鐢电綉" /> <ConfirmDialogInfoItem label="鐢佃垂绫诲瀷" content="浣忓畢" /> - <ConfirmDialogInfoItem label="鍏呭�奸噾棰�" :content="`锟�${form.parValue}`" danger /> - <ConfirmDialogInfoItem label="浼樻儬閲戦" :content="`锟�${discountParValue}`" /> + <ConfirmDialogInfoItem label="鍏呭�奸噾棰�" :content="`锟�${form.parValue.toFixed(2)}`" danger /> + <ConfirmDialogInfoItem label="浼樻儬閲戦" :content="`锟�${discountParValue.toFixed(2)}`" /> <ConfirmDialogInfoItem label="瀹炰粯閲戦" :content="`锟�${realParValue}`" danger /> </template> <template #warning> 鍚屼竴鐢佃垂璐︽埛鍦ㄥ厖鍊兼湡闂达紝鏈埌璐﹀墠鍒囧嬁鍦ㄥ叾浠栦换浣曞钩鍙板啀娆″厖鍊笺�傚洜姝ら�犳垚鐨勮祫閲戞崯澶遍』鐢ㄦ埛鑷鎵挎媴锛侊紒锛� </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 BlRadio from '../../components/Radio/Radio.vue'; -import { IspCodeText, IspCode } from '../../constants'; -import { useLifeRechargeContext } from '../../utils'; +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 { 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: '', @@ -129,16 +157,39 @@ sixID: '', }); -const rate = 0.96; +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 ?? [] +); -const realParValue = computed(() => blLifeRecharge.getRechargeParValue(form.parValue, rate)); +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) +); const discountParValue = computed(() => form.parValue - Number(realParValue.value)); const { blLifeRecharge } = useLifeRechargeContext(); -const rules = reactive<FormRules>({}); +const rules = reactive<FormRules>({ + province: [{ required: true, message: '璇烽�夋嫨鎵�鍦ㄥ煄甯�' }], + electricAccountType: [{ required: true, message: '璇烽�夋嫨鐢佃垂绫诲瀷' }], + electricAccount: [{ required: true, message: '璇疯緭鍏ョ數缃戞埛鍙�' }], + sixID: [{ required: true, message: '璇疯緭鍏ヨ韩浠借瘉鍚庡叚浣�' }], + parValue: [ + { required: true, message: '璇烽�夋嫨鍏呭�奸噾棰�', validator: FormValidator.validatorNumberNotNull }, + ], +}); const formRef = ref<any>(null); @@ -146,6 +197,7 @@ if (!formRef.value) return; formRef.value.validate().then(({ valid, errors }: any) => { if (valid) { + recharge(); } }); } @@ -164,7 +216,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> -- Gitblit v1.9.1