<template>
  <div class="container">
    <div v-show="!isDetail">
      <direct-search
        ref="form"
        :label-position="'right'"
        :forms="searchList"
        :style="{ textAlign: 'left' }"
        @handleSearch="handleFormSearch"
      />
      <el-table-self
        ref="table"
        :table-data="tableData"
        :columns="columns"
        :list-loading="listLoading"
        :current-page="pageIndex"
        :total-count="total"
        :page-sizes="pageSizes"
        :page-size="pageSize"
        @pageSizeChange="handleSizeChange"
        @currentPageChange="handleCurrentChange"
        :sortChange="sortChange"
      />
    </div>

    <div v-if="isDetail">
      <div>
        <el-button icon="el-icon-back" @click="isDetail = false"
          >返 回</el-button
        >
      </div>
      <ConfigForms
        form-type="1"
        :patient-id="patientId"
        :disabled="disabled"
      ></ConfigForms>
    </div>
  </div>
</template>

<script>
import paginationMixin from "@/components/TabComponents/mixin"
import { getPatientPage } from "@/api/patient.js"
import ConfigForms from "./components/ConfigForms.vue"
import { mapGetters } from "vuex"
export default {
  name: "ScreeningIndex",
  mixins: [paginationMixin],
  components: { ConfigForms },
  data() {
    return {
      isDetail: false, //! 控制详情显隐
      listLoading: false,
      disabled: false,
      tableData: [],
      cacheForm: {},
      searchList: [
        {
          type: "date",
          label: "筛查时间",
          prop: "createTime",
          placeholder: "请选择时间",
          valueFormat: "yyyy-MM-dd",
        },
        {
          label: "筛查审核状态",
          type: "select",
          prop: "checkStatus",
          opts: [
            { label: "待审核", value: "1" },
            { label: "驳回修改", value: "2" },
            { label: "合格", value: "3" },
            { label: "不合格", value: "4" },
          ],
        },
        {
          label: "风险评估结果",
          type: "select",
          prop: "riskRank",
          opts: [
            { label: "低危", value: "c" },
            { label: "中危", value: "b" },
            { label: "高危", value: "a" },
          ],
        },
        {
          label: "性别",
          type: "select",
          prop: "sex",
          optsFormatter: () => {
            return this.dictMap && this.dictMap["d-sex"]
          },
        },
        {
          type: "input",
          label: "关键词",
          placeholder: "请输入医联体/姓名/身份证",
          prop: "keyParam",
        },
        {
          type: "button",
          value: "查询",
        },
      ],
      columns: [
        {
          label: "医联体",
          minWidth: 120,
          value: "unionName",
          formatter: (row) => {
            return row.unionName ? row.unionName : "--"
          },
        },
        {
          label: "姓名",
          minWidth: 120,
          formatter: (row) => {
            return row.name ? row.name : "--"
          },
          value: "name",
        },
        {
          label: "性别",
          minWidth: 80,
          value: "sex",
          formatter: (row) => {
            return row.sex
              ? this.$handle.formatDicList(this.dictMap["d-sex"], row.sex + "")
              : "--"
          },
        },
        {
          label: "身份证",
          minWidth: 120,
          value: "idCard",
          formatter: (row) => {
            return row.idCard ? row.idCard : "--"
          },
        },
        {
          label: "年龄",
          minWidth: 120,
          value: "age",
          formatter: (row) => {
            return row.age ? row.age : "--"
          },
        },
        {
          label: "筛查时间",
          minWidth: 180,
          // sortable: "custom",
          value: "createTime",
          formatter: (row) => {
            return row.createTime ? row.createTime : "--"
          },
        },
        {
          label: "风险评估结果",
          minWidth: 120,
          value: "riskRank",
          formatter: (row) => {
            let riskRank = {
              low: "低危",
              medium: "中危",
              high: "高危",
            }
            return row.riskRank ? riskRank[row.riskRank] : "--"
          },
        },
        {
          label: "是否内镜",
          minWidth: 120,
          value: "isInnerCheck",
          formatter: (row) => {
            let arr = [
              { label: "否", value: "0" },
              { label: "是", value: "1" },
            ]
            let label
            if (String(row.isInnerCheck)) {
              label = arr.filter((e) => e.value == row.isInnerCheck)[0].label
            } else {
              label = "--"
            }
            return label
          },
        },
        {
          label: "筛查审核状态",
          minWidth: 120,
          value: "checkStatus",
          formatter: (row) => {
            let arr = [
              { label: "待审核", value: "1" },
              { label: "驳回修改", value: "2" },
              { label: "合格", value: "3" },
              { label: "不合格", value: "4" },
            ]
            let label
            if (row.checkStatus) {
              label = arr.filter((e) => e.value == row.checkStatus)[0].label
            } else {
              label = "--"
            }
            return label
          },
        },
        {
          label: "操作",
          width: 180,
          fixed: "right",
          operType: "button",
          operations: [
            {
              func: this.handleView,
              formatter(row) {
                return {
                  label: "查看",
                  type: "text",
                }
              },
            },
            {
              func: this.handleAdd,
              formatter(row) {
                if (row.checkStatus != 3 && row.checkStatus != 4) {
                  return {
                    label: "修改",
                    type: "text",
                  }
                } else {
                  return {
                    label: "",
                    type: "text",
                    style: {
                      display: "none",
                    },
                  }
                }
              },
            },
          ],
        },
      ],
      searchForm: {},
    }
  },
  methods: {
    handleView(row) {
      this.handleAdd(row, null, true)
    },
    handleAdd({ patientId, name }, index, disabled = false) {
      this.disabled = disabled
      this.patientId = patientId || null
      this.name = name
      this.isDetail = true
    },

    sortChange({ prop, order }) {
      const asc = order ? (order === "ascending" ? true : false) : ""
      const column = order ? prop : ""
      this.handleSearch({ "orders[0].asc": asc, "orders[0].column": column })
    },
    // 查询
    handleFormSearch(form) {
      this.searchForm = form
      this.pageIndex = 1
      this.handleSearch(form)
    },
    handleSearch(form) {
      this.listLoading = true
      const params = Object.assign(this.cacheForm, form)
      const data = {}
      for (let key in params) {
        if (params[key] !== "" && params[key] !== null) {
          // if (key.includes("Time") && params[key]) {
          //   data["start" + key] = params[key][0]
          //   data["end" + key] = params[key][1]
          // } else {
          data[key] = params[key]
          // }
        }
      }
      data.current = this.pageIndex
      data.size = this.pageSize
      data.isDraft = 0
      data.patientFrom = this.selectedIndex
      getPatientPage(data).then((res) => {
        this.listLoading = false
        if (res.code === 1) {
          const d = res.data
          this.tableData = d.records || []
          this.total = Number(d.total)
        }
      })
    },
  },
  computed: {
    ...mapGetters({
      selectedIndex: "table/selectedIndex",
    }),
  },
  created() {
    this.handleFormSearch()
  },
  watch: {
    selectedIndex(v) {
      this.handleFormSearch(this.searchForm)
    },
  },
}
</script>

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