直播管理二期

src/utils/yqrange/yqrangeApi.js

@@ -45,5 +45,35 @@ export const getRtcInfo = (params) => {
   })
 };
 
+// 查询回放信息
+export const getPlayback = (params) => {
+  return fetch({
+    headers,
+    url: getBaseUrl(`rtc/liveAdmin/playback/${params.rtcId}`),
+    method: 'get',
+    // params: params,
+    description: '查询回放信息',
+  })
+};
+
+export const postPlayback = (params) => {
+  return fetch({
+    headers,
+    url: getBaseUrl(`rtc/liveAdmin/playback`),
+    method: 'post',
+    params: params,
+    description: '设置/关闭回放',
+  })
+};
+
+export const updateLiveStatus = (params) => {
+  return fetch({
+    headers,
+    url: getBaseUrl(`rtc/liveAdmin/switchLiveStatus`),
+    method: 'put',
+    params: params,
+    description: '更新直播状态',
+  })
+};
 
 

src/views/yqrange/create-live.vue

@@ -37,22 +37,39 @@
               <span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/20</span>
             </el-col>
           </el-form-item>
-          <el-form-item label="直播方式">
-            <el-radio-group v-model="formData.streamType" size="small" @change="changeStyle">
+          <el-form-item label="直播方式" prop="streamType">
+            <el-radio-group v-model="formData.streamType" size="small" @change="changeStreamType">
               <el-radio label="1" :disabled="styleEditFlag">网页直播</el-radio>
               <el-radio label="2" :disabled="styleEditFlag">拉流直播</el-radio>
             </el-radio-group>
 
+          </el-form-item>
+
+          <el-form-item label="拉流地址" v-if="pullFlag" class="required-label">
+            <el-col :span="13">
+            <el-input
+              size="small"
+              v-model="formData.pullStreamRtmp"
+              maxlength="20"
+              placeholder="请输入App拉流地址"
+              style="width:70%;"
+              :disabled="styleEditFlag"
+            ></el-input>
+            </el-col>
+            <el-col :span="13">
               <el-input
                 size="small"
-                v-model="formData.name"
+                v-model="formData.pullStreamHttp"
                 maxlength="20"
-                placeholder="请填写拉流地址"
+                placeholder="请输入H5拉流地址"
                 style="width:70%;"
                 :disabled="styleEditFlag"
               ></el-input>
+            </el-col>
 
           </el-form-item>
+
+
           <el-form-item label="是否公开" prop="scope">
             <el-radio-group v-model="formData.scope" size="small" @change="changeScope">
               <el-radio label="1">否（仅限圈内人观看）</el-radio>
@@ -135,8 +152,7 @@
                 class="bg-uploader"
                 action="#"
                 :show-file-list="false"
-                :before-upload="beforeUploadPic1"
-                :disabled="isDisabledIns">
+                :before-upload="beforeUploadPic1">
                 <img
                   v-if="item.content"
                   :src="item.content"
@@ -372,10 +388,13 @@
         styleEditFlag: false,// 直播方式是否可以编辑
         liveEditFlag: false,// 直播方式、讲师是否可以编辑
         guestEditFlag: false,// 嘉宾是否可以编辑
+        pullFlag: false, // 是否显示拉流地址
         formData: {
           circleId: "",// 圈子ID
           name: '',// 直播名称
-          style: "1", // 直播方式
+          streamType: "1", // 直播方式
+          pullStreamRtmp: "", //APP拉流地址
+          pullStreamHttp: "", //H5拉流地址
           scope: "1",// 直播范围 1-非公开 2-公开
           infoCollect: "0",// 是否采集用户信息 0-否 1-是
           openTime: '',// 直播开始时间
@@ -436,6 +455,10 @@
             },
             { validator: checkProjectStr, trigger: "blur" }
           ],
+          streamType: [{
+            required: true, message: "请选择直播方式", trigger: 'blur'
+          }],
+
           scope:[
             {required: true}
           ],
