142 lines
4.1 KiB
Vue
142 lines
4.1 KiB
Vue
<template>
|
|
<a-modal :visible="visible" :title="modalTitle" :width="720" @cancel="onCancel">
|
|
<a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
|
|
<a-row>
|
|
<a-col :span="12">
|
|
<a-form-model-item ref="name" label="词典项名称" prop="name">
|
|
<a-input v-if="operable" v-model="form.name"/>
|
|
<span v-else>{{ form.name }}</span>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item ref="value" label="词典项值" prop="value">
|
|
<a-input-number v-if="operable" v-model="form.value"/>
|
|
<span v-else>{{ form.value }}</span>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-row>
|
|
<a-row>
|
|
<a-col :span="12">
|
|
<a-form-model-item ref="parentid" label="所属上级" prop="parentid">
|
|
<a-input-number v-if="operable" v-model="form.parentid" :min="0"/>
|
|
<span v-else>{{ form.parentid }}</span>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-model-item ref="sortid" label="排序" prop="sortid">
|
|
<a-input-number v-if="operable" v-model="form.sortid" :min="0"/>
|
|
<span v-else>{{ form.sortid }}</span>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-row>
|
|
<a-row>
|
|
<a-col :span="24">
|
|
<a-form-model-item ref="description" label="描述" prop="description" :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }">
|
|
<a-textarea :autoSize="{ minRows: 3, maxRows: 10 }" v-model="form.description" v-if="operable"/>
|
|
<span v-else>{{ form.description }}</span>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form-model>
|
|
<div class="draw-button-container align-center">
|
|
<a-button @click="onCancel">取消</a-button>
|
|
<a-button type="primary" @click="onSubmit" :disabled="!operable">保存</a-button>
|
|
</div>
|
|
</a-modal>
|
|
</template>
|
|
|
|
<script>
|
|
import { dictionaryItemAdd, dictionaryItemUpdate } from '@/api/sys/dictionaryItem'
|
|
|
|
export default {
|
|
props: {
|
|
id: {
|
|
type: String,
|
|
default: undefined
|
|
}
|
|
},
|
|
data () {
|
|
return {
|
|
modalTitle: '新增',
|
|
visible: false,
|
|
operable: false,
|
|
labelCol: { span: 8 },
|
|
wrapperCol: { span: 16 },
|
|
form: {
|
|
name: '',
|
|
value: '',
|
|
parentid: 0,
|
|
sortid: 0,
|
|
description: ''
|
|
},
|
|
rules: {
|
|
name: [
|
|
{ required: true, message: '请输入词典项名称', trigger: 'blur' }
|
|
],
|
|
value: [
|
|
{ required: true, message: '请输入词典项值', trigger: 'blur' }
|
|
],
|
|
parentid: [
|
|
{ required: true, message: '请输入所属上级', trigger: 'blur' }
|
|
],
|
|
sortid: [
|
|
{ required: true, message: '请输入排序', trigger: 'blur' }
|
|
]
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
add () {
|
|
console.log(this.form)
|
|
this.modalTitle = '新增'
|
|
this.visible = true
|
|
this.operable = true
|
|
this.form.id = undefined
|
|
},
|
|
edit (obj) {
|
|
var _obj = {...obj}
|
|
this.modalTitle = '修改'
|
|
this.visible = true
|
|
this.operable = true
|
|
this.form = _obj
|
|
},
|
|
detail (obj) {
|
|
this.modalTitle = '详情'
|
|
this.visible = true
|
|
this.operable = false
|
|
this.form = obj
|
|
},
|
|
onSubmit (e) {
|
|
this.$refs.ruleForm.validate(valid => {
|
|
if (valid) {
|
|
this.form.dictionaryCode = this.$route.params.id
|
|
console.log(this.form)
|
|
if (this.form.id) {
|
|
dictionaryItemUpdate(this.form).then(data => {
|
|
this.$message.success('编辑成功')
|
|
this.$emit('ok')
|
|
this.onCancel()
|
|
})
|
|
} else {
|
|
dictionaryItemAdd(this.form).then(data => {
|
|
this.$message.success('新增成功')
|
|
this.$emit('ok')
|
|
this.onCancel()
|
|
})
|
|
}
|
|
} else {
|
|
return false
|
|
}
|
|
})
|
|
},
|
|
onCancel () {
|
|
this.form = {}
|
|
this.visible = false
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
</style>
|