<template>
|
<a-spin :spinning="confirmLoading">
|
<j-form-container :disabled="formDisabled">
|
<a-form :form="form" slot="detail">
|
<a-row>
|
<a-col :span="24">
|
<a-form-item label="租户名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-input v-decorator="['name']" placeholder="请输入租户名称"></a-input>
|
</a-form-item>
|
</a-col>
|
|
<a-col :span="24">
|
<a-form-item label="租户编号" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-input-number
|
style="width: 100%"
|
:min="1"
|
v-decorator="['id', { rules: [{ required: true, message: '请输入租户编号' }] }]"
|
placeholder="请输入租户编号"
|
></a-input-number>
|
</a-form-item>
|
</a-col>
|
|
<a-col :span="24">
|
<a-form-item label="开始时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<j-date
|
placeholder="请选择开始时间"
|
v-decorator="['beginDate']"
|
:trigger-change="true"
|
:show-time="true"
|
date-format="YYYY-MM-DD HH:mm:ss"
|
style="width: 100%"
|
/>
|
</a-form-item>
|
</a-col>
|
<a-col :span="24">
|
<a-form-item label="结束时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<j-date
|
placeholder="请选择结束时间"
|
v-decorator="['endDate']"
|
:trigger-change="true"
|
:show-time="true"
|
date-format="YYYY-MM-DD HH:mm:ss"
|
style="width: 100%"
|
/>
|
</a-form-item>
|
</a-col>
|
<a-col :span="24">
|
<a-form-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-radio-group name="tenantStatus" v-decorator="['status', { initialValue: 1 }]">
|
<a-radio :value="1">正常</a-radio>
|
<a-radio :value="0">冻结</a-radio>
|
</a-radio-group>
|
</a-form-item>
|
</a-col>
|
<a-col v-if="showFlowSubmitButton" :span="24" style="text-align: center">
|
<a-button @click="submitForm">提 交</a-button>
|
</a-col>
|
</a-row>
|
</a-form>
|
</j-form-container>
|
</a-spin>
|
</template>
|
|
<script>
|
import { httpAction, getAction } from '@tievd/cube-block/lib/api/manage'
|
import pick from 'lodash.pick'
|
|
export default {
|
name: 'TenantForm',
|
|
props: {
|
formData: {
|
type: Object,
|
default: () => {},
|
required: false
|
},
|
normal: {
|
type: Boolean,
|
default: false,
|
required: false
|
},
|
disabled: {
|
type: Boolean,
|
default: false,
|
required: false
|
}
|
},
|
data() {
|
return {
|
form: this.$form.createForm(this),
|
model: {},
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 5 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 16 }
|
},
|
confirmLoading: false,
|
validatorRules: {},
|
url: {
|
add: '/sys/tenant/add',
|
edit: '/sys/tenant/edit',
|
queryById: '/sys/tenant/queryById'
|
}
|
}
|
},
|
computed: {
|
formDisabled() {
|
if (this.normal === false) {
|
if (this.formData.disabled === false) {
|
return false
|
} else {
|
return true
|
}
|
}
|
return this.disabled
|
},
|
showFlowSubmitButton() {
|
if (this.normal === false) {
|
if (this.formData.disabled === false) {
|
return true
|
} else {
|
return false
|
}
|
} else {
|
return false
|
}
|
}
|
},
|
created() {
|
this.showFlowData()
|
},
|
methods: {
|
add() {
|
this.edit({})
|
},
|
edit(record) {
|
this.form.resetFields()
|
this.model = Object.assign({}, record)
|
this.visible = true
|
this.$nextTick(() => {
|
this.form.setFieldsValue(pick(this.model, 'id', 'name', 'beginDate', 'endDate', 'status'))
|
})
|
},
|
showFlowData() {
|
if (this.normal === false) {
|
let params = { id: this.formData.dataId }
|
getAction(this.url.queryById, params).then(res => {
|
if (res.success) {
|
this.edit(res.result)
|
}
|
})
|
}
|
},
|
submitForm() {
|
const that = this
|
// 触发表单验证
|
this.form.validateFields((err, values) => {
|
if (!err) {
|
that.confirmLoading = true
|
let httpurl = ''
|
let method = ''
|
if (!this.model.id) {
|
httpurl += this.url.add
|
method = 'post'
|
} else {
|
httpurl += this.url.edit
|
method = 'put'
|
}
|
let formData = Object.assign(this.model, values)
|
console.log('表单提交数据', formData)
|
httpAction(httpurl, formData, method)
|
.then(res => {
|
if (res.success) {
|
that.$message.success(res.message)
|
that.$emit('ok')
|
} else {
|
if ('该编号已存在!' == res.message) {
|
this.model.id = ''
|
}
|
that.$message.warning(res.message)
|
}
|
})
|
.finally(() => {
|
that.confirmLoading = false
|
})
|
}
|
})
|
},
|
popupCallback(row) {
|
this.form.setFieldsValue(pick(row, 'id', 'name', 'beginDate', 'endDate', 'status'))
|
}
|
}
|
}
|
</script>
|