DMJS-IT
/
merchant-web
12
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 品牌视频处理

This commit is contained in:
lzhizhao 2025-09-25 12:56:02 +08:00
parent 9ec6a185fd
commit 0d47faf1c2
1 changed files with 52 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/views/modules/brand/config/popup/add-or-update.vue
View File

@ -219,7 +219,6 @@ export default {
type: "Input", type: "Input",
width: "300px", width: "300px",
type: "jsx", type: "jsx",
rules: { required: true, message: "请添加视频" },
render: () => { render: () => {
const handleChange = (file, fileList) => { const handleChange = (file, fileList) => {
// console.log(fileList); // console.log(fileList);
@ -229,10 +228,12 @@ export default {
console.log(res, fileList); console.log(res, fileList);
}; };
const handleRemove = (file, fileList) => { const handleRemove = (file, fileList) => {
this.modalData.video = "";
console.log(file, fileList); console.log(file, fileList);
}; };
return ( return (
<div style="display: flex;"> <div>
<div style="display: flex; align-items: flex-start; flex-wrap: wrap;">
<el-upload <el-upload
class="upload-demo" class="upload-demo"
action={this.$api.mer_admin.uploadFile()} action={this.$api.mer_admin.uploadFile()}
@ -246,31 +247,44 @@ export default {
headers={{ headers={{
token: "Bearer " + this.$cookie.get("token"), token: "Bearer " + this.$cookie.get("token"),
}} }}
multiple={true} multiple={false}
file-list={this.fileList} file-list={this.modalData.video ? [{name: 'video', url: this.modalData.video}] : []}
// list-type="picture" list-type="picture"
> >
<el-button size="small" type="primary"> <el-button size="small" type="primary">
<i class="el-icon-upload"></i>点击上传 <i class="el-icon-upload"></i>点击上传
</el-button> </el-button>
<div class="el-upload__tip" slot="tip"> <div class="el-upload__tip" slot="tip">
只能上传jpg/png文件，且不超过500kb 只能上传视频文件，且不超过500kb
</div> </div>
</el-upload> </el-upload>
<div style="margin-left:20px"> {this.modalData.video && (
<div style="margin-left: 20px; margin-top: 0; display: flex; align-items: center; min-width: 220px;">
<div style="position: relative; border: 1px solid #dcdfe6; border-radius: 4px; padding: 5px; background: #f5f7fa;">
<video <video
id="videoPlayer" id="videoPlayer"
width="200px" width="200px"
height="100px" height="100px"
object-fit="fill" style="object-fit: cover; border-radius: 2px; display: block;"
muted="muted" muted="muted"
loop loop
controls controls
> >
<source src={this.modalData.video} type="video/mp4" /> <source src={this.modalData.video} type="video/mp4" />
</video> </video>
<div style="margin-top: 5px; font-size: 12px; color: #909399; text-align: center;">
当前视频预览
</div> </div>
</div> </div>
</div>
)}
</div>
{this.modalData.video && (
<div style="margin-top: 10px; font-size: 12px; color: #606266; word-break: break-all; max-width: 400px;">
视频URL: {this.modalData.video}
</div>
)}
</div>
); );
}, },
}, },