feat: upload page

This commit is contained in:
zzc
2025-05-09 15:41:44 +08:00
parent c0b08f6c3b
commit c5408ac63d
7 changed files with 139 additions and 26 deletions

View File

@@ -12,7 +12,7 @@
<el-dialog <el-dialog
:visible.sync="dialogTableVisible" :visible.sync="dialogTableVisible"
append-to-body append-to-body
title="vue-admin-better异常捕获(温馨提示:错误必须解决)" title="异常捕获(温馨提示:错误必须解决)"
width="70%" width="70%"
> >
<el-table :data="errorLogs"> <el-table :data="errorLogs">

View File

@@ -7,27 +7,3 @@ export function getList(data) {
params: data, params: data,
}) })
} }
export function doAdd(data) {
return request({
url: '/management/access_log/role',
method: 'post',
data,
})
}
export function doEdit(id, data) {
return request({
url: `/management/api/access_log/${id}`,
method: 'put',
data,
})
}
export function doDelete(data) {
return request({
url: '/management/api/access_log/delete',
method: 'put',
data,
})
}

View File

@@ -0,0 +1,9 @@
import request from '@/utils/request'
export function getList(data) {
return request({
url: '/management/api/uploaded_file/list',
method: 'get',
params: data,
})
}

View File

@@ -45,8 +45,18 @@
computed: { computed: {
// 设置上传时的 headers // 设置上传时的 headers
uploadHeaders() { uploadHeaders() {
let userId = ''
let appId = ''
if (this.$store.state?.user?.userId) {
userId = this.$store.state?.user?.userId
}
if (this.$store.state?.user?.appId) {
appId = this.$store.state?.user?.appId
}
return { return {
Authorization: `${this.token}`, Authorization: `${this.token}`,
'x-user-id': userId,
'x-app-id': appId,
} }
}, },
}, },

View File

@@ -342,6 +342,12 @@ export const asyncRoutes = [
component: () => import('@/views/personnelManagement/accessLogManagement/index'), component: () => import('@/views/personnelManagement/accessLogManagement/index'),
meta: { title: '访问日志' }, meta: { title: '访问日志' },
}, },
{
path: 'uploadedFileManagement',
name: 'UploadedFileManagement',
component: () => import('@/views/personnelManagement/uploadedFileManagement/index'),
meta: { title: '已上传文件' },
},
// { // {
// path: 'menuManagement', // path: 'menuManagement',
// name: 'MenuManagement', // name: 'MenuManagement',

View File

@@ -22,7 +22,6 @@
<el-table-column align="center" label="顺序" prop="sort" show-overflow-tooltip /> <el-table-column align="center" label="顺序" prop="sort" show-overflow-tooltip />
<el-table-column align="center" label="图片" width="100"> <el-table-column align="center" label="图片" width="100">
<template slot-scope="scope"> <template slot-scope="scope">
<!-- 使用 show-overflow-tooltip 显示图片并添加 tooltip -->
<el-tooltip class="item" :content="scope.row.name" effect="dark" placement="top"> <el-tooltip class="item" :content="scope.row.name" effect="dark" placement="top">
<img alt="image" :src="scope.row.url" style="width: 50px; height: 50px; object-fit: cover" /> <img alt="image" :src="scope.row.url" style="width: 50px; height: 50px; object-fit: cover" />
</el-tooltip> </el-tooltip>

View File

@@ -0,0 +1,113 @@
<template>
<div class="uploadedFileManagement-container">
<!-- <vab-query-form>
<vab-query-form-right-panel :span="12">
<el-form :inline="true" :model="queryForm" @submit.native.prevent>
<el-form-item>
<el-input v-model.trim="queryForm.permission" clearable placeholder="请输入查询条件" />
</el-form-item>
<el-form-item>
<el-button icon="el-icon-search" type="primary" @click="queryData">查询</el-button>
</el-form-item>
</el-form>
</vab-query-form-right-panel>
</vab-query-form> -->
<el-table v-loading="listLoading" :data="list" :element-loading-text="elementLoadingText" @selection-change="setSelectRows">
<el-table-column show-overflow-tooltip type="selection" />
<el-table-column align="center" label="图片" width="100">
<template slot-scope="scope">
<el-tooltip class="item" :content="scope.row.name" effect="dark" placement="top">
<img alt="image" :src="scope.row.url" style="width: 50px; height: 50px; object-fit: cover" />
</el-tooltip>
</template>
</el-table-column>
<el-table-column align="center" label="创建时间" show-overflow-tooltip>
<template #default="{ row }">
{{ formatTime(row.createdAt) }}
</template>
</el-table-column>
<el-table-column align="center" label="大小" prop="size" show-overflow-tooltip />
<el-table-column align="center" label="上传者" show-overflow-tooltip>
<template slot-scope="{ row }">
{{ row.userName || row.userId }}
</template>
</el-table-column>
<el-table-column align="center" label="应用" show-overflow-tooltip>
<template slot-scope="{ row }">
{{ row.appName || row.addId }}
</template>
</el-table-column>
<el-table-column align="center" label="key" prop="key" show-overflow-tooltip />
<el-table-column align="center" label="类型" prop="mimeType" show-overflow-tooltip />
</el-table>
<el-pagination
background
:current-page="queryForm.pageNo"
:layout="layout"
:page-size="queryForm.pageSize"
:total="total"
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
/>
</div>
</template>
<script>
import { getList } from '@/api/uploadedFileManagement'
import { formatTime } from '@/utils'
export default {
name: 'UploadedFileManagement',
data() {
return {
list: null,
listLoading: true,
layout: 'total, sizes, prev, pager, next, jumper',
total: 0,
selectRows: '',
elementLoadingText: '正在加载...',
queryForm: {
pageNo: 1,
pageSize: 10,
permission: '',
},
timeOutID: null,
}
},
created() {
this.fetchData()
},
beforeDestroy() {
clearTimeout(this.timeOutID)
},
methods: {
formatTime,
setSelectRows(val) {
this.selectRows = val
},
handleSizeChange(val) {
this.queryForm.pageSize = val
this.fetchData()
},
handleCurrentChange(val) {
this.queryForm.pageNo = val
this.fetchData()
},
queryData() {
this.queryForm.pageNo = 1
this.fetchData()
},
async fetchData() {
this.listLoading = true
const { data } = await getList(this.queryForm)
this.list = data.list
this.total = data.totalCount
this.timeOutID = setTimeout(() => {
this.listLoading = false
}, 300)
},
},
}
</script>