| | |
| | | <template> |
| | | <Card> |
| | | <template style="position: relative"> |
| | | <el-form ref="form" :model="form" :rules="rules" inline label-position="top"> |
| | | <el-form |
| | | ref="form" |
| | | :model="form" |
| | | :rules="rules" |
| | | inline |
| | | label-position="top" |
| | | > |
| | | <div v-if="!isEdit"> |
| | | <div class="header-title" style="margin-bottom: 38px"> |
| | | <div style="display: flex; align-items: center; gap: 13px"> |
| | |
| | | <img src="@/assets/public/headercard.png" /> |
| | | <div>所属实验调度</div> |
| | | </div> |
| | | <el-button @click="showScheduling = true" class="el-icon-plus" type="primary"> |
| | | 选择实验调度</el-button> |
| | | <el-button |
| | | @click="showScheduling = true" |
| | | class="el-icon-plus" |
| | | type="primary" |
| | | > |
| | | 选择实验调度</el-button |
| | | > |
| | | </div> |
| | | </div> |
| | | <!-- //换到详情弹窗 --> |
| | | <!-- <el-button @click="handleStopExperiment" type="danger"> |
| | | 申请终止实验</el-button> --> |
| | | <Table :data="groupTableData" :total="0" :height="null" class="groupTable"> |
| | | <el-table-column type="index" label="序号" width="80"></el-table-column> |
| | | <el-table-column prop="projectName" label="所属项目课题方案"></el-table-column> |
| | | <el-table-column prop="experimentCode" label="实验编号"></el-table-column> |
| | | <el-table-column prop="experimentName" label="实验名称"></el-table-column> |
| | | <el-table-column prop="experimentDate" label="通知时间"></el-table-column> |
| | | <el-table-column prop="experimentStartTime" label="实验开始时间"></el-table-column> |
| | | <el-table-column prop="experimentEndTime" label="实验结束时间"></el-table-column> |
| | | <el-table-column prop="participantsName" label="参加人员"></el-table-column> |
| | | <Table |
| | | :data="groupTableData" |
| | | :total="0" |
| | | :height="null" |
| | | class="groupTable" |
| | | > |
| | | <el-table-column |
| | | type="index" |
| | | label="序号" |
| | | width="80" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="projectName" |
| | | label="所属项目课题方案" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="experimentCode" |
| | | label="实验编号" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="experimentName" |
| | | label="实验名称" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="experimentDate" |
| | | label="通知时间" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="experimentStartTime" |
| | | label="实验开始时间" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="experimentEndTime" |
| | | label="实验结束时间" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="participantsName" |
| | | label="参加人员" |
| | | ></el-table-column> |
| | | <el-table-column prop="status" label="状态"> |
| | | <template slot-scope="scope"> |
| | | <el-tag :type="getStatusType(scope.row.status)"> |
| | |
| | | <span>组别列表</span> |
| | | </div> |
| | | |
| | | <Table :data="groupData" :total="0" :height="null" class="groupTable"> |
| | | <el-table-column type="index" label="序号" width="80"></el-table-column> |
| | | <Table |
| | | :data="groupData" |
| | | :total="0" |
| | | :height="null" |
| | | class="groupTable" |
| | | > |
| | | <el-table-column |
| | | type="index" |
| | | label="序号" |
| | | width="80" |
| | | ></el-table-column> |
| | | <el-table-column prop="groupName" label="组别"></el-table-column> |
| | | <el-table-column prop="remark" label="备注"></el-table-column> |
| | | </Table> |
| | | </template> |
| | | |
| | | <div style="padding-left: 25px;margin-top: 28px;"> |
| | | <div style="padding-left: 25px; margin-top: 28px"> |
| | | <el-form-item prop="experimentDate" label="试验日期"> |
| | | |
| | | <el-date-picker v-model="form.experimentDate" type="datetime" :disabled="isEdit" placeholder="选择日期时间"> |
| | | <el-date-picker |
| | | v-model="form.experimentDate" |
| | | type="datetime" |
| | | :disabled="isEdit" |
| | | placeholder="选择日期时间" |
| | | > |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | </div> |
| | |
| | | </div> |
| | | <div class="content-box"> |
| | | <div class="content-box-left"> |
| | | <div>项目课题方案名称:{{ groupTableData && groupTableData.length > 0 ? groupTableData[0].projectName : '' }}</div> |
| | | <div>实验编号:{{ groupTableData && groupTableData.length > 0 ? groupTableData[0].experimentCode : '' }}</div> |
| | | <div> |
| | | 项目课题方案名称:{{ |
| | | groupTableData && groupTableData.length > 0 |
| | | ? groupTableData[0].projectName |
| | | : "" |
| | | }} |
| | | </div> |
| | | <div> |
| | | 实验编号:{{ |
| | | groupTableData && groupTableData.length > 0 |
| | | ? groupTableData[0].experimentCode |
| | | : "" |
| | | }} |
| | | </div> |
| | | </div> |
| | | <div class="content-box-right"> |
| | | <div>项目课题方案编号: {{ groupTableData && groupTableData.length > 0 ? groupTableData[0].projectCode : '' }}</div> |
| | | <div>实验名称: {{ groupTableData && groupTableData.length > 0 ? groupTableData[0].experimentName : '' }}</div> |
| | | <div> |
| | | 项目课题方案编号: |
| | | {{ |
| | | groupTableData && groupTableData.length > 0 |
| | | ? groupTableData[0].projectCode |
| | | : "" |
| | | }} |
| | | </div> |
| | | <div> |
| | | 实验名称: |
| | | {{ |
| | | groupTableData && groupTableData.length > 0 |
| | | ? groupTableData[0].experimentName |
| | | : "" |
| | | }} |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <div class="add-group" v-if="!isEdit"> |
| | | <div>*</div> |
| | | <span>参加人员</span> |
| | | <el-button type="primary" class="el-icon-plus" @click="addMember" >选择参加人员</el-button> |
| | | <el-button type="primary" class="el-icon-plus" @click="addMember" |
| | | >选择参加人员</el-button |
| | | > |
| | | </div> |
| | | <div class="add-group" v-else><span>实验人员</span> </div> |
| | | <div class="add-group" v-else><span>实验人员</span></div> |
| | | <div class="member-list"> |
| | | <div class="member-list-card"> |
| | | <div class="member-item"> |
| | | <div class="member-title">实验员</div> |
| | | <div class="flex"> |
| | | <div class="member-name-box-2"> |
| | | <div v-for="i in selectedParticipants" :key="i.id" class="member-name"> |
| | | <div |
| | | v-for="i in selectedParticipants" |
| | | :key="i.id" |
| | | class="member-name" |
| | | > |
| | | {{ i.nickName }} |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="member-change"> |
| | | <div class="member-change-btn" @click="handleEditMember" v-if="!isEdit">修改</div> |
| | | <div |
| | | class="member-change-btn" |
| | | @click="handleEditMember" |
| | | v-if="!isEdit" |
| | | > |
| | | 修改 |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | |
| | | <Table :data="groupData" :total="0" :height="null" class="groupTable"> |
| | | <el-table-column type="index" label="序号" width="80"></el-table-column> |
| | | <el-table-column |
| | | type="index" |
| | | label="序号" |
| | | width="80" |
| | | ></el-table-column> |
| | | <el-table-column prop="groupName" label="组别"></el-table-column> |
| | | <el-table-column prop="remark" label="备注"></el-table-column> |
| | | </Table> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="content-box"> |
| | | <AiEditor ref="purposeEditor" :readOnly="isEdit" :value="editorContents.purpose" height="200px" |
| | | placeholder="请输入实验目的..." /> |
| | | <AiEditor |
| | | ref="purposeEditor" |
| | | :readOnly="isEdit" |
| | | :value="editorContents.purpose" |
| | | height="400px" |
| | | placeholder="请输入实验目的..." |
| | | /> |
| | | </div> |
| | | |
| | | <div class="header-title" style="margin-bottom: 38px"> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="content-box"> |
| | | <AiEditor ref="processEditor" :readOnly="isEdit" :value="editorContents.process" height="200px" |
| | | placeholder="请输入工艺参数及路线..." /> |
| | | <AiEditor |
| | | ref="processEditor" |
| | | :readOnly="isEdit" |
| | | :value="editorContents.process" |
| | | height="400px" |
| | | placeholder="请输入工艺参数及路线..." |
| | | /> |
| | | </div> |
| | | |
| | | <div class="header-title" style="margin-bottom: 38px"> |
| | |
| | | <div>三、实验材料及设备</div> |
| | | </div> |
| | | </div> |
| | | <DynamicComponent ref="materialComponent" title="实验材料" :participants="participantsData" |
| | | @submit="handleMaterialSubmit" :dataSource="form.experimentMaterial" :editable="!isEdit" /> |
| | | <DynamicComponent ref="equipmentComponent" title="实验所用设备" :participants="participantsData" |
| | | @submit="handleEquipmentSubmit" :dataSource="form.experimentDevice" :editable="!isEdit" /> |
| | | <DynamicComponent |
| | | ref="materialComponent" |
| | | title="实验材料" |
| | | :participants="participantsData" |
| | | @submit="handleMaterialSubmit" |
| | | :dataSource="form.experimentMaterial" |
| | | :editable="!isEdit" |
| | | /> |
| | | <DynamicComponent |
| | | ref="equipmentComponent" |
| | | title="实验所用设备" |
| | | :participants="participantsData" |
| | | @submit="handleEquipmentSubmit" |
| | | :dataSource="form.experimentDevice" |
| | | :editable="!isEdit" |
| | | /> |
| | | |
| | | <div class="header-title" style="margin-bottom: 38px"> |
| | | <div class="header-title-left"> |
| | | <img src="@/assets/public/headercard.png" /> |
| | | <div>四、实验操作步骤记录</div> |
| | | </div> |
| | | <el-button @click="handleAddStep" class="el-icon-plus" type="primary" v-if="!isEdit"> |
| | | 添加步骤</el-button> |
| | | <el-button |
| | | @click="handleAddStep" |
| | | class="el-icon-plus" |
| | | type="primary" |
| | | v-if="!isEdit" |
| | | > |
| | | 添加步骤</el-button |
| | | > |
| | | </div> |
| | | |
| | | <div class="step-list" v-for="(item, idx) in stepList" :key="idx"> |
| | |
| | | 步骤{{ idx + 1 }}:{{ item.stepName }} |
| | | </div> |
| | | <div class="step-list-item-control"> |
| | | <div class="controlBtn edit" @click="handleEditStep(idx)" v-if="!isEdit"> |
| | | <img src="@/assets/public/edit.png" alt="编辑" class="edit-icon" /> |
| | | <div |
| | | class="controlBtn edit" |
| | | @click="handleEditStep(idx)" |
| | | v-if="!isEdit" |
| | | > |
| | | <img |
| | | src="@/assets/public/edit.png" |
| | | alt="编辑" |
| | | class="edit-icon" |
| | | /> |
| | | 编辑 |
| | | </div> |
| | | <div class="controlBtn delete" @click="handleDeleteStep(idx)" v-if="!isEdit"> |
| | | <img src="@/assets/public/delete.png" alt="删除" class="delete-icon" /> |
| | | <div |
| | | class="controlBtn delete" |
| | | @click="handleDeleteStep(idx)" |
| | | v-if="!isEdit" |
| | | > |
| | | <img |
| | | src="@/assets/public/delete.png" |
| | | alt="删除" |
| | | class="delete-icon" |
| | | /> |
| | | 删除 |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <DynamicComponent :participants="participantsData" :ref="'stepContent' + idx" @submit="(content) => handleStepContentSubmit(idx, content)" |
| | | :dataSource="item.content" :editable="!isEdit" /> |
| | | <DynamicComponent |
| | | :participants="participantsData" |
| | | :ref="'stepContent' + idx" |
| | | @submit="(content) => handleStepContentSubmit(idx, content)" |
| | | :dataSource="item.content" |
| | | :editable="!isEdit" |
| | | /> |
| | | </div> |
| | | |
| | | <div class="add-project-footer"> |
| | | <el-button type="primary" class="save-btn" @click="handleSave">{{userRole == 3 ? '发送' : '提交'}}</el-button> |
| | | <el-button @click="handleSaveDraft" v-if="userRole == 3">存草稿</el-button> |
| | | <el-button type="primary" class="save-btn" @click="handleSave">{{ |
| | | userRole == 3 ? "发送" : "提交" |
| | | }}</el-button> |
| | | <el-button @click="handleSaveDraft" v-if="userRole == 3" |
| | | >存草稿</el-button |
| | | > |
| | | </div> |
| | | </el-form> |
| | | </template> |
| | | <SelectMemberSimple ref="selectMember" @submit="handleMemberSubmit" /> |
| | | <experimentalScheduling :show="showScheduling" @submit="handleSchedulingSubmit" @close="handleSchedulingClose" /> |
| | | <experimentalScheduling |
| | | :show="showScheduling" |
| | | @submit="handleSchedulingSubmit" |
| | | @close="handleSchedulingClose" |
| | | /> |
| | | <AddStep ref="addStepDialog" @submit="handleStepSubmit" /> |
| | | </Card> |
| | | </template> |
| | |
| | | import DynamicComponent from "@/components/DynamicComponent"; |
| | | import AddStep from "./components/add-step.vue"; |
| | | import AiEditor from "@/components/AiEditor"; |
| | | import { getGroupByDispatchId, getParticipantsByDispatchId, getDetail } from "./service"; |
| | | import moment from 'moment'; |
| | | import { add,update,updateTester } from "./service"; |
| | | import { |
| | | getGroupByDispatchId, |
| | | getParticipantsByDispatchId, |
| | | getDetail, |
| | | } from "./service"; |
| | | import moment from "moment"; |
| | | import { add, update, updateTester } from "./service"; |
| | | import { mapState } from "vuex"; |
| | | |
| | | export default { |
| | | name: "AddProject", |
| | |
| | | return { |
| | | showScheduling: false, |
| | | form: { |
| | | experimentDate: '', // 实验日期 |
| | | experimentDate: "", // 实验日期 |
| | | experimentMaterial: null, |
| | | experimentDevice: null, |
| | | experimentObjective: '', // 实验目的 |
| | | experimentParamRoute: '', // 工艺参数及路线 |
| | | experimentObjective: "", // 实验目的 |
| | | experimentParamRoute: "", // 工艺参数及路线 |
| | | experimentStepRecord: [], // 实验步骤记录 |
| | | experimentSchemePersons: [], // 实验方案人员 |
| | | dispatchId: '', // 实验调度id |
| | | dispatchId: "", // 实验调度id |
| | | status: -1, // 状态:-1=草稿箱 1=已发送 |
| | | commitTime: '', // 提交时间 |
| | | commitTime: "", // 提交时间 |
| | | }, |
| | | editorContents: { |
| | | purpose: "", |
| | |
| | | { required: true, message: "请添加实验设备", trigger: "change" }, |
| | | ], |
| | | }, |
| | | userRole:'', |
| | | userRole: "", |
| | | groupTableData: [], |
| | | groupData: [], |
| | | taskTableData: [], |
| | |
| | | // 状态映射表 |
| | | statusTypeMap: { |
| | | "-1": "info", |
| | | "1": "warning", |
| | | "2": "success", |
| | | "3": "info" |
| | | 1: "warning", |
| | | 2: "success", |
| | | 3: "info", |
| | | }, |
| | | statusTextMap: { |
| | | "-1": "草稿箱", |
| | | "1": "待确认", |
| | | "2": "已确认", |
| | | "3": "已封存" |
| | | } |
| | | 1: "待确认", |
| | | 2: "已确认", |
| | | 3: "已封存", |
| | | }, |
| | | }; |
| | | }, |
| | | async created() { |
| | | const userInfo=JSON.parse(sessionStorage.getItem('userInfo') || '{}'); |
| | | this.userRole=userInfo.roleType || ''; |
| | | const userInfo = JSON.parse(sessionStorage.getItem("userInfo") || "{}"); |
| | | this.userRole = userInfo.roleType || ""; |
| | | // 检查是否为编辑模式 |
| | | if (this.$route.query.type === 'edit' && this.$route.query.id) { |
| | | this.isEdit = this.userRole==3?false:true; |
| | | if (this.$route.query.type === "edit" && this.$route.query.id) { |
| | | this.isEdit = this.userRole == 3 ? false : true; |
| | | this.editId = this.$route.query.id; |
| | | await this.loadEditData(); |
| | | } |
| | | }, |
| | | computed: { |
| | | ...mapState(["tagList", "isFold"]), |
| | | }, |
| | | methods: { |
| | | // ===== 人员相关方法 ===== |
| | |
| | | this.$refs.selectMember.close(); |
| | | }, |
| | | handleEditMember() { |
| | | this.$refs.selectMember.open(this.participantsData, this.selectedParticipants); |
| | | this.$refs.selectMember.open( |
| | | this.participantsData, |
| | | this.selectedParticipants |
| | | ); |
| | | }, |
| | | |
| | | |
| | | // ===== 步骤相关方法 ===== |
| | | handleAddStep() { |
| | | this.$refs.addStepDialog.open(); |
| | |
| | | this.stepList.splice(index, 1); |
| | | this.$message.success("删除成功"); |
| | | }) |
| | | .catch(() => { }); |
| | | .catch(() => {}); |
| | | }, |
| | | handleStepContentSubmit(index, content) { |
| | | this.stepList[index].content = content; |
| | | }, |
| | | |
| | | |
| | | // ===== 材料设备相关方法 ===== |
| | | handleMaterialSubmit(data) { |
| | | this.form.experimentMaterial = data; |
| | |
| | | handleEquipmentSubmit(data) { |
| | | this.form.experimentDevice = data; |
| | | }, |
| | | |
| | | |
| | | // ===== 保存提交相关方法 ===== |
| | | handleSave() { |
| | | this.submitData(1); |
| | |
| | | |
| | | // 获取所有步骤内容 |
| | | const stepContentRefs = Object.keys(this.$refs) |
| | | .filter(key => key.startsWith('stepContent')) |
| | | .map(key => this.$refs[key]); |
| | | |
| | | .filter((key) => key.startsWith("stepContent")) |
| | | .map((key) => this.$refs[key]); |
| | | |
| | | stepContentRefs.forEach((ref) => { |
| | | const editor = Array.isArray(ref) ? ref[0] : ref; |
| | | if (editor && typeof editor.submit === 'function') { |
| | | if (editor && typeof editor.submit === "function") { |
| | | editor.submit(); |
| | | } |
| | | }); |
| | |
| | | // 获取富文本编辑器内容 |
| | | const experimentObjective = this.$refs.purposeEditor.getContent(); |
| | | const experimentParamRoute = this.$refs.processEditor.getContent(); |
| | | |
| | | |
| | | // 构建实验步骤记录数据 |
| | | const experimentStepRecord = this.stepList.map(step => ({ |
| | | const experimentStepRecord = this.stepList.map((step) => ({ |
| | | stepName: step.stepName, |
| | | content: step.content |
| | | content: step.content, |
| | | })); |
| | | |
| | | |
| | | // 构建提交数据 |
| | | const formData = { |
| | | ...this.form, |
| | | experimentDate: moment(this.form.experimentDate).format('YYYY-MM-DD HH:mm:ss'), |
| | | dispatchId: this.groupTableData && this.groupTableData.length > 0 ? this.groupTableData[0]?.id : '', |
| | | experimentDate: moment(this.form.experimentDate).format( |
| | | "YYYY-MM-DD HH:mm:ss" |
| | | ), |
| | | dispatchId: |
| | | this.groupTableData && this.groupTableData.length > 0 |
| | | ? this.groupTableData[0]?.id |
| | | : "", |
| | | experimentObjective, |
| | | experimentParamRoute, |
| | | experimentSchemePersons: this.selectedParticipants.map(person => ({ |
| | | userId: person.userId, |
| | | nickName: person.nickName, |
| | | roleType: person.roleType, |
| | | commitTime: moment().format('YYYY-MM-DD HH:mm:ss'), |
| | | })), |
| | | experimentSchemePersons: this.selectedParticipants.map( |
| | | (person) => ({ |
| | | userId: person.userId, |
| | | nickName: person.nickName, |
| | | roleType: person.roleType, |
| | | commitTime: moment().format("YYYY-MM-DD HH:mm:ss"), |
| | | }) |
| | | ), |
| | | status, |
| | | commitTime: moment().format('YYYY-MM-DD HH:mm:ss'), |
| | | commitTime: moment().format("YYYY-MM-DD HH:mm:ss"), |
| | | }; |
| | | |
| | | |
| | | // 统一转换JSON字符串 |
| | | formData.experimentStepRecord = JSON.stringify(experimentStepRecord); |
| | | formData.experimentDevice = JSON.stringify(this.form.experimentDevice); |
| | | formData.experimentMaterial = JSON.stringify(this.form.experimentMaterial); |
| | | |
| | | formData.experimentDevice = JSON.stringify( |
| | | this.form.experimentDevice |
| | | ); |
| | | formData.experimentMaterial = JSON.stringify( |
| | | this.form.experimentMaterial |
| | | ); |
| | | |
| | | // 编辑模式下添加id参数 |
| | | if (this.editId) { |
| | | formData.id = this.editId; |
| | | } |
| | | |
| | | |
| | | // 根据是否为编辑模式调用不同接口 |
| | | const apiCall = this.editId ? update(formData) : this.isEdit? updateTester(formData): add(formData); |
| | | |
| | | apiCall.then(res => { |
| | | if (res.code === 200) { |
| | | this.$message.success(status === 1 ? '保存成功' : '草稿保存成功'); |
| | | this.$router.go(-1); |
| | | } else { |
| | | this.$message.error(res.msg || (status === 1 ? '保存失败' : '草稿保存失败')); |
| | | } |
| | | }).catch(err => { |
| | | this.$message.error(status === 1 ? '保存失败' : '草稿保存失败'); |
| | | console.error(status === 1 ? '保存失败:' : '草稿保存失败:', err); |
| | | }); |
| | | const apiCall = (this.editId && !this.isEdit) |
| | | ? update(formData) |
| | | : this.isEdit |
| | | ? updateTester(formData) |
| | | : add(formData); |
| | | |
| | | apiCall |
| | | .then((res) => { |
| | | if (res.code === 200) { |
| | | this.$message.success( |
| | | status === 1 ? "保存成功" : "草稿保存成功" |
| | | ); |
| | | this.$router.back(); |
| | | this.$store.commit( |
| | | "SET_TAGLIST", |
| | | this.tagList.filter((item) => item.path !== this.$route.path) |
| | | ); |
| | | } else { |
| | | this.$message.error( |
| | | res.msg || (status === 1 ? "保存失败" : "草稿保存失败") |
| | | ); |
| | | } |
| | | }) |
| | | .catch((err) => { |
| | | this.$message.error(status === 1 ? "保存失败" : "草稿保存失败"); |
| | | console.error(status === 1 ? "保存失败:" : "草稿保存失败:", err); |
| | | }); |
| | | } else { |
| | | // 获取第一个错误字段并滚动到该位置 |
| | | const firstError = this.$refs.form.fields.find(field => field.validateState === 'error'); |
| | | const firstError = this.$refs.form.fields.find( |
| | | (field) => field.validateState === "error" |
| | | ); |
| | | if (firstError) { |
| | | this.$nextTick(() => { |
| | | firstError.$el.scrollIntoView({ behavior: 'smooth', block: 'center' }); |
| | | firstError.$el.scrollIntoView({ |
| | | behavior: "smooth", |
| | | block: "center", |
| | | }); |
| | | }); |
| | | } |
| | | } |
| | |
| | | this.$message.error("请选择实验调度"); |
| | | return false; |
| | | } |
| | | |
| | | // 校验实验日期 |
| | | if (!this.form.experimentDate) { |
| | | this.$message.error("请填写实验日期"); |
| | | return false; |
| | | } |
| | | |
| | | // 校验参与人员 |
| | | if (!this.selectedParticipants || this.selectedParticipants.length === 0) { |
| | | if ( |
| | | !this.selectedParticipants || |
| | | this.selectedParticipants.length === 0 |
| | | ) { |
| | | this.$message.error("请选择参与人员"); |
| | | return false; |
| | | } |
| | | |
| | | // 校验实验目的 |
| | | const purpose = this.$refs.purposeEditor.getContent(); |
| | | if (!purpose || purpose === '<p></p>' || purpose.trim() === '<p></p>') { |
| | | if (!purpose || purpose === "<p></p>" || purpose.trim() === "<p></p>") { |
| | | this.$message.error("请填写实验目的"); |
| | | return false; |
| | | } |
| | | |
| | | // 校验工艺参数及路线 |
| | | const process = this.$refs.processEditor.getContent(); |
| | | if (!process || process === '<p></p>' || process.trim() === '<p></p>') { |
| | | if (!process || process === "<p></p>" || process.trim() === "<p></p>") { |
| | | this.$message.error("请填写工艺参数及路线"); |
| | | return false; |
| | | } |
| | | |
| | | // 校验 DynamicComponent 里的表格 |
| | | function checkDynamicComponentTables(list, label) { |
| | | if (!Array.isArray(list)) return true; |
| | | for (const comp of list) { |
| | | if (comp.type === 'customTable') { |
| | | if (!comp.data || !Array.isArray(comp.data.headers) || comp.data.headers.length === 0) { |
| | | this.$message.error(`${label}中有表格未添加表头`); |
| | | return false; |
| | | } |
| | | if (!Array.isArray(comp.data.rows) || comp.data.rows.length === 0) { |
| | | this.$message.error(`${label}中有表格未添加数据`); |
| | | return false; |
| | | } |
| | | } |
| | | } |
| | | return true; |
| | | } |
| | | // 校验实验材料 |
| | | if (!this.form.experimentMaterial) { |
| | | this.$message.error("请添加实验材料"); |
| | | return false; |
| | | } |
| | | |
| | | if (!checkDynamicComponentTables.call(this, this.form.experimentMaterial, '实验材料')) { |
| | | return false; |
| | | } |
| | | // 校验实验设备 |
| | | if (!this.form.experimentDevice) { |
| | | this.$message.error("请添加实验设备"); |
| | | return false; |
| | | } |
| | | |
| | | if (!checkDynamicComponentTables.call(this, this.form.experimentDevice, '实验设备')) { |
| | | return false; |
| | | } |
| | | // 校验实验步骤记录 |
| | | if (!this.stepList || this.stepList.length === 0) { |
| | | this.$message.error("请添加实验操作步骤"); |
| | | return false; |
| | | } |
| | | |
| | | // 校验每个步骤是否都有内容 |
| | | const invalidStep = this.stepList.findIndex(step => !step.content); |
| | | if (invalidStep !== -1) { |
| | | this.$message.error(`请完善第${invalidStep + 1}个步骤的内容`); |
| | | return false; |
| | | // 校验每个步骤是否都有内容及表格 |
| | | for (let i = 0; i < this.stepList.length; i++) { |
| | | const step = this.stepList[i]; |
| | | if (!step.content) { |
| | | this.$message.error(`请完善第${i + 1}个步骤的内容`); |
| | | return false; |
| | | } |
| | | if (!checkDynamicComponentTables.call(this, step.content, `第${i + 1}个步骤`)) { |
| | | return false; |
| | | } |
| | | } |
| | | |
| | | return true; |
| | | }, |
| | | handleStopExperiment() { |
| | |
| | | handleSchedulingSubmit(data) { |
| | | this.groupTableData = data || []; |
| | | if (data && data.length > 0 && data[0].id) { |
| | | getGroupByDispatchId({ dispatchId: data[0].id }).then(res => { |
| | | if (res) { |
| | | this.groupData = res || []; |
| | | } else { |
| | | this.$message.error(res.msg || '获取组别列表失败'); |
| | | } |
| | | }).catch(err => { |
| | | this.$message.error('获取组别列表失败'); |
| | | console.error('获取组别列表失败:', err); |
| | | }); |
| | | getParticipantsByDispatchId({ dispatchId: data[0].id }).then(res => { |
| | | console.log("获取参加人员列表:", res); |
| | | if (res) { |
| | | this.participantsData = res || []; |
| | | } else { |
| | | this.$message.error(res.msg || '获取参加人员列表失败'); |
| | | } |
| | | }).catch(err => { |
| | | this.$message.error('获取参加人员列表失败'); |
| | | console.error('获取参加人员列表失败:', err); |
| | | }); |
| | | getGroupByDispatchId({ dispatchId: data[0].id }) |
| | | .then((res) => { |
| | | if (res) { |
| | | this.groupData = res || []; |
| | | } else { |
| | | this.$message.error(res.msg || "获取组别列表失败"); |
| | | } |
| | | }) |
| | | .catch((err) => { |
| | | this.$message.error("获取组别列表失败"); |
| | | console.error("获取组别列表失败:", err); |
| | | }); |
| | | getParticipantsByDispatchId({ dispatchId: data[0].id }) |
| | | .then((res) => { |
| | | if (res) { |
| | | this.participantsData = res || []; |
| | | } else { |
| | | this.$message.error(res.msg || "获取参加人员列表失败"); |
| | | } |
| | | }) |
| | | .catch((err) => { |
| | | this.$message.error("获取参加人员列表失败"); |
| | | console.error("获取参加人员列表失败:", err); |
| | | }); |
| | | } |
| | | }, |
| | | handleSchedulingClose() { |
| | |
| | | try { |
| | | const res = await getDetail({ id: this.editId }); |
| | | if (!res) { |
| | | this.$message.error('获取详情失败'); |
| | | this.$message.error("获取详情失败"); |
| | | return; |
| | | } |
| | | |
| | | console.log('编辑数据', res); |
| | | |
| | | const data = res; |
| | | |
| | | // 填充基本表单数据 |
| | |
| | | // 填充实验调度信息 |
| | | if (data.experimentDispatch?.id) { |
| | | this.form.dispatchId = data.experimentDispatch.id; |
| | | console.log('experimentStepRecord experimentStepRecord',JSON.parse(data.experimentStepRecord)) |
| | | this.groupTableData = [{ ...data.experimentDispatch }]; |
| | | |
| | | |
| | | // 获取组别信息 |
| | | try { |
| | | const groupRes = await getGroupByDispatchId({ dispatchId: data.experimentDispatch.id }); |
| | | const groupRes = await getGroupByDispatchId({ |
| | | dispatchId: data.experimentDispatch.id, |
| | | }); |
| | | this.groupData = groupRes || []; |
| | | } catch (err) { |
| | | console.error('获取组别列表失败:', err); |
| | | console.error("获取组别列表失败:", err); |
| | | } |
| | | getParticipantsByDispatchId({ dispatchId: data.experimentDispatch.id }) |
| | | .then((res) => { |
| | | if (res) { |
| | | this.participantsData = res || []; |
| | | } else { |
| | | this.$message.error(res.msg || "获取参加人员列表失败"); |
| | | } |
| | | }) |
| | | .catch((err) => { |
| | | this.$message.error("获取参加人员列表失败"); |
| | | console.error("获取参加人员列表失败:", err); |
| | | }); |
| | | } |
| | | |
| | | // 填充参与人员 |
| | | this.selectedParticipants = Array.isArray(data.experimentSchemePersons) |
| | | ? data.experimentSchemePersons |
| | | : JSON.parse(data.experimentSchemePersons || '[]'); |
| | | : JSON.parse(data.experimentSchemePersons || "[]"); |
| | | |
| | | // 填充富文本编辑器内容 |
| | | this.editorContents.purpose = data.experimentObjective || ''; |
| | | this.editorContents.process = data.experimentParamRoute || ''; |
| | | this.editorContents.purpose = data.experimentObjective || ""; |
| | | this.editorContents.process = data.experimentParamRoute || ""; |
| | | |
| | | // 填充实验材料和设备 |
| | | try { |
| | | this.form.experimentMaterial = typeof data.experimentMaterial === 'string' |
| | | ? JSON.parse(data.experimentMaterial) |
| | | : data.experimentMaterial; |
| | | this.form.experimentMaterial = |
| | | typeof data.experimentMaterial === "string" |
| | | ? JSON.parse(data.experimentMaterial) |
| | | : data.experimentMaterial; |
| | | } catch (err) { |
| | | console.error('解析实验材料数据失败:', err); |
| | | console.error("解析实验材料数据失败:", err); |
| | | this.form.experimentMaterial = []; |
| | | } |
| | | |
| | | try { |
| | | this.form.experimentDevice = typeof data.experimentDevice === 'string' |
| | | ? JSON.parse(data.experimentDevice) |
| | | : data.experimentDevice; |
| | | this.form.experimentDevice = |
| | | typeof data.experimentDevice === "string" |
| | | ? JSON.parse(data.experimentDevice) |
| | | : data.experimentDevice; |
| | | } catch (err) { |
| | | console.error('解析实验设备数据失败:', err); |
| | | console.error("解析实验设备数据失败:", err); |
| | | this.form.experimentDevice = []; |
| | | } |
| | | |
| | | // 填充实验步骤 |
| | | try { |
| | | const stepsData = typeof data.experimentStepRecord === 'string' |
| | | ? JSON.parse(data.experimentStepRecord) |
| | | : data.experimentStepRecord; |
| | | const stepsData = |
| | | typeof data.experimentStepRecord === "string" |
| | | ? JSON.parse(data.experimentStepRecord) |
| | | : data.experimentStepRecord; |
| | | |
| | | this.stepList = (stepsData || []).map(step => ({ |
| | | this.stepList = (stepsData || []).map((step) => ({ |
| | | stepName: step.stepName, |
| | | content: step.content |
| | | content: step.content, |
| | | })); |
| | | } catch (err) { |
| | | console.error('解析实验步骤数据失败:', err); |
| | | console.error("解析实验步骤数据失败:", err); |
| | | this.stepList = []; |
| | | } |
| | | |
| | |
| | | // }); |
| | | // } |
| | | }); |
| | | |
| | | } catch (error) { |
| | | this.$message.error('获取详情失败'); |
| | | console.error('获取详情失败:', error); |
| | | this.$message.error("获取详情失败"); |
| | | console.error("获取详情失败:", error); |
| | | } |
| | | }, |
| | | // 转换数据格式为ViewDynamicComponent需要的格式 |
| | | convertToViewFormat(data) { |
| | | if (!data || !Array.isArray(data)) return []; |
| | | |
| | | return data.map(item => ({ |
| | | return data.map((item) => ({ |
| | | id: item.id || Math.random().toString(36).substr(2, 9), |
| | | type: item.type, |
| | | data: item.data |
| | | data: item.data, |
| | | })); |
| | | }, |
| | | }, |
| | |
| | | } |
| | | |
| | | .groupTable { |
| | | width: 65%; |
| | | width: 100%; |
| | | padding-left: 40px; |
| | | } |
| | | |
| | | .rwuTable { |
| | | width: 85%; |
| | | width: 100%; |
| | | padding-left: 40px; |
| | | } |
| | | |
| | |
| | | border: 1px solid #dcdfe6; |
| | | |
| | | &:nth-child(1) { |
| | | background: linear-gradient(to bottom, |
| | | rgba(4, 156, 154, 0.2) 0%, |
| | | rgba(5, 242, 194, 0) 70%); |
| | | background: linear-gradient( |
| | | to bottom, |
| | | rgba(4, 156, 154, 0.2) 0%, |
| | | rgba(5, 242, 194, 0) 70% |
| | | ); |
| | | } |
| | | |
| | | &:nth-child(2) { |
| | | background: linear-gradient(to bottom, |
| | | rgba(5, 160, 193, 0.2) 0%, |
| | | rgba(5, 242, 194, 0) 70%); |
| | | background: linear-gradient( |
| | | to bottom, |
| | | rgba(5, 160, 193, 0.2) 0%, |
| | | rgba(5, 242, 194, 0) 70% |
| | | ); |
| | | } |
| | | |
| | | &:nth-child(3) { |
| | | background: linear-gradient(to bottom, |
| | | rgba(255, 77, 79, 0.2) 0%, |
| | | rgba(255, 242, 194, 0) 70%); |
| | | background: linear-gradient( |
| | | to bottom, |
| | | rgba(255, 77, 79, 0.2) 0%, |
| | | rgba(255, 242, 194, 0) 70% |
| | | ); |
| | | } |
| | | |
| | | &:nth-child(4) { |
| | | background: linear-gradient(to bottom, |
| | | rgba(250, 199, 20, 0.21) 0%, |
| | | rgba(255, 242, 194, 0) 70%); |
| | | background: linear-gradient( |
| | | to bottom, |
| | | rgba(250, 199, 20, 0.21) 0%, |
| | | rgba(255, 242, 194, 0) 70% |
| | | ); |
| | | } |
| | | |
| | | .member-item { |
| | |
| | | .content-box { |
| | | padding: 0 25px; |
| | | margin-bottom: 20px; |
| | | width: 65%; |
| | | width: 95%; |
| | | display: flex; |
| | | .content-box-left{ |
| | | .content-box-left { |
| | | flex: 1; |
| | | div{ |
| | | div { |
| | | padding: 10px 0; |
| | | } |
| | | } |
| | | .content-box-right{ |
| | | .content-box-right { |
| | | flex: 1; |
| | | div{ |
| | | div { |
| | | padding: 10px 0; |
| | | } |
| | | } |
| | | } |
| | | </style> |
| | | </style> |