<template>
  <page-layer>
    <template #header>
      <el-input style="width: 320px" size="small" v-model="patNo" clearable>
        <template #prepend>门诊ID/身份证</template>
      </el-input>
      <el-divider direction="vertical"></el-divider>
      <el-button type="success" @click="qryPsnBscInfo">参保信息</el-button>
      <el-button type="success" @click="qrySpcChrRcd"> 备案查询 </el-button>
      <el-button type="success" @click="beforeQryMedUseRcd"> 用药记录 </el-button>
      <el-button type="primary" @click="beforeSlwSpcChrRcd"> 慢特病备案 </el-button>
      <el-button type="primary" @click="beforeRvkSlwSpcChrRcd"> 撤销备案 </el-button>
      <el-button type="warning" @click="beforeFetchAllRcds"> 备案统计 </el-button>
    </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="showDateRange" title="请选择时间范围" width="300px">
        <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="qryMedUseRcd" icon="Check">确定</el-button>
        </div>
      </el-dialog>
      <el-dialog v-model="showSpcChrRcds" title="慢特病备案信息">
        <el-table :data="spcChrRcds" 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="showMedUseRcds" title="慢特病用药记录">
        <el-table :data="medUseRcds" 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="showSlwSpcChrRcd" 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="slwSpcChrRcd.psnNo" disabled>
              <template #prepend>人员编号</template>
            </el-input>
          </el-col>
          <el-col :span="8">
            <el-input v-model="slwSpcChrRcd.insutypeName" disabled>
              <template #prepend>险种类型</template>
            </el-input>
          </el-col>
          <el-col :span="8">
            <el-input v-model="slwSpcChrRcd.tel">
              <template #prepend>联系电话</template>
            </el-input>
          </el-col>
        </el-row>
        <div style="height: 12px"></div>
        <el-row :gutter="5">
          <el-col :span="8">
            <el-input v-model="slwSpcChrRcd.addr">
              <template #prepend>联系地址</template>
            </el-input>
          </el-col>
          <el-col :span="8">
            <el-input v-model="slwSpcChrRcd.insuOptinsName" disabled>
              <template #prepend>参保地区</template>
            </el-input>
          </el-col>
          <el-col :span="8">
            <div class="el-input el-input--mini el-input-group el-input-group--prepend">
              <div class="el-input-group__prepend">鉴定日期</div>
              <el-date-picker v-model="slwSpcChrRcd.hospIdeDate" style="width: 100%"></el-date-picker>
            </div>
          </el-col>
        </el-row>
        <div style="height: 12px"></div>
        <el-row :gutter="5">
          <el-col :span="8">
            <div class="el-input el-input--mini el-input-group el-input-group--prepend">
              <div class="el-input-group__prepend">开始日期</div>
              <el-date-picker v-model="slwSpcChrRcd.begndate" style="width: 100%"></el-date-picker>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="el-input el-input--mini el-input-group el-input-group--prepend">
              <div class="el-input-group__prepend">结束日期</div>
              <el-date-picker v-model="slwSpcChrRcd.enddate" style="width: 100%"></el-date-picker>
            </div>
          </el-col>
          <el-col :span="8">
            <el-input v-model="slwSpcChrRcd.opspDiseCode" disabled>
              <template #prepend>病种编码</template>
            </el-input>
          </el-col>
        </el-row>
        <div style="height: 12px"></div>
        <el-row :gutter="5">
          <el-col :span="8">
            <div style="display: flex">
              <div>病种名称：</div>
              <div>
                <el-autocomplete v-model="slwSpcChrRcd.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-col :span="8">
            <div style="display: flex">
              <div>医师姓名：</div>
              <div>
                <el-autocomplete v-model="slwSpcChrRcd.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="slwSpcChrRcd.diagDrCodg" disabled>
              <template #prepend>医师编码</template>
            </el-input>
          </el-col>
        </el-row>
        <div style="margin-top: 24px; width: 100%; text-align: right">
          <el-button plain icon="Close" @click="showSlwSpcChrRcd = false">放弃备案</el-button>
          <el-button type="primary" icon="Check" @click="executeSlwSpcChrRcd">提交备案</el-button>
        </div>
        <div style="height: 12px"></div>
      </el-dialog>
      <el-dialog v-model="showAllSlwSpcChrRcds" title="请选择要撤销的备案" width="70%">
        <div style="height: 12px"></div>
        <el-table :data="allSlwSpcChrRcds" stripe highlight-current-row @row-click="handleSelctSlwSpcChrRcd">
          <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="abortRvkSlwSpcChrRcd">放弃</el-button>
          <el-button type="primary" icon="RefreshLeft" @click="executeRvkSlwSpcChrRcd">撤销备案</el-button>
        </div>
        <div style="height: 12px"></div>
      </el-dialog>
      <el-dialog v-model="showFetchAllRcds" title="门特备案记录" width="70%">
        <el-date-picker
            v-model="fetchAllRcdsDateRange"
            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="fetchAllRcds">查询</el-button>
        <el-button type="primary" icon="Download" @click="exportExcel">导出Excel</el-button>
        <el-table :data="allSpcSlwRcds" 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>
    </template>
  </page-layer>
