el-plus-powerful-form
Version:
## [DOCS](https://peng-xiao-shuai.github.io/vite-vue-admin-docs/zh-CN/component_directive/component/powerful-form-doc.html)
1 lines • 4.28 kB
Source Map (JSON)
{"version":3,"file":"f-input.mjs","sources":["../../packages/components/f-input.tsx"],"sourcesContent":["/*\n * @Author: peng-xiao-shuai\n * @Date: 2023-11-21 19:06:08\n * @LastEditors: peng-xiao-shuai\n * @LastEditTime: 2023-12-05 18:23:40\n * @Description:\n */\nimport { ElInput } from 'element-plus'\nimport type { SetDataType } from '~/index'\nimport { FormTypeEnum, clearSymbol } from '~/index'\nimport {\n componentProps,\n isProperty,\n useEvent,\n} from '~/powerful-form/src/form-view-data'\nexport const FInput = defineComponent({\n name: 'FInput',\n props: componentProps(),\n emits: ['update:modelValue'],\n setup(props, { emit }) {\n const data = computed(\n () => props.formItem.data as SetDataType<FormTypeEnum.Input>\n )\n\n const { event } = useEvent<FormTypeEnum.Input>({\n formData: props.formData,\n index: props.index!,\n formItem: props.formItem,\n })\n\n /**\n * 不要直接使用 v-model props.formData[props.formItem.prop!] 避免页面卡顿\n */\n const modelValue = ref(props.formData[props.formItem.prop!])\n const stop = watchEffect(() => {\n modelValue.value = props.formData[props.formItem.prop!]\n })\n\n onUnmounted(() => {\n stop()\n })\n\n return () => (\n <>\n <ElInput\n v-slots={{\n [data.value?.slot as string]: () => (\n <span style={{ padding: '0 10px' }}>{data.value?.symbol}</span>\n ),\n }}\n style={data.value?.style || {}}\n placeholder={`请输入${clearSymbol(props.formItem.text)}`}\n v-model={modelValue.value}\n onBlur={(...arg: any) => event('blur', ...arg)}\n onFocus={(...arg: any) => event('focus', ...arg)}\n onChange={(v: string) => {\n emit('update:modelValue', v)\n event('change', v)\n }}\n onInput={(...arg: any) => event('input', ...arg)}\n onClear={(...arg: any) => event('clear', ...arg)}\n {...{\n rows: 3,\n clearable: true,\n type: props.formItem.type || FormTypeEnum.Input,\n ...isProperty(\n {\n formData: props.formData,\n index: props.index!,\n formItem: props.formItem,\n },\n data.value?.property\n ),\n }}\n ></ElInput>\n </>\n )\n },\n})\n\nexport default FInput\n"],"names":["FInput","defineComponent","componentProps","props","emit","data","computed","event","useEvent","modelValue","ref","stop","watchEffect","onUnmounted","_createVNode","_Fragment","ElInput","_mergeProps","_a","clearSymbol","$event","arg","v","FormTypeEnum","isProperty","_b","_c"],"mappings":";;;;;;;;;;;;;;;;;AAWY,MAACA,IAAyB,gBAAAC,EAAgB;AAAA,EACpD,MAAM;AAAA,EACN,OAAOC,EAAgB;AAAA,EACvB,OAAO,CAAC,mBAAmB;AAAA,EAC3B,MAAMC,GAAO;AAAA,IACX,MAAAC;AAAA,EACJ,GAAK;AACD,UAAMC,IAAOC,EAAS,MAAMH,EAAM,SAAS,IAAI,GACzC;AAAA,MACJ,OAAAI;AAAA,IACD,IAAGC,EAAS;AAAA,MACX,UAAUL,EAAM;AAAA,MAChB,OAAOA,EAAM;AAAA,MACb,UAAUA,EAAM;AAAA,IACtB,CAAK,GAKKM,IAAaC,EAAIP,EAAM,SAASA,EAAM,SAAS,IAAI,CAAC,GACpDQ,IAAOC,EAAY,MAAM;AAC7B,MAAAH,EAAW,QAAQN,EAAM,SAASA,EAAM,SAAS,IAAI;AAAA,IAC3D,CAAK;AACD,WAAAU,EAAY,MAAM;AAChB,MAAAF;IACN,CAAK,GACM,MAAA;;AAAMG,aAAAA,EAAaC,GAAW,MAAM,CAACD,EAAaE,GAASC,EAAY;AAAA,QAC5E,SAASC,IAAAb,EAAK,UAAL,gBAAAa,EAAY,UAAS,CAAE;AAAA,QAChC,aAAe,MAAMC,EAAYhB,EAAM,SAAS,IAAI,CAAC;AAAA,QACrD,YAAcM,EAAW;AAAA,QACzB,uBAAuB,CAAAW,MAAUX,EAAW,QAAQW;AAAA,QACpD,QAAU,IAAIC,MAAQd,EAAM,QAAQ,GAAGc,CAAG;AAAA,QAC1C,SAAW,IAAIA,MAAQd,EAAM,SAAS,GAAGc,CAAG;AAAA,QAC5C,UAAY,CAAAC,MAAK;AACf,UAAAlB,EAAK,qBAAqBkB,CAAC,GAC3Bf,EAAM,UAAUe,CAAC;AAAA,QAClB;AAAA,QACD,SAAW,IAAID,MAAQd,EAAM,SAAS,GAAGc,CAAG;AAAA,QAC5C,SAAW,IAAIA,MAAQd,EAAM,SAAS,GAAGc,CAAG;AAAA,MAClD,GAAO;AAAA,QACD,MAAM;AAAA,QACN,WAAW;AAAA,QACX,MAAMlB,EAAM,SAAS,QAAQoB,EAAa;AAAA,QAC1C,GAAGC,EAAW;AAAA,UACZ,UAAUrB,EAAM;AAAA,UAChB,OAAOA,EAAM;AAAA,UACb,UAAUA,EAAM;AAAA,QACxB,IAASsB,IAAApB,EAAK,UAAL,gBAAAoB,EAAY,QAAQ;AAAA,MAC7B,CAAK,GAAG;AAAA,QACF,EAACC,IAAArB,EAAK,UAAL,gBAAAqB,EAAY,IAAI,GAAG,MAAMZ;;AAAAA,iBAAAA,EAAa,QAAQ;AAAA,YAC7C,OAAS;AAAA,cACP,SAAS;AAAA,YACX;AAAA,UACD,GAAE,EAACI,IAAAb,EAAK,UAAL,gBAAAa,EAAY,MAAM,CAAC;AAAA;AAAA,MACxB,CAAA,CAAC,CAAC;AAAA;AAAA,EACL;AACF,CAAC;"}