yyb
刚刚 dacc95761cf7090c628fc37a5d4f8bb825ccbbb0
src/components/Dialog/FileList.vue
@@ -5,7 +5,8 @@
             @close="handleClose"
             class="attachment-dialog">
    <!-- 工具栏 -->
    <div class="toolbar">
    <div v-if="editable"
         class="toolbar">
      <el-button type="primary"
                 size="small"
                 @click="handleUpload">
@@ -16,10 +17,11 @@
    <el-dialog v-model="uploadDialogVisible"
               title="上传附件"
               width="50%"
               @close="handleUploadClose">
               @close="closeUpload">
      <AttachmentUpload v-model:file-list="newFileList" />
      <template #footer>
        <el-button @click="handleUploadClose">关闭</el-button>
        <el-button @click="saveUpload">保存</el-button>
        <el-button @click="closeUpload">关闭</el-button>
      </template>
    </el-dialog>
    <!-- 文件列表表格 -->
@@ -34,17 +36,25 @@
        <el-table-column v-if="showActions"
                         fixed="right"
                         label="操作"
                         :width="120"
                         :width="150"
                         align="center">
          <template #default="scope">
            <el-button link
                       type="primary"
                       size="small"
                       :href="scope.row.downloadURL"
                       class="download-link">
              下载
                       class="download-link"
                       @click="previewFile(scope.row.previewURL)">
              预览
            </el-button>
            <el-button link
                       type="primary"
                       size="small"
                       class="download-link"
                       @click="downloadFile(scope.row.downloadURL)">
              下载
            </el-button>
            <el-button v-if="editable"
                       link
                       type="danger"
                       size="small"
                       @click="handleDelete(scope.row)">
@@ -55,9 +65,11 @@
      </el-table>
    </div>
  </el-dialog>
  <filePreview ref="filePreviewRef" />
</template>
<script setup>
import { ElMessage } from 'element-plus'
  import { ref, computed, getCurrentInstance, onMounted, watch } from "vue";
  import AttachmentUpload from "@/components/AttachmentUpload/file/index.vue";
  import {
@@ -65,6 +77,8 @@
    deleteAttachment,
    createAttachment,
  } from "@/api/basicData/storageAttachment.js";
  import filePreview from '@/components/filePreview/index.vue'
  const filePreviewRef = ref()
  const props = defineProps({
    visible: {
@@ -93,6 +107,10 @@
      type: Boolean,
      default: true,
    },
    editable: {
      type: Boolean,
      default: true,
    },
  });
  const emit = defineEmits(["close", "download", "upload", "delete"]);
@@ -115,38 +133,52 @@
    isShow.value = false;
  };
  // 预览文件
  const previewFile = (url) => {
    if (url) {
      filePreviewRef.value.open(url)
    } else {
      ElMessage.warning('文件地址无效,无法预览')
    }
  }
  const handleUpload = () => {
    uploadDialogVisible.value = true;
  };
  const handleUploadClose = async () => {
  const saveUpload = async () => {
    // 检查是否有新上传的文件
    if (newFileList.value.length > 0) {
      try {
        await createAttachment({
          application: "file",
          recordType: props.recordType,
          recordId: props.recordId,
          storageBlobDTOs: [...newFileList.value, ...tableData.value],
        });
        newFileList.value = [];
        // 刷新列表
        setList();
      } catch (error) {
        proxy?.$modal?.msgError("上传失败");
      }
      createAttachment({
        application: "file",
        recordType: props.recordType,
        recordId: props.recordId,
        storageBlobDTOs: [...newFileList.value, ...tableData.value],
      }).then((res) => {
        if (res && res.code === 200) {
          proxy?.$modal?.msgSuccess("上传成功");
          newFileList.value = [];
          // 刷新列表
          setList();
        }
      }).finally(() => {
        uploadDialogVisible.value = false;
      })
    }
  }
  const closeUpload = () => {
    newFileList.value = [];
    uploadDialogVisible.value = false;
  };
  const handleDelete = async (row, index) => {
    try {
      await deleteAttachment([row.storageAttachmentId]);
      proxy?.$modal?.msgSuccess("删除成功");
      setList();
    } catch (error) {
      proxy?.$modal?.msgError("删除失败");
    }
    deleteAttachment([row.storageAttachmentId]).then((res) => {
      if (res && res.code === 200) {
        proxy?.$modal?.msgSuccess("删除成功");
        setList();
      }
    })
  };
  const setList = () => {
@@ -154,12 +186,13 @@
      recordType: props.recordType,
      recordId: props.recordId,
    }).then(res => {
      if (res && res.data) {
        tableData.value = res.data || [];
      }
      tableData.value = (res && res.data) || [];
    });
  };
  const downloadFile = url => {
    window.open(url, "_blank");
  };
  onMounted(() => {
    setList();
  });