| | |
| | | <template> |
| | | <el-dialog :visible.sync="visible" width="80%" @close="handleClose"> |
| | | <el-dialog :visible.sync="visible" width="80%" @open="handleOpen" @close="handleClose"> |
| | | <el-card class="top-card"> |
| | | <el-row :gutter="24" class="top-info-row"> |
| | | <el-col :span="8" class="info-col"> |
| | | <div class="info-item"> |
| | | <span class="label">菌种来源:</span>{{ detail.source }} |
| | | <span class="label">菌种来源:</span>{{ detail.strainSource }} |
| | | </div> |
| | | <div class="info-item"> |
| | | <span class="label">鉴别菌株编号:</span>{{ detail.strainNo }} |
| | | <span class="label">鉴别菌株编号:</span>{{ detail.identifyingStrainCode }} |
| | | </div> |
| | | <div class="info-item"> |
| | | <span class="label">鉴别菌株名称:</span>{{ detail.strainName }} |
| | | <span class="label">鉴别菌株名称:</span>{{ detail.identifyingStrainName }} |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="8" class="info-col"> |
| | | <div class="info-item"> |
| | | <span class="label">验证实验编号:</span>{{ detail.verifyNo }} |
| | | <span class="label">验证实验编号:</span>{{ detail.validationExperimentCode }} |
| | | </div> |
| | | <div class="info-item"> |
| | | <span class="label">实验时间:</span>{{ detail.experimentTime }} |
| | |
| | | </div> |
| | | <div class="info-item signature-item"> |
| | | <div class="signature-area"> |
| | | <img v-if="detail.signature" :src="detail.signature" alt="签字" /> |
| | | <img v-if="detail.handleSignature" :src="detail.handleSignature" alt="签字" /> |
| | | <span v-else class="waiting-text">暂无签名</span> |
| | | </div> |
| | | </div> |
| | |
| | | </el-row> |
| | | </el-card> |
| | | <div class="section-card" style="margin-top: 24px"> |
| | | <el-form label-width="100px" label-position="top"> |
| | | <el-form-item label="实验结论"> |
| | | <el-input |
| | | type="textarea" |
| | | v-model="detail.conclusion" |
| | | :rows="3" |
| | | placeholder="请输入" |
| | | /> |
| | | <el-form ref="form" label-width="100px" :model="detail" label-position="top"> |
| | | <el-form-item label="实验结论" prop="result"> |
| | | <el-input type="textarea" :disabled="true" v-model="detail.result" :rows="3" placeholder="请输入" /> |
| | | </el-form-item> |
| | | <el-form-item label="批准菌株用途"> |
| | | <el-checkbox-group v-model="detail.usage"> |
| | | <el-checkbox label="传代" /> |
| | | <el-checkbox label="菌种保藏" /> |
| | | <el-checkbox label="废弃" /> |
| | | <el-form-item label="批准菌株用途" prop="purpose"> |
| | | <el-checkbox-group :disabled="true" v-model="detail.purpose"> |
| | | <el-checkbox label="1">传代</el-checkbox> |
| | | <el-checkbox label="2">菌种保藏</el-checkbox> |
| | | <el-checkbox label="3">废弃</el-checkbox> |
| | | </el-checkbox-group> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | |
| | | <div class="section-card" style="margin-top: 12px"> |
| | | <el-table |
| | | :data="tableData" |
| | | border |
| | | style="width: 100%" |
| | | :row-class-name="getRowClassName" |
| | | > |
| | | <el-table-column prop="condition" label="菌种培养工艺条件" /> |
| | | <el-table :data="tableData" border style="width: 100%" :row-class-name="getRowClassName"> |
| | | <el-table-column prop="conditions" label="菌种培养工艺条件" /> |
| | | <el-table-column prop="record" label="菌种培养工艺实况记录" /> |
| | | <el-table-column prop="process" label="菌种培养标准工艺" /> |
| | | <el-table-column prop="workmanship" label="菌种培养标准工艺" /> |
| | | <el-table-column label="操作" width="120"> |
| | | <template #default="{ row }"> |
| | | <el-button type="text" @click="handleEdit(row)">详情</el-button> |
| | |
| | | |
| | | <script> |
| | | import DetailConditionDialog from "./DetailConditionDialog.vue"; |
| | | import { detail } from "./service.js"; |
| | | export default { |
| | | name: "DetailConditionDialog", |
| | | components: { DetailConditionDialog }, |
| | |
| | | type: Object, |
| | | default: () => ({ condition: "", record: "", process: "" }), |
| | | }, |
| | | value: { |
| | | type: Object, |
| | | default: () => ({}) |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | | detail: { |
| | | source: "内容的内容内容内容", |
| | | strainNo: "3411234", |
| | | strainName: "名称名称名称", |
| | | verifyNo: "34133214", |
| | | experimentTime: "2025-1-23 11:10:28", |
| | | signature: "", // 签名图片url |
| | | conclusion: "", |
| | | usage: [], |
| | | strainSource: '', |
| | | identifyingStrainCode: '', |
| | | identifyingStrainName: '', |
| | | validationExperimentCode: '', |
| | | experimentTime: '', |
| | | handleSignature: '', // 签名图片url |
| | | result: '', |
| | | purpose: [] |
| | | }, |
| | | activeTab: "condition", |
| | | activeTab: "conditions", |
| | | initialTableData: [ |
| | | { |
| | | condition: "平板培养基", |
| | | record: "文字内容文字内容文字内容文字内容文字内容文字内容", |
| | | process: "文字内容文字内容文字内容文字内容文字内容文字内容", |
| | | }, |
| | | { condition: "培养温度", record: "", process: "" }, |
| | | { condition: "培养时间", record: "", process: "" }, |
| | | { condition: "摇瓶培养基", record: "", process: "" }, |
| | | { condition: "接种量", record: "", process: "" }, |
| | | { condition: "培养时间", record: "", process: "" }, |
| | | { condition: "发酵时间", record: "", process: "" }, |
| | | { condition: "检测数据及结果", record: "", process: "" }, |
| | | { conditions: '平板培养基', record: '', workmanship: '' }, |
| | | { conditions: '培养温度', record: '', workmanship: '' }, |
| | | { conditions: '培养时间', record: '', workmanship: '' }, |
| | | { conditions: '摇瓶培养基', record: '', workmanship: '' }, |
| | | { conditions: '接种量', record: '', workmanship: '' }, |
| | | { conditions: '培养时间', record: '', workmanship: '' }, |
| | | { conditions: '发酵时间', record: '', workmanship: '' }, |
| | | { conditions: '检测数据及结果', record: '', workmanship: '' } |
| | | ], |
| | | tableData: [ |
| | | { |
| | | condition: "平板培养基", |
| | | record: "文字内容文字内容文字内容文字内容文字内容文字内容", |
| | | process: "文字内容文字内容文字内容文字内容文字内容文字内容", |
| | | }, |
| | | { condition: "培养温度", record: "", process: "" }, |
| | | { condition: "培养时间", record: "", process: "" }, |
| | | { condition: "摇瓶培养基", record: "", process: "" }, |
| | | { condition: "接种量", record: "", process: "" }, |
| | | { condition: "培养时间", record: "", process: "" }, |
| | | { condition: "发酵时间", record: "", process: "" }, |
| | | { condition: "检测数据及结果", record: "", process: "" }, |
| | | { conditions: '平板培养基', record: '', workmanship: '' }, |
| | | { conditions: '培养温度', record: '', workmanship: '' }, |
| | | { conditions: '培养时间', record: '', workmanship: '' }, |
| | | { conditions: '摇瓶培养基', record: '', workmanship: '' }, |
| | | { conditions: '接种量', record: '', workmanship: '' }, |
| | | { conditions: '培养时间', record: '', workmanship: '' }, |
| | | { conditions: '发酵时间', record: '', workmanship: '' }, |
| | | { conditions: '检测数据及结果', record: '', workmanship: '' } |
| | | ], |
| | | dialogVisible: false, |
| | | dialogIsEdit: false, |
| | |
| | | }; |
| | | }, |
| | | methods: { |
| | | handleOpen() { |
| | | if (this.value.id) { |
| | | detail({ id: this.value.id }).then(res => { |
| | | this.detail = { |
| | | ...res, |
| | | handleSignature: res.handleSignature || '', // 处理签名为空的情况 |
| | | purpose: res.purpose.split(',') || [] // 处理 purpose 为空的情况 |
| | | } |
| | | this.tableData = res.list || [] |
| | | }) |
| | | } |
| | | }, |
| | | handleClose() { |
| | | this.$emit("update:visible", false); |
| | | }, |
| | | handleEdit(row) { |
| | | const idx = this.tableData.indexOf(row); |
| | | this.dialogVisible = true; |
| | | this.dialogIsEdit = true; |
| | | this.dialogIsFixed = idx < this.initialTableData.length; |
| | | this.dialogValue = { ...row }; |
| | | this.dialogIndex = idx; |
| | | |
| | | this.$emit("viewDetail", row); |
| | | }, |
| | | |
| | | |
| | | handleSave() { |
| | | this.dialogVisible = true; |
| | | this.dialogIsEdit = false; |
| | |
| | | .el-dialog__body { |
| | | padding-bottom: 0; |
| | | } |
| | | |
| | | .top-card { |
| | | margin-bottom: 0; |
| | | background: rgba(239, 239, 239, 1); |
| | |
| | | padding: 24px; |
| | | padding-bottom: 0; |
| | | gap: 24px; |
| | | |
| | | .el-button { |
| | | width: 150px; |
| | | } |