index.vue 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. <template>
  2. <el-input :model-value="modelValue"
  3. @update:modelValue="emitInput"
  4. :placeholder="placeholder"
  5. :disabled="disabled"
  6. :style="{width}"
  7. :maxlength="limit"
  8. :show-word-limit="showWordLimit && !!limit"
  9. show-password
  10. :clearable="clearable"></el-input>
  11. </template>
  12. <script>
  13. import { ElInput } from 'element-plus'
  14. import { useFormInput } from '@cip/components/hooks/form-input'
  15. import { formInputProps } from '../../form-input-props'
  16. import { computed } from 'vue'
  17. export default {
  18. name: 'BasicInput',
  19. components: { ElInput },
  20. props: formInputProps,
  21. emits: ['update:modelValue'],
  22. setup (props, context) {
  23. const formInput = useFormInput(props, context)
  24. const placeholder = computed(() => {
  25. return props.config?.placeholder ?? ''
  26. })
  27. const limit = computed(() => {
  28. return props.config?.limit ?? ''
  29. })
  30. const showWordLimit = computed(() => {
  31. return props.config?.showWordLimit ?? true
  32. })
  33. return {
  34. ...formInput,
  35. placeholder,
  36. limit,
  37. showWordLimit
  38. }
  39. }
  40. }
  41. </script>