<script lang="ts" setup>
import { ref } from 'vue';

import { useVbenModal } from '@vben/common-ui';

import { Descriptions } from 'ant-design-vue';

import { getProductOrderPriceAdjustLogDetail } from '../api';

const data = ref<Record<string, any>>({});

const [Modal, modalApi] = useVbenModal({
  showConfirmButton: false,
  cancelText: '关闭',
  draggable: true,
  onCancel() {
    modalApi.close();
  },
  async onOpenChange(isOpen) {
    if (!isOpen) {
      data.value = {};
      return;
    }
    const payload = modalApi.getData<{ id?: number; values?: any }>();
    const id = Number(payload?.id || payload?.values?.id || 0);
    if (id <= 0) {
      data.value = payload?.values || {};
      return;
    }
    modalApi.setState({ loading: true });
    try {
      const res = await getProductOrderPriceAdjustLogDetail(id);
      data.value = res?.data || res || {};
    } catch {
      data.value = payload?.values || {};
    } finally {
      modalApi.setState({ loading: false });
    }
  },
});
</script>

<template>
  <Modal class="w-[90%] md:w-[640px]" title="订单调价日志详情">
    <Descriptions bordered :column="2" size="small">
      <Descriptions.Item label="ID">{{ data.id }}</Descriptions.Item>
      <Descriptions.Item label="订单ID">{{ data.product_order_id }}</Descriptions.Item>
      <Descriptions.Item label="药品ID">{{ data.drug_id }}</Descriptions.Item>
      <Descriptions.Item label="方式">{{ data.adjust_mode_txt }}</Descriptions.Item>
      <Descriptions.Item label="原售价">{{ data.old_price }}</Descriptions.Item>
      <Descriptions.Item label="新售价">{{ data.new_price }}</Descriptions.Item>
      <Descriptions.Item label="原供货价">{{ data.old_buy_price ?? '-' }}</Descriptions.Item>
      <Descriptions.Item label="新供货价">{{ data.new_buy_price ?? '-' }}</Descriptions.Item>
      <Descriptions.Item label="调整额">{{ data.adjust_amount }}</Descriptions.Item>
      <Descriptions.Item label="百分比">{{ data.percent_value ?? '-' }}</Descriptions.Item>
      <Descriptions.Item label="操作人">{{ data.user_id }}</Descriptions.Item>
      <Descriptions.Item label="挂号ID">{{ data.register_id }}</Descriptions.Item>
      <Descriptions.Item label="备注" :span="2">{{ data.remark || '-' }}</Descriptions.Item>
      <Descriptions.Item label="时间" :span="2">{{ data.created_at }}</Descriptions.Item>
    </Descriptions>
  </Modal>
</template>
