<template>
  <page-layer>
      <template #header>
          <el-select v-model="recordType" style="width: 120px">
              <el-option v-for="item in allRecordTypes" :label="item.label" :value="item.value"></el-option>
          </el-select>&nbsp;&nbsp;
          <el-input v-model="psnIdNumber" placeholder="人员身份证号" clearable style="width: 180px"></el-input>
          <el-divider direction="vertical"></el-divider>
          <el-button type="success" @click="queryPsnBaseInfo">参保信息</el-button>
          <el-button type="primary" @click="startApplyRecord"> 开始备案 </el-button>
          <el-button type="primary" @click="revokeRecord"> 撤销备案 </el-button>
          <span v-if="recordType === '2503'" style="margin-left: 12px">
              <el-button type="success" @click="querySpecialDiseaseRecords"> 备案查询 </el-button>
              <el-button type="success" @click="displayDateRange"> 用药记录 </el-button>
              <el-button type="warning" @click="beforeFetchAllSpecialDiseaseRecords"> 备案统计 </el-button>
          </span>
      </template>
      <template #main>
          <el-tag type="success">人员基本信息</el-tag>
          <el-descriptions :column="4" border>
              <el-descriptions-item>
                  <template #label> 姓名 </template>
                  {{ baseinfo.psnName }}
              </el-descriptions-item>
              <el-descriptions-item>
                  <template #label> 性别 </template>
                  {{ baseinfo.gendName }}
              </el-descriptions-item>
              <el-descriptions-item>
                  <template #label> 证件类型 </template>
                  {{ baseinfo.psnCertTypeName }}
              </el-descriptions-item>
              <el-descriptions-item>
                  <template #label> 证件号码 </template>
                  {{ baseinfo.certno }}
              </el-descriptions-item>
              <el-descriptions-item>
                  <template #label> 出生日期 </template>
                  {{ baseinfo.brdy }}
              </el-descriptions-item>
              <el-descriptions-item>
                  <template #label> 年龄 </template>
                  {{ baseinfo.age }}
              </el-descriptions-item>
              <el-descriptions-item>
                  <template #label> 民族 </template>
                  {{ baseinfo.natyName }}
              </el-descriptions-item>
              <el-descriptions-item>
                  <template #label> 人员编号 </template>
                  {{ baseinfo.psnNo }}
              </el-descriptions-item>
          </el-descriptions>
          <div style="height: 12px"></div>
          <el-tag type="">人员参保信息</el-tag>
          <el-table :data="baseinfo.insuinfo" stripe highlight-current-row @row-click="handleClickInsuinfo">
              <el-table-column property="balc" label="余额" width="50"></el-table-column>
              <el-table-column prop="insutypeName" label="险种类型"></el-table-column>
              <el-table-column prop="psnTypeName" label="人员类别" width="120"></el-table-column>
              <el-table-column prop="psnInsuStasName" label="参保状态" width="80"></el-table-column>
              <el-table-column property="psnInsuDate" label="个人参保日期" width="100"></el-table-column>
              <el-table-column property="pausInsuDate" label="暂停参保日期" width="100"></el-table-column>
              <el-table-column property="cvlservFlagName" label="公务员标志" width="100"></el-table-column>
              <el-table-column property="insuplcAdmdvs" label="参保地医保区划" width="120"></el-table-column>
              <el-table-column property="insuplcAdmdvsName" label="参保地名称"></el-table-column>
              <el-table-column property="empName" label="单位名称"></el-table-column>
          </el-table>
          <div style="height: 12px"></div>
          <el-tag color="#66FFCC">人员身份信息</el-tag>
          <el-table :data="baseinfo.idetinfo">
              <el-table-column label="人员身份类别" prop="psnIdetTypeName"></el-table-column>
              <el-table-column label="人员类别等级" prop="psnTypeLv"></el-table-column>
              <el-table-column label="备注" prop="memo"></el-table-column>
              <el-table-column label="开始时间" prop="begntime"></el-table-column>
              <el-table-column label="结束时间" prop="endtime"></el-table-column>
          </el-table>

          <el-dialog v-model="showSpecialDiseaseRecords" title="慢特病备案信息">
              <el-table :data="specialDiseaseRecords" stripe>
                  <el-table-column property="begndate" label="开始日期"></el-table-column>
                  <el-table-column prop="enddate" label="结束日期"></el-table-column>
                  <el-table-column prop="opspDiseCode" label="病种编码"></el-table-column>
                  <el-table-column prop="opspDiseName" label="病种名称"></el-table-column>
                  <el-table-column prop="ideFixmedinsName" label="备案机构"></el-table-column>
              </el-table>
          </el-dialog>
          <el-dialog v-model="showSpecialDiseaseUsedMedicines" title="慢特病用药记录">
              <el-table :data="specialDiseaseUsedMedicines" stripe height="360">
                  <el-table-column prop="fixmedinsCode" label="定点医药机构编号"></el-table-column>
                  <el-table-column prop="fixmedinsName" label="定点医药机构名称"></el-table-column>
                  <el-table-column prop="cnt" label="数量"></el-table-column>
                  <el-table-column prop="pric" label="单价"></el-table-column>
                  <el-table-column prop="hilistCode" label="医保目录编码"></el-table-column>
                  <el-table-column prop="hilistName" label="医保目录名称"></el-table-column>
                  <el-table-column prop="medListCodg" label="医疗目录编码"></el-table-column>
                  <el-table-column prop="medinsListCodg" label="医药机构目录编码"></el-table-column>
                  <el-table-column prop="medinsListName" label="医药机构目录名称"></el-table-column>
                  <el-table-column prop="prodname" label="商品名"></el-table-column>
                  <el-table-column prop="spec" label="规格"></el-table-column>
                  <el-table-column prop="dosformName" label="剂型"></el-table-column>
              </el-table>
          </el-dialog>
          <el-dialog v-model="showDateRange" title="请选择时间范围" width="320px">
              <el-date-picker
                  v-model="dateRange"
                  type="daterange"
                  :shortcuts="maxHalfYear"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  size="small"
                  style="width: 260px"
              ></el-date-picker>
              <div style="width: 260px; text-align: right; margin-top: 24px">
                  <el-button type="primary" @click="querySpecialDiseaseUsedMedicines" icon="Check">确定</el-button>
              </div>
          </el-dialog>
          <el-dialog v-model="showFetchAllSpecialDiseaseRecords" title="门特备案记录" width="70%">
              <el-date-picker
                  v-model="fetchAllSpecialDiseaseRecordsDateRange"
                  type="daterange"
                  :shortcuts="maxHalfYear"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  size="small"
                  style="width: 240px"
              ></el-date-picker>
              <el-divider direction="vertical"></el-divider>
              <el-button type="primary" icon="Check" @click="fetchAllSpecialDiseaseRecords">查询</el-button>
              <el-button type="primary" icon="Download" @click="exportExcel">导出Excel</el-button>
              <el-table :data="allSpecialDiseaseRecords" height="400" stripe highlight-current-row>
                  <el-table-column prop="psnName" label="人员姓名"></el-table-column>
                  <el-table-column prop="psnNo" label="人员编码"></el-table-column>
                  <el-table-column prop="socialNo" label="身份证号"></el-table-column>
                  <el-table-column prop="opspDiseCode" label="病种编码"></el-table-column>
                  <el-table-column prop="opspDiseName" label="病种名称"></el-table-column>
                  <el-table-column prop="ideFixmedinsName" label="鉴定机构"></el-table-column>
                  <el-table-column prop="hospIdeDate" label="鉴定日期"></el-table-column>
                  <el-table-column prop="diagDrName" label="诊断医师"></el-table-column>
                  <el-table-column prop="begndate" label="开始日期"></el-table-column>
                  <el-table-column prop="enddate" label="结束日期"></el-table-column>
                  <el-table-column prop="trtDclaDetlSn" label="备案流水号"></el-table-column>
              </el-table>
          </el-dialog>

          <el-dialog v-model="showApplySpecialDiseaseRecord" width="70%" title="人员慢特病备案申请">
              <i style="color: red">* </i>人员类别：&nbsp;&nbsp;
              <el-radio v-model="perstype" :label="1">职工</el-radio>
              <el-radio v-model="perstype" :label="2">居民</el-radio>
              <div style="height: 20px"></div>
              <el-row :gutter="5">
                  <el-col :span="8">
                      人员编号：
                      <el-input v-model="tempSpecialDiseaseRecord.psnNo" disabled style="width: 160px"></el-input>
                  </el-col>
                  <el-col :span="8">
                      险种类型：
                      <el-input v-model="tempSpecialDiseaseRecord.insutypeName" disabled style="width: 160px"></el-input>
                  </el-col>
                  <el-col :span="8">
                      联系电话：
                      <el-input v-model="tempSpecialDiseaseRecord.tel" style="width: 160px"></el-input>
                  </el-col>
              </el-row>
              <div style="height: 12px"></div>
              <el-row :gutter="5">
                  <el-col :span="8">
                      联系地址：
                      <el-input v-model="tempSpecialDiseaseRecord.addr" style="width: 160px"></el-input>
                  </el-col>
                  <el-col :span="8">
                      参保地区：
                      <el-input v-model="tempSpecialDiseaseRecord.insuOptinsName" disabled style="width: 160px"></el-input>
                  </el-col>
                  <el-col :span="8">
                      鉴定日期：
                      <el-date-picker v-model="tempSpecialDiseaseRecord.hospIdeDate" style="width: 160px"></el-date-picker>
                  </el-col>
              </el-row>
              <div style="height: 12px"></div>
              <el-row :gutter="5">
                  <el-col :span="8">
                      开始日期：
                      <el-date-picker v-model="tempSpecialDiseaseRecord.begndate" style="width: 160px"></el-date-picker>
                  </el-col>
                  <el-col :span="8">
                      结束日期：
                      <el-date-picker v-model="tempSpecialDiseaseRecord.enddate" style="width: 160px"></el-date-picker>
                  </el-col>
                  <el-col :span="8">
                      <div style="display: flex">
                          <div>病种名称：</div>
                          <div>
                              <el-autocomplete v-model="tempSpecialDiseaseRecord.opspDiseName"
                                               :fetch-suggestions="searchDiag" placeholder="请输入名称" clearable
                                               @select="handleSelectDiag">
                                  <template #default="{ item }">
                                      <div style="height: 40px">
                                          <div style="height: 16px; margin-top: 4px; font-size: 12px; color: #8492a6">
                                              {{ item.code }}
                                          </div>
                                          <div style="height: 16px">{{ item.name }}</div>
                                      </div>
                                  </template>
                              </el-autocomplete>
                          </div>
                      </div>
                  </el-col>
              </el-row>
              <div style="height: 12px"></div>
              <el-row :gutter="5">
                  <el-col :span="8">
                      病种编码：
                      <el-input v-model="tempSpecialDiseaseRecord.opspDiseCode" disabled style="width: 160px"></el-input>
                  </el-col>
                  <el-col :span="8">
                      <div style="display: flex">
                          <div>医师姓名：</div>
                          <div>
                              <el-autocomplete v-model="tempSpecialDiseaseRecord.diagDrName" :fetch-suggestions="searchPhysician" placeholder="请输入姓名" clearable @select="handleSelectPhysician">
                                  <template #default="{ item }">
                                      <span style="color: #8492a6; font-size: 12px">{{ item.code }}</span>
                                      <el-divider direction="vertical"></el-divider>
                                      <span>{{ item.name }}</span>
                                  </template>
                              </el-autocomplete>
                          </div>
                      </div>
                  </el-col>
                  <el-col :span="8">
                      医师编码：
                      <el-input v-model="tempSpecialDiseaseRecord.diagDrCodg" disabled style="width: 160px"></el-input>
                  </el-col>
              </el-row>
              <div style="margin-top: 24px; width: 100%; text-align: right">
                  <el-button plain icon="Close" @click="showApplySpecialDiseaseRecord = false">放弃备案</el-button>
                  <el-button type="primary" icon="Check" @click="submitSpecialDiseaseRecord">提交备案</el-button>
              </div>
              <div style="height: 12px"></div>
          </el-dialog>
          <el-dialog v-model="showAllAppliedSpecicalDiseaseRecords" title="请选择要撤销的备案" width="70%">
              <div style="height: 12px"></div>
              <el-table :data="allAppliedSpecialDiseaseRecords" stripe highlight-current-row @row-click="handleSelectAppliedSpecialDiseaseRecord">
                  <el-table-column prop="opspDiseCode" label="病种编码"></el-table-column>
                  <el-table-column prop="opspDiseName" label="病种名称"></el-table-column>
                  <el-table-column prop="hospIdeDate" label="鉴定日期"></el-table-column>
                  <el-table-column prop="diagDrName" label="鉴定医生"></el-table-column>
                  <el-table-column prop="begndate" label="开始日期"></el-table-column>
                  <el-table-column prop="enddate" label="结束日期"></el-table-column>
              </el-table>
              <div style="margin-top: 24px; width: 100%; text-align: right">
                  <el-button plain icon="Close" @click="abortRevokeSpecialDiseaseRecord">放弃</el-button>
                  <el-button type="primary" icon="RefreshLeft" @click="confirmRevokeSpecialDiseaseRecord">撤销备案</el-button>
              </div>
              <div style="height: 12px"></div>
          </el-dialog>
      </template>
  </page-layer>
