<template>
  <a-col :span="colSpan ? colSpan : defaultColSpan">
    <a-form-item :label="label" :name="name" :icon="icon" :label-col="{ style: { width: textWidth || labelWidth } }"
      :wrapper-col="{ style: { flex: 1 } }">
      <a-input-number v-model:value="innerValue" :disabled="see || readonly" :min="min" :max="max"
        :placeholder="placeholder" :style="style" v-bind="$attrs" />
    </a-form-item>
  </a-col>
</template>

<script>
export default {
  name: "FormNumber",
  inheritAttrs: false, // 禁用自动继承，手动控制透传
  inject: {
    labelWidth: {
      from: "labelWidth",
      default: "90px",
    },
    defaultColSpan: {
      from: 'defaultColSpan',
      default: 12
    }
  },
  props: {
    placeholder: String,
    label: String,
    name: String,
    modelValue: [String, Number],
    colSpan: { type: Number }, // 单个控件自定义列跨度
    icon: String,
    readonly: Boolean,
    min: Number,
    max: Number,
    textWidth: String,
    style: { type: Object, default: () => ({ width: "100%" }) }
  },
  computed: {
    see() {
      return this.$store?.forms?.see;
    },
    innerValue: {
      get() {
        return this.modelValue;
      },
      set(val) {
        this.$emit("update:modelValue", val);
      },
    },
  },
};
</script>
