puzhibing
6 天以前 0db8c9b94a9ac655549d5eba5c2a6c92ac386c06
culture/src/views/strain-library/breeding-record/add.vue
@@ -1,6 +1,24 @@
<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">
@@ -22,19 +40,19 @@
        <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>
@@ -43,18 +61,18 @@
        <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>
@@ -68,30 +86,30 @@
        <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-option label="兼性需氧" value="3"></el-option>
                <el-option label="耐氧厌氧" value="4"></el-option>
                <el-option label="专性需氧" :value="1"></el-option>
                <el-option label="专性厌氧" :value="2"></el-option>
                <el-option label="兼性需氧" :value="3"></el-option>
                <el-option label="耐氧厌氧" :value="4"></el-option>
              </el-select>
            </el-form-item>
          </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>
@@ -103,7 +121,7 @@
            <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>
@@ -111,7 +129,8 @@
        <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">
@@ -120,12 +139,12 @@
            </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>
@@ -135,7 +154,7 @@
            <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>
@@ -150,7 +169,7 @@
              <!-- <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>
@@ -160,7 +179,7 @@
            <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>
@@ -174,7 +193,7 @@
          <el-table-column prop="handleName" label="接种操作人" />
          <el-table-column prop="handleSignature" label="接种操作人签字">
            <template slot-scope="scope">
              <el-image v-if="scope.row.handleSignature"  :preview-src-list="[getFullUrl(scope.row.handleSignature)]"
              <el-image v-if="scope.row.handleSignature" :preview-src-list="[getFullUrl(scope.row.handleSignature)]"
                style="width: 120px;height: 48px;" :src="getFullUrl(scope.row.handleSignature)" alt="操作人签字" />
            </template>
          </el-table-column>
@@ -196,15 +215,14 @@
            </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>
@@ -214,7 +232,7 @@
            <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>
@@ -240,22 +258,21 @@
            </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" />
@@ -265,14 +282,15 @@
          @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)">
          <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" type="default" @click="handleSubmit(2)">存草稿</el-button>
        <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>
@@ -283,10 +301,12 @@
import PreserveStrainRecordDialog from "./preserve-strain-record-dialog.vue";
import ConfirmStorageDialog from "./confirm-storage-dialog.vue";
import ConfirmPreserveDialog from "./confirm-preserve-dialog.vue";
import {getFullUrl} from "@/utils/utils";
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,
@@ -296,9 +316,10 @@
    ConfirmPreserveDialog,
  },
  name: "AddBreedingRecord",
  name: "BreedingRecordAdd",
  data() {
    return {
      cacheForm: null,
      form: {
        id: '', // 主键
        strainCode: '', // 菌株编号
@@ -318,7 +339,6 @@
        separateColonyNumber: '', // 分离菌落编号
        sourceMaterialTimeBatchNumber: '', // 来源物资存值批号
        // 下面是 array 类型字段
        culturePreservations: [],
        observationOfPetriDishes: [],
        separationOfCultureDishesList: [],
        vaccinationSlopes: [],
@@ -327,6 +347,7 @@
        materialCode: '',
        materialName: '',
        materialDescription: '',
        projectId: '',
        planName: '',
        planCode: '',
        stage: '',
@@ -354,6 +375,7 @@
      radio1: 1,
      status: "1",
      remark: "",
      projectData: [], // 存储选中的项目组数据
      queryForm: {},
      showSeparationDialog: false,
      showObservationDialog: false,
@@ -376,6 +398,17 @@
    };
  },
  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
@@ -407,36 +440,55 @@
      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: {
    getFullUrl(url){
      if(url){
    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) {
@@ -498,56 +550,45 @@
      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)) {
            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 ? '编辑失败' : '添加失败');
        }
      });
    },