<template>
  <div class="p-15px text-14px leading-28px">
    <div v-if="info.status ==='UNPASS'" class="text-14px px-15px py-12px rounded text-red-500 bg-red-200 bg-opacity-30">
      审核状态： 审核不通过，原因：{{reasonStr}}</div>
    <div v-else-if="info.status ==='PASS'"
      class="text-14px px-15px py-12px rounded  text-green-500 bg-green-200 bg-opacity-30">审核状态： 审核通过</div>
    <div active-title-bar class="mt-10px">就诊信息</div>
    <el-form class="mt-5px" label-suffix="：">
      <el-row>
        <el-col :lg="8" :md="12" :xs="24">
          <el-form-item class="mb-0" label="挂号科室">{{order.deptName}} </el-form-item>
        </el-col>
        <el-col :lg="8" :md="12" :xs="24">
          <el-form-item class="mb-0" label="就诊日期">{{order.createTime ? dayjs(order.createTime).format('YYYY-MM-DD') : ''
            }} </el-form-item>
        </el-col>
        <el-col :lg="8" :md="12" :xs="24">
          <el-form-item class="mb-0" label="医生">{{order.doctorName}} </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div active-title-bar class="mt-10px">门诊病历</div>
    <el-form class="mt-5px" label-suffix="：">
      <el-form-item class="mb-0" label="主诉">{{info.complaint}} </el-form-item>
      <el-form-item class="mb-0" label="现病史">{{info.presentIllness}} </el-form-item>
      <el-form-item class="mb-0" label="处置">{{info.dispose}} </el-form-item>
      <el-form-item v-for="(i, idx) in (info.diagnosisList || [])" :key="idx" class="mb-0" :label="'诊断'+(idx +1)">
        {{i.name}} {{i.desc}}
      </el-form-item>
    </el-form>
    <div active-title-bar class="my-10px">药品信息</div>
    <el-table :data="drugs">
      <el-table-column label="序号" prop="index" width="80">
        <template #default="{row,$index}">
          {{ $index +1 }}
        </template>
      </el-table-column>
      <el-table-column label="药品" prop="drugName" :min-width="200">
        <template #default="{row}">
          {{ row.drugName }} {{ row.specification }} 
          <span v-if="row.details" class="text-gray-500">({{ row.details }})</span>
        </template>
      </el-table-column>
      <el-table-column label="数量" prop="drugName" :min-width="120">
        <template #default="{row}">
          {{ row.quantity }} {{ row.unit }}
        </template>
      </el-table-column>
      <el-table-column v-if="order.consultType!=='wineConsult'" label="用法" prop="memo" :min-width="170" />
    </el-table>
  </div>
</template>
<script setup>
import { computed } from 'vue';
import dayjs from 'dayjs';

const props = defineProps({
  order: { type: Object, default: () => ({}) },
  info: { type: Object, default: () => ({}) },
})
const drugs = computed(() => {
  return props.info && Array.isArray(props.info.drugs) ? props.info.drugs.map(i => {
    const memo = [i.usageName, i.frequencyName, i.dosage ? `每次${i.dosage}${(i.dosage_unit || '')}` : ''].filter(Boolean).join('，')
    return { ...i, memo }
  }) : []
})

const reasonStr = computed(() => {
  return props.info && Array.isArray(props.info.reasons) ? props.info.reasons.join('，') : '';
})
</script>
<style lang="scss" scoped></style>
