<template>
  <xc-dialog-v2 title="退费详细"
                v-model="modelValue"
                width="100%"
                @closed="emit('update:modelValue',false)">
    <page-layer>
      <template #header>
        数量：{{ chargeAmount }} 金额： {{
          chargeFee.toLocaleString('zh', {
            style: 'currency',
            currency: 'cny',
            currencyDisplay: 'name'
          })
        }}
        <div v-if="isDrug">
          药房：
          <el-select v-model="groupNo">
            <el-option value="71" label="门诊"/>
            <el-option value="73" label="住院"/>
          </el-select>
        </div>
        <el-button @click="confirmRefund('drugWithdrawal')" icon="Delete" type="danger"
                   title="项目可直接退费，只有对应的执行科室可以退费，药品会产生药单，在药房确认退药后会产生退费数据，口服药无法退费。如药房拒绝可再次退费。">
          {{ isDrug ? '退药且退费' : '退费' }}
        </el-button>
        <el-button v-if="isDrug"
                   @click="confirmRefund('refundOnly')"
                   icon="Delete"
                   type="warning"
                   title="只会生成退费的费用，不会产生药单到药房。">
          仅退费不退药
        </el-button>
      </template>

      <template #mainMaxContentHeight>
        <div style="color: red">
          请注意如果点击了【退费且退药】那么需要提交一次药单。
        </div>
        <xc-table :local-data="props.list" :height="400">
          <el-table-column fixed="left" label="操作">
            <template #default="scope">
              <el-button @click="deleteData(scope.row,scope.row.$index)" icon="Delete" type="danger">删除</el-button>
            </template>
          </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 label="录入日期" prop="chargeDate" width="70px"></el-table-column>
          <el-table-column label="项目编码" prop="chargeCodeMx"></el-table-column>
          <el-table-column label="项目名称" prop="chargeName"></el-table-column>
          <el-table-column label="规格" prop="specification"></el-table-column>
          <el-table-column label="药品名称" prop="drugname"></el-table-column>
          <el-table-column label="执行科室" prop="execDept"></el-table-column>
          <el-table-column label="申请科室" prop="deptCode"></el-table-column>
          <el-table-column label="金额" prop="chargeFee"></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-html="conversionRefundFlag(scope.row.oriDetailSn)" style="color:red;"></span>
              <br>
              <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>
        </xc-table>

      </template>
    </page-layer>
  </xc-dialog-v2>
</template>

<script setup name='RefundForProjectEntry'>
import XcDialogV2 from "@/components/xiao-chan/dialog/XcDialogV2";
import XcTable from "@/components/xiao-chan/xc-table/XcTable";
import {conversionRefundFlag, costState} from "@/utils/computed";
import {ElMessageBox} from "element-plus";
import {xiangMuTuiFei} from "@/api/inpatient/xiang-mu-lu-ru";
import PageLayer from "@/layout/PageLayer";

const props = defineProps({
  modelValue: {
    type: Boolean
  },
  list: {
    type: Array,
    default: []
  },
  isDrug: {
    type: Boolean
  },
  patient: {
    type: Object
  }
})

const emit = defineEmits(['uncheck', 'update:modelValue', 'refreshFee'])

let chargeAmount = $ref(0)
let chargeFee = $ref(0)
let groupNo = $ref('73')


const confirmRefund = (flag) => {
  let pharmacyName = groupNo === '71' ? '门诊' : '住院'
  // 是否是药品退药 true
  let isDrugWithdrawal = props.isDrug && flag === 'drugWithdrawal'
  let title = isDrugWithdrawal ? `药品是否要退到 【${pharmacyName}】 药房` : '请确认数据'
  ElMessageBox.confirm(title, '请您仔细确认', {
    type: 'warning',
    confirmButtonText: '我已确认',
    cancelButtonText: '再看看',
  }).then(() => {
    props.patient.groupNo = groupNo
    props.patient.refundFlag = flag
    xiangMuTuiFei(props.patient).then((res) => {
      emit('refreshFee')
      emit('update:modelValue', false)
    })
  }).catch(() => {

  });
}

const deleteData = async (data, index) => {
  await emit('uncheck', data)
  props.list.splice(index, 1)
  if (props.list.length === 0) {
    emit('update:modelValue', false)
  }
  calculatedAmount()
}

const calculatedAmount = () => {
  chargeAmount = 0
  chargeFee = 0
  props.list.forEach(item => {
    chargeAmount += item.chargeAmount
    chargeFee += item.chargeFee
  })
}

onMounted(() => {
  calculatedAmount()
})

</script>

<style scoped lang="scss">

</style>
