index.vue

<template>
  <div class="audit-qualitycontrol">
    <div class="aq-top-tab">
      <el-tabs v-model="type" @tab-click="handleClick">
        <el-tab-pane label="筛查病例数据" name="0"></el-tab-pane>
        <el-tab-pane label="随访病例数据" name="1"></el-tab-pane>
      </el-tabs>
    </div>
    <div class="aq-bot-table">
      <div class="table-top-tab">
        <el-tabs v-model="auditStatus" type="card" @tab-click="handleClick">
          <el-tab-pane label="待审核" name="0"></el-tab-pane>
          <el-tab-pane label="已审核" name="1"></el-tab-pane>
        </el-tabs>
        <div v-show="auditStatus == 1" class="keyExplain">
          字段说明
          <img src="~@/assets/img/DataCenter/question.png" alt />
        </div>
      </div>
      <div class="bot-table">
        <el-table-self
          ref="table"
          :table-data="tableData"
          :columns="columns"
          :header-class="'newHeader'"
          :list-loading="listLoading"
          :current-page="pageIndex"
          :total-count="total"
          :page-sizes="pageSizes"
          :page-size="pageSize"
          @pageSizeChange="handleSizeChange"
          @currentPageChange="handleCurrentChange"
          :showSummary="auditStatus === '0'"
          :getSummaries="getSummaries"
        />
      </div>
    </div>
  </div>
