Form.vue
4.42 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<template>
<el-dialog :title="!dataForm.id ? '新建字典' : '编辑字典'" :close-on-click-modal="false"
:close-on-press-escape="false" :visible.sync="visible" lock-scroll width="600px"
class="NCC-dialog NCC-dialog_center">
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" v-loading="formLoading"
label-width="80px">
<el-form-item label="项目上级" prop="parentId">
<NCC-TreeSelect v-model="dataForm.parentId" :options="treeData" placeholder="选择项目上级"
:disabled="parentDisabled" />
</el-form-item>
<el-form-item label="字典名称" prop="fullName">
<el-input v-model="dataForm.fullName" placeholder="输入名称" />
</el-form-item>
<el-form-item label="字典编码" prop="enCode">
<el-input v-model="dataForm.enCode" placeholder="输入编码" />
</el-form-item>
<el-form-item label="排序" prop="sortCode">
<el-input-number :min="0" :max="9999" v-model="dataForm.sortCode"
controls-position="right" />
</el-form-item>
<el-form-item label="状态" prop="enabledMark">
<el-switch v-model="dataForm.enabledMark" :active-value="1" :inactive-value="0" />
</el-form-item>
<el-form-item label="字典说明" prop="description">
<el-input v-model="dataForm.description" type="textarea" :rows="6" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{$t('common.cancelButton')}}</el-button>
<el-button type="primary" :loading="btnLoading" @click="dataFormSubmit()">
{{$t('common.confirmButton')}}</el-button>
</span>
</el-dialog>
</template>
<script>
import {
getDictionaryDataTypeSelector,
getDictionaryDataInfo,
updateDictionaryData,
createDictionaryData
} from '@/api/systemData/dictionary'
export default {
data() {
return {
visible: false,
formLoading: false,
btnLoading: false,
parentDisabled: false,
dataForm: {
id: '',
dictionaryTypeId: '',
parentId: '0',
fullName: '',
enCode: '',
enabledMark: 1,
sortCode: 0,
description: ''
},
treeData: [],
dataRule: {
parentId: [
{ required: true, message: '请选择', trigger: 'input' }
],
fullName: [
{ required: true, message: '请输入名称', trigger: 'blur' },
{ max: 50, message: '字典名称最多为50个字符！', trigger: 'blur' }
],
enCode: [
{ required: true, message: '请输入编码', trigger: 'blur' },
{ max: 50, message: '字典编码最多为50个字符！', trigger: 'blur' }
]
}
}
},
methods: {
init(id, typeId, isTree) {
this.visible = true
this.dataForm.id = id || ''
this.dataForm.dictionaryTypeId = typeId
this.formLoading = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (isTree === 1) {
this.parentDisabled = false
} else {
this.parentDisabled = true
}
getDictionaryDataTypeSelector(this.dataForm.dictionaryTypeId, isTree, id || 0).then(res => {
this.treeData = res.data.list
if (this.dataForm.id) {
getDictionaryDataInfo(this.dataForm.id).then(res => {
this.dataForm = res.data
this.formLoading = false
})
} else {
this.dataForm.parentId = res.data.list[0].id
this.formLoading = false
}
})
})
},
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
this.btnLoading = true
this.dataForm.parentId = this.dataForm.dictionaryTypeId === this.dataForm.parentId ? '0' : this.dataForm.parentId
const formMethod = this.dataForm.id ? updateDictionaryData : createDictionaryData
formMethod(this.dataForm).then(res => {
this.$message({
message: res.msg,
type: 'success',
duration: 1500,
onClose: () => {
this.$store.commit('base/SET_DICTIONARY_LIST', [])
this.visible = false
this.btnLoading = false
this.$emit('refreshDataList')
}
})
}).catch(() => {
this.btnLoading = false
})
}
})
}
}
}
</script>