Skip to content

P
pica.cloud.web-education-admin
提交 282f02a8 编写于 作者: bo.dang's avatar bo.dang
浏览文件
操作

新建直播

上级 8acd9a18
显示空白字符变更
内嵌 并排
正在显示 包含 372 行增加 和 129 行删除
src/utils/yqrange/yqrangeApi.js 0 → 100644
浏览文件 @ 282f02a8
import fetch from '../fetch';
import { getBaseUrl, getSaasDomain, getSaasApiDomain } from '@/utils/index'
let headers = {
'Content-Type': 'application/json;charset=UTF-8',
token: localStorage.getItem('storageToken'),
};
export const getRtcInfo = (params) => {
return fetch({
headers,
url: getBaseUrl(`rtc/liveAdmin/${params.rtcId}`),
method: 'get',
// params: params,
description: '查询单个直播',
})
};
src/views/yqrange/create-live.vue
浏览文件 @ 282f02a8
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<div class="yqrange-index-content screenSet" id="screenSet"> <div class="yqrange-index-content screenSet" id="screenSet">
<el-row class="step-content"> <el-row class="step-content">
<el-col :span="12"> <el-col :span="12">
<div style="color:#666666;font-size:14px;">新建直播</div> <div style="color:#666666;font-size:14px;">{{curmbThird}}</div>
<!--<el-steps :active="active" simple class>--> <!--<el-steps :active="active" simple class>-->
<!--<span class="step-num" :class="{ 'on-step': stepData[0] }">1</span>--> <!--<span class="step-num" :class="{ 'on-step': stepData[0] }">1</span>-->
<!--<el-step title="基础信息"></el-step>--> <!--<el-step title="基础信息"></el-step>-->
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<!--</el-steps>--> <!--</el-steps>-->
</el-col> </el-col>
<el-col :span="6" :offset="5"> <el-col :span="6" :offset="5">
<el-button size="small" type="primary" @click="complete">完成</el-button> <el-button size="small" type="primary" @click="complete('formData')">完成</el-button>
</el-col> </el-col>
</el-row> </el-row>
<div class="first-step"> <div class="first-step">
...@@ -33,17 +33,17 @@ ...@@ -33,17 +33,17 @@
placeholder="请输入直播标题" placeholder="请输入直播标题"
style="width:70%;" style="width:70%;"
></el-input> ></el-input>
<span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/24</span> <span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/20</span>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="是否公开" prop="isPublicFlag"> <el-form-item label="是否公开" prop="scope">
<el-radio-group v-model="formData.scope" size="small" @change="changePublicFlag"> <el-radio-group v-model="formData.scope" size="small" @change="changeScope">
<el-radio label="1">否（仅限圈内人观看）</el-radio> <el-radio label="1">否（仅限圈内人观看）</el-radio>
<el-radio label="2">是（任何人可观看）</el-radio> <el-radio label="2">是（任何人可观看）</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="是否收集用户信息" prop="isCollectFlag" v-if="isCollectShow"> <el-form-item label="是否收集用户信息" prop="infoCollect" v-if="isCollectShow">
<el-radio-group v-model="formData.infoCollect" size="small"> <el-radio-group v-model="formData.infoCollect" size="small">
<el-radio label="0">否</el-radio> <el-radio label="0">否</el-radio>
<el-radio label="1">是（收集姓名等信息）</el-radio> <el-radio label="1">是（收集姓名等信息）</el-radio>
...@@ -63,42 +63,43 @@ ...@@ -63,42 +63,43 @@
></el-date-picker> ></el-date-picker>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="直播简介：" prop="introduce"> <el-form-item label="直播简介：" class="required-label">
<el-col :span="14"> <el-col :span="12">
<div style="color:#666666;font-size:10px;">直播图片可选择仅文字版，仅图片版或文字版+图片版</div> <div style="color:#666666;font-size:10px;">直播图片可选择仅文字版，仅图片版或文字版+图片版</div>
<el-input type="textarea" v-model="formData.rtcIntroduces[0].content" placeholder="请输入直播简介" maxlength="30" rows="3" style="width:60%;"></el-input> <el-input type="textarea" v-model="formData.textContent" placeholder="请输入直播简介" maxlength="30" rows="3" style="width:80%;"></el-input>
<span class="word-num">{{(formData.textContent).replace(/\s+/g,"").length}}/300</span>
<div style="color:#666666;font-size:12px;">文字版</div> <div style="color:#666666;font-size:12px;">文字版</div>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<el-upload <el-upload
v-model="formData.rtcIntroduces[1].content" v-model="formData.imageContent"
class="bg-uploader" class="bg-uploader"
action="#" action="#"
:show-file-list="false" :show-file-list="false"
:before-upload="beforeUploadPic1" :before-upload="beforeUploadPic1"
> >
<img <img
v-if="formData.imgUrl3" v-if="formData.imageContent"
:src="formData.imgUrl3" :src="formData.imageContent"
@mouseover.stop="imgMouseOver3=true" @mouseover.stop="imgMouseOver1=true"
class="bg-img" class="bg-img"
/> />
<img <img
v-if="!formData.imgUrl3" v-if="!formData.imageContent"
class="bg-img" class="bg-img"
src="../../assets/image/small.png" src="../../assets/image/small.png"
/> />
<div <div
class="img-delete" class="img-delete"
v-show="imgMouseOver3" v-show="imgMouseOver1"
@click.stop="deleteImg(3)" @click.stop="deleteImg(1)"
@mouseout.stop="imgMouseOver3=false" @mouseout.stop="imgMouseOver1=false"
> >
<i class="el-icon-delete"></i> <i class="el-icon-delete"></i>
</div> </div>
<div class="limit-text"> <div class="limit-text">
<p>尺寸:48*48</p> <p>分辨率：750*（不限高度）</p>
<p>限制大小: 500kb</p> <!--<p>限制大小: 500kb</p>-->
<p>支持.jpg,.png格式</p> <p>支持.jpg,.png格式</p>
</div> </div>
</el-upload> </el-upload>
...@@ -112,35 +113,35 @@ ...@@ -112,35 +113,35 @@
class="bg-uploader" class="bg-uploader"
action="#" action="#"
:show-file-list="false" :show-file-list="false"
:before-upload="beforeUploadPic1" :before-upload="beforeUploadPic2"
> >
<img <img
v-if="formData.imgUrl1" v-if="formData.cover"
:src="formData.imgUrl1" :src="formData.cover"
@mouseover.stop="imgMouseOver1=true" @mouseover.stop="imgMouseOver2=true"
class="bg-img" class="bg-img"
/> />
<img <img
v-if="!formData.imgUrl1" v-if="!formData.cover"
class="bg-img" class="bg-img"
src="../../assets/image/small.png" src="../../assets/image/small.png"
/> />
<div <div
class="img-delete" class="img-delete"
v-show="imgMouseOver1" v-show="imgMouseOver2"
@click.stop="deleteImg(1)" @click.stop="deleteImg(2)"
@mouseout.stop="imgMouseOver1=false" @mouseout.stop="imgMouseOver2=false"
> >
<i class="el-icon-delete"></i> <i class="el-icon-delete"></i>
</div> </div>
<div class="limit-text"> <div class="limit-text">
<p>尺寸:48*48</p> <p>尺寸:160*120</p>
<p>限制大小: 500kb</p> <!--<p>限制大小: 500kb</p>-->
<p>支持.jpg,.png格式</p> <p>支持.jpg,.png格式</p>
</div> </div>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<p class="upload-message" v-if="uploadImgMessage1">请选择直播封面</p> <p class="upload-message" v-if="uploadImgMessage2">请选择直播封面</p>
</div> </div>
<div class="basic-item-icon"> <div class="basic-item-icon">
<el-form-item label="直播预告图" class="required-label"> <el-form-item label="直播预告图" class="required-label">
...@@ -149,53 +150,53 @@ ...@@ -149,53 +150,53 @@
class="bg-uploader" class="bg-uploader"
action="#" action="#"
:show-file-list="false" :show-file-list="false"
:before-upload="beforeUploadPic2" :before-upload="beforeUploadPic3"
> >
<img <img
v-if="formData.imgUrl2" v-if="formData.preImage"
:src="formData.imgUrl2" :src="formData.preImage"
@mouseover.stop="imgMouseOver2=true" @mouseover.stop="imgMouseOver3=true"
class="bg-img" class="bg-img"
/> />
<img <img
v-if="!formData.imgUrl2" v-if="!formData.preImage"
class="bg-img" class="bg-img"
src="../../assets/image/small.png" src="../../assets/image/small.png"
/> />
<div <div
class="img-delete" class="img-delete"
v-show="imgMouseOver2" v-show="imgMouseOver3"
@click.stop="deleteImg(2)" @click.stop="deleteImg(3)"
@mouseout.stop="imgMouseOver2=false" @mouseout.stop="imgMouseOver3=false"
> >
<i class="el-icon-delete"></i> <i class="el-icon-delete"></i>
</div> </div>
<div class="limit-text"> <div class="limit-text">
<p>尺寸:750*420</p> <p>尺寸:750*420</p>
<p>限制大小: 2Mb</p> <!--<p>限制大小: 2Mb</p>-->
<p>支持.jpg,.png格式</p> <p>支持.jpg,.png格式</p>
</div> </div>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<p class="upload-message" v-if="uploadImgMessage2">请选择直播预告图</p> <p class="upload-message" v-if="uploadImgMessage3">请选择直播预告图</p>
</div> </div>
<el-form-item label="直播角色" prop="introduce"> <el-form-item label="直播角色">
<div style="color:#666666;font-size:10px;">讲师（必填）</div> <div style="color:#666666;font-size:10px;">讲师（必填）</div>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="姓名" prop="username1" label-width="60px;"> <el-form-item label="姓名" prop="lecturesUserName" label-width="60px;">
<el-input <el-input
size="small" size="small"
v-model="formData.lectures[0].username" v-model="formData.lecturesUserName"
placeholder="请输入姓名" placeholder="请输入姓名"
style="width:70%;" style="width:70%;"
></el-input> ></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="13"> <el-col :span="13">
<el-form-item label="手机" prop="phone1"> <el-form-item label="手机" prop="lecturesPhone">
<el-input maxlength="11" <el-input maxlength="11"
size="small" size="small"
v-model="formData.mobile" v-model="formData.lecturesPhone"
placeholder="请输入手机号" placeholder="请输入手机号"
style="width:70%;" style="width:70%;"
></el-input> ></el-input>
...@@ -209,7 +210,7 @@ ...@@ -209,7 +210,7 @@
<el-form-item label="姓名" label-width="60px;"> <el-form-item label="姓名" label-width="60px;">
<el-input <el-input
size="small" size="small"
v-model="formData.guests[index].username" v-model="item.username"
placeholder="请输入姓名" placeholder="请输入姓名"
style="width:70%;" style="width:70%;"
></el-input> ></el-input>
...@@ -219,7 +220,7 @@ ...@@ -219,7 +220,7 @@
<el-form-item label="手机"> <el-form-item label="手机">
<el-input maxlength="11" <el-input maxlength="11"
size="small" size="small"
v-model="formData.guests[index].phone" v-model="item.phone"
placeholder="请输入手机号" placeholder="请输入手机号"
style="width:70%;" style="width:70%;"
></el-input> ></el-input>
...@@ -239,6 +240,9 @@ ...@@ -239,6 +240,9 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
</div> </div>
<!--<el-col :span="15">-->
<!--<p class="err-text" v-if="guestErrFlag"><img src="../../assets/image/err-icon.svg" alt="">{{guestErrText}}</p>-->
<!--</el-col>-->
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
...@@ -250,6 +254,8 @@ ...@@ -250,6 +254,8 @@
import { openLoading, closeLoading } from "../../utils/utils"; import { openLoading, closeLoading } from "../../utils/utils";
import { doUpload, getFilePath } from "../../utils/qiniu-util"; import { doUpload, getFilePath } from "../../utils/qiniu-util";
import { checkMobile } from '../../utils/patients/checkValid'; import { checkMobile } from '../../utils/patients/checkValid';
import { getRtcInfo } from "../../utils/yqrange/yqrangeApi";
// import { checkPhone } from "../login.vue";
let vm = null; let vm = null;
export default { export default {
...@@ -267,59 +273,46 @@ ...@@ -267,59 +273,46 @@
callback(); callback();
} }
}; };
// // 校验手机号
// let checkMobile = (rule, value, callback) => {
// var reg = /^1[3|4|5|6|7|8|9][0-9]{9}$/; //验证规则
// const flag = reg.test(value);
// if(flag){
// callback()
// }else{
// callback(new Error(`请输入正确的手机号码`))
// }
// };
return{ return{
curmbFirst: '云鹊小圈', curmbFirst: '云鹊小圈',
curmbSecond: '直播管理', curmbSecond: '直播管理',
curmbThird: '新建直播', curmbThird: '新建直播',
active: 0,
//页面展示位置 //页面展示位置
stepData: [true, false, false],
showStorage: true,
isCollectShow: false, isCollectShow: false,
formData: { formData: {
circleId: "1",// 圈子ID
name: '',// 直播名称 name: '',// 直播名称
scope: 1,// 直播范围 1-非公开 2-公开 scope: "1",// 直播范围 1-非公开 2-公开
infoCollect: 1,// 是否采集用户信息 0-否 1-是 infoCollect: "0",// 是否采集用户信息 0-否 1-是
openTime: '',// 直播开始时间 openTime: '',// 直播开始时间
isPublicFlag: false,
rtcIntroduces:[{ rtcIntroduces:[{
seqNo: 1, seqNo: "",
content: '', content: '',
type: 1 // 文字 type: "1" // 文字
}, },
{ {
seqNo: 2, seqNo: "",
content: '', content: '',
type: 2 // 图片 type: "2" // 图片
} }
], ],// 直播简介
cover: '', // 直播封面url 直播第一帧图片 cover: '', // 直播封面url 直播第一帧图片
preImage: '', // 直播预告图url preImage: '', // 直播预告图url
imgUrl1: '', textContent: '', // 直播简介文字版
imgUrl1More: {}, imageContent: '',// 直播简介图片版
imgUrl2: '', // imgUrl2: '',
imgUrl2More: {}, // imgUrl2More: {},
imgUrl3: '', // imgUrl3: '',
imgUrl3More: {}, // imgUrl3More: {},
intro:'', intro:'',
introduce: '',
hostName: '', hostName: '',
guestName: '', guestName: '',
hostMobile: '', hostMobile: '',
guestMobile: '', guestMobile: '',
contentRole: '', mobile1: '',
mobile: '', lecturesUserName: '',
lectures: [{ lecturesPhone: '',
lecturers: [{
username: '', username: '',
phone: '' phone: ''
}],// 讲师 }],// 讲师
...@@ -328,6 +321,10 @@ ...@@ -328,6 +321,10 @@
username: '' username: ''
}] // 嘉宾 }] // 嘉宾
}, },
// imgUrl1: '',
imgUrl1More: {},
guestErrFlag: false,
guestErrText: '嘉宾最多5位！',
isPreview: 0, isPreview: 0,
imgMouseOver1: false, imgMouseOver1: false,
uploadImgMessage1: false,//未上传图片，校验提示语 uploadImgMessage1: false,//未上传图片，校验提示语
...@@ -340,18 +337,9 @@ ...@@ -340,18 +337,9 @@
// 在科学计数法中，为了使公式简便，可以用带“E”的格式表示。例如1.03乘10的8次方，可简写为“1.03e8”的形式 // 在科学计数法中，为了使公式简便，可以用带“E”的格式表示。例如1.03乘10的8次方，可简写为“1.03e8”的形式
// 一天是24*60*60*1000 = 86400000 = 8.64e7 // 一天是24*60*60*1000 = 86400000 = 8.64e7
// console.log('this.maxDate',this.maxDate) // console.log('this.maxDate',this.maxDate)
return time.getTime() > new Date(this.maxDate).getTime() || time.getTime() < new Date(this.minDate).getTime() - 8.64e7; return time.getTime() < Date.now() - 8.64e7
} }
}, },
contentList: [
{
value: '1',
label: '所有人可发布动态'
},{
value: '2',
label: '嘉宾可发布动态'
},
],
rules: { rules: {
name: [ name: [
{ required: true, message: "请输入直播标题", trigger: "blur" }, { required: true, message: "请输入直播标题", trigger: "blur" },
...@@ -363,64 +351,126 @@ ...@@ -363,64 +351,126 @@
}, },
{ validator: checkProjectStr, trigger: "blur" } { validator: checkProjectStr, trigger: "blur" }
], ],
isPublicFlag:[ scope:[
{required: true} {required: true}
], ],
liveStartTime: [ infoCollect: [
{required: true} {required: true, message: "请选择是否收集用户信息", trigger: "blur"}
],
openTime: [
{required: true, message: "请选择直播开始时间", trigger: "blur"}
], ],
username1: [ // // 直播简介
// introduce: [
// {required: true, message: "请选择文字版或图片版", trigger: "blur"}
// ],
lecturesUserName: [
{required: true, message: "请输入姓名", trigger: "blur"}, {required: true, message: "请输入姓名", trigger: "blur"},
], ],
// guestName: [ // guestName: [
// {required: true, message: "请输入姓名", trigger: "blur"}, // {required: true, message: "请输入姓名", trigger: "blur"},
// ], // ],
phone1: [ lecturesPhone: [
{required: true, message: "请输入手机号", trigger: 'blur'}, {required: true, message: "请输入手机号", trigger: ['change','blur']},
{ validator: checkMobile, trigger: 'blur'} {validator: checkMobile, trigger: ['change','blur']}
], ],
introduce: [
{ required: true, message: "请输入圈子名称", trigger: "blur" }, // introduce: [
{ // { required: true, message: "请输入", trigger: "blur" },
min: 2, // {
max: 24, // min: 2,
message: "输入长度为2-24的内容，可包含中英文、数字及特殊符号", // max: 24,
trigger: "blur" // message: "输入长度为2-24的内容，可包含中英文、数字及特殊符号",
}, // trigger: "blur"
{ validator: checkProjectStr, trigger: "blur" } // },
], // { validator: checkProjectStr, trigger: "blur" }
contentRole: [ // ],
{ required: true, message: "请选择内容发布权限", trigger: "blur" },
]
} }
} }
}, },
created() {
// vm = this;
// vm.entryId = vm.getUrlSearch(window.location.href, "entryId");
// vm.peopleLevel = vm.getUrlSearch(window.location.href, "level");
// vm.init();
},
mounted() {
const rtcId = this.$route.query.rtcId;
// if(rtcId){
// this.curmbThird = "编辑直播";
// }
if(rtcId){
this.curmbThird = "编辑直播";
this.initRtcInfo(rtcId);
}
},
methods: { methods: {
//上传圈子头像 checkPhone(val) {
if(!(/^1[3456789]\d{9}$/.test(val))) {
return false;
} else {
return true;
}
},
// 初始化直播
initRtcInfo(rtcId){
getRtcInfo({
rtcId
}).then((data) => {
if(data.code == "000000") {
this.formData = data.data;
this.initFormData();
console.log(this.formData);
}
}).catch((error) => {
this.$message({
message: error,
type: 'error'
});
})
},
//上传直播简介
beforeUploadPic1(file) { beforeUploadPic1(file) {
let fileLimit = { let fileLimit = {
width: 48, width: 750,
height: 48, height: "",
size: 0.5, size: 0.5,
sizeText: "500K", sizeText: "500K",
key: "imgUrl1", key: "imageContent",
more: "imgUrl1More", more: "imgUrl1More",
show: "uploadImgMessage1" show: "uploadImgMessage1"
}; };
this.beforeUpload(file, fileLimit); this.beforeUpload(file, fileLimit);
}, },
// 上传直播封面
beforeUploadPic2(file) { beforeUploadPic2(file) {
let fileLimit = { let fileLimit = {
width: 750, width: 160,
height: 420, height: 120,
size: 2, size: 2,
sizeText: "2Mb", sizeText: "2Mb",
key: "imgUrl2", key: "cover",
more: "imgUrl2More", more: "imgUrl2More",
show: "uploadImgMessage2" show: "uploadImgMessage2"
}; };
this.beforeUpload(file, fileLimit); this.beforeUpload(file, fileLimit);
}, },
// 上传直播预告图
beforeUploadPic3(file) {
let fileLimit = {
width: 750,
height: 420,
size: 2,
sizeText: "2Mb",
key: "preImage",
more: "imgUrl3More",
show: "uploadImgMessage3"
};
this.beforeUpload(file, fileLimit);
},
//上传图片 //上传图片
beforeUpload(file, fileLimit) { beforeUpload(file, fileLimit) {
let vm = this; let vm = this;
...@@ -442,7 +492,11 @@ ...@@ -442,7 +492,11 @@
image.src = theFile.target.result; image.src = theFile.target.result;
image.onload = function() { image.onload = function() {
let _this = this; let _this = this;
if (_this.width != fileLimit.width || _this.height != fileLimit.height) {
if(fileLimit.key == "imageContent" & _this.width != fileLimit.width){
vm.$message.error("图片尺寸不符合规范，请根据规范上传图片");
}
else if (fileLimit.key != "imageContent" & (_this.width != fileLimit.width || _this.height != fileLimit.height)) {
vm.$message.error("图片尺寸不符合规范，请根据规范上传图片"); vm.$message.error("图片尺寸不符合规范，请根据规范上传图片");
} else { } else {
openLoading(vm); openLoading(vm);
...@@ -454,6 +508,9 @@ ...@@ -454,6 +508,9 @@
} else if (fileLimit.show == "uploadImgMessage2") { } else if (fileLimit.show == "uploadImgMessage2") {
vm.uploadImgMessage2 = false; vm.uploadImgMessage2 = false;
} }
else if (fileLimit.show == "uploadImgMessage3") {
vm.uploadImgMessage3 = false;
}
vm.formData[fileLimit.key] = path.fullPath; vm.formData[fileLimit.key] = path.fullPath;
vm.formData[fileLimit.more] = { vm.formData[fileLimit.more] = {
attachmentName: path.name, attachmentName: path.name,
...@@ -468,7 +525,7 @@ ...@@ -468,7 +525,7 @@
return isJPG && isLt2M; return isJPG && isLt2M;
}, },
// 是否公开 // 是否公开
changePublicFlag(value){ changeScope(value){
if(value == 2){ if(value == 2){
this.isCollectShow = true; this.isCollectShow = true;
} }
...@@ -476,26 +533,195 @@ ...@@ -476,26 +533,195 @@
this.isCollectShow = false; this.isCollectShow = false;
} }
}, },
// 校验直播简介文字版或图片版
checkIntroduce(){
// console.log(this.formData.rtcIntroduces[0].content);
console.log(this.formData.rtcIntroduces[1].content);
let flag = true;
if(this.formData.textContent == ""
& this.formData.imageContent == ""){
flag = false;
this.$message.error("直播简介中可选择仅文字版，仅图片版或文字版+图片版");
}
return flag;
},
//删除图片 //删除图片
deleteImg(type) { deleteImg(type) {
if (type == 1) { if (type == 1) {
vm.formData.imgUrl1 = ""; this.imageContent = "";
vm.imgMouseOver1 = false; this.imgMouseOver1 = false;
}
else if (type == 2) {
this.formData.cover = "";
this.imgMouseOver2 = false;
}
else if (type == 3) {
this.formData.preImage = "";
this.imgMouseOver3 = false;
} }
}, },
// 校验直播封面
checkCover(){
let flag = true;
if(this.formData.cover == ""){
flag = false;
this.$message.error("请上传直播封面！");
}
return flag;
},
// 校验直播预告图
checkPreImage(){
let flag = true;
if(this.formData.preImage == ""){
flag = false;
this.$message.error("请上传直播预告图！");
}
return flag;
},
// 校验嘉宾姓名和手机号
checkGuests(){
let flag = true;
if(this.formData.guests != null & this.formData.guests.length >= 1){
for(let i=0;i<this.formData.guests.length;i++) {
if(this.formData.guests[i].username != "" & this.formData.guests[i].phone == ""){
this.$message.error("请输入嘉宾'" + this.formData.guests[i].username + "'的手机号");
flag = false;
}
else if(this.formData.guests[i].username != "" & this.formData.guests[i].phone != ""){
if(!this.checkPhone(this.formData.guests[i].phone)){
this.$message.error("请输入嘉宾'" + this.formData.guests[i].username + "'的正确手机号");
flag = false;
}
}
else if(this.formData.guests[i].username == "" & this.formData.guests[i].phone != ""){
this.$message.error("请输入手机号为'" + this.formData.guests[i].phone + "'嘉宾的姓名");
flag = false;
}
}
}
return flag;
},
// 增加嘉宾 // 增加嘉宾
addGuest(index) { addGuest(index) {
this.formData.guestList.splice(index + 1, 0, ""); if(this.formData.guests != null & this.formData.guests.length >= 5){
this.$message.error("嘉宾最多5位！");
// this.guestErrFlag = true;
// setTimeout(function () {
// this.guestErrFlag = false;
// }, 3000)
}
else {
this.formData.guests.push({username: "", phone: ""});
// this.formData.guests.splice(index + 1, 0, "");
}
},
// 封装数据
initFormData(){
this.formData.scope = String(this.formData.scope);
if(this.formData.scope == "2"){
this.isCollectShow = true;
}
this.formData.infoCollect = String(this.formData.infoCollect);
if(this.formData.rtcIntroduces != null){
for(let i=0;i<this.formData.rtcIntroduces.length;i++) {
if(this.formData.rtcIntroduces[i].type == "1"){
this.formData.textContent = this.formData.rtcIntroduces[i].content;
}
else if(this.formData.rtcIntroduces[i].type == "2"){
this.formData.imageContent = this.formData.rtcIntroduces[i].content;
}
}
}
// 设置讲师
if(this.formData.lecturers != null){
this.formData.lecturesUserName = this.formData.lecturers[0].username;
this.formData.lecturesPhone = this.formData.lecturers[0].phone;
}
},
// 封装数据
setFormData(){
if(!this.formData.circleId){
this.formData.circleId = 1;// 测试用
}
if(this.formData.textContent){
this.formData.rtcIntroduces[0].type = 1;
this.formData.rtcIntroduces[0].content = this.formData.textContent;
}
// 直播简介图片版
if(this.formData.imageContent){
this.formData.rtcIntroduces[1].type = 2;
this.formData.rtcIntroduces[1].content = this.formData.imageContent;
}
// 设置讲师
// if(this.formData.lecturers == undefined){
// this.formData.lecturers
// }
// if(this.formData.lecturers != undefined & this.formData.lecturers.length == 0){
//
// this.formData.lecturers.push({username: this.formData.lecturesUserName, phone: this.formData.lecturesPhone});
// }
this.formData.lecturers[0].username = this.formData.lecturesUserName;
this.formData.lecturers[0].phone = this.formData.lecturesPhone;
}, },
// 删除嘉宾 // 删除嘉宾
delGuest(index) { delGuest(index) {
this.formData.guestList.splice(index, 1); this.formData.guests.splice(index, 1);
}, },
complete(formName) {
console.log(this.formData);
this.$refs[formName].validate((valid) => {
if (valid) {
this.submit();
} else {
console.log('error submit!!');
return false;
}
});
},
//完成 //完成
complete() { submit() {
this.setFormData();
// 校验直播简介文字版或图片版
if(!this.checkIntroduce()){
return;
}
// 校验直播封面、预告图
if(!this.checkCover() || !this.checkPreImage()){
return;
}
// 校验嘉宾姓名和手机号
if(!this.checkGuests()){
return;
}
let req = this.formData;
openLoading(this);
this.POST('rtc/liveAdmin', req).then((res) => {
closeLoading(this);
if( res.code == '000000') {
this.$message.success("操作成功");
this.$router.push({ this.$router.push({
path: '/live-manage', path: '/live-manage',
}) })
}
else {
this.$message.error("操作失败，请重试");
}
})
}, },
}, },
} }
...@@ -613,9 +839,9 @@ ...@@ -613,9 +839,9 @@
} }
} }
} }
.required-label .el-form-item__label::before{ .required-label .el-form-item__label::before {
content: '*'; content: '*';
color: #F56C6C; color: #F56C6C;
margin-right: 4px; margin-right: 4px;
} }
</style> </style>
src/views/yqrange/live-manage.vue
浏览文件 @ 282f02a8
...@@ -143,7 +143,7 @@ ...@@ -143,7 +143,7 @@
this.$router.push({ this.$router.push({
path: '/create-live', path: '/create-live',
query: { query: {
// rtcId: "1" // rtcId: "16"
rtcId: row.id rtcId: row.id
} }
}) })
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或