From 0c9660562a03191d44fc779a889d3da0dc624b6d Mon Sep 17 00:00:00 2001
From: 董国庆 <364620639@qq.com>
Date: 星期五, 25 七月 2025 10:47:19 +0800
Subject: [PATCH] 修改弹窗ui和客户反馈
---
laboratory/src/views/reportLibrary/feasibilityStudy/add.vue | 284 ++++++++++++++++++++++++++++++++++++++++++++++++--------
1 files changed, 242 insertions(+), 42 deletions(-)
diff --git a/laboratory/src/views/reportLibrary/feasibilityStudy/add.vue b/laboratory/src/views/reportLibrary/feasibilityStudy/add.vue
index b33a9ad..c0bf05b 100644
--- a/laboratory/src/views/reportLibrary/feasibilityStudy/add.vue
+++ b/laboratory/src/views/reportLibrary/feasibilityStudy/add.vue
@@ -1,6 +1,6 @@
<template>
- <div>
- <Card>
+ <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" />
@@ -12,12 +12,12 @@
</div>
</div>
- <Table :height="null" :queryForm="queryForm" :total="0">
+ <Table :height="null" :data="tableData" :queryForm="queryForm" :total="0">
<template>
- <el-table-column prop="name" label="项目组名称" />
- <el-table-column prop="age" label="项目负责人" />
- <el-table-column prop="age" label="项目组成员" />
- <el-table-column prop="age" label="创建时间" />
+ <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">
@@ -27,9 +27,9 @@
<div>报告编号</div>
</div>
</div>
- <form-item prop="name" style="margin-top: 38px">
- <el-input v-model="form.name" style="width: 100%;" placeholder="请输入报告编号" />
- </form-item>
+ <el-form-item prop="reportCode" style="margin-top: 38px">
+ <el-input v-model="form.reportCode" disabled style="width: 100%;" placeholder="请输入报告编号" />
+ </el-form-item>
<div class="header-title" style="width: 100%;">
<div class="header-title-left">
@@ -37,9 +37,9 @@
<div>报告名称</div>
</div>
</div>
- <form-item prop="name" style="margin-top: 38px">
- <el-input v-model="form.name" style="width: 100%;" placeholder="请输入报告编号" />
- </form-item>
+ <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">
@@ -47,59 +47,252 @@
<div>报告正文</div>
</div>
</div>
- <form-item prop="name" style="margin-top: 38px">
- <ai-editor v-model="form.name" style="width: 100%;" placeholder="请输入报告编号" />
- </form-item>
+ <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>附件</div>
+ <div class="noRequire">附件</div>
</div>
</div>
- <form-item prop="name" style="margin-top: 38px">
- <el-upload action="https://jsonplaceholder.typicode.com/posts/" :file-list="fileList">
+ <el-form-item prop="name" style="margin-top: 38px">
+ <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>
- </form-item>
+ </el-form-item>
<div class="end-btn" style="margin-top: 38px">
- <el-button type="primary">发送</el-button>
- <el-button type="default">存草稿</el-button>
+ <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'
+import { mapState } from "vuex";
+
export default {
- components: { AiEditor },
+ components: {
+ AiEditor,
+ chooseProject
+ },
data() {
return {
+ loading: false,
form: {
- planName: "",
- planCode: "",
- stage: "",
- creator: "",
- createTime: "",
- approvalComment: "",
- status: "pending",
- approver: "",
- approveTime: ""
+ reportCode: "",
+ reportName: "",
+ reportText: "",
+ feasibilityReportFiles: [] // 添加附件数组
},
+ tableData: [],
fileList: [], // 附件列表
showChoose: false,
- radio1: 1,
- rules: {},
- status: "1",
- remark: "",
- queryForm: {
-
- }
+ rules: {
+ // reportCode: [
+ // { required: true, message: '请输入报告编号', trigger: 'blur' }
+ // ],
+ reportName: [
+ { required: true, message: '请输入报告名称', trigger: 'blur' }
+ ],
+ },
+ queryForm: {}
}
- }
+ },
+
+ mounted() {
+ if (this.$route.query.id) {
+ this.getDetail()
+ }
+ },
+ computed: {
+ ...mapState(["tagList", "isFold"]),
+ },
+
+ methods: {
+ getDetail() {
+ getDetail(this.$route.query.id).then(res => {
+ this.form = res
+ this.tableData = [{ ...res.projectTeam, staffName: res.staffNames }]
+ // 处理文件回显
+ if (res.feasibilityReportFiles && res.feasibilityReportFiles.length > 0) {
+ this.fileList = res.feasibilityReportFiles.map(file => {
+ return {
+ name: file.fileName,
+ url: getFullUrl(file.fileUrl),
+ uid: file.id
+ }
+ })
+ this.form.feasibilityReportFiles = res.feasibilityReportFiles
+ console.log('res.feasibilityReportFiles',this.form.feasibilityReportFiles)
+ } else {
+ this.fileList = []
+ this.form.feasibilityReportFiles = []
+ }
+ })
+ },
+ //获取选择项目组数据
+ getProjectData(data) {
+ this.tableData = [data]
+ this.$forceUpdate()
+ this.showChoose = false
+ },
+ // 上传前校验
+ beforeUpload(file) {
+ return true;
+ },
+ // 自定义上传处理
+ handleUpload(options) {
+ const { file, onSuccess, onError } = options;
+
+ // 使用封装的customUploadRequest方法
+ customUploadRequest({
+ file,
+ onSuccess: (res) => {
+ 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: 1, // 可行性研究报告类型
+ fileName: file.name,
+ fileSize: file.size,
+ };
+
+ // 添加到文件列表显示
+ this.fileList.push({
+ name: file.name,
+ url: getFullUrl(fileObj.fileUrl),
+ uid: fileObj.id
+ });
+
+ // 添加到表单数据
+ this.form.feasibilityReportFiles.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.feasibilityReportFiles.splice(index, 1);
+ }
+ },
+ 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: 1,
+ 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.back()
+ } else {
+ this.$message.error(res.message)
+ }
+ })
+ } else {
+ addData({ ...data }).then(res => {
+ if (res.code === 200) {
+ this.$message.success('发布成功')
+ this.back()
+ } else {
+ this.$message.error(res.message)
+ }
+ }).finally(() => {
+ this.loading = false
+ })
+ }
+
+ }
+ })
+ },
+ back() {
+ this.$router.back();
+ this.$store.commit(
+ "SET_TAGLIST",
+ this.tagList.filter((item) => item.path !== this.$route.path)
+ );
+ },
+ save() {
+ this.$refs.form.validate((valid) => {
+ let data = {
+ ...this.form,
+ reportType: 1,
+ status: -1,
+ reportText: this.$refs.materialEditor.getContent(),
+ teamId: this.tableData[0].id
+ }
+
+ delete data.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.back()
+ } else {
+ this.$message.error(res.message)
+ }
+ })
+ } else {
+ addData({ ...data }).then(res => {
+ if (res.code === 200) {
+ this.$message.success('发布成功')
+ this.back()
+ } else {
+ this.$message.error(res.message)
+ }
+ }).finally(() => {
+ this.loading = false
+ })
+ }
+ }
+ })
+ },
+ },
}
</script>
@@ -138,6 +331,13 @@
}
}
+ .noRequire:before {
+ content: unset;
+ // color: #f56c6c;
+ // margin-right: 4px;
+
+ }
+
span {
flex-shrink: 0;
font-weight: bold;
@@ -159,12 +359,12 @@
}
}
-.end-btn{
+.end-btn {
display: flex;
align-items: center;
gap: 10px;
- button{
+ button {
width: 180px;
height: 36px;
// background: #409EFF;
--
Gitblit v1.7.1