<template>
|
<div>
|
<h4 class="font-weight-bold py-3 mb-2">
|
<router-link to="/dic">
|
<span class="text-muted font-weight-light">数据字典管理 /</span>
|
</router-link>
|
字典{{$route.query.id?'编辑':'添加'}}
|
</h4>
|
<b-card
|
no-body
|
class="pt30 pl20 pr20 pb30"
|
>
|
<b-form @submit="saveDic">
|
<h5>字典{{$route.query.id?'编辑':'添加'}}</h5>
|
<div class="row">
|
<div class="col-md-12 col-lg-6">
|
<b-form-group
|
horizontal
|
label-class="text-sm-right"
|
:label-cols="4"
|
label="字典类型："
|
label-for="type"
|
>
|
<Select
|
v-model="form.type"
|
required
|
placeholder="请选择类型"
|
>
|
<Option
|
v-for="item in sys_type"
|
:key="item.value"
|
:label="item.lable"
|
:value="item.value"
|
/>
|
</Select>
|
</b-form-group>
|
<b-form-group
|
horizontal
|
required
|
label-class="text-sm-right"
|
:label-cols="4"
|
label="字典名称："
|
label-for="name"
|
:invalid-feedback="requiredValid(form.lable)"
|
:valid-feedback="requiredValid(form.lable)"
|
:state="requiredState(form.lable)"
|
>
|
<b-form-input
|
id="name"
|
type="text"
|
autocomplete="off"
|
v-model="form.lable"
|
:state="requiredState(form.lable)"
|
:placeholder="dicTips&&dicTips.labelDefault?`输入字典名称(必须是 ${dicTips.labelDefault})`:'输入字典名称'"
|
/>
|
</b-form-group>
|
<b-form-group
|
horizontal
|
required
|
label-class="text-sm-right"
|
:label-cols="4"
|
label="字典值："
|
label-for="value"
|
:invalid-feedback="requiredValid(form.value)"
|
:valid-feedback="requiredValid(form.value)"
|
:state="requiredState(form.value)"
|
>
|
<b-form-input
|
id="value"
|
type="text"
|
autocomplete="off"
|
v-model="form.value"
|
:state="requiredState(form.value)"
|
:placeholder="dicTips&&dicTips.valueType?`输入字典值(必须是${dicTips.valueType})`:'输入字典值'"
|
/>
|
</b-form-group>
|
<b-form-group
|
horizontal
|
label-class="text-sm-right"
|
:label-cols="4"
|
label="字典附加字段(json格式)："
|
label-for="description"
|
:state="requiredState(form.revJson)"
|
>
|
<b-form-textarea
|
id="value"
|
type="text"
|
autocomplete="off"
|
v-model="form.revJson"
|
:placeholder="dicTips&&dicTips.jsonDesc?dicTips.jsonDesc:'输入字典附加字段'"
|
:rows="4"
|
:max-rows="6"
|
/>
|
</b-form-group>
|
</div>
|
</div>
|
<div class="text-right mt-3">
|
<LaddaBtn
|
:loading="saveLoading"
|
@click.native="saveDic"
|
data-style="slide-down"
|
class="btn btn-primary"
|
>
|
保存
|
</LaddaBtn>
|
|
<b-btn
|
variant="default"
|
@click="$router.push({path:'/dic'})"
|
>
|
返回
|
</b-btn>
|
</div>
|
</b-form>
|
</b-card>
|
</div>
|
</template>
|
|
<script>
|
import LaddaBtn from '@/vendor/libs/ladda/Ladda'
|
import { Select, Option } from 'element-ui'
|
import {
|
getGloDicts,
|
SysDictsSave,
|
sysDictsFindSysById,
|
sysDictsUpdate
|
} from '../../server/dic.js'
|
|
export default {
|
data: () => ({
|
form: {
|
type: '',
|
lable: '',
|
value: '',
|
revJson: ''
|
},
|
saveLoading: false,
|
sys_type: [],
|
ischeckUp: false
|
}),
|
computed: {
|
dicTips() {
|
const tips = this.sys_type.find(item => item.value === this.form.type)
|
if (tips && tips.revJson) {
|
return JSON.parse(tips.revJson)
|
}
|
return null
|
}
|
},
|
async mounted() {
|
this.sys_type = await this.fetchtGloDicts('SYSTEM_DICT')
|
this.fetchDicts()
|
},
|
methods: {
|
// * 保存接口
|
saveDic() {
|
this.ischeckUp = true
|
const isValid = this.valid()
|
if (!isValid) return
|
if (this.$route.query.id && this.$route.query.id !== '') {
|
// * 编辑
|
this.updateDic()
|
} else {
|
// * 添加
|
this.addDic()
|
}
|
},
|
// * 添加操作
|
async addDic() {
|
const res = await SysDictsSave({
|
orgId: this.$store.getters.basicUserInfo.orgId,
|
module: this.$store.state.menuName,
|
scope: 1,
|
...this.form
|
})
|
if (res.code - 0 === 0) {
|
this.$toast({
|
type: 'success',
|
message: '添加成功'
|
})
|
this.$router.push('/dic')
|
} else {
|
this.$toast({
|
type: 'error',
|
message: res.message
|
})
|
}
|
},
|
// * 编辑操作
|
async updateDic() {
|
const res = await sysDictsUpdate({
|
orgId: this.$store.getters.basicUserInfo.orgId,
|
module: this.$store.state.menuName,
|
id: this.$route.query.id,
|
scope: 1,
|
...this.form
|
})
|
if (res.code - 0 === 0) {
|
this.$toast({
|
type: 'success',
|
message: '编辑成功'
|
})
|
this.$router.push('/dic')
|
} else {
|
this.$toast({
|
type: 'error',
|
message: res.message
|
})
|
}
|
},
|
// * 获取字典类型
|
async fetchtGloDicts(type) {
|
const res = await getGloDicts({
|
type
|
})
|
if (res && res.code - 0 === 0) {
|
return res.data
|
}
|
},
|
// * 校验
|
requiredValid(val) {
|
return this.ischeckUp ? (val !== '' ? '' : '此字段为必填项') : ''
|
},
|
requiredState(val) {
|
return this.ischeckUp ? val !== '' : null
|
},
|
valid() {
|
if (!this.form.type) {
|
this.$toast({
|
type: 'error',
|
message: '请选择字典类型'
|
})
|
return false
|
}
|
if (!this.form.lable) {
|
this.$toast({
|
type: 'error',
|
message: '请填写字典名称'
|
})
|
return false
|
}
|
if (!this.form.value) {
|
this.$toast({
|
type: 'error',
|
message: '请填写字典信息'
|
})
|
return false
|
}
|
return true
|
},
|
// * 初始化
|
async fetchDicts() {
|
if (!(this.$route.query.id && this.$route.query.id !== '')) return
|
const id = this.$route.query.id
|
const res = await sysDictsFindSysById({
|
id
|
})
|
if (res && res.code - 0 === 0) {
|
for (let name in this.form) {
|
this.form[name] = res.data[name]
|
}
|
}
|
}
|
},
|
components: {
|
Select,
|
Option,
|
LaddaBtn
|
}
|
}
|
</script>
|
