修改上传
This commit is contained in:
parent
5fceedfd1d
commit
6dddc2cd7a
GPG Key ID:
A7972FD973317FF3
@ -289,5 +289,8 @@ export default {
|
||||
chushihuashibai: "Failed to initialize local stream",
|
||||
buzhichifenxiang: "Your browser does not support screen sharing. Please download the new version of chrome",
|
||||
xuanzefenxiangneirong: "Please choose what to share",
|
||||
guanbishibai: "Closing failed"
|
||||
guanbishibai: "Closing failed",
|
||||
fengmianyaoqiu:"Cover requirements:",
|
||||
fengmianyaoqiu1:"File extension: JPG, png",
|
||||
fengmianyaoqiu2:"File size limit: 2m",
|
||||
}
|
||||
@ -94,7 +94,10 @@ export default {
|
||||
shipinyaoqiu:"视频要求：",
|
||||
shipinyaoqiu1:"上传视频时间要求为30s之内",
|
||||
shipinyaoqiu2:"支持文件大小100M",
|
||||
shipinyaoqiu3:"文件扩展名：fiv、mp4…",
|
||||
shipinyaoqiu3:"文件扩展名：fiv、mp4",
|
||||
fengmianyaoqiu:"封面要求：",
|
||||
fengmianyaoqiu1:"文件扩展名：jpg，png",
|
||||
fengmianyaoqiu2:"文件大小限制：2M",
|
||||
ziwojieshao:"自我介绍",
|
||||
lianxifangshi:"联系方式",
|
||||
genghuanshoujihao:"更换手机号",
|
||||
|
||||
@ -804,6 +804,10 @@ export default defineComponent({
|
||||
// }
|
||||
|
||||
for(const i in uesrinfo.willsay){
|
||||
if(uesrinfo.willsay[i].name == '请选择'){
|
||||
console.log(111)
|
||||
break;
|
||||
}
|
||||
for(const j in chiveslist.value[1]){
|
||||
if(uesrinfo.willsay[i].name == chiveslist.value[1][j].name){
|
||||
uesrinfo.willsay[i].name = chiveslist.value[1][j].languageid
|
||||
@ -814,6 +818,10 @@ export default defineComponent({
|
||||
const arr: any = {};
|
||||
for(const i in uesrinfo.willsay){
|
||||
// const a: any = {};
|
||||
if(uesrinfo.willsay[i].name == '请选择'){
|
||||
console.log(111)
|
||||
break;
|
||||
}
|
||||
arr[uesrinfo.willsay[i].name] = uesrinfo.willsay[i].level
|
||||
// arr.push(a);
|
||||
// arr.push({uesrinfo.willsay[i].name})
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="upload-video">
|
||||
<a-form :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||
<div class="title">{{lan.$t("shangchuanshipin")}}</div>
|
||||
<div class="title">{{ lan.$t("shangchuanshipin") }}</div>
|
||||
<a-form-item :label="lan.$t('shipinbiaoti')">
|
||||
<a-input
|
||||
size="small"
|
||||
@ -10,8 +10,16 @@
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item :label="lan.$t('shipinfengmian')" class="video-cover">
|
||||
<a-upload list-type="picture" :customRequest="uploadspic" :before-upload="beforeUpload">
|
||||
<div class="upload-image" v-if="!viewCover && form.img.length == 0">
|
||||
<div style="display: flex">
|
||||
<a-upload
|
||||
list-type="picture"
|
||||
:customRequest="uploadspic"
|
||||
:before-upload="beforeUploadpic"
|
||||
>
|
||||
<div
|
||||
class="upload-image"
|
||||
v-if="!viewCover && form.img.length == 0"
|
||||
>
|
||||
<PlusOutlined
|
||||
style="fontsize: 22px"
|
||||
v-if="uploadpicprogress == 0"
|
||||
@ -24,14 +32,35 @@
|
||||
/>
|
||||
</div>
|
||||
<div class="upload-image" v-else>
|
||||
<img style="width: 100%; height: 100%" :src="form.img" />
|
||||
<img
|
||||
style="width: 100%; height: 100%"
|
||||
:src="form.img"
|
||||
/>
|
||||
</div>
|
||||
</a-upload>
|
||||
<div class="demand">
|
||||
<p class="one-line-hide">
|
||||
{{ lan.$t("fengmianyaoqiu") }}
|
||||
</p>
|
||||
<p class="one-line-hide">
|
||||
1.{{ lan.$t("fengmianyaoqiu1") }}
|
||||
</p>
|
||||
<p class="one-line-hide">
|
||||
2.{{ lan.$t("fengmianyaoqiu2") }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</a-form-item>
|
||||
<a-form-item :label="lan.$t('xuanzeshipin')" class="video-introduction">
|
||||
<div class="upload-container">
|
||||
<a-upload list-type="picture" :customRequest="uploads" :beforeUpload="beforeVideoUpload">
|
||||
<div class="upload-image">
|
||||
<a-form-item
|
||||
:label="lan.$t('shipinjieshao')"
|
||||
class="video-introduction"
|
||||
>
|
||||
<a-upload
|
||||
list-type="picture"
|
||||
:customRequest="uploads"
|
||||
:before-upload="beforeUpload"
|
||||
>
|
||||
<div class="upload-image" v-if="form.fileurl.length == 0">
|
||||
<PlaySquareOutlined
|
||||
style="fontsize: 22px"
|
||||
v-if="uploadprogress == 0"
|
||||
@ -42,12 +71,12 @@
|
||||
:width="80"
|
||||
v-else
|
||||
/>
|
||||
<video style="display: none" :src="videofile"></video>
|
||||
<!-- <video style="display: none" :src="videofile"></video> -->
|
||||
</div>
|
||||
<div
|
||||
class="upload-image upload"
|
||||
style="position: relative"
|
||||
v-show="false"
|
||||
v-show="form.fileurl.length != 0"
|
||||
>
|
||||
<video
|
||||
:src="form.fileurl"
|
||||
@ -56,34 +85,27 @@
|
||||
videos[0] = el;
|
||||
}
|
||||
"
|
||||
class="upload"
|
||||
class="upload1"
|
||||
></video>
|
||||
<!-- <a-progress type="circle" :percent="100" :width="80" style="position:absolute;right:35%"/> -->
|
||||
</div>
|
||||
</a-upload>
|
||||
<!-- 文件列表 -->
|
||||
<div v-if="form.video[0].length">
|
||||
<div
|
||||
v-for="(item, index) in form.video"
|
||||
:key="index"
|
||||
class="video-list"
|
||||
>
|
||||
<img src="@/static/images/link.png" class="link" />
|
||||
<span class="one-line-hide">{{ item.split('/')[item.split('/').length-1] }}</span>
|
||||
<img
|
||||
src="@/static/images/delete.png"
|
||||
@click="removeFile(0)"
|
||||
class="del"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="demand">
|
||||
<p class="one-line-hide">{{lan.$t('shipinyaoqiu')}}</p>
|
||||
<p class="one-line-hide">
|
||||
1. {{lan.$t('shipinyaoqiu3')}}
|
||||
{{ lan.$t("shipinyaoqiu") }}
|
||||
</p>
|
||||
<p class="one-line-hide">1.{{ lan.$t("shipinyaoqiu1") }}</p>
|
||||
<p class="one-line-hide">2.{{ lan.$t("shipinyaoqiu2") }}</p>
|
||||
<p class="one-line-hide">3.{{ lan.$t("shipinyaoqiu3") }}</p>
|
||||
</div>
|
||||
<!-- <div class="demand">
|
||||
<p class="one-line-hide">视频要求：</p>
|
||||
<p class="one-line-hide">1.上传视频时间要求为30s之内</p>
|
||||
<p class="one-line-hide">2.支持文件大小100M</p>
|
||||
<p class="one-line-hide">
|
||||
3.文件扩展名：fiv、mp4…文件扩展名：fiv、mp4…
|
||||
</p>
|
||||
</div> -->
|
||||
</a-form-item>
|
||||
<a-form-item :label="lan.$t('shipinjianjie')" class="brief">
|
||||
<a-textarea
|
||||
@ -96,7 +118,9 @@
|
||||
<span class="words-number">{{ form.desc.length }}/200</span>
|
||||
</a-form-item>
|
||||
<a-form-item :wrapper-col="{ span: 4, offset: 0 }">
|
||||
<a-button @click="onSubmit">{{lan.$t('shangchuanshipin')}}</a-button>
|
||||
<a-button @click="onSubmit">{{
|
||||
lan.$t("shangchuanshipin")
|
||||
}}</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<nav-bottom></nav-bottom>
|
||||
@ -110,9 +134,9 @@ import { previewCover } from "@/utils/common";
|
||||
import { FromSend, ImgInfo, VideoInfo } from "@/types";
|
||||
import { uploadflie } from "@/utils/vod";
|
||||
import { setvideo, videoadd, videodetail } from "@/api";
|
||||
import { useRoute } from 'vue-router';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { useI18n } from '@/utils/i18n';
|
||||
import { useRoute } from "vue-router";
|
||||
import { message } from "ant-design-vue";
|
||||
import { useI18n } from "@/utils/i18n";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ReleaseWebcast",
|
||||
@ -136,15 +160,15 @@ export default defineComponent({
|
||||
fileurl: "",
|
||||
fileduration: "",
|
||||
desc: "",
|
||||
video:[""],
|
||||
video: [""],
|
||||
});
|
||||
onMounted(async () => {
|
||||
if(useRoute().query.id){
|
||||
console.log(useRoute().query.id,"knijkdbj")
|
||||
form.value = await videodetail(useRoute().query.id,1)
|
||||
console.log(form.value,"fornm")
|
||||
if (useRoute().query.id) {
|
||||
console.log(useRoute().query.id, "knijkdbj");
|
||||
form.value = await videodetail(useRoute().query.id, 1);
|
||||
console.log(form.value, "fornm");
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
// 是否显示封面预览 封面的路径
|
||||
const viewCover: Ref<boolean> = ref(false),
|
||||
@ -169,7 +193,6 @@ export default defineComponent({
|
||||
return false;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 删除封面
|
||||
*/
|
||||
@ -192,35 +215,43 @@ export default defineComponent({
|
||||
const uploadpicprogress: Ref<number> = ref(0);
|
||||
const videofile = ref<File>();
|
||||
const videos = ref<Array<any>>([]);
|
||||
const ifalowupload=ref<boolean>(false)
|
||||
const ifalowupload = ref<boolean>(false);
|
||||
interface AntUpload {
|
||||
action: string;
|
||||
data: unknown;
|
||||
file: File;
|
||||
}
|
||||
async function uploadspic(file: AntUpload) {
|
||||
if(ifalowupload.value){
|
||||
if (ifalowupload.value) {
|
||||
const res = await uploadflie(file.file, (info: any) => {
|
||||
console.log(info);
|
||||
uploadpicprogress.value = info.percent.toFixed(2) * 100;
|
||||
});
|
||||
console.log(res);
|
||||
form.value.img = res.video.url;
|
||||
}else{
|
||||
return
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
function beforeUploadpic(info?: any) {
|
||||
console.log(info);
|
||||
if (info.type.split("/")[0] != "image") {
|
||||
message.error(lan.$t("fengmiangeshi"));
|
||||
ifalowupload.value = false;
|
||||
return;
|
||||
} else {
|
||||
ifalowupload.value = true;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 上传视频
|
||||
*/
|
||||
const uploadprogress: Ref<number> = ref(0);
|
||||
const ifallowvideo=ref<boolean>(false)
|
||||
const ifallowvideo = ref<boolean>(false);
|
||||
async function uploads(file: AntUpload) {
|
||||
if(ifallowvideo.value){
|
||||
uploadprogress.value=0
|
||||
form.value.video=[""]
|
||||
if (ifallowvideo.value) {
|
||||
console.log(file);
|
||||
videofile.value = file.file;
|
||||
videos.value[0].addEventListener("durationchange", () => {
|
||||
@ -235,53 +266,46 @@ export default defineComponent({
|
||||
|
||||
form.value.fileid = res.fileId;
|
||||
form.value.fileurl = res.video.url;
|
||||
form.value.video[0]=res.video.url
|
||||
uploadprogress.value=0
|
||||
}
|
||||
}
|
||||
|
||||
function beforeVideoUpload(info?: any) {
|
||||
console.log(info);
|
||||
if (info.type.split("/")[0] != "video") {
|
||||
ifallowvideo.value;
|
||||
message.error(lan.$t("wenjiangeshi"));
|
||||
} else {
|
||||
ifallowvideo.value = true;
|
||||
}
|
||||
|
||||
function beforeVideoUpload(info?: any){
|
||||
console.log(info)
|
||||
if(info.type.split("/")[0]!="video"){
|
||||
ifallowvideo.value
|
||||
message.error(lan.$t('wenjiangeshi'))
|
||||
|
||||
}else{
|
||||
ifallowvideo.value=true
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* 表单提交
|
||||
*/
|
||||
const routes=useRoute()
|
||||
const routes = useRoute();
|
||||
const onSubmit = async (e: FromSend) => {
|
||||
e.preventDefault();
|
||||
console.log(toRaw(form.value), 111);
|
||||
console.log(toRaw(form.value).video[0].length)
|
||||
console.log(toRaw(form.value).video[0].length);
|
||||
|
||||
console.log(routes.query,"adsadsa")
|
||||
const subdata=toRaw(form.value)
|
||||
if(subdata.title==""){
|
||||
message.error(lan.$t('biaotiweikong'))
|
||||
return
|
||||
}else if(subdata.img==""){
|
||||
message.error(lan.$t('fengmianweikong'))
|
||||
return
|
||||
}else if(subdata.fileurl==""){
|
||||
message.error(lan.$t('wenjianweikong'))
|
||||
}else if(subdata.desc==""){
|
||||
message.error(lan.$t('jianjieweikong'))
|
||||
}
|
||||
else{
|
||||
|
||||
if(routes.query.id){
|
||||
form.value.id=routes.query.id
|
||||
console.log('edi')
|
||||
setvideo(form.value)
|
||||
}else{
|
||||
console.log(routes.query, "adsadsa");
|
||||
const subdata = toRaw(form.value);
|
||||
if (subdata.title == "") {
|
||||
message.error(lan.$t("biaotiweikong"));
|
||||
return;
|
||||
} else if (subdata.img == "") {
|
||||
message.error(lan.$t("fengmianweikong"));
|
||||
return;
|
||||
} else if (subdata.fileurl == "") {
|
||||
message.error(lan.$t("wenjianweikong"));
|
||||
} else if (subdata.desc == "") {
|
||||
message.error(lan.$t("jianjieweikong"));
|
||||
} else {
|
||||
if (routes.query.id) {
|
||||
form.value.id = routes.query.id;
|
||||
console.log("edi");
|
||||
setvideo(form.value);
|
||||
} else {
|
||||
videoadd(form, toRaw(form.value));
|
||||
}
|
||||
// videoadd(form, toRaw(form.value));
|
||||
@ -289,15 +313,14 @@ export default defineComponent({
|
||||
|
||||
// videoadd(form, toRaw(form.value));
|
||||
};
|
||||
|
||||
function beforeUpload(info?: any){
|
||||
console.log(info.type)
|
||||
if(info.type.split('/')[0]!="image"){
|
||||
message.error(lan.$t('fengmiangeshi'))
|
||||
ifalowupload.value=false
|
||||
return
|
||||
}else{
|
||||
ifalowupload.value=true
|
||||
function beforeUpload(info?: any) {
|
||||
console.log(info);
|
||||
if (info.type.split("/")[0] != "video") {
|
||||
ifallowvideo.value = false;
|
||||
message.error(lan.$t("shipinjieshaoccuowu"));
|
||||
return;
|
||||
} else {
|
||||
ifallowvideo.value = true;
|
||||
}
|
||||
}
|
||||
|
||||
@ -322,16 +345,21 @@ export default defineComponent({
|
||||
beforeUpload,
|
||||
ifalowupload,
|
||||
beforeVideoUpload,
|
||||
lan
|
||||
lan,
|
||||
beforeUploadpic
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.upload1{
|
||||
width: 171px;
|
||||
height: 96px;
|
||||
}
|
||||
.upload {
|
||||
width: 171px;
|
||||
height: 96px;
|
||||
display:none
|
||||
display: none;
|
||||
}
|
||||
.upload-video {
|
||||
width: 100%;
|
||||
@ -401,7 +429,7 @@ export default defineComponent({
|
||||
font-size: 10px;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
&:hover{
|
||||
&:hover {
|
||||
background: #08ae98;
|
||||
}
|
||||
}
|
||||
@ -412,11 +440,6 @@ export default defineComponent({
|
||||
height: 96px;
|
||||
}
|
||||
}
|
||||
.video-introduction {
|
||||
.ant-form-item-control-wrapper {
|
||||
.ant-form-item-children {
|
||||
display: flex;
|
||||
// align-items: center;
|
||||
.demand {
|
||||
height: 94px;
|
||||
font-size: 10px;
|
||||
@ -431,6 +454,11 @@ export default defineComponent({
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
.video-introduction {
|
||||
.ant-form-item-control-wrapper {
|
||||
.ant-form-item-children {
|
||||
display: flex;
|
||||
// align-items: center;
|
||||
}
|
||||
}
|
||||
.video-list {
|
||||
|
||||
@ -10,6 +10,7 @@
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item :label="lan.$t('zhibofengmian')" class="item-cover">
|
||||
<div style="display:flex">
|
||||
<a-upload
|
||||
list-type="picture"
|
||||
:customRequest="uploadspic"
|
||||
@ -36,7 +37,21 @@
|
||||
:src="form.img"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</a-upload>
|
||||
<div class="demand">
|
||||
<p class="one-line-hide">
|
||||
{{ lan.$t("fengmianyaoqiu") }}
|
||||
</p>
|
||||
<p class="one-line-hide">
|
||||
1.{{ lan.$t("fengmianyaoqiu1") }}
|
||||
</p>
|
||||
<p class="one-line-hide">
|
||||
2.{{ lan.$t("fengmianyaoqiu2") }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:label="lan.$t('shipinjieshao')"
|
||||
@ -618,11 +633,6 @@ export default defineComponent({
|
||||
height: 96px;
|
||||
}
|
||||
}
|
||||
.video-introduction {
|
||||
.ant-form-item-control-wrapper {
|
||||
.ant-form-item-children {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.demand {
|
||||
line-height: 17px;
|
||||
font-size: 10px;
|
||||
@ -633,6 +643,12 @@ export default defineComponent({
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
.video-introduction {
|
||||
.ant-form-item-control-wrapper {
|
||||
.ant-form-item-children {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user