</template>
<script setup>
import PageLayer from "@/layout/PageLayer.vue";
import {
    obtainBasicPersonInfo,
    querySpecialChronicDiseasesAccreditation,
    querySpecialChronicDiseasesMedicalRecord
} from "@/api/medical-insurance/si-query";
import {ElMessage, ElMessageBox} from "element-plus";
import {formatDate, formatDatetime} from "@/utils/date";
import {maxHalfYear} from "@/data/shortcuts";
import {
    getAllSpcChrRcdsByPsnNo, revokeSpecialChronicDiseasesRecord,
    selectAllSpcSlwRcds,
    specialChronicDiseasesRecord
} from "@/api/medical-insurance/si-psn-rcd";
import {Export} from "@/utils/ExportExcel";
import {searchData} from "@/api/inpatient/dictionary";

const allRecordTypes = [
    { value: '2503', label: '慢特病备案' },
    { value: '2505', label: '定点备案' },
    { value: '2507', label: '意外伤害备案' },
    { value: '2501', label: '转院备案' },
]
const recordType = ref('2503')
const psnIdNumber = ref('')

const baseinfo = ref({})
const currentInsuinfo = ref({})
const perstype = ref(1)
const specialDiseaseRecords = ref([])
const showSpecialDiseaseRecords = ref(false)
const specialDiseaseUsedMedicines = ref([])
const showSpecialDiseaseUsedMedicines = ref(false)
const dateRange = ref(null)
const showDateRange = ref(false)
const showFetchAllSpecialDiseaseRecords = ref(false)
const fetchAllSpecialDiseaseRecordsDateRange = ref(null)
const allSpecialDiseaseRecords = ref([])
const showApplySpecialDiseaseRecord = ref(false)
const tempSpecialDiseaseRecord = reactive({})

