diff --git a/src/assets/img/主播信息登记表.docx b/src/assets/img/主播信息登记表.docx new file mode 100644 index 0000000..4c9fb84 Binary files /dev/null and b/src/assets/img/主播信息登记表.docx differ diff --git a/src/views/user/OrganizationTalent.vue b/src/views/user/OrganizationTalent.vue index db40c74..3d4d9cd 100644 --- a/src/views/user/OrganizationTalent.vue +++ b/src/views/user/OrganizationTalent.vue @@ -17,7 +17,7 @@
- +
@@ -58,8 +58,7 @@ - - +
@@ -71,20 +70,23 @@
主播信息表: - + +
-
格式要求word,不超过10M;可同时上传最多30位主播信息表
+
格式要求word,不超过10M;可同时上传最多30位主播信息表,支持多次选择追加
-
-
{{ item.name }}
+
+ +
+
{{ item.name }}
- +
@@ -104,6 +106,8 @@ import assetActiveIcon from '@/assets/img/user/申请icon.png'; import assetInactiveIcon from '@/assets/img/user/申请未选中.png'; const TALENT_STORAGE_KEY = 'cog.org.talents'; +const MAX_BATCH_FILES = 30; +const MAX_FILE_SIZE = 10 * 1024 * 1024; const API_ENDPOINTS = { list: '/api/mcn/anchors/list', delete: '/api/mcn/anchors/delete', @@ -195,29 +199,95 @@ export default { saveTalents(this.talents); this.$message.success(`已删除,接口待接入:${this.apiEndpoints.delete}`); }, + openBatchDialog() { + this.resetBatchUpload(); + this.batchDialogVisible = true; + }, + closeBatchDialog() { + this.batchDialogVisible = false; + this.resetBatchUpload(); + }, + resetBatchUpload() { + this.uploadedBatchFiles = []; + if (this.$refs.batchUploader) { + this.$refs.batchUploader.value = ''; + } + }, triggerBatchUpload() { + if (this.uploadedBatchFiles.length >= MAX_BATCH_FILES) { + this.$message.warning(`最多只能上传${MAX_BATCH_FILES}个主播信息表`); + return; + } this.$refs.batchUploader.click(); }, handleBatchUpload(event) { const files = Array.from(event.target.files || []); - const invalid = files.some(file => file.size > 10 * 1024 * 1024); - if (invalid) { - this.$message.warning('单个文件大小不能超过10M'); - event.target.value = ''; + event.target.value = ''; + + if (!files.length) { return; } - this.uploadedBatchFiles = files.slice(0, 30).map(file => ({ name: file.name })); - event.target.value = ''; + + const invalidSize = files.some(file => file.size > MAX_FILE_SIZE); + if (invalidSize) { + this.$message.warning('单个文件大小不能超过10M'); + return; + } + + const remain = MAX_BATCH_FILES - this.uploadedBatchFiles.length; + if (remain <= 0) { + this.$message.warning(`最多只能上传${MAX_BATCH_FILES}个主播信息表`); + return; + } + + if (files.length > remain) { + this.$message.warning(`最多只能上传${MAX_BATCH_FILES}个主播信息表,本次仅添加${remain}个`); + } + + const existingNames = new Set(this.uploadedBatchFiles.map(item => item.name)); + const nextFiles = []; + + files.slice(0, remain).forEach(file => { + if (existingNames.has(file.name)) { + return; + } + existingNames.add(file.name); + nextFiles.push({ name: file.name, file }); + }); + + if (!nextFiles.length) { + this.$message.warning('所选文件已存在或无可添加文件'); + return; + } + + this.uploadedBatchFiles = this.uploadedBatchFiles.concat(nextFiles); + }, + removeBatchFile(index) { + this.uploadedBatchFiles.splice(index, 1); }, downloadTemplate() { - const content = '主播姓名,手机号,身份证号,全网粉丝总数,全网作品点击量,近一年利润,近一年直播场次,授权截止日期,平台名称,垂类赛道,平台ID,粉丝数量,主播昵称'; - const blob = new Blob([content], { type: 'application/msword;charset=utf-8' }); - const url = URL.createObjectURL(blob); - const link = document.createElement('a'); - link.href = url; - link.download = '主播信息模板.doc'; - link.click(); - URL.revokeObjectURL(url); + const fileName = '主播信息登记表.docx'; + const fileUrl = encodeURI(`/img/${fileName}`); + fetch(fileUrl) + .then(res => { + if (!res.ok) { + throw new Error('download failed'); + } + return res.blob(); + }) + .then(blob => { + const url = window.URL.createObjectURL(blob); + const link = document.createElement('a'); + link.href = url; + link.download = fileName; + document.body.appendChild(link); + link.click(); + document.body.removeChild(link); + window.URL.revokeObjectURL(url); + }) + .catch(() => { + this.$message.error('模板下载失败,请稍后重试'); + }); }, submitBatch() { if (!this.uploadedBatchFiles.length) { @@ -225,7 +295,8 @@ export default { return; } this.batchDialogVisible = false; - this.$message.success(`批量导入已提交,接口待接入:${this.apiEndpoints.batchImport}`); + this.$message.success(`批量导入已提交(${this.uploadedBatchFiles.length}个文件),接口待接入:${this.apiEndpoints.batchImport}`); + this.resetBatchUpload(); } }, watch: { @@ -237,6 +308,7 @@ export default {