<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: 18px">
|
<el-row :gutter="20">
|
<el-col :span="24">
|
<el-form-item prop="reportTitle" label="报告标题">
|
<el-input v-model="form.reportTitle" style="width: 100%" placeholder="请输入报告标题" />
|
</el-form-item>
|
<el-form-item prop="reportCode" label="报告编号" style="margin-left: 100px">
|
<el-input v-model="form.reportCode" style="width: 100%" placeholder="请输入报告编号" disabled />
|
</el-form-item>
|
</el-col>
|
<el-col :span="24">
|
<el-form-item prop="developPersonName" label="制定人">
|
<el-input v-model="form.developPersonName" style="width: 100%" placeholder="请输入制定人" disabled />
|
</el-form-item>
|
<el-form-item prop="developDate" label="制定日期" style="margin-left: 100px">
|
<el-date-picker :prefix-icon="null" v-model="form.developDate" type="date" disabled placeholder="请选择日期" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
|
<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: 18px">
|
<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: 18px">
|
<el-upload action="#" :file-list="fileList" :http-request="handleUpload" :before-upload="beforeUpload"
|
:on-remove="handleRemove">
|
<el-button size="small" type="primary">点击上传</el-button>
|
<div slot="tip" class="el-upload__tip">支持任意格式文件上传</div>
|
</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";
|
import { customUploadRequest, getFullUrl } from '@/utils/utils'
|
|
export default {
|
components: {
|
AiEditor,
|
chooseProject,
|
},
|
data() {
|
return {
|
loading: false,
|
form: {
|
reportCode: "",
|
reportTitle: "",
|
reportText: "",
|
developPerson: "",
|
developPersonName: "",
|
developDate: "",
|
reportType: 1,
|
status: 1,
|
teamId: "",
|
qaReportFiles: [],
|
commitPersonId: null,
|
},
|
tableData: [],
|
fileList: [], // 附件列表
|
showChoose: false,
|
rules: {
|
reportTitle: [
|
{ required: true, message: "请输入报告标题", trigger: "blur" },
|
],
|
},
|
queryForm: {},
|
};
|
},
|
|
mounted() {
|
console.log(
|
"JSON.parse(sessionStorage.getItem(",
|
JSON.parse(sessionStorage.getItem("userInfo"))
|
);
|
this.form.developPerson = JSON.parse(
|
sessionStorage.getItem("userInfo")
|
).nickName;
|
this.form.developPersonName = JSON.parse(
|
sessionStorage.getItem("userInfo")
|
).nickName;
|
this.form.commitPersonId = JSON.parse(
|
sessionStorage.getItem("userInfo")
|
).userId;
|
this.form.developDate = new Date().toISOString().split("T")[0];
|
|
if (this.$route.query.id) {
|
this.getDetail();
|
}
|
},
|
|
methods: {
|
getDetail() {
|
getDetail(this.$route.query.id).then((res) => {
|
this.form = res;
|
this.tableData = [
|
{
|
...res.projectTeamVO,
|
staffName: res.projectTeamVO.staffs
|
.map((item) => item.nickName)
|
.join(","),
|
},
|
];
|
if (res.qaReportFileList && res.qaReportFileList.length > 0) {
|
this.fileList = res.qaReportFileList.map(file => ({
|
name: file.fileName,
|
url: getFullUrl(file.fileUrl),
|
uid: file.id
|
}))
|
this.form.qaReportFiles = res.qaReportFileList
|
} else {
|
this.fileList = []
|
this.form.qaReportFiles = []
|
}
|
|
});
|
},
|
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;
|
}
|
// const prefix = apiConfig.showImgUrl;
|
|
let data = {
|
...this.form,
|
reportText: this.$refs.materialEditor.getContent(),
|
teamId: this.tableData[0].id,
|
status: 1, // 待审核状态
|
commitPersonId: JSON.parse(sessionStorage.getItem("userInfo")).userId,
|
// qaReportFiles: this.form.qaReportFiles.map((file) => {
|
// if (file.fileUrl && file.fileUrl.startsWith(prefix)) {
|
// return {
|
// ...file,
|
// fileUrl: file.fileUrl.substring(prefix.length),
|
// };
|
// }
|
// return file;
|
// }),
|
};
|
|
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);
|
}
|
})
|
.finally(() => {
|
this.loading = false;
|
});
|
} 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,
|
reportText: this.$refs.materialEditor.getContent(),
|
teamId: this.tableData[0].id,
|
status: -1, // 草稿箱状态
|
commitPersonId: JSON.parse(sessionStorage.getItem("userInfo")).userId,
|
};
|
console.log('qaReportFiles qaReportFiles', this.form.qaReportFiles)
|
// if (this.form.qaReportFiles && this.form.qaReportFiles.length > 0) {
|
// // const prefix = apiConfig.showImgUrl;
|
// console.log('0000000000000000')
|
// this.form = {
|
// ...this.form,
|
// qaReportFiles: this.form.qaReportFiles.map((file) => {
|
// if (file.fileUrl && file.fileUrl.startsWith(prefix)) {
|
// file.fileUrl = file.fileUrl.substring(prefix.length)
|
// }
|
// console.log('1111111111111', file)
|
// return file;
|
// }),
|
// };
|
// }
|
console.log("data", data);
|
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);
|
}
|
})
|
.finally(() => {
|
this.loading = false;
|
});
|
} 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;
|
});
|
}
|
}
|
});
|
},
|
// 上传前校验
|
beforeUpload(file) {
|
return true;
|
},
|
// 自定义上传处理
|
handleUpload(options) {
|
const { file, onSuccess, onError } = options;
|
|
// 使用封装的customUploadRequest方法
|
customUploadRequest({
|
file,
|
onSuccess: (res) => {
|
console.log()
|
if (res.code === 200) {
|
const fileObj = {
|
id: new Date().getTime(),
|
reportId: this.$route.query.id ? this.$route.query.id : '',
|
fileUrl: res.msg || res.data || '',
|
reportType: 2, // 可行性研究报告类型
|
fileName: file.name,
|
fileSize: file.size,
|
};
|
|
// 添加到文件列表显示
|
this.fileList.push({
|
name: file.name,
|
url: getFullUrl(fileObj.fileUrl),
|
uid: fileObj.id
|
});
|
|
// 添加到表单数据
|
this.form.qaReportFiles.push(fileObj);
|
|
this.$message.success('文件上传成功');
|
onSuccess(res);
|
} else {
|
this.$message.error(res.message || '文件上传失败');
|
onError();
|
}
|
},
|
onError: (err) => {
|
this.$message.error('文件上传失败');
|
onError(err);
|
}
|
});
|
},
|
// 删除文件
|
handleRemove(file) {
|
const index = this.fileList.findIndex(item => item.name === file.name);
|
if (index !== -1) {
|
this.fileList.splice(index, 1);
|
this.form.qaReportFiles.splice(index, 1);
|
}
|
},
|
},
|
};
|
</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>
|