const nullIdNumber = () => {
    if (!psnIdNumber.value) {
        ElMessage({
            message: '请输入患者身份证号！',
            type: 'warning',
            duration: 2000,
            showClose: true,
        })
        return true
    }
    return false
}

const queryPsnBaseInfo = () => {
    if (nullIdNumber()) {
        return
    }
    const param = {
        socialNo: psnIdNumber.value,
        onlyQry: 1,
    }
    obtainBasicPersonInfo(param).then((res) => {
        baseinfo.value = res
    }).catch(() => {
        baseinfo.value = {}
    })
}

const nullBaseinfo = (needInsuinfo) => {
    if (!baseinfo.value.psnNo) {
        ElMessage({
            message: '请先查询参保信息！',
            type: 'warning',
            duration: 2000,
            showClose: true,
        })
        return true
    }
    if (needInsuinfo && !currentInsuinfo.value.insutype) {
        ElMessage({
            message: '请选择一条参保信息！',
            type: 'warning',
            duration: 2000,
            showClose: true,
        })
        return true
    }
    return false
}

const nullDateRange = () => {
    if (!dateRange.value) {
        ElMessage({
            message: '请选择日期范围！',
            type: 'warning',
            duration: 2000,
            showClose: true,
        })
        return true
    }
    return false
}

