<template>
|
<div class="add-container" :loading="loading">
|
<Card v-loading="loading">
|
<div class="header-title" style="width: 100%;">
|
<div class="header-title-left">
|
<img src="@/assets/public/headercard.png" />
|
<div>所属项目组</div>
|
</div>
|
<div class="header-title-right">
|
<el-button @click="showChoose = true" class="el-icon-circle-plus-outline" type="primary">
|
选择项目组</el-button>
|
</div>
|
</div>
|
<Table :height="null" :data="tableData" :queryForm="queryForm" :total="0">
|
<template>
|
<el-table-column prop="teamName" label="项目组名称" />
|
<el-table-column prop="personCharge" label="项目负责人" />
|
<el-table-column prop="staffName" label="项目组成员" />
|
<el-table-column prop="createTime" label="创建时间" />
|
</template>
|
</Table>
|
<el-form ref="form" :model="form" :rules="rules" inline label-position="top" style="margin-top: 38px">
|
<div class="header-title" style="width: 100%;">
|
<div class="header-title-left">
|
<img src="@/assets/public/headercard.png" />
|
<div>报告编号</div>
|
</div>
|
</div>
|
<el-form-item prop="reportCode" style="margin-top: 38px">
|
<el-input v-model="form.reportCode" style="width: 100%;" placeholder="请输入报告编号" />
|
</el-form-item>
|
|
<div class="header-title" style="width: 100%;">
|
<div class="header-title-left">
|
<img src="@/assets/public/headercard.png" />
|
<div>报告名称</div>
|
</div>
|
</div>
|
<el-form-item prop="reportName" style="margin-top: 38px">
|
<el-input v-model="form.reportName" style="width: 100%;" placeholder="请输入报告名称" />
|
</el-form-item>
|
|
<div class="header-title" style="width: 100%;">
|
<div class="header-title-left">
|
<img src="@/assets/public/headercard.png" />
|
<div>报告正文</div>
|
</div>
|
</div>
|
<el-form-item prop="reportText" style="margin-top: 38px">
|
<ai-editor ref="materialEditor" :value="form.reportText" style="width: 100%;"
|
placeholder="请输入报告正文" />
|
</el-form-item>
|
<div class="header-title" style="width: 100%;">
|
<div class="header-title-left">
|
<img src="@/assets/public/headercard.png" />
|
<div class="noRequire">附件</div>
|
</div>
|
</div>
|
<el-form-item prop="name" style="margin-top: 38px">
|
<el-upload action="https://jsonplaceholder.typicode.com/posts/" :file-list="fileList">
|
<el-button size="small" type="primary">点击上传</el-button>
|
</el-upload>
|
</el-form-item>
|
|
<div class="end-btn" style="margin-top: 38px">
|
<el-button type="primary" @click="submit" :loading="loading">发送</el-button>
|
<el-button type="default" @click="save" :loading="loading">存草稿</el-button>
|
</div>
|
</el-form>
|
</Card>
|
<chooseProject @submit="getProjectData" :show="showChoose" @close="showChoose = false"></chooseProject>
|
</div>
|
</template>
|
|
<script>
|
import { Card } from 'element-ui';
|
import AiEditor from '@/components/AiEditor'
|
import chooseProject from '@/components/chooseProject'
|
import { addData, getDetail, editData } from './service'
|
|
export default {
|
components: {
|
AiEditor,
|
chooseProject
|
},
|
data() {
|
return {
|
loading: false,
|
form: {
|
reportCode: "",
|
reportName: "",
|
reportText: ""
|
},
|
tableData: [],
|
fileList: [], // 附件列表
|
showChoose: false,
|
rules: {
|
reportCode: [
|
{ required: true, message: '请输入报告编号', trigger: 'blur' }
|
],
|
reportName: [
|
{ required: true, message: '请输入报告名称', trigger: 'blur' }
|
],
|
},
|
queryForm: {}
|
}
|
},
|
|
mounted() {
|
if (this.$route.query.id) {
|
this.getDetail()
|
}
|
},
|
|
methods: {
|
getDetail() {
|
getDetail(this.$route.query.id).then(res => {
|
this.form = res
|
this.tableData = [{ ...res.projectTeam, staffName: res.staffNames }]
|
this.fileList = res.fileList
|
})
|
},
|
getProjectData(data) {
|
this.tableData = [data]
|
this.$forceUpdate()
|
this.showChoose = false
|
},
|
submit() {
|
if (this.tableData.length == 0) {
|
this.$message.error('请选择项目组')
|
return
|
}
|
|
this.$refs.form.validate((valid) => {
|
if (this.$refs.materialEditor.getContent() == '<p></p>') {
|
this.$message.error('请输入报告正文')
|
return
|
}
|
let data = {
|
...this.form,
|
reportType: 2,
|
status: 1,
|
reportText: this.$refs.materialEditor.getContent(),
|
teamId: this.tableData[0].id
|
}
|
if (valid) {
|
this.loading = true
|
if (this.$route.query.id) {
|
editData({ ...data, id: this.$route.query.id }).then(res => {
|
if (res.code === 200) {
|
this.$message.success('修改成功')
|
this.$router.back()
|
} else {
|
this.$message.error(res.message)
|
}
|
})
|
} else {
|
addData({ ...data }).then(res => {
|
if (res.code === 200) {
|
this.$message.success('发布成功')
|
this.$router.back()
|
} else {
|
this.$message.error(res.message)
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
}
|
})
|
},
|
save() {
|
this.$refs.form.validate((valid) => {
|
let data = {
|
...this.form,
|
reportType: 2,
|
status: -1,
|
reportText: this.$refs.materialEditor.getContent(),
|
teamId: this.tableData[0].id
|
}
|
|
delete data.id
|
|
if (valid) {
|
this.loading = true
|
addData({ ...data }).then(res => {
|
if (res.code === 200) {
|
this.$message.success('提交成功')
|
this.$router.back()
|
} else {
|
this.$message.error(res.message)
|
}
|
}).finally(() => {
|
this.loading = false
|
})
|
}
|
})
|
},
|
},
|
}
|
</script>
|
|
<style lang="less" scoped>
|
.header-title {
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
margin-bottom: 20px;
|
gap: 13px;
|
|
.header-title-left {
|
display: flex;
|
align-items: center;
|
gap: 13px;
|
margin-top: 38px;
|
|
img {
|
width: 12px;
|
height: 19px;
|
}
|
|
div {
|
flex-shrink: 0;
|
font-weight: bold;
|
font-size: 18px;
|
color: #222222;
|
line-height: 27px;
|
font-family: "Source Han Sans CN Bold Bold";
|
|
&:before {
|
content: "*";
|
color: #f56c6c;
|
margin-right: 4px;
|
}
|
}
|
|
.noRequire:before {
|
content: unset;
|
}
|
|
span {
|
flex-shrink: 0;
|
font-weight: bold;
|
font-size: 18px;
|
color: #222222;
|
line-height: 27px;
|
font-family: "Source Han Sans CN Bold Bold";
|
}
|
}
|
|
.header-title-left :first-child {
|
margin-top: 0;
|
}
|
}
|
|
.header-title:first-child {
|
.header-title-left {
|
margin-top: 0;
|
}
|
}
|
|
.end-btn {
|
display: flex;
|
align-items: center;
|
gap: 10px;
|
|
button {
|
width: 180px;
|
height: 36px;
|
}
|
}
|
</style>
|
