index.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. <template>
  2. <div class="ele-body">
  3. <el-card shadow="never">
  4. <doc-search @search="reload" />
  5. <ele-pro-table
  6. ref="table"
  7. :columns="columns"
  8. :datasource="datasource"
  9. height="calc(100vh - 350px)"
  10. class="dict-table"
  11. tool-class="ele-toolbar-actions"
  12. >
  13. <!-- 工具栏 -->
  14. <template v-slot:toolbar>
  15. <el-button type="primary" @click="handleUpload">上传</el-button>
  16. </template>
  17. <template v-slot:action="{ row }">
  18. <el-link type="primary" @click="handleDownload(row)">下载</el-link>
  19. </template>
  20. </ele-pro-table>
  21. </el-card>
  22. <uploadDialog ref="uploadDialogRef" />
  23. </div>
  24. </template>
  25. <script>
  26. import { getFile, getFileList } from '@/api/system/file/index.js';
  27. import docSearch from './components/doc-search';
  28. import uploadDialog from './components/upload-dialog.vue';
  29. export default {
  30. components: { docSearch, uploadDialog },
  31. data () {
  32. return {
  33. columns: [
  34. {
  35. label: '序号',
  36. type: 'index',
  37. width: 55,
  38. align: 'center'
  39. },
  40. {
  41. label: '文档名称',
  42. prop: 'name',
  43. minWidth: '180',
  44. showOverflowTooltip: true
  45. },
  46. {
  47. label: '文档类型',
  48. prop: 'type'
  49. },
  50. {
  51. label: '系统'
  52. },
  53. {
  54. label: '储存路径',
  55. prop: 'storePath',
  56. minWidth: '180',
  57. showOverflowTooltip: true
  58. },
  59. {
  60. label: '模块名',
  61. prop: 'module'
  62. },
  63. {
  64. label: '上传时间',
  65. prop: 'createTime'
  66. },
  67. {
  68. label: '操作',
  69. slot: 'action',
  70. action: 'action'
  71. }
  72. ]
  73. };
  74. },
  75. methods: {
  76. datasource ({ page, where, limit }) {
  77. return getFileList({
  78. ...where,
  79. pageNum: page,
  80. size: limit
  81. });
  82. },
  83. reload (where) {
  84. this.$refs.table.reload({ where });
  85. },
  86. handleUpload () {
  87. this.$refs.uploadDialogRef.open();
  88. },
  89. handleDownload (row) {
  90. getFile({ objectName: row.storePath });
  91. }
  92. }
  93. };
  94. </script>