<template>
  <div class="layout_display_flex_y">
    <div>
      <el-button type="danger" @click="xiangMuTuiFeiClick" icon="Delete">退费</el-button>
      <el-button type="primary" @click="weiGuiTuiFeiFenXiDialogOpen(true)">违规费用分析</el-button>
      <el-button type="primary" @click="exportExecl" icon="Download">导出 Excel</el-button>
    </div>

    <div class="layout_flex_1-y layout_display_flex_y">
      <div class="layout_flex_1-y">
        <el-table :data="cptTableDataHuanZheFeiYong"
                  height="100%"
                  @selection-change="handleSelectionChange" highlight-current-row stripe>
          <el-table-column type="selection"></el-table-column>
          <el-table-column label="流水号" prop="detailSn" width="70px"></el-table-column>
          <el-table-column label="医嘱号" prop="orderNo" width="70px"></el-table-column>
          <el-table-column prop="chargeDate" label="录入日期" width="80px"></el-table-column>
          <el-table-column prop="chargeCodeMx" label="项目编码"></el-table-column>
          <el-table-column prop="chargeName" label="项目名称"></el-table-column>
          <el-table-column prop="drugname" label="药品名称"
                           v-if="patient.feiYongLeiXingCode === 1"></el-table-column>
          <el-table-column prop="genTime" label="执行时间" width="80px"></el-table-column>
          <el-table-column prop="execDept" label="执行科室"></el-table-column>
          <el-table-column prop="deptCode" label="申请科室"></el-table-column>
          <el-table-column prop="chargeFee" label="金额"></el-table-column>
          <el-table-column label="数量" prop="chargeAmount"></el-table-column>
          <el-table-column label="状态" prop="chargeStatus">
            <template #default="scope">
              {{ costState(scope.row.chargeStatus) }}
            </template>
          </el-table-column>
          <el-table-column label="录入人" prop="opName"></el-table-column>
          <el-table-column label="账单码" prop="billItemName"></el-table-column>
          <el-table-column label="是否退费" prop="tuiFeiFlag">
            <template #default="scope">
              <span v-if="scope.row.oriDetailSn === -1" style="color: red">已退费 <br/> </span>
              <span v-if="scope.row.oriDetailSn > 0"
              ><span style="color: #e6a23c">退费数据</span> <br/>
              <span style="color: teal">
                原流水号为 <br/>
                【 {{ scope.row.oriDetailSn }} 】
              </span>
            </span>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div>
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="fenYe.currentPage"
            :page-sizes="[20, 30, 40, 50, 100]"
            :page-size="fenYe.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="fenYe.total"
            style="margin-top: 5px"
        ></el-pagination>
      </div>
    </div>
  </div>

  <el-dialog
      v-model="weiGuiTuiFeiFenXiDialog"
      title="违规费用分析"
      :fullscreen="true">
    <wei-gui-fei-yong-fen-xi
        :init="weiGuiTuiFeiInit"
        @open="weiGuiTuiFeiOpenDialog"
        :patient="weiGuiJiBenXinXi"/>
  </el-dialog>
</template>

<script lang="ts" setup>
import {ref, watch} from 'vue'
import {costState} from '@/utils/computed'
import WeiGuiFeiYongFenXi from '@/components/inpatient/WeiGuiFeiYongFenXi.vue'
import {ElMessage, ElMessageBox} from 'element-plus'
import {refund} from "@/api/hospitalization-costs/hospitalization-costs-api";
import {useUserStore} from "@/pinia/user-store";

const props = defineProps({
  init: {
    type: Object,
  },
  patient: {
    type: Object,
  },
})

const emits = defineEmits<{
  (e: 'size', value: any)
  (e: 'current', value: any)
  (e: 'query-fei-yong')
  (e: 'execl')
}>()


const cptTableDataHuanZheFeiYong = ref([])
const fenYe = ref({
  pageSize: 30,
  currentPage: 1,
  total: 0,
})

const userStore = useUserStore().userInfo

watch(
    () => props.init,
    () => {
      cptTableDataHuanZheFeiYong.value = props.init.records
      fenYe.value.total = typeof props.init.total === 'undefined' ? 0 : props.init.total
    }
)

// 分页
const handleSizeChange = (val) => {
  fenYe.value.pageSize = val
  fenYe.value.currentPage = 1
  emits('size', {val})
}

const handleCurrentChange = (val) => {
  fenYe.value.currentPage = val
  emits('current', {val})
}

// 获取选择到的项目
const handleSelectionChange = (val) => {
  props.patient.list = val
}

const xiangMuTuiFeiClick = () => {
  props.patient.deptCode = userStore.deptCode
  try {
    let chargeFee = 0
    let chargeAmount = 0
    for (let i = 0; i < props.patient.list.length; i++) {
      chargeFee += props.patient.list[i].chargeFee
      chargeAmount += props.patient.list[i].chargeAmount
    }
    // @ts-ignore
    ElMessageBox.confirm(
        `退费数量为：<span style='color:red'>【${chargeAmount}】</span> ，总价格为：<span style='color:#E6A23C'>【${chargeFee.toFixed(2)}】</span>`,
        '请认真核对',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          dangerouslyUseHTMLString: true
        }
    ).then(async () => {
      let data = {
        inpatientNo: props.patient.inpatientNo,
        admissTimes: props.patient.admissTimes,
        groupNo: null,
        list: props.patient.list,
        refundFlag: 'refundOnly'
      }
      await refund(data)
      emits('query-fei-yong')
    })
        .catch(() => {
        })
  } catch (e) {
    ElMessage.error({
      message: '请选择退费数据',
      showClose: true,
    })
  }
}

///////////////////////////////////////////// 违规退费分析 /////////////////////////////////////////////////////////////////////////
const weiGuiTuiFeiInit = ref(0)
const weiGuiTuiFeiFenXiDialog = ref(true)

const weiGuiJiBenXinXi = ref({})

const weiGuiTuiFeiFenXiDialogOpen = (val) => {
  // 014912
  weiGuiTuiFeiInit.value += 1
  weiGuiJiBenXinXi.value.openDialog = val
  weiGuiJiBenXinXi.value.deptCode = userStore.deptCode
  weiGuiJiBenXinXi.value.inpatientNo = typeof props.patient.inpatientNo === 'undefined' ? '' : props.patient.inpatientNo
}

const weiGuiTuiFeiOpenDialog = (val) => {
  weiGuiTuiFeiFenXiDialog.value = val
}

const exportExecl = () => {
  emits('execl')
}


</script>

<style></style>
