zdqy_firm_former/src/views/component/sum/sum-table.vue

<template>
  <div class="sum-table">
    <el-table
      :data="tableData"
      style="width: 100%"
      border
      :span-method="cellMergeMethod"
    >
      <el-table-column type="index" label="序号" width="45" />
      <el-table-column
        prop="zhiLiangZhiBiao"
        align="center"
        label="质量指标"
        width="120"
      />
      <el-table-column
        prop="muBiaoZhi"
        align="center"
        label="目标达成值"
        width="120"
      />
      <el-table-column
        prop="shuJuLaiYuan"
        align="center"
        label="数据来源"
        width="120"
      />
      <el-table-column
        prop="zongJiDaCheng"
        align="center"
        label="总计达成值"
        width="120"
      />
      <el-table-column
        prop="daBiaoPingJia"
        align="center"
        label="达标评价"
        width="120"
      >
        <template slot-scope="scope">
          {{
            scope.row.daBiaoPingJia === 'N'
              ? '原因分析占比'
              : scope.row.daBiaoPingJia
          }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="项目">
        <el-table-column
          v-for="item in childCols"
          :key="item.prop"
          :prop="item.prop"
          align="center"
          :label="item.label"
          width="120px"
        />
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  props: {
    formData: {
      type: Object,
      default: () => {}
    },
    readonly: {
      type: Boolean,
      default: false
    },
    params: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      childCols: [],
      tableData: []
    }
  },
  watch: {
    'formData.bianZhiBuMen': {
      handler(val) {
        if (!val) return
        this.getColumnList(val)
      },
      deep: true,
      immediate: true
    }
  },
  mounted() {
    console.log(this.formData, this.params, this.readonly, 'shiFouHeJi')
  },
  methods: {
    /**
     * 单元格合并方法
     * 1. 质量指标、目标达成值、总计达成值、达标评价：数据相同时纵向合并（rowspan）
     * 2. childCols（列索引>=6）：shiFouHeJi为Y时横向合并（colspan）
     */
    cellMergeMethod({ row, column, rowIndex, columnIndex }) {
      // 需要纵向合并的字段
      const mergeColFields = [
        'zhiLiangZhiBiao',
        'muBiaoZhi',
        'zongJiDaCheng',
        'daBiaoPingJia'
      ]
      const field = column.property

      // --- 需求1：纵向合并（相同值时 rowspan） ---
      // 特殊规则：达标评价为N时，总计达成值不合并
      if (
        mergeColFields.includes(field) &&
        !(field === 'zongJiDaCheng' && row.daBiaoPingJia === 'N')
      ) {
        if (this.isMergeStart(field, rowIndex)) {
          return { rowspan: this.getMergeSpan(field, rowIndex), colspan: 1 }
        } else {
          return { rowspan: 0, colspan: 0 }
        }
      }

      // --- 需求2：childCols 横向合并（shiFouHeJi=Y 时 colspan） ---
      if (columnIndex >= 6 && row.shiFouHeJi === 'Y') {
        if (columnIndex === 6) {
          return { rowspan: 1, colspan: this.childCols.length }
        } else {
          return { rowspan: 0, colspan: 0 }
        }
      }

      return { rowspan: 1, colspan: 1 }
    },
    /** 判断当前行是否为某字段纵向合并的起始行（同一质量指标范围内） */
    isMergeStart(field, currentIndex) {
      if (currentIndex === 0) return true
      const curRow = this.tableData[currentIndex]
      const prevRow = this.tableData[currentIndex - 1]
      // 质量指标不同则必须重新开始，不合并
      if (curRow.zhiLiangZhiBiao !== prevRow.zhiLiangZhiBiao) return true
      // 同一质量指标内，字段值不同则重新开始
      return curRow[field] !== prevRow[field]
    },
    /** 计算从当前行开始、同一质量指标范围内的连续相同值行数 */
    getMergeSpan(field, startIndex) {
      const startVal = this.tableData[startIndex][field]
      const startZhiLiang = this.tableData[startIndex].zhiLiangZhiBiao
      let span = 1
      for (let i = startIndex + 1; i < this.tableData.length; i++) {
        const row = this.tableData[i]
        // 超出同一质量指标范围则停止
        if (row.zhiLiangZhiBiao !== startZhiLiang) break
        if (row[field] === startVal) {
          span++
        } else {
          break
        }
      }
      return span
    },
    getColumnList(bianZhiBuMen) {
      // TODO: 正式环境替换为 this.$common.request(...)
      // 模拟 res.variables?.data 的数据格式
      const mockData = [
        { xiang_mu_: '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测' },
        { xiang_mu_: '人PCA3基因表达检测' },
        { xiang_mu_: '精神类药物基因' },
        { xiang_mu_: '结直肠癌多基因甲基化检测' },
        { xiang_mu_: '胃癌早筛甲基化检测（Septin9、RNF180）' },
        { xiang_mu_: '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"' },
        { xiang_mu_: '人外周血循环肿瘤细胞（CTC）分型检测' },
        { xiang_mu_: '循环染色体异常细胞检测（CAC）' },
        { xiang_mu_: 'HLA-B51基因分型检测' },
        { xiang_mu_: 'HLA-B27基因分型检测' },
        { xiang_mu_: '结直肠癌miR-92a检测（RNA）' },
        { xiang_mu_: '结直肠癌SDC2基因甲基化' },
        { xiang_mu_: '宫颈癌甲基化检测' },
        { xiang_mu_: '人乳头瘤病毒基因分型' }
      ]

      // 模拟异步，与原接口保持一致
      Promise.resolve({ variables: { data: mockData } }).then((res) => {
        this.childCols = res.variables.data.map((item) => ({
          label: item.xiang_mu_,
          prop: item.xiang_mu_
        }))
        // 列数据就绪后自动加载表格数据
        this.getTableData()
      })
    },
    getTableData() {
      const keys = this.childCols.reduce((pre, cur) => {
        pre[cur.prop] = cur.label
        return pre
      }, {})

      // TODO: 正式环境替换为接口请求
      // 模拟表格数据，验证合并功能：
      // - 前3行：质量指标/目标达成值/总计达成值/达标评价 相同 → 纵向合并
      // - 第4行：独立行，不合并
      // - 第5行：独立行，不合并
      // - 最后2行：shiFouHeJi=Y → childCols 横向合并 + 主列纵向合并
      this.tableData = [
        {
          zhiLiangZhiBiao: '实验室内周转时间达标率',
          muBiaoZhi: '≥95%',
          shuJuLaiYuan: '实验室内周转时间（从实验室接收到报告发出时间）',
          zongJiDaCheng: '96%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 128,
          人PCA3基因表达检测: 56,
          精神类药物基因: 89,
          结直肠癌多基因甲基化检测: 45,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 67,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 34,
          '人外周血循环肿瘤细胞（CTC）分型检测': 78,
          '循环染色体异常细胞检测（CAC）': 23,
          'HLA-B51基因分型检测': 91,
          'HLA-B27基因分型检测': 42,
          '结直肠癌miR-92a检测（RNA）': 55,
          结直肠癌SDC2基因甲基化: 38,
          宫颈癌甲基化检测: 61,
          人乳头瘤病毒基因分型: 47
        },
        {
          zhiLiangZhiBiao: '实验室内周转时间达标率',
          muBiaoZhi: '≥95%',
          shuJuLaiYuan: '实验室内周转时间达标数',
          zongJiDaCheng: '96%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 135,
          人PCA3基因表达检测: 62,
          精神类药物基因: 94,
          结直肠癌多基因甲基化检测: 51,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 72,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 39,
          '人外周血循环肿瘤细胞（CTC）分型检测': 83,
          '循环染色体异常细胞检测（CAC）': 28,
          'HLA-B51基因分型检测': 97,
          'HLA-B27基因分型检测': 48,
          '结直肠癌miR-92a检测（RNA）': 59,
          结直肠癌SDC2基因甲基化: 41,
          宫颈癌甲基化检测: 65,
          人乳头瘤病毒基因分型: 52
        },
        {
          zhiLiangZhiBiao: '实验室内周转时间达标率',
          muBiaoZhi: '≥95%',
          shuJuLaiYuan: '实验室内周转时间中位数',
          zongJiDaCheng: '96%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 142,
          人PCA3基因表达检测: 48,
          精神类药物基因: 91,
          结直肠癌多基因甲基化检测: 47,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 69,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 36,
          '人外周血循环肿瘤细胞（CTC）分型检测': 80,
          '循环染色体异常细胞检测（CAC）': 25,
          'HLA-B51基因分型检测': 94,
          'HLA-B27基因分型检测': 45,
          '结直肠癌miR-92a检测（RNA）': 57,
          结直肠癌SDC2基因甲基化: 39,
          宫颈癌甲基化检测: 63,
          人乳头瘤病毒基因分型: 49
        },
        {
          zhiLiangZhiBiao: '实验室内周转时间达标率',
          muBiaoZhi: '≥95%',
          shuJuLaiYuan: '实验室内周转时间90%分位数',
          zongJiDaCheng: '96%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 76,
          人PCA3基因表达检测: 33,
          精神类药物基因: 67,
          结直肠癌多基因甲基化检测: 29,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 44,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 18,
          '人外周血循环肿瘤细胞（CTC）分型检测': 52,
          '循环染色体异常细胞检测（CAC）': 12,
          'HLA-B51基因分型检测': 63,
          'HLA-B27基因分型检测': 27,
          '结直肠癌miR-92a检测（RNA）': 36,
          结直肠癌SDC2基因甲基化: 21,
          宫颈癌甲基化检测: 40,
          人乳头瘤病毒基因分型: 30
        },
        {
          zhiLiangZhiBiao: '实验室内周转时间达标率',
          muBiaoZhi: '≥95%',
          shuJuLaiYuan: '检验报告总数',
          zongJiDaCheng: '96%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 215,
          人PCA3基因表达检测: 187,
          精神类药物基因: 203,
          结直肠癌多基因甲基化检测: 156,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 178,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 134,
          '人外周血循环肿瘤细胞（CTC）分型检测': 192,
          '循环染色体异常细胞检测（CAC）': 98,
          'HLA-B51基因分型检测': 220,
          'HLA-B27基因分型检测': 145,
          '结直肠癌miR-92a检测（RNA）': 167,
          结直肠癌SDC2基因甲基化: 123,
          宫颈癌甲基化检测: 189,
          人乳头瘤病毒基因分型: 158
        },
        {
          zhiLiangZhiBiao: '实验室内周转时间达标率',
          muBiaoZhi: '≥95%',
          shuJuLaiYuan: '当月检验报告超时数',
          zongJiDaCheng: '96%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 215,
          人PCA3基因表达检测: 187,
          精神类药物基因: 203,
          结直肠癌多基因甲基化检测: 156,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 178,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 134,
          '人外周血循环肿瘤细胞（CTC）分型检测': 192,
          '循环染色体异常细胞检测（CAC）': 98,
          'HLA-B51基因分型检测': 220,
          'HLA-B27基因分型检测': 145,
          '结直肠癌miR-92a检测（RNA）': 167,
          结直肠癌SDC2基因甲基化: 123,
          宫颈癌甲基化检测: 189,
          人乳头瘤病毒基因分型: 158
        },
        {
          zhiLiangZhiBiao: '实验室内周转时间达标率',
          muBiaoZhi: '≥95%',
          shuJuLaiYuan: '申请项目漏检导致检验报告超时数',
          zongJiDaCheng: '99.5%',
          daBiaoPingJia: 'N',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 215,
          人PCA3基因表达检测: 187,
          精神类药物基因: 203,
          结直肠癌多基因甲基化检测: 156,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 178,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 134,
          '人外周血循环肿瘤细胞（CTC）分型检测': 192,
          '循环染色体异常细胞检测（CAC）': 98,
          'HLA-B51基因分型检测': 220,
          'HLA-B27基因分型检测': 145,
          '结直肠癌miR-92a检测（RNA）': 167,
          结直肠癌SDC2基因甲基化: 123,
          宫颈癌甲基化检测: 189,
          人乳头瘤病毒基因分型: 158
        },
        {
          zhiLiangZhiBiao: '实验室内周转时间达标率',
          muBiaoZhi: '≥95%',
          shuJuLaiYuan: '设备故障导致检验报告超时数',
          zongJiDaCheng: '99.5%',
          daBiaoPingJia: 'N',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 215,
          人PCA3基因表达检测: 187,
          精神类药物基因: 203,
          结直肠癌多基因甲基化检测: 156,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 178,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 134,
          '人外周血循环肿瘤细胞（CTC）分型检测': 192,
          '循环染色体异常细胞检测（CAC）': 98,
          'HLA-B51基因分型检测': 220,
          'HLA-B27基因分型检测': 145,
          '结直肠癌miR-92a检测（RNA）': 167,
          结直肠癌SDC2基因甲基化: 123,
          宫颈癌甲基化检测: 189,
          人乳头瘤病毒基因分型: 158
        },
        {
          zhiLiangZhiBiao: '实验室内周转时间达标率',
          muBiaoZhi: '≥95%',
          shuJuLaiYuan: '检测复查导致检验报告超时数',
          zongJiDaCheng: '99.5%',
          daBiaoPingJia: 'N',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 215,
          人PCA3基因表达检测: 187,
          精神类药物基因: 203,
          结直肠癌多基因甲基化检测: 156,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 178,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 134,
          '人外周血循环肿瘤细胞（CTC）分型检测': 192,
          '循环染色体异常细胞检测（CAC）': 98,
          'HLA-B51基因分型检测': 220,
          'HLA-B27基因分型检测': 145,
          '结直肠癌miR-92a检测（RNA）': 167,
          结直肠癌SDC2基因甲基化: 123,
          宫颈癌甲基化检测: 189,
          人乳头瘤病毒基因分型: 158
        },
        {
          zhiLiangZhiBiao: '检验报告不正确率',
          muBiaoZhi: '≤0.1‰',
          shuJuLaiYuan: '不正确检验报告数',
          zongJiDaCheng: '0%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 215,
          人PCA3基因表达检测: 187,
          精神类药物基因: 203,
          结直肠癌多基因甲基化检测: 156,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 178,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 134,
          '人外周血循环肿瘤细胞（CTC）分型检测': 192,
          '循环染色体异常细胞检测（CAC）': 98,
          'HLA-B51基因分型检测': 220,
          'HLA-B27基因分型检测': 145,
          '结直肠癌miR-92a检测（RNA）': 167,
          结直肠癌SDC2基因甲基化: 123,
          宫颈癌甲基化检测: 189,
          人乳头瘤病毒基因分型: 158
        },
        {
          zhiLiangZhiBiao: '检验报告不正确率',
          muBiaoZhi: '≤0.1‰',
          shuJuLaiYuan: '检验报告总数',
          zongJiDaCheng: '0%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'N',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 215,
          人PCA3基因表达检测: 187,
          精神类药物基因: 203,
          结直肠癌多基因甲基化检测: 156,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 178,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 134,
          '人外周血循环肿瘤细胞（CTC）分型检测': 192,
          '循环染色体异常细胞检测（CAC）': 98,
          'HLA-B51基因分型检测': 220,
          'HLA-B27基因分型检测': 145,
          '结直肠癌miR-92a检测（RNA）': 167,
          结直肠癌SDC2基因甲基化: 123,
          宫颈癌甲基化检测: 189,
          人乳头瘤病毒基因分型: 158
        },
        {
          zhiLiangZhiBiao: '委托样品周转时间达标报告数',
          muBiaoZhi: '≥90%',
          shuJuLaiYuan: '委托样品周转时间达标报告数',
          zongJiDaCheng: '100%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'Y',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 300,
          人PCA3基因表达检测: 250,
          精神类药物基因: 280,
          结直肠癌多基因甲基化检测: 210,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 240,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 180,
          '人外周血循环肿瘤细胞（CTC）分型检测': 270,
          '循环染色体异常细胞检测（CAC）': 150,
          'HLA-B51基因分型检测': 310,
          'HLA-B27基因分型检测': 200,
          '结直肠癌miR-92a检测（RNA）': 230,
          结直肠癌SDC2基因甲基化: 170,
          宫颈癌甲基化检测: 260,
          人乳头瘤病毒基因分型: 220
        },
        {
          zhiLiangZhiBiao: '委托样品周转时间达标报告数',
          muBiaoZhi: '≥90%',
          shuJuLaiYuan: '委托样品周转时间达标报告数',
          zongJiDaCheng: '100%',
          daBiaoPingJia: 'Y',
          shiFouHeJi: 'Y',
          '乳头瘤病毒（HPV）E6/E7 mRNA基因分型检测': 320,
          人PCA3基因表达检测: 265,
          精神类药物基因: 295,
          结直肠癌多基因甲基化检测: 225,
          '胃癌早筛甲基化检测（Septin9、RNF180）': 255,
          '"幽门螺杆菌23S rRNA/gyrA基因 突变检测"': 195,
          '人外周血循环肿瘤细胞（CTC）分型检测': 285,
          '循环染色体异常细胞检测（CAC）': 165,
          'HLA-B51基因分型检测': 325,
          'HLA-B27基因分型检测': 215,
          '结直肠癌miR-92a检测（RNA）': 245,
          结直肠癌SDC2基因甲基化: 185,
          宫颈癌甲基化检测: 275,
          人乳头瘤病毒基因分型: 235
        }
      ]
    }
  }
}
</script>

<style lang="scss" scoped></style>