| | |
| | | <!-- 场景基本信息编辑 --> |
| | | <template> |
| | | <el-form |
| | | :inline="false" |
| | |
| | | label-width="150px" |
| | | > |
| | | <slot name="form-item" :formObj="formObj"></slot> |
| | | <el-form-item> |
| | | <el-button |
| | | :disabled="!edit" |
| | | type="primary" |
| | | @click="onSubmit" |
| | | :loading="loading" |
| | | <el-form-item v-if="showButtons"> |
| | | <el-button :disabled="!edit" type="primary" @click="onSubmit" :loading="loading" |
| | | >提交</el-button |
| | | > |
| | | <el-button :disabled="!edit" @click="onReset">重置</el-button> |
| | | <el-button v-if="enableCancelBtn" @click="onCancel">取消</el-button> |
| | | <el-button v-if="useReset" :disabled="!edit" @click="onReset">重置</el-button> |
| | | <el-button v-if="useCancel" @click="onCancel">取消</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </template> |
| | |
| | | formInfo: Object, |
| | | //表单检验规则 |
| | | rules: Object, |
| | | showButtons: { |
| | | type: Boolean, |
| | | default: true |
| | | }, |
| | | //取消按钮是否可用 |
| | | enableCancelBtn: Boolean, |
| | | useCancel: Boolean, |
| | | //重置按钮是否可用 |
| | | useReset: Boolean, |
| | | //触发重置 |
| | | reset: Boolean, |
| | | //通知编辑状态 |
| | | isEdit: Boolean, |
| | | isEdit: Boolean |
| | | }); |
| | | |
| | | //触发函数,提交和取消 |
| | | const emit = defineEmits(['submit', 'cancel', 'update:isEdit']); |
| | | |
| | | //表单操作函数 |
| | | const { formObj, formRef, edit, onSubmit, onCancel, onReset } = useFormConfirm({ |
| | | const { formObj, formRef, edit, onSubmit, onCancel, onReset, formProps } = useFormConfirm({ |
| | | submit: { |
| | | do: submit, |
| | | do: submit |
| | | }, |
| | | cancel: { |
| | | do: cancel, |
| | | }, |
| | | do: cancel |
| | | } |
| | | }); |
| | | |
| | | //加载状态 |
| | |
| | | emit('submit', formObj, () => { |
| | | loading.value = false; |
| | | resolve(); |
| | | },(err)=>{ |
| | | loading.value = false; |
| | | reject(err); |
| | | }); |
| | | }); |
| | | } |
| | |
| | | () => props.formInfo, |
| | | (nValue) => { |
| | | formObj.value = nValue; |
| | | } |
| | | }, |
| | | { deep: false, immediate: false } |
| | | ); |
| | | |
| | | //监听表单重置功能触发 |