const handleClickInsuinfo = (row) => {
    currentInsuinfo.value = row
    if (row.insutype === '310') {
        perstype.value = 1
    } else if (row.insutype === '390') {
        perstype.value = 2
    }
}

const querySpecialDiseaseRecords = () => {
    if (nullBaseinfo(true)) {
        return
    }
    querySpecialChronicDiseasesAccreditation({
        psnNo: baseinfo.value.psnNo,
        admdvs: currentInsuinfo.value.insuplcAdmdvs,
        needAllRcd: 1,
    }).then((res) => {
        specialDiseaseRecords.value = res
        showSpecialDiseaseRecords.value = true
    })
}

const displayDateRange = () => {
    showDateRange.value = true
}

const querySpecialDiseaseUsedMedicines = () => {
    if (nullBaseinfo(false)) {
        return
    }
    if (nullDateRange()) {
        return
    }
    const param = {
        psnNo: baseinfo.value.psnNo,
        begntime: formatDatetime(dateRange.value[0]),
        endtime: formatDatetime(dateRange.value[1]),
    }
    querySpecialChronicDiseasesMedicalRecord(param).then((res) => {
        showDateRange.value = false
        specialDiseaseUsedMedicines.value = res
        showSpecialDiseaseUsedMedicines.value = true
    })
}

