<template>
  <el-container>
    <el-header style="height: 35px; margin-top: 10px">
      <el-select v-model="slctSetlPrm.clrType" placeholder="结算类别" style="width: 100px" @change="setlinfos = []">
        <el-option v-for="item in clrTypes" :key="item.code" :value="item.code" :label="item.name"></el-option>
      </el-select>
      <el-date-picker
        v-model="dateRange"
        type="daterange"
        :shortcuts="setlShtcuts"
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        style="width: 220px"
        @change="setlinfos = []"
      ></el-date-picker>
      <el-select v-model="slctSetlPrm.insutype" placeholder="险种类型" filterable clearable style="width: 120px" @change="currentPage = 1">
        <el-option v-for="item in insutypes" :key="item.code" :value="item.code" :label="item.name"></el-option>
      </el-select>
      <el-select v-model="slctSetlPrm.setlOptins" placeholder="清算机构" filterable clearable :disabled="setlinfos.length === 0" style="width: 120px" @change="currentPage = 1">
        <el-option v-for="item in optins" :key="item.code" :value="item.code" :label="item.name"></el-option>
      </el-select>
      <el-divider direction="vertical"></el-divider>
      <el-button type="primary" icon="el-icon-search" @click="getSetlInfos">检索</el-button>
      <el-button type="primary" icon="el-icon-coin" @click="bfrChkSetl">对总账</el-button>
      <el-button type="primary" icon="el-icon-data-analysis" @click="setlDtlCheck">明细对账</el-button>
    </el-header>
    <el-main>
      <el-table :data="cptSetlinfos.slice(pageSize * (currentPage - 1), pageSize * currentPage)" stripe :height="tableHeight" highlight-current-row>
        <el-table-column type="index" label="序号"></el-table-column>
        <el-table-column prop="patNo" label="住院号/门诊号"></el-table-column>
        <el-table-column prop="times" label="次数"></el-table-column>
        <el-table-column prop="psnName" label="姓名"></el-table-column>
        <el-table-column prop="gendName" label="性别"></el-table-column>
        <el-table-column prop="brdy" label="出生日期"></el-table-column>
        <el-table-column prop="insutypeName" label="险种类型"></el-table-column>
        <el-table-column prop="psnTypeName" label="人员类别"></el-table-column>
        <el-table-column prop="mdtrtId" label="就诊ID"></el-table-column>
        <el-table-column prop="setlId" label="结算ID"></el-table-column>
        <el-table-column prop="setlTime" label="结算时间"></el-table-column>
        <el-table-column prop="medTypeName" label="医疗类别"></el-table-column>
        <el-table-column prop="medfeeSumamt" label="总费用"></el-table-column>
        <el-table-column prop="fundPaySumamt" label="报销金额"></el-table-column>
        <el-table-column prop="acctPay" label="个人账户支出"></el-table-column>
        <el-table-column prop="psnCashPay" label="个人现金支出"></el-table-column>
        <el-table-column prop="clrOptinsName" label="清算机构"></el-table-column>
      </el-table>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[15, 30, 45, 60]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="cptSetlinfos.length"
        style="margin-top: 5px"
      ></el-pagination>
      <el-dialog v-model="showSetlDtlCheckRslt" title="明细对账结果" :close-on-click-modal="false" :close-on-press-escape="false">
        <el-table :data="setlDtlCheckRslt" stripe :height="300" highlight-current-row>
          <el-table-column type="index" label="序号"></el-table-column>
          <el-table-column prop="psnNo" label="人员编号"></el-table-column>
          <el-table-column prop="mdtrtId" label="就诊ID"></el-table-column>
          <el-table-column prop="setlId" label="结算ID"></el-table-column>
          <el-table-column prop="msgId" label="结算报文ID"></el-table-column>
          <el-table-column prop="memo" label="对账结果"></el-table-column>
          <el-table-column prop="medfeeSumamt" label="总费用"></el-table-column>
          <el-table-column prop="fundPaySumamt" label="报销金额"></el-table-column>
          <el-table-column>
            <template #default="scope">
              <el-button type="text" icon="el-icon-document" @click="getSetlinfo(scope.row)">结算信息</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-dialog>
      <el-dialog v-model="showSetlinfo" title="结算信息" :close-on-click-modal="false" width="70%">
        <Setlinfo :setlinfo="setlinfo" />
      </el-dialog>
    </el-main>
  </el-container>
</template>

<script>
import { computed, onMounted, reactive, ref } from '@vue/runtime-core'
import store from '@/store'
import { getClrTypes, getInsutypes } from '@/api/medical-insurance/si-dict'
import { setlShtcuts } from '@/data/shortcuts'
import { ElMessage, ElMessageBox } from 'element-plus'
import { institutionSettlementDetailCheck, institutionSettlementLedgerCheck, selectSetlinfos } from '@/api/medical-insurance/si-manage'
import { querySettlementInfo } from '@/api/medical-insurance/si-query'
import { formatDate } from '@/utils/date'
import Setlinfo from '../../../components/medical-insurance/setlinfo/Index.vue'

