<template> <a-spin :spinning='confirmLoading'> <j-form-container :disabled='formDisabled'> <a-form-model ref='form' :model='model' :rules='validatorRules' slot='detail'> <a-row> <a-col :span='24'> <a-form-model-item label='策略名称' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='name'> <a-input v-model='model.name' placeholder='请输入策略名称'></a-input> </a-form-model-item> </a-col> <a-col :span='24'> <a-form-model-item label='参数键名' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='code'> <a-input v-model='model.code' placeholder='请输入参数键名'></a-input> </a-form-model-item> </a-col> <a-col :span='24'> <a-form-model-item label='策略类别' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='type'> <j-dict-select-tag type='list' v-model='model.type' dictCode='strategyType' placeholder='请选择策略类别' /> </a-form-model-item> </a-col> <a-col :span='24'> <a-form-model-item label='是否启用' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='enabled'> <j-dict-select-tag type='radio' v-model='model.enabled' dictCode='is_or_not' placeholder='请选择是否启用' /> </a-form-model-item> </a-col> <a-col :span='24'> <a-form-model-item label='备注' :labelCol='labelCol' :wrapperCol='wrapperCol' prop='remark'> <a-textarea v-model='model.remark' rows='4' placeholder='请输入备注' /> </a-form-model-item> </a-col> </a-row> </a-form-model> </j-form-container> </a-spin> </template> <script> import { httpAction, getAction } from '@/api/manage' import { validateDuplicateValue } from '@/utils/util' export default { name: 'StrategyForm', components: {}, props: { //表单禁用 disabled: { type: Boolean, default: false, required: false } }, data() { return { model: {}, labelCol: { xs: { span: 24 }, sm: { span: 5 } }, wrapperCol: { xs: { span: 24 }, sm: { span: 16 } }, confirmLoading: false, validatorRules: { name: [ { required: true, message: '请输入策略名称!' } ], code: [ { required: true, message: '请输入参数键名!' } ], type: [ { required: true, message: '请选择策略类别!' } ], enabled: [ { required: true, message: '请输入是否启用!' } ] }, url: { add: '/config/strategy/add', edit: '/config/strategy/edit', queryById: '/config/strategy/queryById' } } }, computed: { formDisabled() { return this.disabled } }, created() { //备份model原始值 this.modelDefault = JSON.parse(JSON.stringify(this.model)) }, methods: { add() { this.edit(this.modelDefault) }, edit(record) { this.model = Object.assign({}, record) this.visible = true }, submitForm() { const that = this // 触发表单验证 this.$refs.form.validate(valid => { if (valid) { that.confirmLoading = true let httpurl = '' let method = '' if (!this.model.id) { httpurl += this.url.add method = 'post' } else { httpurl += this.url.edit method = 'put' } httpAction(httpurl, this.model, method).then((res) => { if (res.success) { that.$message.success(res.message) that.$emit('ok') } else { that.$message.warning(res.message) } }).finally(() => { that.confirmLoading = false }) } }) } } } </script>