6 changed files with 1816 additions and 1517 deletions
@ -1,142 +1,109 @@ |
|||||
<template> |
<template> |
||||
<div> |
<div> |
||||
<Modal |
<Modal title="添加字典" v-model="visible" :mask-closable="false" :width="500"> |
||||
title="添加字典" |
<Form ref="form" :model="form" :label-width="85" :rules="formValidate"> |
||||
v-model="visible" |
<FormItem label="分类名称" prop="title"> |
||||
:mask-closable="false" |
<Input v-model="form.categoryName" /> |
||||
:width="500" |
</FormItem> |
||||
> |
<FormItem label="排序值" prop="sortOrder"> |
||||
<Form |
<Tooltip trigger="hover" placement="right" content="值越小越靠前，支持小数"> |
||||
ref="form" |
<InputNumber :max="1000" :min="0" v-model="form.sort"></InputNumber> |
||||
:model="form" |
</Tooltip> |
||||
:label-width="85" |
</FormItem> |
||||
:rules="formValidate" |
</Form> |
||||
> |
<div slot="footer"> |
||||
<FormItem label="字典名称" prop="title"> |
<Button type="text" @click="visible = false">取消</Button> |
||||
<Input v-model="form.title" /> |
<Button type="primary" :loading="submitLoading" @click="submit">提交</Button> |
||||
</FormItem> |
</div> |
||||
<FormItem label="字典类型" prop="type" class="block-tool"> |
</Modal> |
||||
<Tooltip |
</div> |
||||
placement="right" |
|
||||
:max-width="220" |
|
||||
transfer |
|
||||
content="建议设置为英文名且需唯一 非开发人员谨慎修改" |
|
||||
> |
|
||||
<Input v-model="form.type" /> |
|
||||
</Tooltip> |
|
||||
</FormItem> |
|
||||
<FormItem label="备注" prop="description"> |
|
||||
<Input v-model="form.description" /> |
|
||||
</FormItem> |
|
||||
<FormItem label="排序值" prop="sortOrder"> |
|
||||
<Tooltip |
|
||||
trigger="hover" |
|
||||
placement="right" |
|
||||
content="值越小越靠前，支持小数" |
|
||||
> |
|
||||
<InputNumber |
|
||||
:max="1000" |
|
||||
:min="0" |
|
||||
v-model="form.sortOrder" |
|
||||
></InputNumber> |
|
||||
</Tooltip> |
|
||||
</FormItem> |
|
||||
</Form> |
|
||||
<div slot="footer"> |
|
||||
<Button type="text" @click="visible = false">取消</Button> |
|
||||
<Button |
|
||||
type="primary" |
|
||||
:loading="submitLoading" |
|
||||
@click="submit" |
|
||||
>提交</Button |
|
||||
> |
|
||||
</div> |
|
||||
</Modal> |
|
||||
</div> |
|
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import { addDict } from "@/api/index"; |
import { |
||||
export default { |
addType |
||||
name: "addDictType", |
} from "@/api/app"; |
||||
components: {}, |
export default { |
||||
props: { |
name: "addDictType", |
||||
value: { |
components: {}, |
||||
type: Boolean, |
props: { |
||||
default: false, |
value: { |
||||
}, |
type: Boolean, |
||||
dataLength: { |
default: false, |
||||
type: Number |
}, |
||||
}, |
dataLength: { |
||||
}, |
type: Number |
||||
data() { |
}, |
||||
return { |
}, |
||||
visible: this.value, |
data() { |
||||
submitLoading: false, |
return { |
||||
form: { |
visible: this.value, |
||||
title: "", |
submitLoading: false, |
||||
type: "", |
form: { |
||||
description: "", |
categoryName: "", |
||||
sortOrder: 0, |
sort: 0, |
||||
}, |
shopId: '' |
||||
formValidate: { |
}, |
||||
// 表单验证规则 |
formValidate: { |
||||
title: [{ required: true, message: "请输入", trigger: "blur" }], |
// 表单验证规则 |
||||
type: [{ required: true, message: "请输入", trigger: "blur" }], |
categoryName: [{ |
||||
sortOrder: [ |
required: true, |
||||
{ |
message: "请输入", |
||||
required: true, |
trigger: "blur" |
||||
type: "number", |
}], |
||||
message: "请输入排序值", |
sort: [{ |
||||
trigger: "blur", |
required: true, |
||||
}, |
type: "number", |
||||
], |
message: "请输入排序值", |
||||
}, |
trigger: "blur", |
||||
}; |
}, ], |
||||
}, |
}, |
||||
methods: { |
}; |
||||
init() {}, |
}, |
||||
submit() { |
methods: { |
||||
this.$refs.form.validate((valid) => { |
init(v) { |
||||
if (valid) { |
this.form.shopId = v |
||||
// 添加 |
}, |
||||
this.submitLoading = true; |
submit() { |
||||
addDict(this.form).then((res) => { |
this.$refs.form.validate((valid) => { |
||||
this.submitLoading = false; |
if (valid) { |
||||
if (res.success) { |
// 添加 |
||||
this.$Message.success("操作成功"); |
this.submitLoading = true; |
||||
this.$emit("on-submit", true); |
addType(this.form).then((res) => { |
||||
this.visible = false; |
this.submitLoading = false; |
||||
} |
if (res.success) { |
||||
}); |
this.$Message.success("操作成功"); |
||||
} |
this.$emit("on-submit", true); |
||||
}); |
this.visible = false; |
||||
}, |
} |
||||
setCurrentValue(value) { |
}); |
||||
if (value === this.visible) { |
} |
||||
return; |
}); |
||||
} |
}, |
||||
// 清空数据 |
setCurrentValue(value) { |
||||
this.$refs.form.resetFields(); |
if (value === this.visible) { |
||||
this.form.sortOrder = this.dataLength; |
return; |
||||
this.visible = value; |
} |
||||
}, |
// 清空数据 |
||||
}, |
this.$refs.form.resetFields(); |
||||
watch: { |
this.form.sort = this.dataLength; |
||||
value(val) { |
this.visible = value; |
||||
this.setCurrentValue(val); |
}, |
||||
}, |
}, |
||||
visible(value) { |
watch: { |
||||
this.$emit("input", value); |
value(val) { |
||||
}, |
this.setCurrentValue(val); |
||||
}, |
}, |
||||
mounted() { |
visible(value) { |
||||
this.init(); |
this.$emit("input", value); |
||||
}, |
}, |
||||
}; |
}, |
||||
|
mounted() { |
||||
|
this.init(); |
||||
|
}, |
||||
|
}; |
||||
</script> |
</script> |
||||
|
|
||||
<style lang="less"> |
<style lang="less"> |
||||
@import "@/styles/drawer-common.less"; |
@import "@/styles/drawer-common.less"; |
||||
</style> |
</style> |
||||
|
|
||||
@ -1,143 +1,118 @@ |
|||||
<template> |
<template> |
||||
<div> |
<div> |
||||
<Modal |
<Modal title="编辑分类" v-model="visible" :mask-closable="false" :width="500"> |
||||
title="编辑字典" |
<Form ref="form" :model="form" :label-width="85" :rules="formValidate"> |
||||
v-model="visible" |
<FormItem label="分类名称" prop="title"> |
||||
:mask-closable="false" |
<Input v-model="form.categoryName" /> |
||||
:width="500" |
</FormItem> |
||||
> |
<FormItem label="排序值" prop="sort"> |
||||
<Form ref="form" :model="form" :label-width="85" :rules="formValidate"> |
<Tooltip trigger="hover" placement="right" content="值越小越靠前，支持小数"> |
||||
<FormItem label="字典名称" prop="title"> |
<InputNumber :max="1000" :min="0" v-model="form.sort"></InputNumber> |
||||
<Input v-model="form.title" /> |
</Tooltip> |
||||
</FormItem> |
</FormItem> |
||||
<FormItem label="字典类型" prop="type" class="block-tool"> |
</Form> |
||||
<Tooltip |
<div slot="footer"> |
||||
placement="right" |
<Button type="text" @click="visible = false">取消</Button> |
||||
:max-width="220" |
<Button type="primary" :loading="submitLoading" @click="submit">提交</Button> |
||||
transfer |
</div> |
||||
content="建议设置为英文名且需唯一 非开发人员谨慎修改" |
</Modal> |
||||
> |
</div> |
||||
<Input v-model="form.type" /> |
|
||||
</Tooltip> |
|
||||
</FormItem> |
|
||||
<FormItem label="备注" prop="description"> |
|
||||
<Input v-model="form.description" /> |
|
||||
</FormItem> |
|
||||
<FormItem label="排序值" prop="sortOrder"> |
|
||||
<Tooltip |
|
||||
trigger="hover" |
|
||||
placement="right" |
|
||||
content="值越小越靠前，支持小数" |
|
||||
> |
|
||||
<InputNumber |
|
||||
:max="1000" |
|
||||
:min="0" |
|
||||
v-model="form.sortOrder" |
|
||||
></InputNumber> |
|
||||
</Tooltip> |
|
||||
</FormItem> |
|
||||
</Form> |
|
||||
<div slot="footer"> |
|
||||
<Button type="text" @click="visible = false">取消</Button> |
|
||||
<Button type="primary" :loading="submitLoading" @click="submit" |
|
||||
>提交</Button |
|
||||
> |
|
||||
</div> |
|
||||
</Modal> |
|
||||
</div> |
|
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import { editDict } from "@/api/index"; |
import { |
||||
export default { |
editType |
||||
name: "addDictType", |
} from "@/api/app"; |
||||
components: {}, |
export default { |
||||
props: { |
name: "addDictType", |
||||
value: { |
components: {}, |
||||
type: Boolean, |
props: { |
||||
default: false, |
value: { |
||||
}, |
type: Boolean, |
||||
data: { |
default: false, |
||||
type: Object, |
}, |
||||
}, |
data: { |
||||
}, |
type: Object, |
||||
data() { |
}, |
||||
return { |
}, |
||||
visible: this.value, |
data() { |
||||
submitLoading: false, |
return { |
||||
form: { |
shopId:'', |
||||
title: "", |
visible: this.value, |
||||
type: "", |
submitLoading: false, |
||||
description: "", |
form: { |
||||
sortOrder: 0, |
categoryName: "", |
||||
}, |
sort: "", |
||||
formValidate: { |
shopId:'' |
||||
// 表单验证规则 |
}, |
||||
title: [{ required: true, message: "请输入", trigger: "blur" }], |
formValidate: { |
||||
type: [{ required: true, message: "请输入", trigger: "blur" }], |
// 表单验证规则 |
||||
sortOrder: [ |
categoryName: [{ |
||||
{ |
required: true, |
||||
required: true, |
message: "请输入", |
||||
type: "number", |
trigger: "blur" |
||||
message: "请输入排序值", |
}], |
||||
trigger: "blur", |
sort: [{ |
||||
}, |
required: true, |
||||
], |
message: "请输入排序值", |
||||
}, |
trigger: "blur", |
||||
}; |
}, ], |
||||
}, |
}, |
||||
methods: { |
}; |
||||
init() {}, |
}, |
||||
submit() { |
methods: { |
||||
this.$refs.form.validate((valid) => { |
init(v) { |
||||
if (valid) { |
this.form.shopId = v |
||||
// 添加 |
}, |
||||
this.submitLoading = true; |
submit() { |
||||
editDict(this.form).then((res) => { |
this.$refs.form.validate((valid) => { |
||||
this.submitLoading = false; |
if (valid) { |
||||
if (res.success) { |
// 添加 |
||||
this.$Message.success("操作成功"); |
this.submitLoading = true; |
||||
this.$emit("on-submit", this.form); |
editType(this.form).then((res) => { |
||||
this.visible = false; |
this.submitLoading = false; |
||||
} |
if (res.success) { |
||||
}); |
this.$Message.success("操作成功"); |
||||
} |
this.$emit("on-submit", this.form); |
||||
}); |
this.visible = false; |
||||
}, |
} |
||||
setCurrentValue(value) { |
}); |
||||
if (value === this.visible) { |
} |
||||
return; |
}); |
||||
} |
}, |
||||
// 清空数据 |
setCurrentValue(value) { |
||||
this.$refs.form.resetFields(); |
if (value === this.visible) { |
||||
// 回显 转换null为"" |
return; |
||||
let v = this.data; |
} |
||||
for (let attr in v) { |
// 清空数据 |
||||
if (v[attr] == null) { |
this.$refs.form.resetFields(); |
||||
v[attr] = ""; |
// 回显 转换null为"" |
||||
} |
let v = this.data; |
||||
} |
for (let attr in v) { |
||||
let str = JSON.stringify(v); |
if (v[attr] == null) { |
||||
let data = JSON.parse(str); |
v[attr] = ""; |
||||
this.form = data; |
} |
||||
this.visible = value; |
} |
||||
}, |
let str = JSON.stringify(v); |
||||
}, |
let data = JSON.parse(str); |
||||
watch: { |
this.form = data; |
||||
value(val) { |
this.visible = value; |
||||
this.setCurrentValue(val); |
}, |
||||
}, |
}, |
||||
visible(value) { |
watch: { |
||||
this.$emit("input", value); |
value(val) { |
||||
}, |
this.setCurrentValue(val); |
||||
}, |
}, |
||||
mounted() { |
visible(value) { |
||||
this.init(); |
this.$emit("input", value); |
||||
}, |
}, |
||||
}; |
}, |
||||
|
mounted() { |
||||
|
this.init(); |
||||
|
}, |
||||
|
}; |
||||
</script> |
</script> |
||||
|
|
||||
<style lang="less"> |
<style lang="less"> |
||||
@import "@/styles/drawer-common.less"; |
@import "@/styles/drawer-common.less"; |
||||
</style> |
</style> |
||||
|
|
||||
File diff suppressed because it is too large
Loading…
Reference in new issue