<template>
  <el-drawer :model-value="visible" size="70%" style="--el-drawer-padding-primary: 0" @close="close()">
    <template #header>
      <div class="flex items-center py-2">
        <span v-if="order && order.consultType === 'onlineMedicinePurchase'" class="purchase-tag mr-2">在线配药</span>
        <span v-if="order && order.consultType === 'wineConsult'" class="purchase-tag success mr-2">中药饮片</span>
        <div>本次病情概要 </div>
      </div>
    </template>
    <illness-summary-content v-if="visible" :order="order" />
  </el-drawer>
</template>
<script setup>
import { ref, watch } from "vue";
import dayjs from 'dayjs';
import MyLayout, { LayoutMain } from "@/components/layout";
import illnessSummaryContent from "@/components/illness-summary/illness-summary.vue";

const props = defineProps({
  order: {
    type: Object,
    default: () => ({})
  },
  visible: {
    type: Boolean,
    default: false,
  },
});

const emit = defineEmits(["close"]);

function close() {
  emit("close");
}

</script>
<style lang="scss" scoped>
.purchase-tag {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 4px;
  background: #b8956a;
  color: white;
  font-size: 14px;
}
.purchase-tag.success{
  background: #67c23a;
}
</style>