export default {
  components: {
    Setlinfo,
  },
  setup() {
    const windowSize = store.state.app.windowSize
    const tableHeight = windowSize.h - 100
    const insutypes = ref([])
    const clrTypes = ref([])
    const dateRange = ref(null)
    const setlinfos = ref([])
    const optins = ref([])
    const slctSetlPrm = reactive({
      insutype: '',
      clrType: null,
      setlOptins: null,
      stmtBegndate: null,
      stmtEnddate: null,
    })
    const pageSize = ref(30)
    const currentPage = ref(1)
    const handleSizeChange = (val) => {
      pageSize.value = val
    }
    const handleCurrentChange = (val) => {
      currentPage.value = val
    }
    const cptSetlinfos = computed(() => {
      return setlinfos.value.filter((item) => {
        if (!slctSetlPrm.insutype && !slctSetlPrm.setlOptins) {
          return true
        }

        if (slctSetlPrm.insutype && !slctSetlPrm.setlOptins) {
          return item.insutype === slctSetlPrm.insutype
        }

        if (!slctSetlPrm.insutype && slctSetlPrm.setlOptins) {
          return item.clrOptins === slctSetlPrm.setlOptins
        }

        return item.insutype === slctSetlPrm.insutype && item.clrOptins === slctSetlPrm.setlOptins
      })
    })
    const getSetlInfos = () => {
      if (!slctSetlPrm.clrType) {
        ElMessage({
          message: '请选择结算类别！',
          type: 'warning',
          showClose: true,
        })
        return
      }
      if (!dateRange.value) {
        ElMessage({
          message: '请选择日期范围！',
          type: 'warning',
          showClose: true,
        })
        return
      }
      slctSetlPrm.stmtBegndate = formatDate(dateRange.value[0])
      slctSetlPrm.stmtEnddate = formatDate(dateRange.value[1])
      selectSetlinfos(slctSetlPrm)
        .then((res) => {
          setlinfos.value = res.list
          optins.value = res.optins
        })
        .catch(() => {
          setlinfos.value = []
          optins.value = []
        })
    }

    const bfrChkSetl = () => {
      if (setlinfos.value.length === 0) {
        ElMessage({
          message: '没有数据！请先检索。',
          type: 'warning',
          showClose: true,
        })
        return
      }
      if (!slctSetlPrm.insutype) {
        ElMessage({
          message: '对总账时险种类型不能为空！',
          type: 'warning',
          showClose: true,
        })
        return
      }
      if (!slctSetlPrm.setlOptins) {
        ElMessage({
          message: '请选择清算机构！',
          type: 'warning',
          showClose: true,
        })
        return
      }
      institutionSettlementLedgerCheck(slctSetlPrm).then((res) => {
        ElMessageBox.alert(res, {
          type: 'success',
        })
      })
    }

    const setlDtlCheckRslt = ref([])
    const showSetlDtlCheckRslt = ref(false)
    const setlDtlCheck = () => {
      if (setlinfos.value.length === 0) {
        ElMessage({
          message: '没有数据！请先检索。',
          type: 'warning',
          showClose: true,
        })
        return
      }
      if (slctSetlPrm.insutype) {
        ElMessage({
          message: '明细对账时请不要选择险种类型！',
          type: 'warning',
          showClose: true,
        })
        return
      }
      if (!slctSetlPrm.setlOptins) {
        ElMessage({
          message: '请选择清算机构！',
          type: 'warning',
          showClose: true,
        })
        return
      }
      institutionSettlementDetailCheck(slctSetlPrm).then((res) => {
        setlDtlCheckRslt.value = res
        showSetlDtlCheckRslt.value = true
      })
    }

    const setlinfo = ref({})
    const showSetlinfo = ref(false)
    const getSetlinfo = (row) => {
      console.log(row)
      const param = {
        psnNo: row.psnNo,
        mdtrtId: row.mdtrtId,
      }
      querySettlementInfo(param).then((res) => {
        setlinfo.value = res
        showSetlinfo.value = true
      })
    }

    onMounted(() => {
      getInsutypes().then((res) => {
        insutypes.value = res
        getClrTypes().then((res2) => {
          clrTypes.value = res2
        })
      })
    })

    return {
      tableHeight,
      insutypes,
      clrTypes,
      dateRange,
      slctSetlPrm,
      setlShtcuts,
      setlinfos,
      cptSetlinfos,
      pageSize,
      currentPage,
      setlDtlCheckRslt,
      optins,
      showSetlDtlCheckRslt,
      setlinfo,
      showSetlinfo,
      getSetlinfo,
      handleCurrentChange,
      handleSizeChange,
      getSetlInfos,
      bfrChkSetl,
      setlDtlCheck,
    }
  },
}

function calSumamt(list) {
  let medSum = 0
  let fundSum = 0
  let acctSum = 0
  let psnCashPay = 0
  list.forEach((item) => {
    medSum += item.medfeeSumamt
    fundSum += item.fundPaySumamt
    acctSum += item.acctPay
    psnCashPay += item.psnCashPay
  })
  medSum = medSum.toFixed(2)
  fundSum = fundSum.toFixed(2)
  acctSum = acctSum.toFixed(2)
  psnCashPay = psnCashPay.toFixed(2)
  return { medSum, fundSum, acctSum, psnCashPay }
}
</script>