</template>
<script>
// import CustomsTable from "@/components/CustomsTable"
import paginationMixin from "@/components/TabComponents/mixin"
import { getFollowCheck, getFollowUncheck } from "@/api/followup"
import { getScreeningCheck, getScreeningUncheck } from "@/api/screeningAudit"
import { getScreeningTotal, getFollowTotal } from "@/api/dataoverview.js"
export default {
  components: {
    // CustomsTable,
  },
  mixins: [paginationMixin],
  data() {
    return {
      type: "", // 0是筛查   1是随访
      auditStatus: "", // 0 待审核  1 已审核
      listLoading: false,
      tableData: [
        // {
        //   unionId: "2",
        //   unionName: "合肥高新附院",
        //   unCheckNums: 2,
        //   checkNums: 0,
        //   reportTime: "2022-12-09 09:12:35",
        // },
      ],
      reportMap: {},
    }
  },
  watch: {
    auditStatus(val) {
      sessionStorage.setItem("audit-status", val)
      // switch (this.type) {
      //   case "1":
      //     this.handleSearch()
      //     break
      // }
    },
    type(val) {
      this.getReportTotal()
      sessionStorage.setItem("audit-type", val)
      // switch (val) {
      //   case "1":
      //     this.handleSearch()
      //     break
      // }
    },
  },
  computed: {
    columns() {
      const unCkeckColumns = [
        {
          label: "医联体",
          minWidth: 120,
          value: "unionName",
        },
        {
          label: "已审核（例）",
          minWidth: 120,
          value: "checkNums",
        },
        {
          label: "待审核（例）备份",
          minWidth: 120,
          value: "unCheckNums",
        },
        {
          label: "最新上报时间",
          minWidth: 120,
          value: "reportTime",
        },
        {
          label: "操作",
          width: 220,
          fixed: "right",
          operType: "button",
          operations: [
            {
              func: this.auditHandle,
              label: "审核",
              type: "text",
            },
          ],
        },
      ]
      const checkColumns = [
        {
          label: "筛查编号",
          minWidth: 120,
          value: "unionId",
        },
        {
          label: "医联体",
          minWidth: 120,
          value: "unionName",
        },
        {
          label: "姓名",
          minWidth: 120,
          formatter: (row) => {
            return row.name ? row.name : "--"
          },
          value: "name",
        },
        {
          label: "年龄",
          minWidth: 120,
          value: "age",
          formatter: (row) => {
            return row.age ? row.age : "--"
          },
        },
        {
          label: "风险评估",
          minWidth: 120,
          value: "riskRank",
          formatter: (row) => {
            let riskRank = {
              low: "低危",
              medium: "中危",
              high: "高危",
            }
            return row.riskRank ? riskRank[row.riskRank] : "--"
          },
        },
        {
          label: "审核状态",
          minWidth: 120,
          value: "checkStatus",
          formatter: (row) => {
            let text = ""
            if (row.checkStatus == 3) {
              text = "合格"
            } else if (row.checkStatus == 4) {
              text = "不合格"
            } else if (row.checkStatus == 2) {
              text = "驳回修改"
            } else if (row.checkStatus) {
              text = "--"
            }
            return text
          },
        },
        {
          label: "上报时间",
          minWidth: 120,
          value: "reportTime",
        },
        {
          label: "操作",
          width: 220,
          fixed: "right",
          operType: "button",
          operations: [
            {
              func: this.auditHandle,
              label: "审核",
              type: "text",
            },
          ],
        },
      ]
      return this.auditStatus == "1" ? checkColumns : unCkeckColumns
    },
  },
  mounted() {
    if (
      sessionStorage.getItem("audit-status") ||
      sessionStorage.getItem("audit-type")
    ) {
      this.auditStatus = sessionStorage.getItem("audit-status") || "0"
      this.type = sessionStorage.getItem("audit-type") || "0"
    }
    // this.handleSearch()
    this.handleClick()
  },
  methods: {
    getSummaries() {
      return [
        "总计",
        this.reportMap["checkNums"],
        this.reportMap["unCheckNums"],
      ]
    },
    handleClick() {
      if (this.auditStatus == 1) {
        this.columns[this.columns.length - 1].operations[0].label =
          "修改审核意见"
      } else {
        this.columns[this.columns.length - 1].operations[0].label = "审核"
      }
      this.pageIndex = 1
      this.handleSearch()
    },
    auditHandle(data, i) {
      if (this.type == "1") {
        this.$router.push({
          path: "/followaudit",
          query: {
            id: data["id"],
            unionId: data["unionId"],
            unionName: data["unionName"],
            patientId: data.patientId,
            checkStatus: data["checkStatus"],
            checkNote: data["checkNote"],
          },
        })
      } else {
        switch (this.auditStatus) {
          case "0":
            this.$router.push({
              path: "/auditdetail",
              query: {
                unionId: data["unionId"],
              },
            })
            break
          case "1":
            this.$router.push({
              path: "/auditdetail",
              query: {
                id: data["id"],
                patientId: data["patientId"],
                checkNote: data["checkNote"],
                checkStatus: data["checkStatus"],
                unionName: data["unionName"],
              },
            })
            break

          default:
            break
        }
      }
    },
    async handleSearch() {
      this.listLoading = true
      let params = {
        pageSize: this.pageSize,
        pageNum: this.pageIndex,
      }
      let res
      switch (this.auditStatus) {
        case "0":
          if (this.type == "0") {
            res = await getScreeningUncheck(params) //待审核
          } else {
            res = await getFollowUncheck(params) //待审核
          }
          break
        case "1":
          if (this.type == "0") {
            res = await getScreeningCheck(params) //待审核
          } else {
            res = await getFollowCheck(params) //已审核
          }
          break
      }
      this.tableData = res.data.records
      this.total = res.data.total
      this.listLoading = false
    },
    getReportTotal() {
      const API = this.type === "1" ? getFollowTotal : getScreeningTotal
      API().then((res) => {
        this.reportMap = res.data
      })
    },
  },
}
</script>
<style lang="scss" scoped>
.audit-qualitycontrol {
  padding: 20px 0;
  .table-top-tab {
    margin-bottom: 15px;
    position: relative;
    .keyExplain {
      position: absolute;
      display: flex;
      align-items: center;
      right: 0;
      top: 10%;
      font-size: 16px;
      font-family: AlibabaPuHuiTiR;
      color: #999999;
      img {
        width: 18px;
        height: 18px;
        margin-left: 5px;
        transform: translateY(1px);
      }
    }
  }
  .aq-bot-table {
    padding: 20px;
    ::v-deep {
      .el-tabs__nav {
        border: none;
      }
      .el-tabs__item {
        margin-right: 10px;
        border: 1px solid #e4e7ed;
        border-radius: 5px 5px 0 0;
      }
      .is-active {
        background: #4e68ff;
        color: #fff;
      }
    }
  }
}
::v-deep {
  .el-tabs__item {
    padding-left: 20px !important;
    font-size: 18px;
    font-family: AlibabaPuHuiTiM;
  }
  .is-active {
    color: #4e68ff;
  }
}
</style>