const beforeFetchAllSpecialDiseaseRecords = () => {
    showFetchAllSpecialDiseaseRecords.value = true
}

const fetchAllSpecialDiseaseRecords = () => {
    if (!fetchAllSpecialDiseaseRecordsDateRange.value) {
        ElMessage({
            message: '请选择日期范围！',
            type: 'warning',
            duration: 2000,
            showClose: true,
        })
        return true
    }
    const begntime = formatDate(fetchAllSpecialDiseaseRecordsDateRange.value[0])
    const endtime = formatDate(fetchAllSpecialDiseaseRecordsDateRange.value[1])
    selectAllSpcSlwRcds(begntime, endtime).then((res) => {
        allSpecialDiseaseRecords.value = res
    })
}

const exportExcel = () => {
    if (allSpecialDiseaseRecords.value.length === 0) {
        ElMessage({
            message: '没有可以导出的数据。',
            type: 'warning',
            duration: 2000,
            showClose: true,
        })
        return true
    }
    const title = {
        psnName: '人员姓名',
        psnNo: '人员编码',
        socialNo: '身份证号',
        opspDiseCode: '病种编码',
        opspDiseName: '病种名称',
        ideFixmedinsName: '鉴定机构',
        hospIdeDate: '鉴定日期',
        diagDrName: '诊断医师',
        begndate: '开始日期',
        enddate: '结束日期',
        trtDclaDetlSn: '备案流水号',
    }
    Export(allSpecialDiseaseRecords.value, title, '门特备案详情')
}

const searchDiag = (queryString, cb) => {
    if (queryString && queryString.length > 1) {
        const param = {
            method: 'name',
            content: queryString,
            target: 'slwspcdiag',
            perstype: perstype.value,
            medType: '14',
        }
        searchData(param).then((res) => {
            cb(res)
        })
    }
}

const handleSelectDiag = (item) => {
    tempSpecialDiseaseRecord.opspDiseCode = item.code
    tempSpecialDiseaseRecord.opspDiseName = item.name
}

