董国庆
2025-05-26 f90eb2159fc4aa79d7cd28e0f30b7e82a2cea779
laboratory/src/views/chemistQa/pilotAndProduction/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" />
@@ -10,97 +10,263 @@
                    <el-button @click="showChoose = true" class="el-icon-circle-plus-outline" type="primary">
                        选择项目组</el-button>
                </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">
            <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="name" label="报告内容">
                            <el-input v-model="form.name" style="width: 100%;" placeholder="请输入报告内容" />
                        <el-form-item prop="reportTitle" label="报告标题">
                            <el-input v-model="form.reportTitle" style="width: 100%;" placeholder="请输入报告标题" />
                        </el-form-item>
                        <el-form-item prop="name" label="报告编号" style="margin-left: 100px;">
                            <el-input v-model="form.name" style="width: 100%;" placeholder="请输入报告编号" />
                        <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="name" label="制定人">
                            <el-input v-model="form.name" style="width: 100%;" placeholder="请输入制定人" />
                        <el-form-item prop="developPersonName" label="制定人">
                            <el-input v-model="form.developPersonName" style="width: 100%;" placeholder="请输入制定人" disabled />
                        </el-form-item>
                        <el-form-item prop="name" label="制定日期" style="margin-left: 100px;">
                            <el-date-picker :prefix-icon="null" v-model="form.createTime"  type="date" placeholder="请选择日期" />
                        <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>
                <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: 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>附件</div>
                        <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-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">发送</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'
export default {
    components: { AiEditor },
    components: {
        AiEditor,
        chooseProject
    },
    data() {
        return {
            loading: false,
            form: {
                planName: "",
                planCode: "",
                stage: "",
                creator: "",
                createTime: "",
                approvalComment: "",
                status: "pending",
                approver: "",
                approveTime: ""
                reportCode: "",
                reportTitle: "",
                reportText: "",
                developPerson: "",
                developPersonName: "",
                developDate: "",
                reportType: 2,
                status: 1,
                teamId: "",
                qaReportFiles: [],
                 commitPersonId: null,
            },
            tableData: [],
            fileList: [], // 附件列表
            showChoose: false,
            radio1: 1,
            rules: {},
            status: "1",
            remark: "",
            queryForm: {
            }
            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')).userId;
        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.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,
                    reportText: this.$refs.materialEditor.getContent(),
                    teamId: this.tableData[0].id,
                    status: 1, // 待审核状态
                    commitPersonId: JSON.parse(sessionStorage.getItem('userInfo')).userId
                }
                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('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 = options.file;
            const fileObj = {
                fileName: file.name,
                fileSize: file.size,
                createTime: new Date().toISOString(),
                createBy: '当前用户',
                reportType: 2,
                status: 1,
                id: Date.now().toString(),
                fileUrl: 'https://example.com/default-file-url'
            };
            this.fileList.push({
                name: file.name,
                url: fileObj.fileUrl
            });
            this.form.qaReportFiles.push(fileObj);
            this.$message.success('文件上传成功');
        },
        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>
@@ -137,6 +303,10 @@
            }
        }
        .noRequire:before {
            content: unset;
        }
        span {
            flex-shrink: 0;
            font-weight: bold;
@@ -166,7 +336,6 @@
    button {
        width: 180px;
        height: 36px;
        // background: #409EFF;
    }
}
</style>