</template>

<script>
import { ref } from 'vue'
import { maxHalfYear } from '@/data/shortcuts'
import { ElMessage, ElMessageBox } from 'element-plus'
import { obtainBasicPersonInfo, querySpecialChronicDiseasesAccreditation, querySpecialChronicDiseasesMedicalRecord } from '@/api/medical-insurance/si-query'
import { getAllSpcChrRcdsByPsnNo, revokeSpecialChronicDiseasesRecord, specialChronicDiseasesRecord, selectAllSpcSlwRcds } from '@/api/medical-insurance/si-psn-rcd'
import { formatDatetime, formatDate } from '@/utils/date'
import { searchData } from '@/api/inpatient/dictionary'
import { Export } from '../../../utils/ExportExcel'
import PageLayer from "@/layout/PageLayer";
export default {
  components: {PageLayer},
  setup() {
    const patNo = ref('')
    const dateRange = ref(null)
    const baseinfo = ref({})
    const currentInsuinfo = ref({})
    const showSpcChrRcds = ref(false)
    const spcChrRcds = ref([])
    const showMedUseRcds = ref(false)
    const medUseRcds = ref([])
    const slwSpcChrRcd = ref({})
    const showSlwSpcChrRcd = ref(false)
    const allSlwSpcChrRcds = ref([])
    const showAllSlwSpcChrRcds = ref(false)
    const currentSlwSpcChrRcd = ref({})
    const showDateRange = ref(false)
    const perstype = ref(1)
    const nullPatNo = () => {
      if (!patNo.value) {
        ElMessage({
          message: '请输入患者门诊ID或身份证！',
          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 nullBaseinfo = () => {
      if (!baseinfo.value.psnNo) {
        ElMessage({
          message: '请先查询参保信息！',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return true
      }
      return false
    }
    const nullInsuinfo = () => {
      if (!currentInsuinfo.value.insutype) {
        ElMessage({
          message: '备案前，请选择一条参保信息！',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return true
      }
      return false
    }

    const qryPsnBscInfo = () => {
      if (nullPatNo()) {
        return
      }
      const param = {
        patNo: patNo.value,
        medType: '14',
      }
      obtainBasicPersonInfo(param)
        .then((res) => {
          baseinfo.value = res
          spcChrRcds.value = []
          medUseRcds.value = []
        })
        .catch(() => {
          baseinfo.value = {}
          spcChrRcds.value = []
          medUseRcds.value = []
        })
    }

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

    const qrySpcChrRcd = () => {
      if (nullBaseinfo()) {
        return
      }
      if (nullInsuinfo()) {
        return
      }
      querySpecialChronicDiseasesAccreditation({
        psnNo: baseinfo.value.psnNo,
        admdvs: currentInsuinfo.value.insuplcAdmdvs,
        needAllRcd: 1,
      }).then((res) => {
        spcChrRcds.value = res
        showSpcChrRcds.value = true
      })
    }

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

    const qryMedUseRcd = () => {
      if (nullBaseinfo()) {
        return
      }
      if (nullDateRange()) {
        return
      }
      const param = {
        psnNo: baseinfo.value.psnNo,
        begntime: formatDatetime(dateRange.value[0]),
        endtime: formatDatetime(dateRange.value[1]),
      }
      querySpecialChronicDiseasesMedicalRecord(param).then((res) => {
        medUseRcds.value = res
        showMedUseRcds.value = true
      })
    }

    const beforeSlwSpcChrRcd = () => {
      if (nullBaseinfo()) {
        return
      }
      if (nullInsuinfo()) {
        return
      }
      slwSpcChrRcd.value.psnNo = baseinfo.value.psnNo
      slwSpcChrRcd.value.psnName = baseinfo.value.psnName
      slwSpcChrRcd.value.socialNo = baseinfo.value.certno
      slwSpcChrRcd.value.insutype = currentInsuinfo.value.insutype
      slwSpcChrRcd.value.insutypeName = currentInsuinfo.value.insutypeName
      slwSpcChrRcd.value.insuOptins = currentInsuinfo.value.insuplcAdmdvs
      slwSpcChrRcd.value.insuOptinsName = currentInsuinfo.value.insuplcAdmdvsName
      showSlwSpcChrRcd.value = true
    }

    const executeSlwSpcChrRcd = () => {
      specialChronicDiseasesRecord(slwSpcChrRcd.value).then((res) => {
        ElMessageBox.alert(res, {
          type: 'success',
          confirmButtonText: '确定',
        }).then(() => {
          showSlwSpcChrRcd.value = false
        })
      })
    }

    const beforeRvkSlwSpcChrRcd = () => {
      if (nullBaseinfo()) {
        return
      }
      getAllSpcChrRcdsByPsnNo(baseinfo.value.psnNo).then((res) => {
        allSlwSpcChrRcds.value = res
        showAllSlwSpcChrRcds.value = true
      })
    }

    const handleSelctSlwSpcChrRcd = (row) => {
      currentSlwSpcChrRcd.value = row
    }

    const abortRvkSlwSpcChrRcd = () => {
      currentSlwSpcChrRcd.value = {}
      showAllSlwSpcChrRcds.value = false
    }

    const executeRvkSlwSpcChrRcd = () => {
      if (!currentSlwSpcChrRcd.value.psnNo) {
        ElMessage({
          message: '请选择要撤销的备案！',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return
      }

      ElMessageBox.prompt('请填写撤销原因', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        inputPattern: /\S/,
        inputErrorMessage: '撤销原因为必填项！',
      })
        .then(({ value }) => {
          currentSlwSpcChrRcd.value.memo = value
          const param = {
            id: currentSlwSpcChrRcd.value.id,
            psnNo: currentSlwSpcChrRcd.value.psnNo,
            trtDclaDetlSn: currentSlwSpcChrRcd.value.trtDclaDetlSn,
            memo: value,
          }
          revokeSpecialChronicDiseasesRecord(param).then((res) => {
            ElMessage({
              message: res,
              type: 'success',
              duration: 2000,
              showClose: true,
            })
            abortRvkSlwSpcChrRcd()
          })
        })
        .catch(() => {})
    }

    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) => {
      slwSpcChrRcd.value.opspDiseCode = item.code
      slwSpcChrRcd.value.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) => {
      slwSpcChrRcd.value.diagDrCodg = item.code
      slwSpcChrRcd.value.diagDrName = item.name
    }

    const showFetchAllRcds = ref(false)
    const fetchAllRcdsDateRange = ref(null)
    const allSpcSlwRcds = ref([])
    const beforeFetchAllRcds = () => {
      showFetchAllRcds.value = true
    }
    const fetchAllRcds = () => {
      if (!fetchAllRcdsDateRange.value) {
        ElMessage({
          message: '请选择日期范围！',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return true
      }
      const begntime = formatDate(fetchAllRcdsDateRange.value[0])
      const endtime = formatDate(fetchAllRcdsDateRange.value[1])
      selectAllSpcSlwRcds(begntime, endtime).then((res) => {
        allSpcSlwRcds.value = res
      })
    }

    const exportExcel = () => {
      if (allSpcSlwRcds.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(allSpcSlwRcds.value, title, '门特备案详情')
    }

    return {
      patNo,
      dateRange,
      maxHalfYear,
      baseinfo,
      currentInsuinfo,
      spcChrRcds,
      showSpcChrRcds,
      medUseRcds,
      showMedUseRcds,
      slwSpcChrRcd,
      showSlwSpcChrRcd,
      allSlwSpcChrRcds,
      showAllSlwSpcChrRcds,
      perstype,
      qryPsnBscInfo,
      qrySpcChrRcd,
      showDateRange,
      beforeQryMedUseRcd,
      qryMedUseRcd,
      handleClickInsuinfo,
      beforeSlwSpcChrRcd,
      executeSlwSpcChrRcd,
      beforeRvkSlwSpcChrRcd,
      handleSelctSlwSpcChrRcd,
      abortRvkSlwSpcChrRcd,
      executeRvkSlwSpcChrRcd,
      searchDiag,
      handleSelectDiag,
      searchPhysician,
      handleSelectPhysician,
      showFetchAllRcds,
      fetchAllRcdsDateRange,
      allSpcSlwRcds,
      beforeFetchAllRcds,
      fetchAllRcds,
      exportExcel,
    }
  },
}
</script>