const searchPhysician = (queryString, cb) => {
    if (queryString && queryString.length > 1) {
        const param = {
            method: 'name',
            content: queryString,
            target: 'physician',
            medType: '14',
        }
        searchData(param).then((res) => {
            cb(res)
        })
    }
}
const handleSelectPhysician = (item) => {
    tempSpecialDiseaseRecord.diagDrCodg = item.code
    tempSpecialDiseaseRecord.diagDrName = item.name
}

const startApplyRecord = () => {
    if (nullBaseinfo(true)) {
        return
    }
    switch (recordType.value) {
        case '2503':
            beforeApplySpecialDiseaseRecord()
            break
    }
}

const beforeApplySpecialDiseaseRecord = () => {
    tempSpecialDiseaseRecord.psnNo = baseinfo.value.psnNo
    tempSpecialDiseaseRecord.psnName = baseinfo.value.psnName
    tempSpecialDiseaseRecord.socialNo = baseinfo.value.certno
    tempSpecialDiseaseRecord.insutype = currentInsuinfo.value.insutype
    tempSpecialDiseaseRecord.insutypeName = currentInsuinfo.value.insutypeName
    tempSpecialDiseaseRecord.insuOptins = currentInsuinfo.value.insuplcAdmdvs
    tempSpecialDiseaseRecord.insuOptinsName = currentInsuinfo.value.insuplcAdmdvsName
    showApplySpecialDiseaseRecord.value = true
}
const submitSpecialDiseaseRecord = () => {
    specialChronicDiseasesRecord(tempSpecialDiseaseRecord).then((res) => {
        ElMessageBox.alert(res, {
            type: 'success',
            confirmButtonText: '确定',
        }).then(() => {
            showApplySpecialDiseaseRecord.value = false
        })
    })
}

const revokeRecord = () => {
    if (nullBaseinfo(false)) {
        return
    }
    switch (recordType.value) {
        case '2503':
            beforeRevokeSpecialDiseaseRecord()
            break
    }
}

const allAppliedSpecialDiseaseRecords = ref([])
const showAllAppliedSpecicalDiseaseRecords = ref(false)
const beforeRevokeSpecialDiseaseRecord = () => {
    getAllSpcChrRcdsByPsnNo(baseinfo.value.psnNo).then((res) => {
        allAppliedSpecialDiseaseRecords.value = res
        showAllAppliedSpecicalDiseaseRecords.value = true
    })
}

const currentAppliedSpecialDiseaseRecord = ref({})
const handleSelectAppliedSpecialDiseaseRecord = (row) => {
    currentAppliedSpecialDiseaseRecord.value = row
}

const abortRevokeSpecialDiseaseRecord = () => {
    currentAppliedSpecialDiseaseRecord.value = {}
    showAllAppliedSpecicalDiseaseRecords.value = false
}

const confirmRevokeSpecialDiseaseRecord = () => {
    if (!currentAppliedSpecialDiseaseRecord.value.psnNo) {
        ElMessage({
            message: '请选择要撤销的备案！',
            type: 'warning',
            duration: 2000,
            showClose: true,
        })
        return
    }
    ElMessageBox.prompt('请填写撤销原因：', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        inputPattern: /\S/,
        inputErrorMessage: '撤销原因为必填项！',
    }).then(({ value }) => {
        currentAppliedSpecialDiseaseRecord.value.memo = value
        const param = {
            id: currentAppliedSpecialDiseaseRecord.value.id,
            psnNo: currentAppliedSpecialDiseaseRecord.value.psnNo,
            trtDclaDetlSn: currentAppliedSpecialDiseaseRecord.value.trtDclaDetlSn,
            memo: value,
        }
        revokeSpecialChronicDiseasesRecord(param).then((res) => {
            ElMessage({
                message: res,
                type: 'success',
                duration: 2000,
                showClose: true,
            })
            abortRevokeSpecialDiseaseRecord()
        })
    }).catch(() => {})
}
</script>