dg_erp/jy-ui/src/components/AForm/AInput.vue

<script setup lang="ts">
import { EpPropMergeType } from 'element-plus/es/utils'
import { StrAnyObj } from '@/typings'

const props = withDefaults(
  defineProps<{
    modelValue: EpPropMergeType<
      | (new (...args: any[]) => string | number)
      | (() => string | number | null | undefined)
      | ((new (...args: any[]) => string | number) | (() => string | number | null | undefined))[],
      unknown,
      unknown
    >
    style?: StrAnyObj
    placeholder?: string
    clearable?: boolean
    disabled?: boolean
    readonly?: boolean
    type?: 'text' | 'textarea' | 'password'
    maxlength?: number
    minlength?: number
    showWordLimit?: boolean
    showPassword?: boolean
    rows?: number
    autosize?: boolean | { minRows?: number; maxRows?: number }
    resize?: 'none' | 'both' | 'horizontal' | 'vertical'
    change?: (value: any) => void
  }>(),
  {
    clearable: true,
    disabled: false,
    readonly: false
  }
)

const emits = defineEmits(['update:modelValue'])

const computedModelValue = computed({
  get() {
    return props.modelValue
  },
  set(newValue) {
    emits('update:modelValue', newValue)
  }
})
</script>

<template>
  <el-input
    v-model="computedModelValue"
    :placeholder="disabled ? '' : placeholder"
    :clearable="clearable"
    :disabled="disabled"
    :readonly="readonly"
    :type="type"
    :maxlength="maxlength"
    :minlength="minlength"
    :show-word-limit="showWordLimit"
    :show-password="showPassword"
    :rows="rows"
    :autosize="autosize"
    :resize="resize"
    :style="style"
    style="width: 100%"
    @change="(value: any) => change?.(value)"
  />
</template>