puzhibing
6 天以前 0db8c9b94a9ac655549d5eba5c2a6c92ac386c06
culture/src/views/strain-library/validation/chief-cell/confirm-detail.vue
@@ -2,23 +2,41 @@
  <Card class="confirm-detail-page">
    <el-card class="top-card">
      <el-row :gutter="24" class="top-info-row">
        <el-col :span="24" class="info-col source-col">
          <div class="info-item source-item">
            <span class="label">菌种来源:</span>
            <el-tooltip
                :content="detail.strainSource || '暂无数据'"
                placement="top"
                :disabled="!detail.strainSource || detail.strainSource.length < 30"
                popper-class="source-tooltip"
                effect="dark"
            >
              <span class="source-text">{{ detail.strainSource || '暂无数据' }}</span>
            </el-tooltip>
          </div>
        </el-col>
        <el-col :span="8" class="info-col">
          <div class="info-item"><span class="label">菌种来源:</span>{{ detail.strainSource }}</div>
          <div class="info-item"><span class="label">鉴别菌株编号:</span>{{ detail.identifyingStrainCode }}</div>
          <div class="info-item"><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.validationExperimentCode }}</div>
          <div class="info-item"><span class="label">实验时间:</span>{{ detail.experimentTime }}</div>
          <div class="info-item"><span class="label">实验时间:</span>{{ detail.experimentTime | formatDate }}</div>
          <div class="info-item"></div>
        </el-col>
        <el-col :span="8" class="info-col ">
          <div class="info-item sign-label"><span class="label">菌种实验员签字</span></div>
          <div class="info-item signature-item">
            <div class="signature-area">
              <img v-if="detail.handleSignature" :src="detail.handleSignature" alt="签字" />
              <el-image v-if="detail.handleSignature" :src="getFullUrl(detail.handleSignature)" :preview-src-list="[getFullUrl(detail.handleSignature)]" alt="签字" />
              <span v-else class="waiting-text">暂无签名</span>
            </div>
          </div>
        </el-col>
        <el-col :span="8" class="info-col">
          <div class="info-item">
            <span class="label">签字时间:</span>{{ detail.handleTime }}
          </div>
        </el-col>
      </el-row>
@@ -74,11 +92,14 @@
import EditConditionDialog from './EditConditionDialog.vue'
import DetailConditionDialog from './DetailConditionDialog.vue'
import { detail,confirm } from './service'
import { getFullUrl } from '@/utils/utils'
import moment from 'moment'
export default {
  name: 'ConfirmDetail',
  components: { EditConditionDialog, DetailConditionDialog },
  data() {
    return {
      cacheForm: null,
      detail: {
        strainSource: '',
        identifyingStrainCode: '',
@@ -127,16 +148,46 @@
      detailDialogValue: {}
    }
  },
  mounted() {
    this.getDetail()
  filters: {
    formatDate(date) {
      if(date){
        return moment(date).format('YYYY-MM-DD')
      }else{
        return ''
      }
    },
  },
  activated() {
    if (this.cacheForm) {
      this.detail = this.cacheForm;
    }
    if (this.$route.query.id && !this.cacheForm) {
      this.getDetail();
    }
  },
  deactivated() {
    this.cacheForm = JSON.parse(JSON.stringify(this.detail));
  },
  methods: {
    getFullUrl(url) {
      if (url) {
        return getFullUrl(url)
      }
      return ''
    },
    getDetail() {
      detail({id: this.$route.query.id}).then(res => {
        const data = res.data || res
        const purpose = Array.isArray(data.purpose)
          ? data.purpose
          : String(data.purpose || '').split(',').filter(Boolean).map(Number)
        this.detail = {
          ...res,
          handleSignature: res.handleSignature || '', // 处理签名为空的情况
          purpose: res.purpose || [] // 处理 purpose 为空的情况
          ...data,
          handleSignature: data.handleSignature || '',
          purpose
        }
        if (Array.isArray(data.list) && data.list.length) {
          this.tableData = data.list.map(item => ({ ...item }))
        }
      })
    },
@@ -162,12 +213,17 @@
    handleSave() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.detail.list = this.tableData || []
          this.detail.purpose = this.detail.purpose.join(',')
          confirm({...this.detail}).then(res => {
          const payload = {
            ...this.detail,
            list: this.tableData || [],
            purpose: (this.detail.purpose || []).join(','),
            isDraft: 0
          }
          confirm(payload).then(res => {
            if (res.code == 200) {
              this.$message.success('保存成功');
              this.$router.back()
              this.cacheForm = null
              this.$closeCurrentView('/strain/validation/chief-cell')
            } else {
              this.$message.error(res.msg);
            }
@@ -215,13 +271,43 @@
.info-item {
  display: flex;
  font-size: 15px;
  height: 45px;
  line-height: 45px;
}
.label {
  color: #666;
  font-weight: 500;
  flex-shrink: 0;
}
.source-item {
  flex: 1;
  min-width: 0;
  .source-text {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #303133;
    cursor: pointer;
    padding: 0 4px;
    &:hover {
      color: #409EFF;
    }
  }
}
// 或者直接覆盖所有 .el-tooltip__popper
/deep/ .source-tooltip {
  max-width: 320px !important;
  min-width: 120px !important;
  word-break: break-word;
  line-height: 1.6;
  padding: 10px 14px;
  font-size: 13px;
}
.sign-col {
@@ -291,4 +377,4 @@
    height: auto;
  }
}
</style>
</style>