<template>
  <Dialog
    v-model="diaVisible"
    diaTitle="附件"
    width="60%"
    height="50%"
    @close="closeFun"
    show-footer
  >
    <BaseTable
      ref="tableRef"
      showIndex
      tableName="DEMAND_ATTACHMENT"
      :params="{uuid:demandId}"
      :api="dataQueryDirApi"
      :searchLimitNum="3"
      :actionsWidth="tableActionsLength['2-2-2']"
    >
      <template #fileSize="{ row }">
        {{ formatFileSize(row.fileSize) }}
      </template>
      <template #tableActions="{ row }">
        <div class="gl-table-actions">
          <el-link type="primary" @click="reviewFile(row.id)">预览</el-link>
          <el-link type="primary" @click="downloadFile(row)">下载</el-link>
          <el-popconfirm
            title="确认删除吗？"
            @confirm="deleteFileFun(row.id)"
          >
            <template #reference>
              <el-link type="danger">删除</el-link>
            </template>
          </el-popconfirm>
        </div>
      </template>
    </BaseTable>
    <template #footer>
      <div>
        <el-button @click="closeFun">取消</el-button>
        <el-button type="primary" @click="closeFun">确认</el-button>
      </div>
    </template>
  </Dialog>
</template>

<script setup lang="ts">
import { computed, ref } from 'vue';
import BaseTable from '@/components/common/table/baseTable.vue';
import Dialog from '@/components/common/dialog/index.vue';
import { dataDelFileApi, dataQueryDirApi } from '@/api/data/data';
import { formatFileSize, openTabReviewFile } from '@/utils/file';
import { ElMessage } from 'element-plus';
import { tableActionsLength } from '@/utils/common';

const props = defineProps<{
  visible: boolean;
  demandId: string;
}>();

const emits = defineEmits(['update:visible']);

const diaVisible = computed({
  get: () => props.visible,
  set: (val) => {
    emits('update:visible', val);
  },
});

const closeFun = () => {
  diaVisible.value = false;
};
const tableRef = ref();
const deleteFileFun = async(id:number) => {
  const res:any = await dataDelFileApi({ delFileId: id });
  if (res.code === 200) {
    ElMessage.success('删除成功');
    tableRef.value.resetFun();
  }
};
const env = import.meta.env;
const downloadFile = (row: any) => {
  const downloadUrl = `${env.VITE_API_FILE_URL}/data/downloadFile?fileId=${row.id}`;
  window.open(downloadUrl, '_blank');
};

const reviewFile = (id: number) => {
  openTabReviewFile(id);
};

</script>

<style lang="scss" scoped>

</style>
