rt-sim-training-client/src/views/messageBoard/create.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>