Browse Source

修复系统附件列表文件预览bug,修改删除文件记录接口

cfort 2 years ago
parent
commit
41d7f99e7c

+ 12 - 0
src/api/platform/file/attachment.js

@@ -33,6 +33,18 @@ export function remove(params) {
     params: params
     params: params
   })
   })
 }
 }
+/**
+ * 删除文件
+ * @param {*} params
+ */
+ export function deleteFile(params) {
+    return request({
+      url: SYSTEM_URL() + '/file/delete',
+      method: 'post',
+      isLoading: true,
+      params: params
+    })
+  }
 /**
 /**
  * 保存数据
  * 保存数据
  * @param {*} params
  * @param {*} params

+ 9 - 14
src/business/platform/file/uploader/upload.vue

@@ -51,9 +51,7 @@
                 list-type="picture-card"
                 list-type="picture-card"
             >
             >
                 <i class="el-icon-upload" />
                 <i class="el-icon-upload" />
-                <div class="el-upload__text">
-                    将文件拖到此处,或<em>点击上传</em>
-                </div>
+                <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
             </el-upload>
             </el-upload>
 
 
             <el-dialog :visible.sync="dialogVisible" append-to-body>
             <el-dialog :visible.sync="dialogVisible" append-to-body>
@@ -63,7 +61,7 @@
     </div>
     </div>
 </template>
 </template>
 <script>
 <script>
-    import { uploadFile, remove } from '@/api/platform/file/attachment'
+    import { uploadFile, remove, deleteFile } from '@/api/platform/file/attachment'
     import { fileTypes, allFileTypes, accept as acceptTypes } from '@/business/platform/file/constants/fileTypes'
     import { fileTypes, allFileTypes, accept as acceptTypes } from '@/business/platform/file/constants/fileTypes'
     export default {
     export default {
         props: {
         props: {
@@ -121,11 +119,7 @@
                     return false
                     return false
                 }
                 }
                 // if (this.$utils.isNotEmpty(this.accept) && this.handleAccpt(file) || this.fileExtType(file)) {
                 // if (this.$utils.isNotEmpty(this.accept) && this.handleAccpt(file) || this.fileExtType(file)) {
-                if (
-                    this.$utils.isNotEmpty(this.accept) &&
-                    this.accept &&
-                    !this.fileExtType(file)
-                ) {
+                if (this.$utils.isNotEmpty(this.accept) && this.accept && !this.fileExtType(file)) {
                     this.$message.closeAll()
                     this.$message.closeAll()
                     this.$message({
                     this.$message({
                         message: '不允许的文件类型',
                         message: '不允许的文件类型',
@@ -270,9 +264,9 @@
              */
              */
             clearFiles() {
             clearFiles() {
                 const ids = this.$refs.upload.uploadFiles.map((file) => {
                 const ids = this.$refs.upload.uploadFiles.map((file) => {
-                        // console.log(file.response.data.id)
-                        return file.response.data.id
-                    }).join(',')
+                    // console.log(file.response.data.id)
+                    return file.response.data.id
+                }).join(',')
 
 
                 if (this.$utils.isEmpty(ids)) {
                 if (this.$utils.isEmpty(ids)) {
                     this.$message.warning('请先上传文件!')
                     this.$message.warning('请先上传文件!')
@@ -284,7 +278,8 @@
                 })
                 })
             },
             },
             handleRemoteRemove(ids, callback) {
             handleRemoteRemove(ids, callback) {
-                remove({ attachmentIds: ids }).then(res => {
+                // 删除附件文件
+                deleteFile({ attachmentIds: ids }).then(() => {
                     const _this = this
                     const _this = this
                     // this.fileList = []
                     // this.fileList = []
                     callback(_this)
                     callback(_this)
@@ -338,4 +333,4 @@
             width: 100%;
             width: 100%;
         }
         }
     }
     }
-</style>
+</style>

+ 176 - 162
src/views/platform/file/attachment/detail.vue

@@ -1,171 +1,185 @@
 <template>
 <template>
-  <el-dialog
-    :title="title"
-    :visible.sync="dialogVisible"
-    :close-on-click-modal="false"
-    :close-on-press-escape="false"
-    append-to-body
-    class="dialog attachment-detail-dialog"
-    top="6vh"
-    @close="closeDialog"
-    @open="getFormData"
-  >
-    <el-form :label-width="formLabelWidth" class="attachment-from" @submit.native.prevent>
-      <el-form-item label="文件名:">
-        <span>{{ attachment.fileName }}</span>
-      </el-form-item>
-      <el-form-item label="附件分类:">
-        <span>{{ attachment.typeId }}</span>
-      </el-form-item>
-      <el-form-item label="附件类型:">
-        {{ attachment.fileType }}
-      </el-form-item>
-      <el-form-item label="文件路径">
-        {{ attachment.filePath }}
-      </el-form-item>
-      <el-form-item label="创建时间:">
-        {{ attachment.createTime |dateFormat }}
-      </el-form-item>
-      <el-form-item label="存储类型">
-        {{ attachment.storeType }}
-      </el-form-item>
-      <el-form-item label="总字节数">
-        {{ attachment.totalBytes |numberFormatter }}
-      </el-form-item>
-      <el-form-item label="扩展名:">
-        <span>{{ attachment.ext }}</span>
-      </el-form-item>
-      <el-form-item label="说明:">
-        <span>{{ attachment.note }}</span>
-      </el-form-item>
-      <el-form-item label="上传者">
-        {{ attachment.creatorName }}
-      </el-form-item>
-    </el-form>
-    <div slot="footer" class="el-dialog--center">
-      <ibps-toolbar
-        :actions="toolbars"
-        @action-event="handleActionEvent"
-      />
-    </div>
-    <file-preview
-      :file="attachment"
-      :visible="filePreviewVisible"
-      @close="visible => filePreviewVisible = visible"
-    />
-  </el-dialog>
+    <el-dialog
+        :title="title"
+        :visible.sync="dialogVisible"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+        append-to-body
+        class="dialog attachment-detail-dialog"
+        top="6vh"
+        @close="closeDialog"
+        @open="getFormData"
+    >
+        <el-form
+            :label-width="formLabelWidth"
+            class="attachment-from"
+            @submit.native.prevent
+        >
+            <el-form-item label="文件名:">
+                <span>{{ attachment.fileName }}</span>
+            </el-form-item>
+            <el-form-item label="附件分类:">
+                <span>{{ attachment.typeId }}</span>
+            </el-form-item>
+            <el-form-item label="附件类型:">
+                {{ attachment.fileType }}
+            </el-form-item>
+            <el-form-item label="文件路径">
+                {{ attachment.filePath }}
+            </el-form-item>
+            <el-form-item label="创建时间:">
+                {{ attachment.createTime | dateFormat }}
+            </el-form-item>
+            <el-form-item label="存储类型">
+                {{ attachment.storeType }}
+            </el-form-item>
+            <el-form-item label="总字节数">
+                {{ attachment.totalBytes | numberFormatter }}
+            </el-form-item>
+            <el-form-item label="扩展名:">
+                <span>{{ attachment.ext }}</span>
+            </el-form-item>
+            <el-form-item label="说明:">
+                <span>{{ attachment.note }}</span>
+            </el-form-item>
+            <el-form-item label="上传者">
+                {{ attachment.creatorName }}
+            </el-form-item>
+        </el-form>
+        <div slot="footer" class="el-dialog--center">
+            <ibps-toolbar
+                :actions="toolbars"
+                @action-event="handleActionEvent"
+            />
+        </div>
+    </el-dialog>
 </template>
 </template>
 
 
 <script>
 <script>
-import { get } from '@/api/platform/file/attachment'
-import { downloadFile } from '@/business/platform/file/utils'
-import FilePreview from '@/business/platform/file/file-preview'
+    import { get } from '@/api/platform/file/attachment'
+    import { downloadFile } from '@/business/platform/file/utils'
+    import { SYSTEM_URL, BASE_API } from '@/api/baseUrl'
 
 
-export default {
-  components: {
-    FilePreview
-  },
-  props: {
-    visible: {
-      type: Boolean,
-      default: false
-    },
-    id: String,
-    data: [Object, String]
-  },
-  data() {
-    return {
-      formName: 'attachmentForm',
-      title: '系统附件明细',
-      formLabelWidth: '120px',
-      dialogVisible: this.visible,
-      dialogLoading: false,
-      filePreviewVisible: false,
-      attachment: {
-        fileName: '',
-        typeId: '',
-        fileType: '',
-        filePath: '',
-        createTime: '',
-        storeType: '',
-        totalBytes: '',
-        ext: '',
-        note: '',
-        creatorName: ''
-      },
-      toolbars: [
-        { key: 'primary', icon: 'ibps-icon-eye', label: '预览' },
-        { key: 'download', icon: 'ibps-icon-download', label: '下载' },
-        { key: 'cancel' }
-      ]
+    export default {
+        props: {
+            visible: {
+                type: Boolean,
+                default: false
+            },
+            id: String,
+            data: [Object, String]
+        },
+        data() {
+            return {
+                formName: 'attachmentForm',
+                title: '系统附件明细',
+                formLabelWidth: '120px',
+                dialogVisible: this.visible,
+                dialogLoading: false,
+                filePreviewVisible: false,
+                attachment: {
+                    fileName: '',
+                    typeId: '',
+                    fileType: '',
+                    filePath: '',
+                    createTime: '',
+                    storeType: '',
+                    totalBytes: '',
+                    ext: '',
+                    note: '',
+                    creatorName: ''
+                },
+                toolbars: [
+                    { key: 'primary', icon: 'ibps-icon-eye', label: '预览' },
+                    {
+                        key: 'download',
+                        icon: 'ibps-icon-download',
+                        label: '下载'
+                    },
+                    { key: 'cancel' }
+                ],
+                fileOption: {
+                    user: {}
+                }
+            }
+        },
+        computed: {
+            formId() {
+                return this.id
+            },
+            formData() {
+                return this.data
+            }
+        },
+        watch: {
+            visible: {
+                handler: function (val, oldVal) {
+                    this.dialogVisible = this.visible
+                    console.log(this.data)
+                }
+                // immediate: true
+            }
+        },
+        created() {
+            this.getFormData()
+        },
+        methods: {
+            handleActionEvent({ key }) {
+                switch (key) {
+                    case 'primary':
+                        this.filePreview()
+                        break
+                    case 'download':
+                        this.handleDownload()
+                        break
+                    case 'cancel':
+                        this.closeDialog()
+                        break
+                    default:
+                        break
+                }
+            },
+            handleDownload() {
+                downloadFile(this.attachment)
+            },
+            // 获取明细数据
+            getFormData() {
+                if (this.$utils.isEmpty(this.formId)) {
+                    return
+                }
+                get({ attachmentId: this.formId }).then((response) => {
+                    this.attachment = response.data
+                }).catch(() => {})
+            },
+            // 关闭当前窗口
+            closeDialog() {
+                this.$emit('close', false)
+            },
+            filePreview () {
+                const { id, fileName, ext } = this.data
+                this.fileOption.user.id = this.$store.getters.userId
+                this.fileOption.user.name = this.$store.getters.name
+                this.fileOption.url = BASE_API() + SYSTEM_URL() + `/file/download?attachmentId=${id}`
+                this.fileOption.editUrl = BASE_API() + SYSTEM_URL() + `/file/editCallback?fileName=${fileName}&fileType=${ext}&id=${id}`
+                this.fileOption.title = fileName
+                this.fileOption.fileType = ext
+                // console.log(this.fileOption)
+                let routeData = this.$router.resolve({
+                    path: '/fileView',
+                    query: this.fileOption
+                })
+                window.open(routeData.href)
+            }
+        }
     }
     }
-  },
-  computed: {
-    formId() {
-      return this.id
-    },
-    formData() {
-      return this.data
-    }
-  },
-  watch: {
-    visible: {
-      handler: function(val, oldVal) {
-        this.dialogVisible = this.visible
-      },
-      immediate: true
-    }
-  },
-  created() {
-    this.getFormData()
-  },
-  methods: {
-    handleActionEvent({ key }) {
-      switch (key) {
-        case 'primary':
-          this.handlePreview()
-          break
-        case 'download':
-          this.handleDownload()
-          break
-        case 'cancel':
-          this.closeDialog()
-          break
-        default:
-          break
-      }
-    },
-    handlePreview() {
-      this.filePreviewVisible = true
-    },
-    handleDownload() {
-      downloadFile(this.attachment)
-    },
-    // 获取明细数据
-    getFormData() {
-      if (this.$utils.isEmpty(this.formId)) {
-        return
-      }
-      get({ attachmentId: this.formId }).then(response => {
-        this.attachment = response.data
-      }).catch(() => {
-      })
-    },
-    // 关闭当前窗口
-    closeDialog() {
-      this.$emit('close', false)
-    }
-  }
-
-}
 </script>
 </script>
 <style lang="scss">
 <style lang="scss">
-.attachment-detail-dialog{
-  .el-dialog__body{
-    height:  calc(57vh - 100px) !important;
-  }
-}
-.attachment-from>div{
-    margin-bottom: 13px !important;
-}
+    .attachment-detail-dialog {
+        .el-dialog__body {
+            height: calc(57vh - 100px) !important;
+        }
+    }
+    .attachment-from > div {
+        margin-bottom: 13px !important;
+    }
 </style>
 </style>

+ 321 - 279
src/views/platform/file/attachment/list.vue

@@ -1,295 +1,337 @@
 <template>
 <template>
-  <div class="main-container">
-    <ibps-crud
-      ref="crud"
-      :height="height"
-      :data="listData"
-      :toolbars="listConfig.toolbars"
-      :search-form="listConfig.searchForm"
-      :pk-key="pkKey"
-      :columns="listConfig.columns"
-      :row-handle="listConfig.rowHandle"
-      :pagination="pagination"
-      :loading="loading"
-      @action-event="handleAction"
-      @sort-change="handleSortChange"
-      @pagination-change="handlePaginationChange"
-    />
-    <ibps-uploader
-      :visible="dialogFormVisible"
-      :multiple="true"
-      margin-top="7vh"
-      accept="*"
-      class="attachment-uploader-dialog"
-      @action-event="uploaderAction"
-      @close="visible => dialogFormVisible = visible"
-    />
-    <modify-name
-      :id="editId"
-      :file="file"
-      :visible="modifyNameVisible"
-      @callback="search"
-      @close="visible => modifyNameVisible = visible"
-    />
-    <detail
-      :id="editId"
-      :visible="detailVisible"
-      :data="detailData"
-      @callback="search"
-      @close="visible => detailVisible = visible"
-    />
-     <div  v-if="filePreviewVisible">
-       <file-preview
-          :file="file"
-          :visible="filePreviewVisible"
-          @close="visible => filePreviewVisible = visible"
+    <div class="main-container">
+        <ibps-crud
+            ref="crud"
+            :height="height"
+            :data="listData"
+            :toolbars="listConfig.toolbars"
+            :search-form="listConfig.searchForm"
+            :pk-key="pkKey"
+            :columns="listConfig.columns"
+            :row-handle="listConfig.rowHandle"
+            :pagination="pagination"
+            :loading="loading"
+            @action-event="handleAction"
+            @sort-change="handleSortChange"
+            @pagination-change="handlePaginationChange"
         />
         />
-    </div>
-    <div  v-if="filePreviewVisible2">
-       <file-preview
-          :optionFile="file"
-          :visible="filePreviewVisible"
-          @close="visible => filePreviewVisible = visible"
+        <ibps-uploader
+            :visible="dialogFormVisible"
+            :multiple="true"
+            margin-top="7vh"
+            accept="*"
+            class="attachment-uploader-dialog"
+            @action-event="uploaderAction"
+            @close="visible => dialogFormVisible = visible"
+        />
+        <modify-name
+            :id="editId"
+            :file="file"
+            :visible="modifyNameVisible"
+            @callback="search"
+            @close="visible => modifyNameVisible = visible"
+        />
+        <detail
+            :id="editId"
+            :visible="detailVisible"
+            :data="detailData"
+            @callback="search"
+            @close="visible => detailVisible = visible"
         />
         />
+        <div v-if="filePreviewVisible">
+            <file-preview
+                :file="file"
+                :visible="filePreviewVisible"
+                @close="visible => filePreviewVisible = visible"
+            />
+        </div>
+        <div v-if="filePreviewVisible2">
+            <file-preview
+                :optionFile="file"
+                :visible="filePreviewVisible2"
+                @close="visible => filePreviewVisible2 = visible"
+            />
+        </div>
     </div>
     </div>
-  </div>
 </template>
 </template>
 
 
 <script>
 <script>
-import { queryPageList, remove } from '@/api/platform/file/attachment'
-import { downloadFile } from '@/business/platform/file/utils'
-import ActionUtils from '@/utils/action'
-import FixHeight from '@/mixins/height'
-import IbpsUploader from '@/business/platform/file/uploader'
-import FilePreview from '@/business/platform/file/file-preview'
-import Detail from './detail'
-import ModifyName from './modify-name'
-import {SYSTEM_URL,BASE_API} from '@/api/baseUrl'
+    import { queryPageList, deleteFile } from '@/api/platform/file/attachment'
+    import { downloadFile } from '@/business/platform/file/utils'
+    import ActionUtils from '@/utils/action'
+    import FixHeight from '@/mixins/height'
+    import IbpsUploader from '@/business/platform/file/uploader'
+    import FilePreview from '@/business/platform/file/file-preview'
+    import Detail from './detail'
+    import ModifyName from './modify-name'
+    import { SYSTEM_URL, BASE_API } from '@/api/baseUrl'
 
 
-export default {
-  components: {
-    IbpsUploader,
-    FilePreview,
-    Detail,
-    ModifyName
-  },
-  mixins: [FixHeight],
-  data() {
-    const extType = ['txt', 'pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'wps', 'jpg', 'jpeg', 'png', 'gif', 'mp3', 'mp4']
-    return {
-      dialogFormVisible: false, // 弹窗
-      modifyNameVisible: false,
-      detailVisible: false,
-      filePreviewVisible: false,
-      filePreviewVisible2: false,
-      editId: '', // 编辑dialog需要使用
-      pkKey: 'id', // 主键  如果主键不是pk需要传主键
-      detailData: '',
-      file: {fileName:'',url:'',editUrl:'',title:'',fileType:'' },
-      loading: true,
-      height: document.clientHeight,
+    export default {
+        components: {
+            IbpsUploader,
+            FilePreview,
+            Detail,
+            ModifyName
+        },
+        mixins: [FixHeight],
+        data() {
+            const extType = [
+                'txt',
+                'pdf',
+                'doc',
+                'docx',
+                'xls',
+                'xlsx',
+                'ppt',
+                'pptx',
+                'wps',
+                'jpg',
+                'jpeg',
+                'png',
+                'gif',
+                'mp3',
+                'mp4'
+            ]
+            return {
+                dialogFormVisible: false, // 弹窗
+                modifyNameVisible: false,
+                detailVisible: false,
+                filePreviewVisible: false,
+                filePreviewVisible2: false,
+                editId: '', // 编辑dialog需要使用
+                pkKey: 'id', // 主键  如果主键不是pk需要传主键
+                detailData: '',
+                file: {
+                    fileName: '',
+                    url: '',
+                    editUrl: '',
+                    title: '',
+                    fileType: ''
+                },
+                loading: true,
+                height: document.clientHeight,
 
 
-      listData: [],
-      pagination: {},
-      sorts: {},
-      listConfig: {
-        toolbars: [
-          {
-            key: 'search'
-          },
-          {
-            key: 'upLoad',
-            label: '上传',
-            icon: 'ibps-icon-upload'
-          },
-          {
-            key: 'remove'
-          }
-        ],
-        searchForm: {
-          forms: [
-            { prop: 'Q^file_name_^SL', label: '文件名' },
-            { prop: 'Q^creator_name_^SL', label: '上传者' },
-            { prop: 'Q^ext_^SL', label: '扩展名' },
-            { prop: ['Q^create_time_^DL', 'Q^create_time_^DG'], label: '创建时间', fieldType: 'daterange' }
-          ]
+                listData: [],
+                pagination: {},
+                sorts: {},
+                listConfig: {
+                    toolbars: [
+                        {
+                            key: 'search'
+                        },
+                        {
+                            key: 'upLoad',
+                            label: '上传',
+                            icon: 'ibps-icon-upload'
+                        },
+                        {
+                            key: 'remove'
+                        }
+                    ],
+                    searchForm: {
+                        forms: [
+                            { prop: 'Q^file_name_^SL', label: '文件名' },
+                            { prop: 'Q^creator_name_^SL', label: '上传者' },
+                            { prop: 'Q^ext_^SL', label: '扩展名' },
+                            {
+                                prop: [
+                                    'Q^create_time_^DL',
+                                    'Q^create_time_^DG'
+                                ],
+                                label: '创建时间',
+                                fieldType: 'daterange'
+                            }
+                        ]
+                    },
+                    // 表格字段配置
+                    columns: [
+                        { prop: 'fileName', label: '文件名' },
+                        {
+                            prop: 'createTime',
+                            label: '创建时间',
+                            dateFormat: 'yyyy-MM-dd HH:mm:ss'
+                        },
+                        { prop: 'ext', label: '扩展名' },
+                        {
+                            prop: 'totalBytes',
+                            label: '总字节数',
+                            filter: 'numberFormatter'
+                        },
+                        { prop: 'creatorName', label: '上传者' }
+                    ],
+                    rowHandle: {
+                        actions: [
+                            {
+                                key: 'preview',
+                                label: '预览',
+                                icon: 'ibps-icon-eye',
+                                hidden: (row, index) => {
+                                    if (extType.includes(row.ext)) return false
+                                    return true
+                                }
+                            },
+                            {
+                                key: 'modifyName',
+                                label: '修改文件名',
+                                icon: 'ibps-icon-eraser'
+                            },
+                            {
+                                key: 'detail',
+                                icon: 'ibps-icon-detail'
+                            },
+                            {
+                                key: 'download',
+                                label: '下载',
+                                icon: 'ibps-icon-download'
+                            },
+                            {
+                                key: 'remove'
+                            }
+                        ]
+                    }
+                }
+            }
         },
         },
-        // 表格字段配置
-        columns: [
-          { prop: 'fileName', label: '文件名' },
-          { prop: 'createTime', label: '创建时间', dateFormat: 'yyyy-MM-dd HH:mm:ss' },
-          { prop: 'ext', label: '扩展名' },
-          { prop: 'totalBytes', label: '总字节数', filter: 'numberFormatter' },
-          { prop: 'creatorName', label: '上传者' }
-        ],
-        rowHandle: {
-          actions: [
-            {
-              key: 'preview',
-              label: '预览',
-              icon: 'ibps-icon-eye',
-              hidden: (row, index) => {
-                if (extType.includes(row.ext)) return false
-                return true
-              }
-            }, {
-              key: 'modifyName',
-              label: '修改文件名',
-              icon: 'ibps-icon-eraser'
-            }, {
-              key: 'detail',
-              icon: 'ibps-icon-detail'
-            }, {
-              key: 'download',
-              label: '下载',
-              icon: 'ibps-icon-download'
-            }, {
-              key: 'remove'
+        created() {
+            this.loadData()
+        },
+        methods: {
+            // 加载数据
+            loadData() {
+                this.loading = true
+                queryPageList(this.getSearcFormData()).then((response) => {
+                    ActionUtils.handleListData(this, response.data)
+                    this.loading = false
+                }).catch(() => {
+                    this.loading = false
+                })
+            },
+            /**
+             * 获取格式化参数
+             */
+            getSearcFormData() {
+                return ActionUtils.formatParams(
+                    this.$refs['crud'] ? this.$refs['crud'].getSearcFormData() : {},
+                    this.pagination,
+                    this.sorts
+                )
+            },
+            /**
+             * 处理分页事件
+             */
+            handlePaginationChange(page) {
+                ActionUtils.setPagination(this.pagination, page)
+                this.loadData()
+            },
+            /**
+             * 处理排序
+             */
+            handleSortChange(sort) {
+                ActionUtils.setSorts(this.sorts, sort)
+                this.loadData()
+            },
+            /**
+             * 查询
+             */
+            search() {
+                this.loadData()
+            },
+            /**
+             * 处理按钮事件
+             */
+            handleAction(command, position, selection, data) {
+                switch (command) {
+                    case 'search': // 查询
+                        ActionUtils.setFirstPagination(this.pagination)
+                        this.search()
+                        break
+                    case 'upLoad': // 添加
+                        this.handleUpload()
+                        break
+                    case 'modifyName': // 修改文件名
+                        ActionUtils.selectedRecord(selection).then((id) => {
+                            this.handleModify(id)
+                            this.file.fileName = data.fileName
+                            // console.log(this.file.fileName)
+                        })
+                        break
+                    case 'detail': // 明细
+                        ActionUtils.selectedRecord(selection).then((id) => {
+                            this.handleDetail(id)
+                            this.detailData = data
+                        })
+                        break
+                    case 'preview': // 预览
+                        console.log('ext:', data.ext)
+                        if (['png', 'jpeg', 'jpg'].includes(data.ext)) {
+                            this.file = data
+                            this.filePreviewVisible2 = false
+                            this.filePreviewVisible = true
+                            break
+                        }
+                        this.file.url = BASE_API() + SYSTEM_URL() + `/file/download?attachmentId=${data.id}`
+                        this.file.editUrl = BASE_API() + SYSTEM_URL() + `/file/editCallback?fileName=${data.fileName}&fileType=${data.ext}&id=${data.id}`
+                        this.file.title = data.fileName // 文件名称
+                        this.file.fileType = data.ext //类型
+                        this.filePreviewVisible = false
+                        this.filePreviewVisible2 = true
+                        break
+                    case 'download': //  下载
+                        this.handleDownload(data)
+                        break
+                    case 'remove': // 删除
+                        ActionUtils.removeRecord(selection).then((ids) => {
+                            this.handleRemove(ids)
+                        }).catch(() => {})
+                        break
+                    default:
+                        break
+                }
+            },
+            /**
+             * 上传
+             */
+            handleUpload(id = '') {
+                this.editId = id
+                this.dialogFormVisible = true
+            },
+            uploaderAction(data) {
+                this.dialogFormVisible = false
+                this.search()
+            },
+            /**
+             * 修改文件名
+             */
+            handleModify(id = '') {
+                this.editId = id
+                this.modifyNameVisible = true
+            },
+            /**
+             * 处理明细
+             */
+            handleDetail(id = '') {
+                this.editId = id
+                this.detailVisible = true
+            },
+            /**
+             * 处理删除
+             */
+            handleRemove(ids) {
+                deleteFile({ attachmentIds: ids }).then(() => {
+                    ActionUtils.removeSuccessMessage()
+                    this.search()
+                }).catch(() => {})
+            },
+            handleDownload(data) {
+                downloadFile(data)
             }
             }
-          ]
         }
         }
-      }
-    }
-  },
-  created() {
-    this.loadData()
-  },
-  methods: {
-    // 加载数据
-    loadData() {
-      this.loading = true
-      queryPageList(this.getSearcFormData()).then(response => {
-        ActionUtils.handleListData(this, response.data)
-        this.loading = false
-      }).catch(() => {
-        this.loading = false
-      })
-    },
-    /**
-     * 获取格式化参数
-     */
-    getSearcFormData() {
-      return ActionUtils.formatParams(
-        this.$refs['crud'] ? this.$refs['crud'].getSearcFormData() : {},
-        this.pagination,
-        this.sorts)
-    },
-    /**
-     * 处理分页事件
-     */
-    handlePaginationChange(page) {
-      ActionUtils.setPagination(this.pagination, page)
-      this.loadData()
-    },
-    /**
-     * 处理排序
-     */
-    handleSortChange(sort) {
-      ActionUtils.setSorts(this.sorts, sort)
-      this.loadData()
-    },
-    /**
-     * 查询
-     */
-    search() {
-      this.loadData()
-    },
-    /**
-     * 处理按钮事件
-     */
-    handleAction(command, position, selection, data) {
-      switch (command) {
-        case 'search':// 查询
-          ActionUtils.setFirstPagination(this.pagination)
-          this.search()
-          break
-        case 'upLoad':// 添加
-          this.handleUpload()
-          break
-        case 'modifyName':// 修改文件名
-          ActionUtils.selectedRecord(selection).then((id) => {
-            this.handleModify(id)
-            this.file.fileName = data.fileName
-            // console.log(this.file.fileName)
-          })
-          break
-        case 'detail':// 明细
-          ActionUtils.selectedRecord(selection).then((id) => {
-            this.handleDetail(id)
-            this.detailData = data
-          })
-          break
-        case 'preview':// 预览
-          console.log("ext:",data.ext)
-          if("png"==data.ext||"jpeg"==data.ext||"jpg"==data.ext){
-            this.file = data
-            this.filePreviewVisible2 = false
-            this.filePreviewVisible = true
-            break
-          }
-          this.file.url = BASE_API() + SYSTEM_URL() + '/file/download?attachmentId=' + data.id
-          this.file.editUrl =  BASE_API()+SYSTEM_URL() + '/file/editCallback?fileName='+data.fileName+'&fileType='+data.ext+'&id='+ data.id
-          this.file.title =data.fileName // 文件名称
-          this.file.fileType = data.ext //类型
-          this.filePreviewVisible = false
-          this.filePreviewVisible2 = true
-          break
-        case 'download'://  下载
-          this.handleDownload(data)
-          break
-        case 'remove':// 删除
-          ActionUtils.removeRecord(selection).then((ids) => {
-            this.handleRemove(ids)
-          }).catch(() => { })
-          break
-        default:
-          break
-      }
-    },
-    /**
-     * 上传
-     */
-    handleUpload(id = '') {
-      this.editId = id
-      this.dialogFormVisible = true
-    },
-    uploaderAction(data) {
-      this.dialogFormVisible = false
-      this.search()
-    },
-    /**
-     * 修改文件名
-     */
-    handleModify(id = '') {
-      this.editId = id
-      this.modifyNameVisible = true
-    },
-    /**
-     * 处理明细
-     */
-    handleDetail(id = '') {
-      this.editId = id
-      this.detailVisible = true
-    },
-    /**
-     * 处理删除
-     */
-    handleRemove(ids) {
-      remove({ attachmentIds: ids }).then(response => {
-        ActionUtils.removeSuccessMessage()
-        this.search()
-      }).catch(() => {})
-    },
-    handleDownload(data) {
-      downloadFile(data)
     }
     }
-  }
-}
 </script>
 </script>
 <style lang="scss">
 <style lang="scss">
-.attachment-uploader-dialog{
-  .el-dialog__body{
-    height:  calc(57vh - 100px) !important;
-  }
-}
+    .attachment-uploader-dialog {
+        .el-dialog__body {
+            height: calc(57vh - 100px) !important;
+        }
+    }
 </style>
 </style>