fix: bug

wupengfei

2025-02-25 e7b532e0514eae9c426465da6e6f922e6e9a0696

fix: bug

 packages/components/src/components/Input/NumberInput.vue

New file
@@ -0,0 +1,71 @@
<template>
  <nut-input type="number" :formatter="formatter" formatTrigger="onBlur" v-model="innerModelValue">
    <template #right>
      <slot name="right"></slot>
    </template>
  </nut-input>
</template>

<script setup lang="ts">
import { computed } from 'vue';

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

type Props = {
  min?: number;
  max?: number;
  precision?: number;
  modelValue?: number | string;
};

const props = withDefaults(defineProps<Props>(), {
  max: Math.pow(2, 53) - 1,
});

const emit = defineEmits<{
  (e: 'update:modelValue', val: string | number): void;
}>();

const innerModelValue = computed({
  get() {
    return props.modelValue + '';
  },
  set(val) {
    emit('update:modelValue', val);
  },
});

function formatter(value: string): string {
  const newVal = value !== '' ? Number.parseFloat(value) : '';
  if (Number.isNaN(newVal)) {
    return '';
  }
  if (newVal && newVal > props.max) {
    return `${toPrecision(props.max)}`;
  }
  if (props.min !== undefined && !!`${newVal}` && (newVal as number) < props.min) {
    return `${toPrecision(props.min)}`;
  }
  return newVal !== '' ? `${toPrecision(newVal)}` : newVal;
}

function toPrecision(num: number) {
  if (props.precision) {
    if (props.precision === 0) return Math.round(num);
    let snum = String(num);
    const pointPos = snum.indexOf('.');
    if (pointPos === -1) return num;
    const nums = snum.replace('.', '').split('');
    const datum = nums[pointPos + props.precision];
    if (!datum) return num;
    const length = snum.length;
    if (snum.charAt(length - 1) === '5') {
      snum = `${snum.slice(0, Math.max(0, length - 1))}6`;
    }
    return Number(snum).toFixed(props.precision);
  }
  return String(num);
}
</script>

 packages/components/src/utils/validator.ts

@@ -20,6 +20,14 @@
  //   return Promise.resolve(true);
  // }

  // 身份证后六位
  static validatorIDNumberSix(value: string, ruleCfg: FormItemRuleWithoutValidator) {
    if (BoleRegExp.RegIDNumberSix.test(value)) {
      return Promise.resolve(true);
    }
    return Promise.reject(ruleCfg.message);
  }

  static validatorUrl(value: string, ruleCfg: FormItemRuleWithoutValidator) {
    if (BoleRegExp.RegUrl.test(value)) {
      return Promise.resolve(true);
@@ -107,6 +115,9 @@

  static RegUrl = /^(https?:\/\/)?([\da-z.-]+)\.([a-z.]{2,6})(\/\w+)*\/?$/;

  // 身份证后六位
  static RegIDNumberSix = /^\d{5}[X]$|^\d{6}$/;

  static RegUrlWithParameter =
    /^((http|ftp|https):\/\/)?[\w\-_]+(\.[\w\-_]+)+([\w\-\\.,@?^=%&:/~\\+#]*[\w\-\\@?^=%&/~\\+#])?$/;


 packages/components/src/views/electricBillRecharge/electricBillRecharge.vue

@@ -30,11 +30,11 @@
      />
    </FormItem>
    <FormItem label="电网户号" class="bole-form-item" prop="electricAccount" required>
      <NutInput
      <NumberInput
        v-model.trim="form.electricAccount"
        class="bole-input-text"
        placeholder="请输入13位数字编号"
        type="text"
        max-length="13"
      />
    </FormItem>
    <FormItem
@@ -49,6 +49,7 @@
        class="bole-input-text"
        placeholder="请输入身份证后六位"
        type="text"
        max-length="6"
      />
    </FormItem>
    <FormItem
@@ -132,6 +133,7 @@
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';

@@ -187,8 +189,14 @@
const rules = reactive<FormRules>({
  province: [{ required: true, message: '请选择所在城市' }],
  electricAccountType: [{ required: true, message: '请选择电费类型' }],
  electricAccount: [{ required: true, message: '请输入电网户号' }],
  sixID: [{ required: true, message: '请输入身份证后六位' }],
  electricAccount: [{ required: true, message: '请输入电网户号', regex: /^\d{13}$/ }],
  sixID: [
    {
      required: true,
      message: '请输入身份证后六位',
      validator: FormValidator.validatorIDNumberSix,
    },
  ],
  parValue: [
    { required: true, message: '请选择充值金额', validator: FormValidator.validatorNumberNotNull },
  ],