duoyuyan
This commit is contained in:
@@ -1,16 +1,20 @@
|
||||
<template>
|
||||
<div class="webcast">
|
||||
<a-form :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||
<div class="title">直播信息</div>
|
||||
<a-form-item label="直播标题">
|
||||
<div class="title">{{ lan.$t("zhiboxinxi") }}</div>
|
||||
<a-form-item :label="lan.$t('zhibobiaoti')">
|
||||
<a-input
|
||||
size="small"
|
||||
v-model:value="form.title"
|
||||
placeholder="请输入您的直播标题"
|
||||
:placeholder="lan.$t('shuruzhibobiaoti')"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="直播封面" class="item-cover">
|
||||
<a-upload list-type="picture" :customRequest="uploadspic" :before-upload="beforeUploadpic">
|
||||
<a-form-item :label="lan.$t('zhibofengmian')" class="item-cover">
|
||||
<a-upload
|
||||
list-type="picture"
|
||||
:customRequest="uploadspic"
|
||||
:before-upload="beforeUploadpic"
|
||||
>
|
||||
<div
|
||||
class="upload-image"
|
||||
v-if="!viewCover && form.img.length == 0"
|
||||
@@ -34,8 +38,15 @@
|
||||
</div>
|
||||
</a-upload>
|
||||
</a-form-item>
|
||||
<a-form-item label="视频介绍" class="video-introduction">
|
||||
<a-upload list-type="picture" :customRequest="uploads" :before-upload="beforeUpload">
|
||||
<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"
|
||||
@@ -67,15 +78,23 @@
|
||||
</div>
|
||||
</a-upload>
|
||||
<div class="demand">
|
||||
<p class="one-line-hide">
|
||||
{{ 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>
|
||||
</div> -->
|
||||
</a-form-item>
|
||||
<a-form-item label="开始时间">
|
||||
<a-form-item :label="lan.$t('kaishishijian')">
|
||||
<!-- <a-input
|
||||
size="small"
|
||||
v-model:value="form.startTime"
|
||||
@@ -85,42 +104,45 @@
|
||||
show-time
|
||||
:value="form.dateline"
|
||||
@change="startchange"
|
||||
placeholder="请设置您的开始时间"
|
||||
:placeholder="lan.$t('shezhikaishishijian')"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="直播时长"
|
||||
:label="lan.$t('zhiboshichang')"
|
||||
class="duration"
|
||||
v-bind="validateInfos.livetime"
|
||||
>
|
||||
<a-input
|
||||
size="small"
|
||||
v-model:value="form.livetime"
|
||||
placeholder="请输入直播时间"
|
||||
:placeholder="lan.$t('shuruzhiboshijian')"
|
||||
type="number"
|
||||
/>
|
||||
<span class="unit">分钟</span>
|
||||
<span class="unit">{{ lan.$t("fenzhong") }}</span>
|
||||
</a-form-item>
|
||||
<a-form-item label="直播人数" v-bind="validateInfos.livenumber">
|
||||
<a-form-item
|
||||
:label="lan.$t('zhiborenshu')"
|
||||
v-bind="validateInfos.livenumber"
|
||||
>
|
||||
<a-input
|
||||
size="small"
|
||||
v-model:value="form.livenumber"
|
||||
placeholder="请输入直播人数"
|
||||
:placeholder="lan.$t('shuruzhiborenshu')"
|
||||
type="number"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="直播简介" class="brief">
|
||||
<a-form-item :label="lan.$t('zhibojianjie')" class="brief">
|
||||
<a-textarea
|
||||
v-model:value="form.desc"
|
||||
:autoSize="true"
|
||||
class="brief-textarea"
|
||||
:maxlength="200"
|
||||
placeholder="请输入您的直播简介"
|
||||
:placeholder="lan.$t('shuruzhibojianjie')"
|
||||
/>
|
||||
<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">发布直播</a-button>
|
||||
<a-button @click="onSubmit">{{ lan.$t("fabuzhibo") }}</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<div class="modal-container">
|
||||
@@ -136,14 +158,16 @@
|
||||
<img src="@/static/images/delete.png" class="close" />
|
||||
</template>
|
||||
<div class="notice-container report" v-if="lives.status == 1">
|
||||
<div class="title">您尚未获得直播资格</div>
|
||||
<div class="title">{{ lan.$t("wuzhibozige") }}</div>
|
||||
<div class="title sub-title">
|
||||
{{ lives.data.msg }}
|
||||
</div>
|
||||
<div class="confirm-btn" @click="fankui">意见反馈</div>
|
||||
<div class="confirm-btn" @click="fankui">
|
||||
{{ lan.$t("yijianfankui") }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice-container" v-else>
|
||||
<div class="title">您尚未获得直播资格</div>
|
||||
<div class="title">{{ lan.$t("wuzhibozige") }}</div>
|
||||
<div class="title sub-title">
|
||||
<!-- 上一周/月您在平台视频点击量为
|
||||
<span class="red">第24名</span>,要在前
|
||||
@@ -178,7 +202,8 @@ import { getlivest, liveadd, liveinfo, setlive } from "@/api";
|
||||
import { useRoute } from "vue-router";
|
||||
import dayjs from "dayjs";
|
||||
import { message } from "ant-design-vue";
|
||||
import router from '@/router';
|
||||
import router from "@/router";
|
||||
import { useI18n } from "@/utils/i18n";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ReleaseWebcast",
|
||||
@@ -189,6 +214,7 @@ export default defineComponent({
|
||||
RankList,
|
||||
},
|
||||
setup() {
|
||||
const lan: any = useI18n();
|
||||
// 表单数据
|
||||
const form = ref({
|
||||
title: "",
|
||||
@@ -266,8 +292,8 @@ export default defineComponent({
|
||||
viewCover.value = true;
|
||||
// form.cover = fileList;
|
||||
}
|
||||
function fankui(){
|
||||
router.push({path:"/mine/aboutus",query:{selected:3}})
|
||||
function fankui() {
|
||||
router.push({ path: "/mine/aboutus", query: { selected: 3 } });
|
||||
}
|
||||
const { resetFields, validate, validateInfos } = useForm(form, rules);
|
||||
|
||||
@@ -323,24 +349,23 @@ export default defineComponent({
|
||||
message.error("直播简介不能为空");
|
||||
return;
|
||||
} else {
|
||||
if(lives.value.status==0){
|
||||
// subdata.fileid=picinfo.
|
||||
if (id != undefined && id) {
|
||||
/**
|
||||
* todo 提交会报错 编辑直播
|
||||
*/
|
||||
subdata.id = id;
|
||||
// setlive(subdata)
|
||||
} else {
|
||||
console.log(subdata);
|
||||
console.log(lives.value)
|
||||
// liveadd(subdata);
|
||||
}
|
||||
}else{
|
||||
message.error("您尚未获得直播资格")
|
||||
}
|
||||
|
||||
|
||||
if (lives.value.status == 0) {
|
||||
// subdata.fileid=picinfo.
|
||||
if (id != undefined && id) {
|
||||
/**
|
||||
* todo 提交会报错 编辑直播
|
||||
*/
|
||||
subdata.id = id;
|
||||
setlive(subdata)
|
||||
} else {
|
||||
console.log(subdata);
|
||||
console.log(lives.value);
|
||||
liveadd(subdata);
|
||||
}
|
||||
} else {
|
||||
message.error("您尚未获得直播资格");
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch((err: unknown) => {
|
||||
@@ -394,51 +419,49 @@ export default defineComponent({
|
||||
action: string;
|
||||
data: unknown;
|
||||
file: File;
|
||||
}
|
||||
const ifallowupload=ref<boolean>(false)
|
||||
function beforeUpload(info?: any){
|
||||
console.log(info)
|
||||
if(info.type.split("/")[0]!="video"){
|
||||
ifallowupload.value=false
|
||||
message.error("视频介绍的文件格式错误")
|
||||
return
|
||||
}else{
|
||||
ifallowupload.value=true
|
||||
}
|
||||
}
|
||||
async function uploads(file: AntUpload) {
|
||||
if(ifallowupload.value){
|
||||
console.log(file);
|
||||
videofile.value = file.file;
|
||||
videos.value[0].addEventListener("durationchange", () => {
|
||||
console.log(videos.value[0].duration);
|
||||
form.value.fileduration = videos.value[0].duration;
|
||||
});
|
||||
const res = await uploadflie(file.file, (info: any) => {
|
||||
console.log(info);
|
||||
uploadprogress.value = info.percent.toFixed(2) * 100;
|
||||
});
|
||||
console.log(res);
|
||||
|
||||
form.value.fileid = res.fileId;
|
||||
form.value.fileurl = res.video.url;
|
||||
}
|
||||
|
||||
}
|
||||
const ifallowpic=ref<boolean>(false)
|
||||
async function uploadspic(file: AntUpload) {
|
||||
if(ifallowpic.value){
|
||||
const res = await uploadflie(file.file, (info: any) => {
|
||||
console.log(info);
|
||||
uploadpicprogress.value = info.percent.toFixed(2) * 100;
|
||||
});
|
||||
console.log(res);
|
||||
const ifallowupload = ref<boolean>(false);
|
||||
function beforeUpload(info?: any) {
|
||||
console.log(info);
|
||||
if (info.type.split("/")[0] != "video") {
|
||||
ifallowupload.value = false;
|
||||
message.error("视频介绍的文件格式错误");
|
||||
return;
|
||||
} else {
|
||||
ifallowupload.value = true;
|
||||
}
|
||||
}
|
||||
async function uploads(file: AntUpload) {
|
||||
if (ifallowupload.value) {
|
||||
console.log(file);
|
||||
videofile.value = file.file;
|
||||
videos.value[0].addEventListener("durationchange", () => {
|
||||
console.log(videos.value[0].duration);
|
||||
form.value.fileduration = videos.value[0].duration;
|
||||
});
|
||||
const res = await uploadflie(file.file, (info: any) => {
|
||||
console.log(info);
|
||||
uploadprogress.value = info.percent.toFixed(2) * 100;
|
||||
});
|
||||
console.log(res);
|
||||
|
||||
// picinfo.fileId=res.fileId
|
||||
// picinfo.url=res.video.url
|
||||
form.value.img = res.video.url;
|
||||
}
|
||||
|
||||
form.value.fileid = res.fileId;
|
||||
form.value.fileurl = res.video.url;
|
||||
}
|
||||
}
|
||||
const ifallowpic = ref<boolean>(false);
|
||||
async function uploadspic(file: AntUpload) {
|
||||
if (ifallowpic.value) {
|
||||
const res = await uploadflie(file.file, (info: any) => {
|
||||
console.log(info);
|
||||
uploadpicprogress.value = info.percent.toFixed(2) * 100;
|
||||
});
|
||||
console.log(res);
|
||||
|
||||
// picinfo.fileId=res.fileId
|
||||
// picinfo.url=res.video.url
|
||||
form.value.img = res.video.url;
|
||||
}
|
||||
}
|
||||
|
||||
getlivest().then((res) => {
|
||||
@@ -446,17 +469,17 @@ export default defineComponent({
|
||||
isEntitled.value = true;
|
||||
lives.value = res;
|
||||
}
|
||||
});
|
||||
function beforeUploadpic(info?: any){
|
||||
console.log(info)
|
||||
if(info.type.split("/")[0]!='image'){
|
||||
message.error("封面必须是图片文件")
|
||||
ifallowpic.value=false
|
||||
return
|
||||
}else{
|
||||
ifallowpic.value=true
|
||||
}
|
||||
}
|
||||
});
|
||||
function beforeUploadpic(info?: any) {
|
||||
console.log(info);
|
||||
if (info.type.split("/")[0] != "image") {
|
||||
message.error("封面必须是图片文件");
|
||||
ifallowpic.value = false;
|
||||
return;
|
||||
} else {
|
||||
ifallowpic.value = true;
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
labelCol: { span: 4 },
|
||||
@@ -481,12 +504,13 @@ export default defineComponent({
|
||||
startchange,
|
||||
videofile,
|
||||
videos,
|
||||
lives,
|
||||
beforeUploadpic,
|
||||
ifallowpic,
|
||||
beforeUpload,
|
||||
lives,
|
||||
beforeUploadpic,
|
||||
ifallowpic,
|
||||
beforeUpload,
|
||||
ifallowupload,
|
||||
fankui
|
||||
fankui,
|
||||
lan,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user