<template>
  <div class="order-title">
    订单详情
  </div>
  <div class="order-wrapper">
    <van-cell title="医院名称" value="长沙泰和医院"></van-cell>
    <van-cell title="费用类型" :value="createOrderRequest.body"></van-cell>
    <van-cell title="就诊科室" :value="createOrderRequest.deptName"></van-cell>
    <div v-if="createOrderRequest.orderType !== 3">
      <van-cell title="医生姓名" :value="createOrderRequest.doctorName"></van-cell>
    </div>
    <div v-if="createOrderRequest.orderType === 1">
      <van-cell title="医生职称" :value="createOrderRequest.chargeType"></van-cell>
      <van-cell title="就诊日期" :value="createOrderRequest.week + '  ' + createOrderRequest.date"></van-cell>
      <van-cell title="就诊时段" :value="createOrderRequest.ampm + '  ' + (createOrderRequest.apValue || '')"></van-cell>
    </div>
    <van-cell title="就诊人" :value="createOrderRequest.patientName"></van-cell>
    <van-cell title="就诊卡号" :value="createOrderRequest.patientId"></van-cell>

    <div v-if="createOrderRequest.orderType === 3">
      <van-cell title="住院号" :value="createOrderRequest.inpatientNo"></van-cell>
    </div>

    <van-cell title="支付金额">
      <template #value>
        <span style="color: orangered">{{ fixDigits(createOrderRequest.cashpayAmt) }}</span>
      </template>
    </van-cell>
    <van-cell title="支付时间" :value="createOrderRequest.payTime"></van-cell>

    <div v-if="createOrderRequest.orderType === 2">
      <van-cell title="项目清单"></van-cell>
      <div style="text-align: center; margin-top: 8px; font-size: 12px; color: #0f5757">
        <van-row>
          <van-col span="10">名称</van-col>
          <van-col span="5">单价</van-col>
          <van-col span="4">数量</van-col>
          <van-col span="5">金额</van-col>
        </van-row>
        <div style="height: 5px"></div>
        <div v-for="(fee, index) in createOrderRequest.chargeList" :key="index">
          <div style="height: 5px"></div>
          <van-row>
            <van-col span="10">{{ fee.itemName }}</van-col>
            <van-col span="5">{{ fixPrice(fee.itemPrice) }}</van-col>
            <van-col span="4">{{ fee.itemNumber }}</van-col>
            <van-col span="5">{{ fixPrice(fee.itemTotalFee) }}</van-col>
          </van-row>
          <div style="height: 5px"></div>
        </div>
      </div>
    </div>
  </div>
  <div class="close-wrapper">
    <van-button
        size="small"
        type="danger"
        round
        plain
        style="width: 120px"
        @click="closeComponent"
    >
      关闭
    </van-button>
  </div>
</template>

<script setup>
import store from "@/store";

const emits = defineEmits(['close'])

const createOrderRequest = store.getters.getCreateOrderRequest

function fixDigits(money) {
  return '￥' + money
}

function fixPrice(money) {
  let m = money / 100
  return '￥' + m.toFixed(2)
}

function closeComponent() {
  emits('close')
}
</script>

<style scoped>
.order-title {
  height: 50px;
  font-size: 16px;
  font-weight: bold;
  line-height: 50px;
  text-align: center;
  background-color: #f5f5f5;;
}
.order-wrapper {
  height: calc(100vh - 100px);
  overflow-y: auto;
}
.close-wrapper {
  height: 50px;
  line-height: 40px;
  text-align: center;
  background-color: #f5f5f5;;
}
</style>