Skip to content

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

批量上传

parent 18ed921e
Hide whitespace changes
Inline Side-by-side
Showing with 229 additions and 50 deletions
src/api/report.js
View file @ 56bcee1f
......@@ -499,24 +499,24 @@ 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',
// 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',
// 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',
// url: 'http://localhost:8567/material/business/youtube/createdirectories',
url: 'https://putinapi.zhangxindiet.com/business/youtube/createdirectories',
method: 'get',
params
})
......@@ -524,16 +524,16 @@ export function createDirectory(params) {
export function updateDirectory() {
return request({
url: 'http://localhost:8567/business/youtube/updateDirectory',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/updateDirectory',
// url: 'http://localhost:8567/business/youtube/updateDirectory',
url: 'https://putinapi.zhangxindiet.com/business/youtube/updateDirectory',
method: 'get',
})
}
export function getMaterialCount(params) {
return request({
url: 'http://localhost:8567/material/count',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/updateDirectory',
// url: 'http://localhost:8567/material/count',
url: 'https://putinapi.zhangxindiet.com/business/youtube/updateDirectory',
method: 'get',
params
})
......@@ -541,8 +541,8 @@ export function getMaterialCount(params) {
export function movematerial(params) {
return request({
url: 'http://localhost:8567/material/business/youtube/movematerial',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/updateDirectory',
// url: 'http://localhost:8567/material/business/youtube/movematerial',
url: 'https://putinapi.zhangxindiet.com/business/youtube/updateDirectory',
method: 'get',
params
})
......@@ -551,8 +551,8 @@ export function movematerial(params) {
export function deleteDirectory(params) {
return request({
url: 'http://localhost:8567/material/business/youtube/deleteDirectory',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/deleteDirectory',
// url: 'http://localhost:8567/material/business/youtube/deleteDirectory',
url: 'https://putinapi.zhangxindiet.com/business/youtube/deleteDirectory',
method: 'get',
params
})
......@@ -560,8 +560,8 @@ export function deleteDirectory(params) {
export function uploadMaterial(body,params){
return request({
url: 'http://localhost:8567/material/business/youtube/uploadVideo',
// url: 'https://putinapi.zhangxindiet.com/business/youtube/deleteDirectory',
// url: 'http://localhost:8567/material/business/youtube/uploadVideo',
url: 'https://putinapi.zhangxindiet.com/business/youtube/deleteDirectory',
method: 'post',
headers: { 'Content-Type': 'multipart/form-data' },
data: body, // Body 数据
......@@ -570,5 +570,40 @@ export function uploadMaterial(body,params){
}
export function getMaterialDesigners() {
return request({
// url: 'http://localhost:8567/material/getMaterialDesigners',
url: 'https://putinapi.zhangxindiet.com/material/getMaterialDesigners',
method: 'get',
})
}
export function getMaterialsByTag(params) {
return request({
// url: 'http://localhost:8567/material/business/youtube/getMaterialsByTag',
url: 'https://putinapi.zhangxindiet.com/material/getMaterialDesigners',
method: 'get',
params
})
}
export function getAllTags() {
return request({
// url: 'http://localhost:8567/material/getAllTags',
url: 'https://putinapi.zhangxindiet.com/material/getMaterialDesigners',
method: 'get',
})
}
export function getYoutubeUploadDetaillist() {
return request({
// url: 'http://localhost:8567/material/getYoutubeUploadDetaillist',
url: 'https://putinapi.zhangxindiet.com/material/getYoutubeUploadDetaillist',
method: 'get',
})
}
// ----------------------------------------
src/views/createDelivery/index.vue
View file @ 56bcee1f
......@@ -618,8 +618,16 @@
<el-form-item label="选择图片">
<ImageUploader @change="handleUploadChange"/>
</el-form-item>
<el-form-item label="输入Youtube链接">
<TextInputList v-model="putinTask.videoUrls" :maxLength="100"/>
<el-form-item label="选择 Youtube 视频">
<el-button type="primary" @click="fetchVideoList">加载视频列表</el-button>
<el-input v-model="videoUrlsString" placeholder="YouTube 链接将自动填充" :disabled="true" type="textarea" :rows="3"></el-input>
<div class="video-list" style="display: flex; flex-wrap: wrap;">
<div v-for="video in videoDataList" :key="video.videoId" class="video-item" @click="toggleVideoSelection(video)" style="margin: 10px; text-align: center; cursor: pointer;">
<video :src="video.ossUrl" controls width="200"></video>
<p>{{ video.materialName }}</p>
<el-checkbox v-model="selectedVideoId" :label="video.videoId"></el-checkbox>
</div>
</div>
</el-form-item>
</el-form>
</div>
......@@ -696,7 +704,8 @@ import {
putinCreatePutinTask,
getAdvList,
getAdvertiseCount,
fetchConversionAction
fetchConversionAction,
getYoutubeUploadDetaillist
} from "@/api/report";
import { dateOptions } from "@/assets/js/dateOptions";
import moment from "moment";
......@@ -731,7 +740,14 @@ export default {
ImageUploader,
YouTubeVideoInput
}, // 注册
watch: {
selectedVideoId: {
handler(newVal) {
this.putinTask.videoUrls = newVal.map(videoId => `https://www.youtube.com/watch?v=${videoId}`);
},
deep: true
}
},
data() {
return {
tagId: "",
......@@ -1001,6 +1017,8 @@ export default {
activePutin: "newPutin",
advGroupSelect: [],
checkedAdvId: "", // 点击户时，选中的id
videoDataList: [], // 存储通过 getYoutubeUploadDetaillist 获取的视频列表
selectedVideoId: [], // 存储用户选择的视频的 videoId
};
},
......@@ -1008,6 +1026,9 @@ export default {
showGroupBudget() {
return this.putinBaseInfo.budgetMode === "BUDGET_MODE_DAY";
},
videoUrlsString() {
return this.putinTask.videoUrls.join('\n');
},
},
created() {
this.putinTask.startDate = moment().subtract(0, "days").format("YYYY-MM-DD");
......@@ -1716,7 +1737,23 @@ export default {
handleUploadChange(files){
console.log("aabbccddeeff", files)
this.putinTask.imageAssets = files
}
},
fetchVideoList() {
getYoutubeUploadDetaillist().then(res => {
this.videoDataList = res.result.data;
});
},
selectVideo(video) {
this.selectedVideoId = video.videoId;
},
toggleVideoSelection(video) {
const index = this.selectedVideoId.indexOf(video.videoId);
if (index > -1) {
this.selectedVideoId.splice(index, 1); // 取消选中
} else {
this.selectedVideoId.push(video.videoId); // 选中
}
},
},
};
</script>
src/views/createMaterial/AdMaterialManager.vue
View file @ 56bcee1f
......@@ -45,6 +45,20 @@
<div class="current-path">
当前位置：{{ currentPath }}
</div>
<el-select
v-model="tagFilter"
@change="handleTagFilterChange"
clearable
placeholder="按标签筛选"
style="width: 200px; margin-right: 10px"
>
<el-option
v-for="tag in allTags"
:key="tag"
:label="tag"
:value="tag"
></el-option>
</el-select>
<el-button type="primary" @click="showUploadVideoDialog">上传视频</el-button>
</div>
......@@ -172,7 +186,7 @@
<!-- 上传视频弹窗 -->
<el-dialog title="上传视频" :visible.sync="uploadVideoDialogVisible" width="40%">
<el-form ref="uploadVideoForm" :model="uploadVideoForm" label-width="120px">
<el-form-item label="选择文件" prop="file" :rules="[{ required: true, message: '请选择文件', trigger: 'change' }]">
<el-form-item label="选择文件">
<el-upload
class="upload-demo"
ref="uploadVideo"
......@@ -180,20 +194,29 @@
:on-change="handleFileChange"
:auto-upload="false"
:file-list="fileList"
:limit="1"
:limit="50"
:multiple="true"
>
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<div slot="tip" class="el-upload__tip">只能上传视频文件,且不超过100MB</div>
<div slot="tip" class="el-upload__tip">可选择多个文件，单次上传不超过50个,且不要超过100MB</div>
</el-upload>
</el-form-item>
<el-form-item label="素材名称" prop="materialName" :rules="[{ required: true, message: '请输入素材名称', trigger: 'blur' }]">
<el-input v-model="uploadVideoForm.materialName" autocomplete="off"></el-input>
</el-form-item>
<!-- <el-form-item label="素材名称" prop="materialName" :rules="[{ required: true, message: '请输入素材名称', trigger: 'blur' }]">-->
<!-- <el-input v-model="uploadVideoForm.materialName" autocomplete="off"></el-input>-->
<!-- </el-form-item>-->
<el-form-item label="标签" prop="tags">
<el-input v-model="uploadVideoForm.tags" autocomplete="off" placeholder="多个标签请用英文逗号分隔"></el-input>
</el-form-item>
<el-form-item label="创作者" prop="director">
<el-input-number v-model="uploadVideoForm.director" :min="0" placeholder="请输入创作者ID"></el-input-number>
<el-select v-model="uploadVideoForm.director" placeholder="请选择创作者" clearable filterable>
<el-option
v-for="designer in materialDesigners"
:key="designer.id"
:label="designer.realName"
:value="designer.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="类型" prop="resType" :rules="[{ required: true, message: '请选择类型', trigger: 'change' }]">
<el-select v-model="uploadVideoForm.resType" placeholder="请选择">
......@@ -230,7 +253,10 @@ import {
getDirectoryById,
getMaterialCount,
movematerial,
uploadMaterial
uploadMaterial,
getMaterialDesigners,
getAllTags,
getMaterialsByTag
} from '@/api/report';
export default {
......@@ -286,7 +312,7 @@ export default {
uploadVideoDialogVisible: false, // 控制上传视频弹窗的显示和隐藏
uploadVideoForm: { // 上传视频表单数据
file: null,
// file: null,
materialName: '',
tags: '',
director: null,
......@@ -294,12 +320,20 @@ export default {
directoryId: null
},
fileList:[],
uploadVideoUrl: 'http://localhost:8567/material/business/youtube/uploadVideo',
uploadVideoUrl: 'https://putinapi.zhangxindiet.com/business/youtube/deleteDirectory',
materialDesigners: [],
tagFilter: '',
allTags: [],
};
},
created() {
this.currentPage = 1;
this.fetchDirectories();
this.fetchMaterialDesigners();
},
mounted() {
this.fetchAllTags();
},
methods: {
......@@ -312,17 +346,81 @@ export default {
}
});
},
async fetchMaterialDesigners() {
try {
const response = await getMaterialDesigners();
if (response && response.status === 200 && response.result) {
this.materialDesigners = response.result.data;
} else {
this.$message.error('获取创作者列表失败');
console.error('获取创作者列表失败:', response);
}
} catch (error) {
this.$message.error('获取创作者列表失败');
console.error('获取创作者列表失败:', error);
}
},
async fetchMaterialsByTag(tag) {
this.loading = true;
this.currentPage = 1;
try {
const response = await getMaterialsByTag({
tag: tag,
pageNum: this.currentPage,
pageSize: this.pageSize,
});
if (response && response.status === 200) {
this.materials = response.result.data.value;
this.totalCount = response.result.data.total;
} else {
this.$message.error(response.msg || '获取素材列表失败');
}
} catch (error) {
this.$message.error('获取数据失败');
console.error('获取数据失败:', error);
} finally {
this.loading = false;
}
},
handleTagFilterChange(value) {
this.tagFilter = value;
this.currentPage = 1; // 重置页码
if (this.tagFilter) {
this.fetchMaterialsByTag(this.tagFilter);
} else {
this.fetchMaterialsByDirectoryId(this.currentDirectory);
}
},
async fetchAllTags() {
try {
const response = await getAllTags();
if (response && response.status === 200) {
this.allTags = response.result.data;
} else {
this.$message.error('获取标签列表失败');
}
} catch (error) {
console.error('获取标签列表失败:', error);
this.$message.error('获取标签列表失败');
}
},
handleSizeChange(val) {
this.pageSize = val;
this.currentPage = 1; // 改变每页条数后，通常需要重置当前页码为 1
this.fetchMaterialsByDirectoryId(this.currentDirectory);
this.currentPage = 1;
if (this.tagFilter) {
this.fetchMaterialsByTag(this.tagFilter);
} else {
this.fetchMaterialsByDirectoryId(this.currentDirectory);
}
},
// 处理目录点击
handleNodeClick(data) {
this.currentDirectory = data.id;
this.currentPath = this.getNodePath(data);
this.currentPage = 1; // 重置当前页码为 1
this.currentPage = 1;
this.tagFilter = '';
this.fetchMaterialsByDirectoryId(data.id);
},
......@@ -335,12 +433,10 @@ export default {
directoryId: directoryId,
includeSubdirectories: this.includeSubdirectories
});
console.log("getMaterialCount response:", countResponse);
if (countResponse && countResponse.status === 200) {
this.totalCount = countResponse.result;
this.totalCount = countResponse.result.data;
} else {
this.$message.error(countResponse.msg || '获取总数失败');
console.error('获取总数失败:', countResponse);
}
// 再获取数据
......@@ -367,7 +463,11 @@ export default {
// 翻页
handleCurrentChange(val) {
this.currentPage = val;
this.fetchMaterialsByDirectoryId(this.currentDirectory);
if (this.tagFilter) {
this.fetchMaterialsByTag(this.tagFilter);
} else {
this.fetchMaterialsByDirectoryId(this.currentDirectory);
}
},
// 获取节点路径
......@@ -567,33 +667,40 @@ export default {
return new Date(date).toLocaleString();
},
handleFileChange(file, fileList) {
if (fileList.length > 0) {
this.fileList = [fileList[0]]; // 只保留一个文件
this.uploadVideoForm.file = fileList[0].raw; // 将选中的文件赋值给 file 字段
}
this.fileList = fileList;
},
async submitUpload() {
this.$refs.uploadVideoForm.validate(async (valid) => {
if (valid) {
// 1. 检查是否选择了文件
if (this.fileList.length === 0) {
this.$message.error('请选择文件');
return;
}
// 2. 创建 FormData 对象
const formData = new FormData();
formData.append('file', this.uploadVideoForm.file);
formData.append('materialName', this.uploadVideoForm.materialName);
// 3. 添加文件到 FormData
this.fileList.forEach(file => {
formData.append('files', file.raw);
});
formData.append('tags', this.uploadVideoForm.tags);
formData.append('director', this.uploadVideoForm.director);
formData.append('resType', this.uploadVideoForm.resType);
formData.append('directoryId', this.uploadVideoForm.directoryId);
// 5. 发送上传请求
try {
// 使用 uploadVideo 方法发送请求
const response = await uploadMaterial(formData);
if (response && response.status === 200) {
this.$message.success('上传成功');
this.uploadVideoDialogVisible = false;
this.fetchMaterialsByDirectoryId(this.currentDirectory); // 刷新列表
// 清空表单
this.fetchMaterialsByDirectoryId(this.currentDirectory); // 刷新文件列表
// 6. 清空表单和文件列表
this.uploadVideoForm = {
file: null,
materialName: '',
tags: '',
director: null,
......@@ -601,7 +708,7 @@ export default {
directoryId: null
};
this.fileList = [];
this.$refs.uploadVideo.clearFiles(); // 清空上传组件的文件列表
this.$refs.uploadVideo.clearFiles(); // 清空 el-upload 组件的文件列表
} else {
this.$message.error(response.msg || '上传失败');
}
......@@ -610,7 +717,7 @@ export default {
console.error('上传失败:', error);
}
} else {
console.log('error submit!!');
console.log('表单验证失败');
return false;
}
});
......
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