@@ -546,14 +569,17 @@
         })
       },
       getIndexIntroduce(index) {
-        if (!this.isDisabledIns) {
-          if(this.formData.rtcIntroduces != null && this.formData.rtcIntroduces.length > index){
+        // if (!this.isDisabledIns) {
+         if(this.formData.rtcIntroduces != null && this.formData.rtcIntroduces.length == 1){
+          index = 0;
+        }
+        else if(this.formData.rtcIntroduces != null && this.formData.rtcIntroduces.length > index){
             index = index + 1;
           }
           this.introduceIndex = index;
-        }else {
-          this.$message.warning('正在上传，请稍等')
-        }
+        // }else {
+        //   this.$message.warning('正在上传，请稍等')
+        // }
       },
       //上传直播简介
       beforeUploadPic1(file) {
@@ -661,12 +687,12 @@
         const isLt100kb = file.size / 1024 < 100
         if (!isJPG && !isPNG) {
           vm.$message.error('上传直播简介图片只能是 JPEG或者png 格式!')
-          vm.isDisabledIns = false;
+          // vm.isDisabledIns = false;
           return;
         }
         if (!isLt100kb) {
           vm.$message.error('上传图片大小不能超过 100kb')
-          vm.isDisabledIns = false;
+          // vm.isDisabledIns = false;
           return;
         }
 
@@ -679,7 +705,7 @@
             let _this = this;
             if (_this.width !== 750) {
               vm.$message.info('图片尺寸不一致，无法提交!');
-              vm.isDisabledIns = false;
+              // vm.isDisabledIns = false;
               return;
             }else {
               doUpload(vm,file, getFilePath(file,null), 'preview4', 'progress1', 1).then(function (path) {
@@ -687,7 +713,7 @@
                 vm.formData.rtcIntroduces[vm.introduceIndex].content = path.fullPath;
                 vm.formData.rtcIntroduces[vm.introduceIndex].seqNo = vm.introduceIndex+1;
                 vm.$message.success('上传成功');
-                vm.isDisabledIns = false;
+                // vm.isDisabledIns = false;
               });
             }
             // vm.cleatBroadcast.liveIntroduceModel[vm.introduceIndex].content1 = _this.width + '*' + _this.height;
@@ -751,7 +777,13 @@
       //   return isJPG && isLt2M;
       // },
       // 直播方式
-      changeStyle(){
+      changeStreamType(){
+         if(this.formData.streamType == 2){
+           this.pullFlag = true;
+         }
+         else {
+           this.pullFlag = false;
+         }
 
       },
 
@@ -765,10 +797,26 @@
           this.isCollectShow = false;
         }
       },
+
+      // 校验拉流地址
+      checkpullStream(){
+        let flag = true;
+        if(this.pullFlag){
+          if(this.formData.pullStreamRtmp == ""){
+            this.$message.warning("请输入APP拉流地址");
+            flag = false;
+          }
+          if(this.formData.pullStreamHttp == ""){
+            this.$message.warning("请输入H5拉流地址");
+            flag = false;
+          }
+        }
+        return flag;
+      },
       // 校验直播简介文字版或图片版
       checkIntroduce(){
         // console.log(this.formData.rtcIntroduces[0].content);
-        console.log(this.formData.rtcIntroduces[1].content);
+        // console.log(this.formData.rtcIntroduces[1].content);
 
         let flag = true;
         if(this.formData.textContent == ""
@@ -781,6 +829,8 @@
       // 增加直播简介
       addIntroImage(){
         let length = this.formData.rtcIntroduces.length;
+
+
         if(length > 5){
           this.$message.warning("直播简介图片最多支持新增5张图片!");
           return;
@@ -791,7 +841,6 @@
           content: '',
           type: 2 // 文字
         };
-
           this.formData.rtcIntroduces.push(item);
 
       },
@@ -994,6 +1043,10 @@
 
         this.submitFlag = true;
         this.setFormData();
+        // 校验拉流地址
+        if(!this.checkpullStream()){
+          return;
+        }
         // 校验直播简介文字版或图片版
         if(!this.checkIntroduce()){
           return;
@@ -1007,6 +1060,11 @@
           return;
         }
 
+        if(!this.pullFlag){
+          this.formData.pullStreamHttp = "";
+          this.formData.pullStreamRtmp = "";
+        }
+
         let req = this.formData;
         openLoading(this);
         this.POST('rtc/liveAdmin', req).then((res) => {