Skip to content

Z
zxn-adputin
Commit b71750aa authored by jiyonggang's avatar jiyonggang
Browse files
Options

添加上传资源页面

parent 2cfb099a
Hide whitespace changes
Inline Side-by-side
Showing with 182 additions and 75 deletions
src/api/report.js
View file @ b71750aa
...@@ -497,5 +497,56 @@ export function fetchConversionAction(data) { ...@@ -497,5 +497,56 @@ export function fetchConversionAction(data) {
export function getMaterialDirectoriesTree() {
return request({
url: 'http://localhost:8567/material/business/youtube/directories/tree',
// url: 'https://putinapi.zhangxindiet.com/material/business/youtube/directories/tree',
method: 'get',
})
}
export function getDirectoryById(params) {
return request({
url: 'http://localhost:8567/material/business/youtube/getDirectoryById',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/getDirectoryById',
method: 'get',
params
})
}
export function createDirectory(params) {
return request({
url: 'http://localhost:8567/material/business/youtube/createdirectories',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/createdirectories',
method: 'get',
params
})
}
export function updateDirectory() {
return request({
url: 'http://localhost:8567/business/youtube/updateDirectory',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/updateDirectory',
method: 'get',
})
}
export function getCount() {
return request({
url: 'http://localhost:8567/material/count',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/updateDirectory',
method: 'get',
})
}
export function deleteDirectory() {
return request({
url: 'http://localhost:8567/business/youtube/deleteDirectory',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/deleteDirectory',
method: 'get',
})
}
// ---------------------------------------- // ----------------------------------------
src/views/createMaterial/AdMaterialManager.vue
View file @ b71750aa
...@@ -75,12 +75,12 @@ ...@@ -75,12 +75,12 @@
<template slot-scope="scope"> <template slot-scope="scope">
<div class="preview-container"> <div class="preview-container">
<img <img
v-if="scope.row.type === 'image'" v-if="scope.row.resType === 1"
:src="scope.row.url" :src="scope.row.url"
class="preview-image" class="preview-image"
> >
<video <video
v-else-if="scope.row.type === 'video'" v-else-if="scope.row.resType === 2"
:src="scope.row.url" :src="scope.row.url"
class="preview-video" class="preview-video"
controls controls
...@@ -89,22 +89,23 @@ ...@@ -89,22 +89,23 @@
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" label="文件名"></el-table-column> <el-table-column prop="materialName" label="文件名"></el-table-column>
<el-table-column prop="type" label="类型" width="100"> <el-table-column prop="resType" label="类型" width="100">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.type === 'image' ? '图片' : '视频' }} {{ scope.row.resType === 1 ? '图片' : scope.row.resType === 2 ? '视频' : '' }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="size" label="大小" width="100"> <!-- <el-table-column prop="size" label="大小" width="100">-->
<!-- <template slot-scope="scope">-->
<!-- {{ formatFileSize(scope.row.size) }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column prop="createdAt" label="上传时间" width="180">
<template slot-scope="scope"> <template slot-scope="scope">
{{ formatFileSize(scope.row.size) }} {{ formatDate(scope.row.createdAt) }}
</template>
</el-table-column>
<el-table-column prop="createTime" label="上传时间" width="180">
<template slot-scope="scope">
{{ formatDate(scope.row.createTime) }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="realName" label="创作者"></el-table-column>
<el-table-column label="操作" width="150"> <el-table-column label="操作" width="150">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
...@@ -190,7 +191,14 @@ ...@@ -190,7 +191,14 @@
</template> </template>
<script> <script>
import { MockService } from './mockService' import {
getMaterialDirectoriesTree,
getDirectoryById,
createDirectory,
updateDirectory,
deleteDirectory
} from '@/api/report';
export default { export default {
name: 'AdMaterialManager', name: 'AdMaterialManager',
...@@ -198,7 +206,6 @@ export default { ...@@ -198,7 +206,6 @@ export default {
return { return {
// 目录树数据 // 目录树数据
directories: [], directories: [],
mockService: null,
defaultProps: { defaultProps: {
children: 'children', children: 'children',
label: 'name' label: 'name'
...@@ -239,28 +246,31 @@ export default { ...@@ -239,28 +246,31 @@ export default {
}, },
created() { created() {
this.mockService = new MockService()
this.fetchDirectories() this.fetchDirectories()
}, },
methods: { methods: {
// 获取目录树数据 fetchDirectories(){
async fetchDirectories() { getMaterialDirectoriesTree().then(res => {
try { if (res.status === 200) {
const directories = await this.mockService.getDirectories() this.directories= res.result.data
this.directories = directories }else {
} catch (error) { this.$message.error('获取目录失败')
this.$message.error('获取目录失败') }
console.error('获取目录失败:', error) });
} },
},
// 获取当前目录下的文件 // 获取当前目录下的文件
async fetchMaterials(directoryId) { async fetchMaterials(directoryId) {
this.loading = true this.loading = true
try { try {
const materials = await this.mockService.getMaterials(directoryId) const response = await this.request({
this.materials = materials url: '/api/materials',
method: 'get',
params: { directoryId }
})
this.materials = response.data
} catch (error) { } catch (error) {
this.$message.error('获取文件列表失败') this.$message.error('获取文件列表失败')
console.error('获取文件列表失败:', error) console.error('获取文件列表失败:', error)
...@@ -273,9 +283,35 @@ export default { ...@@ -273,9 +283,35 @@ export default {
handleNodeClick(data) { handleNodeClick(data) {
this.currentDirectory = data.id this.currentDirectory = data.id
this.currentPath = this.getNodePath(data) this.currentPath = this.getNodePath(data)
this.fetchMaterials(data.id) this.fetchMaterialsByDirectoryId(data.id);
},
fetchMaterialsByDirectoryId(directoryId) {
this.loading = true;
getDirectoryById({
directoryId: directoryId,
pageNum: 1,
pageSize: 10,
includeSubdirectories: true
})
.then(response => {
if (response && response.status === 200) {
this.materials = response.result.data;
} else {
this.$message.error(response.msg || '获取素材列表失败');
console.error('获取素材列表失败:', response);
}
})
.catch(error => {
this.$message.error('获取素材列表失败');
console.error('获取素材列表失败:', error);
})
.finally(() => {
this.loading = false;
});
}, },
// 获取节点路径 // 获取节点路径
getNodePath(node) { getNodePath(node) {
const path = [] const path = []
...@@ -296,23 +332,28 @@ export default { ...@@ -296,23 +332,28 @@ export default {
}, },
// 创建目录 // 创建目录
async createDirectory() { createDirectory() {
this.$refs.newDirForm.validate(async (valid) => { this.$refs.newDirForm.validate((valid) => {
if (valid) { if (valid) {
try { createDirectory({
await this.mockService.createDirectory({ name: this.newDirForm.name,
name: this.newDirForm.name, parentId: this.newDirForm.parentId
parentId: this.newDirForm.parentId })
.then(response => {
if (response && response.status === 200 && response.result && response.result.data) {
this.$message.success('创建成功');
this.newDirDialogVisible = false;
this.fetchDirectories();
} else {
this.$message.error(response.msg || '创建失败');
}
}) })
this.$message.success('创建成功') .catch(error => {
this.newDirDialogVisible = false this.$message.error('创建失败');
await this.fetchDirectories() // 重新获取目录树 console.error('创建目录失败:', error);
} catch (error) { });
this.$message.error('创建失败')
console.error('创建目录失败:', error)
}
} }
}) });
}, },
// 删除目录 // 删除目录
...@@ -321,20 +362,24 @@ export default { ...@@ -321,20 +362,24 @@ export default {
type: 'warning' type: 'warning'
}).then(async () => { }).then(async () => {
try { try {
await this.mockService.deleteDirectory(data.id) const response = await deleteDirectory(data.id);
this.$message.success('删除成功') if (response.code === 0) { // Assuming your API uses a code for success/failure
await this.fetchDirectories() // 重新获取目录树 this.$message.success('删除成功');
// 如果删除的是当前选中的目录，清空文件列表 await this.fetchDirectories(); // 重新获取目录树
if (data.id === this.currentDirectory) { // 如果删除的是当前选中的目录，清空文件列表
this.materials = [] if (data.id === this.currentDirectory) {
this.currentDirectory = null this.materials = [];
this.currentPath = '根目录' this.currentDirectory = null;
this.currentPath = '根目录';
}
} else {
this.$message.error(response.message || '删除失败');
} }
} catch (error) { } catch (error) {
this.$message.error('删除失败') this.$message.error('删除失败');
console.error('删除目录失败:', error) console.error('删除目录失败:', error);
} }
}).catch(() => {}) }).catch(() => { });
}, },
// 上传前验证 // 上传前验证
...@@ -356,17 +401,12 @@ export default { ...@@ -356,17 +401,12 @@ export default {
// 处理上传成功 // 处理上传成功
async handleUploadSuccess(response, file, fileList) { async handleUploadSuccess(response, file, fileList) {
try { // Assuming your upload API returns the uploaded file data on success
const result = await this.mockService.uploadFile(file.raw, this.currentDirectory) if (response.code === 0) { // Check for success code from your API
if (result.code === 0) { this.$message.success('上传成功')
this.$message.success('上传成功') await this.fetchMaterials(this.currentDirectory) // 重新获取文件列表
await this.fetchMaterials(this.currentDirectory) // 重新获取文件列表 } else {
} else { this.$message.error(response.message || '上传失败')
this.$message.error(result.message || '上传失败')
}
} catch (error) {
this.$message.error('上传失败')
console.error('上传文件失败:', error)
} }
}, },
...@@ -396,13 +436,21 @@ export default { ...@@ -396,13 +436,21 @@ export default {
} }
try { try {
await this.mockService.moveFile( const response = await this.request({
this.currentMoveFile.id, url: '/api/materials/move',
this.selectedMoveDirectory method: 'post',
) data: {
this.$message.success('移动成功') fileId: this.currentMoveFile.id,
this.moveDialogVisible = false targetDirectoryId: this.selectedMoveDirectory
await this.fetchMaterials(this.currentDirectory) // 重新获取当前目录的文件列表 }
});
if (response.code === 0) {
this.$message.success('移动成功')
this.moveDialogVisible = false
await this.fetchMaterials(this.currentDirectory) // 重新获取当前目录的文件列表
} else {
this.$message.error(response.message || '移动失败')
}
} catch (error) { } catch (error) {
this.$message.error('移动失败') this.$message.error('移动失败')
console.error('移动文件失败:', error) console.error('移动文件失败:', error)
...@@ -415,14 +463,22 @@ export default { ...@@ -415,14 +463,22 @@ export default {
type: 'warning' type: 'warning'
}).then(async () => { }).then(async () => {
try { try {
await this.mockService.deleteFile(file.id) const response = await this.request({
this.$message.success('删除成功') url: '/api/materials/delete',
await this.fetchMaterials(this.currentDirectory) // 重新获取文件列表 method: 'post',
params: { fileId: file.id }
});
if (response.code === 0) {
this.$message.success('删除成功')
await this.fetchMaterials(this.currentDirectory) // 重新获取文件列表
} else {
this.$message.error(response.message || '删除失败')
}
} catch (error) { } catch (error) {
this.$message.error('删除失败') this.$message.error('删除失败')
console.error('删除文件失败:', error) console.error('删除文件失败:', error)
} }
}).catch(() => {}) }).catch(() => { })
}, },
// 预览文件 // 预览文件
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment