<template>
  <BasicModal
    v-bind="$attrs"
    @register="register"
    title="生产科发票"
    width="700px"
    :bodyStyle="{ height: '240px' }"
    @ok="handleOk"
  >
    <a-list item-layout="horizontal" :data-source="itemArray">
      <template #renderItem="{ item }">
        <a-list-item>
          <a-list-item-meta>
            <template #title>
              <!-- <a :href="item.url" target="_blank" rel="noopener noreferrer">{{ item.name }}</a> -->
              <a @click="view(item.url)">{{ item.name }}</a>
            </template>
          </a-list-item-meta>
        </a-list-item>
      </template>
    </a-list>
  </BasicModal>
</template>
<script lang="ts" setup>
  import { BasicModal, useModalInner } from '@/components/Modal';
  import { computed, ref } from 'vue';
  import type { UploadProps, UploadChangeParam } from 'ant-design-vue';
  import { InboxOutlined } from '@ant-design/icons-vue';
  import { message } from 'ant-design-vue';
  import { getDeductUrlById, getInvoiceUrlById } from '@/api/project/invoice';
  import { view } from '@/utils/pdfShow';

  interface Item {
    name: string;
    url: string;
  }

  const list = ref();
  const id = ref();
  const itemArray = ref<Item[]>([]);

  const [register, { closeModal }] = useModalInner(async (data) => {
    itemArray.value = [];
    const res = await getInvoiceUrlById({ id: data.data.id });
    for (let item in res) {
      const url = res[item];
      const name = item;
      // 将 name 和 url 放入对象并添加到数组中
      itemArray.value.push({ name, url });
    }
  });

  async function handleOk() {
    itemArray.value = [];
    closeModal();
  }
</script>