<template>
|
<el-form :model="model" ref="formRef" :rules="rules" :label-width="labelWidth" :inline="inline">
|
<el-form-item :label-width="item.labelWidth" v-for="item in formItems" :label="item.label" :prop="item.prop">
|
<!-- 输入字符串 -->
|
<el-input
|
v-if="item.type === 'string'"
|
:placeholder="item.placeholder"
|
:style="{ width: `${item.width}px` }"
|
:width="item.width"
|
v-model="model[item.prop]"
|
:clearable="item.clearable"
|
></el-input>
|
<!-- 输入数字 -->
|
<el-input-number
|
class="w100"
|
v-else-if="item.type === 'number'"
|
:placeholder="item.placeholder"
|
:style="{ width: `${item.width}px` }"
|
v-model="model[item.prop]"
|
:clearable="item.clearable"
|
></el-input-number>
|
</el-form-item>
|
<slot></slot>
|
</el-form>
|
</template>
|
|
<script setup lang="ts">
|
import { ref } from 'vue';
|
import { YWFormProps } from '/@/components/form/yw-form';
|
import { FormInstance, ElInput, ElInputNumber } from 'element-plus';
|
|
const props = defineProps(YWFormProps);
|
|
const formRef = ref<FormInstance>(null);
|
|
defineExpose({
|
formRef,
|
});
|
</script>
|
<style scoped lang="scss"></style>
|
