From 893fc457a2daeb0aa33a5a9d0b32eef7db238c1f Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期一, 23 十月 2023 21:58:07 +0800
Subject: [PATCH] bug修改
---
src/views/operate/video/updateInterface/index.vue | 86 ++++++++++++++++++++++---------------------
1 files changed, 44 insertions(+), 42 deletions(-)
diff --git a/src/views/operate/video/updateInterface/index.vue b/src/views/operate/video/updateInterface/index.vue
index d1d05cd..f10f017 100644
--- a/src/views/operate/video/updateInterface/index.vue
+++ b/src/views/operate/video/updateInterface/index.vue
@@ -1,37 +1,23 @@
<template>
<div class="updateUser">
<el-form label-position="right" label-width="150px" :model="videoData" :rules="rules" :disabled="isDisabled" ref="user">
- <el-form-item prop="belongToId" label="鎵�灞炰簨浠剁紪鍙�">
- <el-input v-model="videoData.belongToId"></el-input>
- </el-form-item>
- <el-form-item prop="eventSource" label="浜嬩欢鏉ユ簮">
- <el-input v-model="videoData.eventSource"></el-input>
- </el-form-item>
- <el-form-item prop="category" label="闂绫诲埆">
- <el-input v-model="videoData.category"></el-input>
- </el-form-item>
- <el-form-item prop="type" label="绫诲瀷">
- <el-select v-model="videoData.type">
- <el-option v-for="item in getResourceType()" :key="item.value" :label="item.label" :value="item.value" />
- </el-select>
- </el-form-item>
- <el-form-item prop="regionName" label="绀惧尯鍚嶇О">
- <el-input v-model="videoData.regionName"></el-input>
- </el-form-item>
- <el-form-item prop="id" label="瑙嗛Id">
- <el-input v-model="videoData.id"></el-input>
- </el-form-item>
<el-form-item prop="url" label="瑙嗛" min-width="8">
- <video controls v-if="videoList" :src="videoData.url" width="300px" height="200px" />
+ <template v-if="videoList" >
+ <div class="video-cover" v-for="video in videoList" :key="video">
+ <i v-if="isUpdate" @click="handleDelete(video)" class="el-icon-delete video-delete-icon"></i>
+ <video controls :src="video" width="100%" height="100%"/>
+ </div>
+ </template>
<el-upload
v-if="isUpdate"
class="avatar-uploader"
action=""
ref="image"
+ :limit="4"
:show-file-list="false"
:auto-upload="true"
:http-request="videoUpload">
- <i class="el-icon-plus avatar-uploader-icon"></i>
+ <el-button size="small" type="primary">涓婁紶瑙嗛<i class="el-icon-upload el-icon--right"></i></el-button>
</el-upload>
</el-form-item>
<el-button v-if="!isDisabled" class="submit-button" type="primary" @click.native.prevent="onSubmit">鎻愪氦</el-button>
@@ -67,7 +53,7 @@
belongToId: [{ required: true, trigger: 'blur', message: '璇疯緭鍏ユ墍灞炰簨浠剁紪鍙�' }],
eventSource: [{ required: true, trigger: 'blur', message: '璇疯緭鍏ヤ簨浠舵潵婧�' }],
regionName: [{ required: true, trigger: 'blur', message: '璇疯緭鍏ョぞ鍖哄悕绉�' }],
- id: [{ required: true, trigger: 'blur', message: '璇疯緭鍏ュ浘鐗嘔d' }],
+ id: [{ required: true, trigger: 'blur', message: '璇疯緭鍏ヨ棰慖d' }],
category: [{ required: true, trigger: 'blue', message: '璇疯緭鍏ラ棶棰樼被鍨�' }],
url: [{ required: true, validator: validateVideoUrl }],
type: [{ required: true, trigger: ['blur', 'change'], message: '璇烽�夋嫨绫诲瀷' }]
@@ -94,6 +80,7 @@
delete params.eventSource;
delete params.id;
params.belongToId = +params.belongToId;
+ params.type="03"
if (this.isUpdate && !this.dialogData) {
videoManagement.addVideoResource(params)
.then(() => {
@@ -119,8 +106,10 @@
formData.append('file', file.file);
imageManagement.importImage(formData)
.then(res => {
- this.$refs.image.clearFiles();
- this.$set(this.videoData, 'url', FILE_ORIGINAL_URL + res.url1);
+ const url = res.url1 ?? res.url2 ?? res.url3 ?? res.url4;
+ const videoUrl = FILE_ORIGINAL_URL + url;
+ this.videoList.push(videoUrl);
+ this.$set(this.videoData, 'url', this.videoList.join(','));
this.$message.success('涓婁紶鎴愬姛');
})
.catch(err => {
@@ -128,6 +117,12 @@
this.$refs.image.clearFiles();
})
},
+
+ handleDelete(data) {
+ this.videoList = this.videoList.filter(item => item !== data);
+ this.videoData.url = this.videoList.join(',');
+ },
+
getResourceType(value) {
return value ? RESOURCE_TYPE.find(item => item.value === value) : RESOURCE_TYPE;
}
@@ -147,27 +142,34 @@
<style lang="scss" scoped>
.updateUser {
border-radius: 1px;
- background-color: #09152f;
+ // background-color: #09152f;
display: flex;
justify-content: center;
align-items: center;
- .avatar-uploader .el-upload {
- border: 1px solid #ffffff;
- border-radius: 6px;
- cursor: pointer;
- position: relative;
- overflow: hidden;
+
+ .video-cover {
+ height: 169px;
+ display: flex;
}
- .avatar-uploader .el-upload:hover {
- border-color: #409EFF;
+
+ .video-cover:hover {
+ background-color: #ffffff;
+ opacity: .6;
+ .video-delete-icon {
+ display: block;
+ opacity: 1;
+ }
}
- .avatar-uploader-icon {
- font-size: 14px;
- color: #8c939d;
- width: 50px;
- height: 50px;
- line-height: 50px;
- text-align: center;
+
+ .video-delete-icon {
+ position: absolute;
+ color: red;
+ left: calc(100% - 160px);
+ top: calc(100% - 150px);
+ z-index: 2;
+ height: 14px;
+ font-size: 24px;
+ display: none;
}
.submit-button {
@@ -180,7 +182,7 @@
}
.updateUser::v-deep .el-input__inner {
- background-color: #09152f;
+ // background-color: #09152f;
border: 1px solid #17324c;
}
--
Gitblit v1.8.0