| | |
| | | <template> |
| | | <div> |
| | | <Card> |
| | | <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" v-if="!isReadOnly"> |
| | | <el-button @click="showChoose = true" class="el-icon-circle-plus-outline" type="primary"> |
| | | 选择项目组</el-button> |
| | | </div> |
| | | </div> |
| | | <Table :height="null" :queryForm="queryForm" :total="0" :data="projectData" style="margin-bottom: 20px"> |
| | | <template> |
| | | <el-table-column prop="teamName" label="项目组名称" /> |
| | | <el-table-column prop="personCharge" label="项目负责人" /> |
| | | <el-table-column prop="staff" label="项目组成员" /> |
| | | <el-table-column prop="createTime" label="创建时间" /> |
| | | </template> |
| | | </Table> |
| | | <el-form ref="form" :model="form" :rules="rules" inline label-position="top"> |
| | | <div class="header-title" style="width: 100%"> |
| | | <div class="header-title-left"> |
| | |
| | | <el-row v-if="activeTab === 'strain'" :gutter="10"> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8"> |
| | | <el-form-item label="菌株编号" prop="strainCode"> |
| | | <el-input :disabled="!!$route.query.isDetail" v-model="form.strainCode" class="w-380" |
| | | <el-input :disabled="isReadOnly" v-model="form.strainCode" class="w-380" |
| | | placeholder="请输入菌株编号" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8"> |
| | | <el-form-item label="菌株名称" prop="strainName"> |
| | | <el-input :disabled="!!$route.query.isDetail" v-model="form.strainName" class="w-380" |
| | | <el-input :disabled="isReadOnly" v-model="form.strainName" class="w-380" |
| | | placeholder="请输入菌株名称" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8"> |
| | | <el-form-item label="培养基配方" prop="formula"> |
| | | <el-input :disabled="!!$route.query.isDetail" v-model="form.formula" class="w-380" |
| | | <el-input :disabled="isReadOnly" v-model="form.formula" class="w-380" |
| | | placeholder="请输入培养基配方" /> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | <el-row v-if="activeTab === 'material'" :gutter="10"> |
| | | <el-col :span="24"> |
| | | <el-form-item label="来源物资、时间及批号" prop="sourceMaterialTimeBatchNumber"> |
| | | <el-input :disabled="!!$route.query.isDetail" v-model="form.sourceMaterialTimeBatchNumber" |
| | | <el-input :disabled="isReadOnly" v-model="form.sourceMaterialTimeBatchNumber" |
| | | placeholder="请输入物资编号" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="培养基配方" prop="formula"> |
| | | <el-input :disabled="!!$route.query.isDetail" v-model="form.formula" placeholder="请输入培养基配方" /> |
| | | <el-input :disabled="isReadOnly" v-model="form.formula" placeholder="请输入培养基配方" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="分离菌落编号" prop="separateColonyNumber"> |
| | | <el-input :disabled="!!$route.query.isDetail" v-model="form.separateColonyNumber" |
| | | <el-input :disabled="isReadOnly" v-model="form.separateColonyNumber" |
| | | placeholder="请输入分离菌落编号" /> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | <el-row :gutter="10"> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6"> |
| | | <el-form-item label="培养基" prop="cultureMedium"> |
| | | <el-input :disabled="!!$route.query.isDetail" v-model="form.cultureMedium" class="w-380" |
| | | <el-input :disabled="isReadOnly" v-model="form.cultureMedium" class="w-380" |
| | | placeholder="请输入培养基" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6"> |
| | | <el-form-item label="培养温度" prop="temperature"> |
| | | <el-input :disabled="!!$route.query.isDetail" v-model="form.temperature" class="w-380" |
| | | <el-input :disabled="isReadOnly" v-model="form.temperature" class="w-380" |
| | | placeholder="请输入培养温度" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6"> |
| | | <el-form-item label="需氧类型" prop="aerobicType"> |
| | | <el-select :disabled="!!$route.query.isDetail" v-model="form.aerobicType" class="w-380" |
| | | <el-select :disabled="isReadOnly" v-model="form.aerobicType" class="w-380" |
| | | placeholder="请选择需氧类型"> |
| | | <el-option label="专性需氧" :value="1"></el-option> |
| | | <el-option label="专性厌氧" :value="2"></el-option> |
| | |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6"> |
| | | <el-form-item label="培养时间" prop="cultureTime"> |
| | | <el-input :disabled="!!$route.query.isDetail" v-model="form.cultureTime" class="w-380" |
| | | <el-input :disabled="isReadOnly" v-model="form.cultureTime" class="w-380" |
| | | placeholder="请输入培养时间" /> |
| | | <!-- <el-date-picker v-model="form.cultureTime" class="w-380" placeholder="请选择培养时间" type="date" value-format="yyyy-MM-dd" /> --> |
| | | </el-form-item> |
| | |
| | | <div>一、培养皿分离记录</div> |
| | | </div> |
| | | <div class="header-title-right"> |
| | | <el-button @click="handleAddSeparation" v-if="!$route.query.isDetail && [1, 4].includes(roleType)" |
| | | <el-button @click="handleAddSeparation" v-if="canEditRecord" |
| | | class="el-icon-circle-plus-outline" type="primary"> |
| | | 新增培养皿分离记录</el-button> |
| | | </div> |
| | |
| | | <Table ref="separationTable" :data="separationTableData" :height="null" |
| | | :total="form.separationOfCultureDishesList.length" :queryForm="separationPagination" :type="2" |
| | | @handleCurrentChange="handleSeparationPageChange" @handleSizeChange="handleSeparationSizeChange"> |
| | | <el-table-column width="100" type="index" label="培养皿序号" /> |
| | | <el-table-column width="100" type="index" label="序号" /> |
| | | <el-table-column prop="petriDishNumber" label="培养皿编号" /> |
| | | <el-table-column prop="separateBacterialColoniesCode" label="分离菌落编号" /> |
| | | <el-table-column prop="handleSignature" label="接种操作人签字"> |
| | | <template slot-scope="scope"> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="createTime" label="操作时间" /> |
| | | <el-table-column prop="address" label="操作"> |
| | | <template slot-scope="scope" v-if="[1, 4].includes(roleType)"> |
| | | <el-table-column prop="address" label="操作" v-if="canEditRecord"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text" @click="handleEditSeparation(scope.row, scope.$index)" |
| | | v-if="!$route.query.isDetail">编辑</el-button> |
| | | v-if="canEditRecord">编辑</el-button> |
| | | <el-button type="text" @click="handleDeleteSeparation(scope.$index)" |
| | | v-if="!$route.query.isDetail">删除</el-button> |
| | | v-if="canEditRecord">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </Table> |
| | |
| | | <div>二、培养皿生物学形态观察记录</div> |
| | | </div> |
| | | <div class="header-title-right"> |
| | | <el-button @click="handleAddObservation" v-if="!$route.query.isDetail && [1, 4].includes(roleType)" |
| | | <el-button @click="handleAddObservation" v-if="canEditRecord" |
| | | class="el-icon-circle-plus-outline" type="primary"> |
| | | 新增观察记录</el-button> |
| | | </div> |
| | |
| | | <!-- <el-button type="text" @click="handleEditObservation(scope.row)" v-if="!$route.query.isDetail">编辑</el-button> --> |
| | | <el-button type="text" @click="handleEditObservation(scope.row)">形态记录</el-button> |
| | | <el-button type="text" @click="handleDeleteObservation(scope.$index)" |
| | | v-if="!$route.query.isDetail && [1, 4].includes(roleType)">删除</el-button> |
| | | v-if="canEditRecord">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </Table> |
| | |
| | | <div>三、接种斜面记录</div> |
| | | </div> |
| | | <div class="header-title-right"> |
| | | <el-button @click="handleAddInoculation" v-if="!$route.query.isDetail && [1, 4].includes(roleType)" |
| | | <el-button @click="handleAddInoculation" v-if="canEditRecord" |
| | | class="el-icon-circle-plus-outline" type="primary"> |
| | | 新增斜面记录</el-button> |
| | | </div> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="preserveTime" label="入库保藏/废弃时间" /> |
| | | <el-table-column label="操作" |
| | | v-if="[1, 3].includes(roleType) && $route.query.isDetail || ([4].includes(roleType))"> |
| | | <el-table-column label="操作" v-if="canEditRecord || canEngineerConfirm"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text" @click="handleEditInoculation(scope.row, scope.$index)" |
| | | v-if="!$route.query.isDetail && [1, 4].includes(roleType)">编辑</el-button> |
| | | v-if="canEditRecord">编辑</el-button> |
| | | <el-button type="text" @click="handleConfirmStorageClick(scope.row, scope.$index)" |
| | | v-if="$route.query.isDetail && [3].includes(roleType) && !scope.row.preserveSignature">确认入库</el-button> |
| | | v-if="canEngineerConfirm && !scope.row.preserveSignature">确认入库</el-button> |
| | | <el-button type="text" @click="handleDeleteInoculation(scope.$index)" |
| | | v-if="!scope.row.preserveSignature && [4].includes(roleType)">删除</el-button> |
| | | v-if="canEditRecord && !scope.row.preserveSignature">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </Table> |
| | |
| | | <div>四、菌种保藏记录</div> |
| | | </div> |
| | | <div class="header-title-right"> |
| | | <el-button @click="handleAddPreserve" v-if="!$route.query.isDetail && [1, 4].includes(roleType)" |
| | | <el-button @click="handleAddPreserve" v-if="canEditRecord" |
| | | class="el-icon-circle-plus-outline" type="primary"> |
| | | 新增菌种保藏记录</el-button> |
| | | </div> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="preserveTime" label="保藏时间" /> |
| | | <el-table-column label="操作" |
| | | v-if="[1, 3].includes(roleType) && $route.query.isDetail || ([4].includes(roleType))"> |
| | | <el-table-column label="操作" v-if="canEditRecord || canEngineerConfirm"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text" @click="handleEditPreserve(scope.row, scope.$index)" |
| | | v-if="!$route.query.isDetail && [1, 4].includes(roleType)">编辑</el-button> |
| | | v-if="canEditRecord">编辑</el-button> |
| | | <el-button type="text" @click="handleConfirmPreserve(scope.row, scope.$index)" |
| | | v-if="$route.query.isDetail && [3].includes(roleType) && !scope.row.preserveSignature">确认入库</el-button> |
| | | v-if="canEngineerConfirm && !scope.row.preserveSignature">确认入库</el-button> |
| | | <el-button type="text" @click="handleDeletePreserve(scope.$index)" |
| | | v-if="!scope.row.preserveSignature && [4].includes(roleType)">删除</el-button> |
| | | v-if="canEditRecord && !scope.row.preserveSignature">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </Table> |
| | | <!-- 弹窗组件 --> |
| | | <SeparationRecordDialog :visible.sync="showSeparationDialog" :editData="editSeparationData" |
| | | @confirm="handleSeparationConfirm" @close="resetSeparationEdit" /> |
| | | <SlantRecordDialog :visible.sync="showObservationDialog" :editData="editObservationData" |
| | | <SlantRecordDialog :visible.sync="showObservationDialog" :editData="editObservationData" :read-only="isReadOnly" |
| | | @ok="handleObservationConfirm" /> |
| | | <InoculationSlopeRecordDialog :visible.sync="showInoculationDialog" :editData="editInoculationData" |
| | | @save="handleInoculationConfirm" /> |
| | |
| | | @confirm="handleConfirmStorage" /> |
| | | <ConfirmPreserveDialog :visible.sync="showConfirmPreserveDialog" :editData="editPreserveData" |
| | | @confirm="handleConfirmPreserveSubmit" /> |
| | | <div class="end-btn" style="margin-top: 20px;" |
| | | v-if="($route.query.isDetail && [4, 3].includes(roleType)) || !$route.query.isDetail && [1, 3, 4].includes(roleType)"> |
| | | <div class="end-btn" style="margin-top: 20px;" v-if="canEditRecord"> |
| | | <el-button type="primary" v-if="[1, 4].includes(roleType)" @click="handleSubmit(1)">提交</el-button> |
| | | <el-button v-if="[1, 4].includes(roleType)" type="primary" @click="handleSubmit(3)">同步给保藏人</el-button> |
| | | <el-button v-if="!$route.query.isDetail && roleType != 1" type="default" @click="handleSubmit(2)">存草稿</el-button> |
| | | </div> |
| | | </el-form> |
| | | </Card> |
| | | |
| | | <chooseProject v-if="!isReadOnly" @submit="getProjectData" :show="showChoose" @close="showChoose = false"></chooseProject> |
| | | </div> |
| | | </template> |
| | | <script> |
| | |
| | | import ConfirmPreserveDialog from "./confirm-preserve-dialog.vue"; |
| | | import { getFullUrl } from "@/utils/utils"; |
| | | import { add, detail, edit, vaccinationSlopesConfirm, culturePreservationsConfirm } from './service' |
| | | import ChooseProject from "@/components/chooseProject/index.vue"; |
| | | export default { |
| | | components: { |
| | | ChooseProject, |
| | | AiEditor, |
| | | SeparationRecordDialog, |
| | | SlantRecordDialog, |
| | |
| | | ConfirmPreserveDialog, |
| | | |
| | | }, |
| | | name: "AddBreedingRecord", |
| | | name: "BreedingRecordAdd", |
| | | data() { |
| | | return { |
| | | cacheForm: null, |
| | | form: { |
| | | id: '', // 主键 |
| | | strainCode: '', // 菌株编号 |
| | |
| | | separateColonyNumber: '', // 分离菌落编号 |
| | | sourceMaterialTimeBatchNumber: '', // 来源物资存值批号 |
| | | // 下面是 array 类型字段 |
| | | culturePreservations: [], |
| | | observationOfPetriDishes: [], |
| | | separationOfCultureDishesList: [], |
| | | vaccinationSlopes: [], |
| | |
| | | materialCode: '', |
| | | materialName: '', |
| | | materialDescription: '', |
| | | projectId: '', |
| | | planName: '', |
| | | planCode: '', |
| | | stage: '', |
| | |
| | | radio1: 1, |
| | | status: "1", |
| | | remark: "", |
| | | projectData: [], // 存储选中的项目组数据 |
| | | queryForm: {}, |
| | | showSeparationDialog: false, |
| | | showObservationDialog: false, |
| | |
| | | }; |
| | | }, |
| | | computed: { |
| | | isReadOnly() { |
| | | return Boolean(this.$route.query.isDetail) || Number(this.form.status) === 1 |
| | | }, |
| | | canEditRecord() { |
| | | return !this.isReadOnly && [1, 4].includes(this.roleType) |
| | | }, |
| | | canEngineerConfirm() { |
| | | return Boolean(this.$route.query.isDetail) |
| | | && this.roleType === 3 |
| | | && Number(this.form.status) === 2 |
| | | }, |
| | | totalInoculationCount() { |
| | | // 只统计入库(保存) |
| | | return this.form.vaccinationSlopes |
| | |
| | | return this.form.culturePreservations.slice(start, start + pageSize); |
| | | } |
| | | }, |
| | | mounted() { |
| | | if (this.$route.query.id) { |
| | | activated() { |
| | | if (this.cacheForm) { |
| | | this.form = this.cacheForm; |
| | | } |
| | | if (this.$route.query.id && !this.cacheForm) { |
| | | this.getDetail() |
| | | } |
| | | }, |
| | | deactivated() { |
| | | this.cacheForm = JSON.parse(JSON.stringify(this.form)); |
| | | }, |
| | | methods: { |
| | | getProjectData(data) { |
| | | this.projectData = [data]; // 将选中的项目组数据存储到数组中 |
| | | this.showChoose = false; |
| | | this.form.projectId = this.projectData[0].id; |
| | | }, |
| | | getFullUrl(url) { |
| | | if (url) { |
| | | return getFullUrl(url) |
| | | } |
| | | }, |
| | | ChangeTab(tab) { |
| | | if (!this.$route.query.id) { |
| | | this.activeTab = tab |
| | | } |
| | | if (this.isReadOnly) return |
| | | this.activeTab = tab |
| | | this.form.preserveSource = tab === 'strain' ? 1 : 2 |
| | | }, |
| | | async getDetail() { |
| | | const res = await detail({ id: this.$route.query.id }) |
| | | const response = await detail({ id: this.$route.query.id }) |
| | | const res = response.data || response |
| | | if (res.preserveSource == 1) { |
| | | this.activeTab = 'strain' |
| | | } else { |
| | | this.activeTab = 'material' |
| | | } |
| | | res.vaccinationSlopes = res.vaccinationSlopes.map(item => { |
| | | res.vaccinationSlopes = (res.vaccinationSlopes || []).map(item => { |
| | | return { |
| | | ...item, |
| | | handleType: item.handleType === 1 ? '保存' : '废弃' |
| | | } |
| | | }) |
| | | this.form = res |
| | | this.form = { |
| | | ...this.form, |
| | | ...res, |
| | | observationOfPetriDishes: res.observationOfPetriDishes || [], |
| | | separationOfCultureDishesList: res.separationOfCultureDishesList || [], |
| | | culturePreservations: res.culturePreservations || [] |
| | | } |
| | | this.projectData = res.tprojectTeamList || []; |
| | | }, |
| | | handleSeparationConfirm(data) { |
| | | if (this.editSeparationIndex !== null) { |
| | |
| | | this.editPreserveData = null; |
| | | }, |
| | | handleSubmit(type) { |
| | | if (this.activeTab === 'material') { |
| | | this.form.preserveSource = 2 |
| | | } else { |
| | | this.form.preserveSource = 1 |
| | | if (this.isReadOnly) return |
| | | if (type === 1) { |
| | | if (!this.form.id || Number(this.form.status) !== 2) { |
| | | this.$message.warning('请先同步给保藏人并完成入库确认') |
| | | return |
| | | } |
| | | const hasUnconfirmedSlope = this.form.vaccinationSlopes.some(item => !item.preserveId && !item.preserveSignature) |
| | | const hasUnconfirmedPreservation = this.form.culturePreservations.some(item => !item.preserveId && !item.preserveSignature) |
| | | if (hasUnconfirmedSlope || hasUnconfirmedPreservation) { |
| | | this.$message.warning('存在未确认的接种斜面或菌种保藏记录,不能提交') |
| | | return |
| | | } |
| | | } |
| | | |
| | | if (type == 1) { |
| | | this.form.status = 1 |
| | | } else if (type == 3) { |
| | | this.form.status = 2 |
| | | } else { |
| | | this.form.status = 3 |
| | | } |
| | | |
| | | this.$refs.form.validate(async (valid) => { |
| | | if (!valid) return; |
| | | try { |
| | | if (this.form.vaccinationSlopes.length > 0) { |
| | | let arr = this.form.vaccinationSlopes |
| | | this.form.vaccinationSlopes = arr.map(item => { |
| | | return { |
| | | ...item, |
| | | handleType: item.handleType === '保存' ? 1 : 2, |
| | | } |
| | | }) |
| | | const status = type === 1 ? 1 : type === 3 ? 2 : 3 |
| | | const payload = { |
| | | ...this.form, |
| | | preserveSource: this.activeTab === 'material' ? 2 : 1, |
| | | status, |
| | | isDraft: status === 2 ? this.form.isDraft : 0, |
| | | vaccinationSlopes: (this.form.vaccinationSlopes || []).map(item => ({ |
| | | ...item, |
| | | handleType: item.handleType === '保存' || item.handleType === 1 ? 1 : 2 |
| | | })) |
| | | } |
| | | console.log(this.form, this.form.isDraft); |
| | | |
| | | if (this.form.id && (this.form.isDraft == 0 || this.form.isDraft == null || this.form.isDraft == 1)) { |
| | | |
| | | if (this.form.status != 2) { |
| | | this.form.isDraft == 0 |
| | | } |
| | | |
| | | edit(this.form).then(res => { |
| | | if (res.code === 200) { |
| | | this.$message.success('编辑成功'); |
| | | this.$router.back(); |
| | | } else { |
| | | this.$message.error('编辑失败'); |
| | | } |
| | | }) |
| | | const request = payload.id ? edit(payload) : add(payload) |
| | | const res = await request |
| | | if (res.code === 200) { |
| | | this.$message.success(payload.id ? '编辑成功' : '添加成功') |
| | | this.cacheForm = null |
| | | this.$closeCurrentView('/strain/breeding-record') |
| | | } else { |
| | | add(this.form).then(res => { |
| | | if (res.code === 200) { |
| | | this.$message.success('添加成功'); |
| | | this.$router.back(); |
| | | } else { |
| | | this.$message.error('添加失败'); |
| | | } |
| | | }); |
| | | this.$message.error(res.msg || (payload.id ? '编辑失败' : '添加失败')) |
| | | } |
| | | |
| | | } catch (e) { |
| | | this.$message.error('添加失败'); |
| | | this.$message.error(this.form.id ? '编辑失败' : '添加失败'); |
| | | } |
| | | }); |
| | | }, |