88 lines
2.3 KiB
Vue
88 lines
2.3 KiB
Vue
|
<template>
|
||
|
<el-dialog
|
||
|
title="创建留言板"
|
||
|
:visible.sync="dialogVisible"
|
||
|
width="30%"
|
||
|
:before-close="handleClose"
|
||
|
>
|
||
|
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||
|
<el-form-item label="留言板名称:" prop="title">
|
||
|
<el-input v-model="form.title" style="width: 200px;" />
|
||
|
</el-form-item>
|
||
|
<el-form-item label="归属项目:" prop="project">
|
||
|
<el-select v-model="form.project" placeholder="请选择">
|
||
|
<el-option
|
||
|
v-for="item in projectOptionList"
|
||
|
:key="item.value"
|
||
|
:label="item.label"
|
||
|
:value="item.value"
|
||
|
/>
|
||
|
</el-select>
|
||
|
</el-form-item>
|
||
|
</el-form>
|
||
|
<span slot="footer" class="dialog-footer">
|
||
|
<el-button @click="handleClose">取 消</el-button>
|
||
|
<el-button type="primary" @click="commit">确 定</el-button>
|
||
|
</span>
|
||
|
</el-dialog>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import { createPost } from '@/api/learn';
|
||
|
export default {
|
||
|
name: 'Create',
|
||
|
props:{
|
||
|
projectOptionList:{
|
||
|
type: Array,
|
||
|
default() {
|
||
|
return [];
|
||
|
}
|
||
|
}
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
dialogVisible: false,
|
||
|
form:{
|
||
|
title: '',
|
||
|
project: ''
|
||
|
},
|
||
|
rules: {
|
||
|
title: [
|
||
|
{ required: true, message: '请填写留言板名称', trigger: 'blur' }
|
||
|
],
|
||
|
project: [
|
||
|
{ required: true, message: '请选择归属项目', trigger: 'change' }
|
||
|
]
|
||
|
}
|
||
|
};
|
||
|
},
|
||
|
methods: {
|
||
|
handleClose() {
|
||
|
this.$refs.form.resetFields();
|
||
|
this.dialogVisible = false;
|
||
|
},
|
||
|
doShow() {
|
||
|
this.dialogVisible = true;
|
||
|
},
|
||
|
commit() {
|
||
|
this.$refs['form'].validate((valid) => {
|
||
|
if (valid) {
|
||
|
createPost(this.form).then(resp => {
|
||
|
this.$emit('reloadTable');
|
||
|
this.handleClose();
|
||
|
}).catch(() => {
|
||
|
this.$message.error('创建留言板失败!');
|
||
|
this.handleClose();
|
||
|
});
|
||
|
}
|
||
|
});
|
||
|
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
</script>
|
||
|
|
||
|
<style scoped>
|
||
|
|
||
|
</style>
|