<template>
  <window-size>
    <van-empty :image="empty" description="您没有待缴费记录" v-if="showEmpty"></van-empty>
    <div v-for="item in unpaidFees" :key="item.hisOrdNum">
      <van-cell :title="makeTitle(item)" :label="item.priceTime" is-link center @click="onClickFeeItem(item)">
        <template #default>
          <span style="color: orangered">{{ makeMoney(item.totalAmt) }}</span>
        </template>
      </van-cell>
      <div style="height: 5px"></div>
    </div>
  </window-size>
</template>

<script setup>
import { getUnPaidFee, getUnsettledMdtrtId } from '../../../api/pay-mz-fee'
import empty from '../../../assets/empty.png'
import { useRouter } from 'vue-router'
import { computed, onMounted, ref } from 'vue'
import store from "../../../store";
import {showDialog} from "vant";

const router = useRouter()
const patientId = router.currentRoute.value.params.patientId
const unpaidFees = ref([])
const showEmpty = computed(() => {
  return unpaidFees.value.length === 0
})

const onClickFeeItem = (item) => {
  const routeParams = {
    patientId: patientId,
    hisOrdNum: item.hisOrdNum,
    patName: item.patName,
    deptName: item.deptName,
    doctorCode: item.doctorCode,
    doctorName: item.doctorName,
    totalAmt: item.totalAmt,
    selfAmt: item.selfAmt,
    fundPay: item.fundPay,
    acctPay: item.acctPay
  }
  getUnsettledMdtrtId(item.hisOrdNum).then(res => {
    routeParams.mdtrtId = res
    toMedinsSettle(routeParams)
  }).catch(() => {
    toDetail(routeParams)
  })
}

const toMedinsSettle = (params) => {
  router.push({
    name: 'medinsSettle',
    params,
  })
}

const toDetail = (params) => {
  router.push({
    name: 'unPaidDetail',
    params,
  })
}

onMounted(() => {
  if (store.getters.hasCertainPatientId(patientId)) {
    getUnPaidFee(patientId).then((res) => {
      unpaidFees.value = res
    });
  } else {
    showDialog({
      title: '提示',
      message: `您尚未绑定门诊号为【${patientId}】的诊疗卡，请前往添加。`
    }).then(() => {
      router.push('/myPatientIdCards')
    });
  }
})

function makeTitle(item) {
  return item.deptName + ' | ' + item.doctorName
}

function makeMoney(money) {
  const m = money / 100
  return '￥ ' + m.toFixed(2)
}
</script>