137 lines
4.4 KiB
Vue
137 lines
4.4 KiB
Vue
<template>
|
||
<el-dialog
|
||
:title="dialog.mode === 'create' ? '创建标签' : '编辑标签'"
|
||
v-model="dialog.visible"
|
||
append-to-body
|
||
:close-on-click-modal="false"
|
||
:close-on-press-escape="false"
|
||
@open="open">
|
||
<el-form
|
||
ref="tagForm"
|
||
label-width="120px"
|
||
:model="tagForm"
|
||
:rules="rules">
|
||
<el-form-item
|
||
label="标签名称"
|
||
prop="name">
|
||
<el-input
|
||
v-model="tagForm.name"
|
||
placeholder="标签名称，不能超过5个字"></el-input>
|
||
</el-form-item>
|
||
<el-form-item
|
||
label="描述"
|
||
prop="description">
|
||
<el-input
|
||
:rows="2"
|
||
type="textarea"
|
||
v-model="tagForm.description" />
|
||
</el-form-item>
|
||
</el-form>
|
||
<div></div>
|
||
<template #footer>
|
||
<el-button @click="closeTagCreateDiaglog">取 消</el-button>
|
||
<el-button
|
||
:loading="dialog.btnLoading"
|
||
type="primary"
|
||
@click="dialog.mode === 'create' ? confirmCreate() : confirmUpate()">
|
||
确 定
|
||
</el-button>
|
||
</template>
|
||
</el-dialog>
|
||
</template>
|
||
<script>
|
||
export default {
|
||
name: 'tagCreate',
|
||
props: {
|
||
dialog: Object,
|
||
// tagForm: {
|
||
// type: Object,
|
||
// default: function () {
|
||
// return {};
|
||
// },
|
||
// },
|
||
},
|
||
inject: ['cellsysOrg'],
|
||
data() {
|
||
return {
|
||
tagForm: {
|
||
name: null,
|
||
description: null,
|
||
},
|
||
//dialog: {
|
||
// mode: "create",
|
||
// visible: false,
|
||
// btnLoading: false
|
||
//},
|
||
rules: {
|
||
name: [
|
||
{ required: true, message: '请输入标签名称', trigger: 'blur' },
|
||
{ min: 1, max: 5, message: '长度在 1 到 5 个字符', trigger: 'blur' },
|
||
],
|
||
},
|
||
};
|
||
},
|
||
created() {},
|
||
methods: {
|
||
open() {
|
||
//this.tagForm["name"] = null;
|
||
//this.tagForm["description"] = null;
|
||
},
|
||
confirmCreate() {
|
||
let { id, name, description } = this.tagForm;
|
||
this.$refs['tagForm'].validate((valid) => {
|
||
if (valid) {
|
||
this.dialog.btnLoading = true;
|
||
this.cellsysOrg
|
||
.createTag({
|
||
name: name,
|
||
description: description,
|
||
})
|
||
.then((res) => {
|
||
this.$message.success('创建标签成功！');
|
||
this.closeTagCreateDiaglog();
|
||
})
|
||
.catch((error) => {
|
||
console.error(error);
|
||
this.$message.error(error.message);
|
||
})
|
||
.finally(() => {
|
||
this.$nextTick(() => {
|
||
this.dialog.btnLoading = false;
|
||
});
|
||
});
|
||
}
|
||
});
|
||
},
|
||
confirmUpate() {
|
||
this.$refs['tagForm'].validate((valid) => {
|
||
if (valid) {
|
||
this.dialog.btnLoading = true;
|
||
this.cellsysOrg
|
||
.updateTag(this.tagForm)
|
||
.then((res) => {
|
||
this.$message.success('更新标签成功！');
|
||
this.closeTagCreateDiaglog();
|
||
})
|
||
.catch((error) => {
|
||
console.error(error);
|
||
this.$message.error(error.message);
|
||
})
|
||
.finally(() => {
|
||
this.$nextTick(() => {
|
||
this.dialog.btnLoading = false;
|
||
});
|
||
});
|
||
}
|
||
});
|
||
},
|
||
closeTagCreateDiaglog() {
|
||
this.dialog.visible = false;
|
||
this.$refs.tagForm.resetFields();
|
||
this.$emit('closeTagCreateDiaglog');
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
<style scoped></style>
|