소스 검색

销售直播代码 直播间

yuhongqi 9 시간 전
부모
커밋
1a77a3f57a

+ 96 - 3
src/views/live/live/index.vue

@@ -93,8 +93,8 @@
       <el-table-column label="主播ID" align="center" prop="talentId" />
       <el-table-column label="直播类型" align="center" prop="liveType">
         <template slot-scope="scope">
-          <el-tag v-if="scope.row.liveType == 1">直播</el-tag>
-          <el-tag v-if="scope.row.liveType == 2">录播</el-tag>
+          <el-tag type="danger" v-if="scope.row.liveType == 1">直播</el-tag>
+          <el-tag type="success" v-if="scope.row.liveType == 2">录播</el-tag>
           <el-tag v-if="scope.row.liveType == 3">直播回放</el-tag>
         </template>
       </el-table-column>
@@ -168,6 +168,18 @@
               >
                 <i class="el-icon-service"></i> 复制直播间
               </el-dropdown-item>
+              <el-dropdown-item
+                v-if="scope.row.liveCodeUrl == null"
+                @click.native="handleGenerateCode(scope.row)"
+              >
+                <i class="el-icon-service"></i> 生成二维码
+              </el-dropdown-item>
+              <el-dropdown-item
+                v-if="scope.row.liveCodeUrl != null"
+                @click.native="handleCheckCode(scope.row)"
+              >
+                <i class="el-icon-service"></i> 查看二维码
+              </el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown>
 
@@ -175,6 +187,26 @@
       </el-table-column>
     </el-table>
 
+    <el-dialog
+      title="直播二维码"
+      :visible.sync="qrcodeDialogVisible"
+    width="500px"
+    :close-on-click-modal="true"
+    :show-close="true"
+    top="10vh"
+    >
+    <div class="qrcode-img-container">
+
+      <img
+        :src="currentQrcodeUrl"
+        alt="直播二维码"
+        class="qrcode-img"
+        @error="handleImgError"
+      @click="handleImgZoom"
+      >
+    </div>
+    </el-dialog>
+
     <pagination
       v-show="total>0"
       :total="total"
@@ -306,7 +338,7 @@ import {
   handleShelfOrUn,
   handleDeleteSelected,
   finishLive,
-  startLive, copyLive
+  startLive, copyLive,generateCode
 } from "@/api/live/live";
 import Editor from '@/components/Editor/wang';
 import user from '@/store/modules/user';
@@ -402,6 +434,9 @@ export default {
       serverName: '',
       livingCode:'',
       videoUrl: "",
+      qrcodeDialogVisible: false,  // 弹窗显示状态:默认隐藏
+      currentQrcodeUrl: "",        // 当前要展示的二维码地址
+      defaultImg: "https://via.placeholder.com/400x400?text=二维码加载失败"  // 占位图
     };
   },
   created() {
@@ -694,6 +729,35 @@ export default {
         copyLive({"liveId":row.liveId}).then(response=>{this.getList()})
       }).catch(() => {});
     },
+    handleGenerateCode(row){
+      this.$confirm('是否确认生成直播间小程序二维码?', "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        generateCode({"liveId":row.liveId}).then(response=>{
+          if(res.code == 200){
+            row.liveCodeUrl = response.data.liveCodeUrl
+            this.getList()
+          }
+        })
+      }).catch(() => {});
+    },
+    // 查看二维码图片
+    handleCheckCode(row) {
+      // 先校验图片地址是否存在
+      if (!row.liveCodeUrl) {
+        this.$message.warning("二维码图片地址不存在,请稍后重试");
+        return;
+      }
+      // 赋值当前图片地址 + 打开弹窗
+      this.currentQrcodeUrl = row.liveCodeUrl;
+      this.qrcodeDialogVisible = true;
+    },
+    // 2. 图片加载失败:替换为占位图
+    handleImgError(e) {
+      e.target.src = this.defaultImg;
+    },
     handleStart(row){
       if(row.isShow == 2){
         this.$message.error("直播间已下架")
@@ -749,4 +813,33 @@ export default {
 .selection-toolbar .el-checkbox .el-checkbox__inner {
   top: 8px; /* 根据实际需求调整 */
 }
+/* 图片容器:居中 + 内边距 */
+.qrcode-img-container {
+  text-align: center;
+  padding: 20px 0;
+}
+
+/* 图片样式:自适应弹窗宽度,避免溢出 */
+.qrcode-img {
+  max-width: 100%;    /* 最大宽度不超过容器 */
+  max-height: 400px;  /* 最大高度限制,避免过高 */
+  cursor: pointer;    /* 鼠标悬浮变指针,提示可点击 */
+  transition: all 0.3s ease;  /* 过渡动画,hover 更流畅 */
+}
+
+/* 图片 hover 效果:轻微放大 */
+.qrcode-img:hover {
+  transform: scale(1.02);
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);  /* 加阴影增强层次感 */
+}
+
+/* 底部提示文字样式 */
+.qrcode-footer {
+  text-align: center !important;  /* 覆盖 Element 默认样式,居中显示 */
+}
+
+.text-gray {
+  color: #666;
+  font-size: 12px;
+}
 </style>

+ 12 - 2
src/views/live/liveConfig/goods.vue

@@ -77,7 +77,17 @@
       >
         <template slot-scope="scope">
           <el-tag v-if="scope.row.status == 1">上架</el-tag>
-          <el-tag v-if="scope.row.status == 0">下架</el-tag>
+          <el-tag type="info" v-if="scope.row.status == 0">下架</el-tag>
+        </template>
+      </el-table-column>
+
+      <el-table-column
+        prop="status"
+        label="店铺上下架"
+      >
+        <template slot-scope="scope">
+          <el-tag v-if="scope.row.fsStatus == 1">上架</el-tag>
+          <el-tag type="info" v-if="scope.row.fsStatus == 0">下架</el-tag>
         </template>
       </el-table-column>
 
@@ -225,7 +235,7 @@
       :close-on-press-escape="false"
     >
       <el-form :model="salesForm" ref="salesForm" :rules="salesRules">
-        <el-form-item label="调整后库存" prop="newSales">
+        <el-form-item label="调整后销量" prop="newSales">
           <el-input-number
             v-model="salesForm.sales"
             :min="0"

+ 1 - 0
src/views/live/liveConfig/liveLotteryConf.vue

@@ -730,6 +730,7 @@ export default {
       const doLotteryParam = {
         lotteryId: row.lotteryId,
         lotteryStatus: status,
+        liveId:this.liveId,
         duration: row.duration,
         status: status
       };

+ 1 - 0
src/views/live/liveConfig/liveRedConf.vue

@@ -351,6 +351,7 @@ export default {
         redId: row.redId,
         redStatus: status,
         totalLots: row.totalLots,
+        liveId: this.liveId,
         status: status,
         duration: row.duration
       };

+ 37 - 20
src/views/live/liveConsole/index.vue

@@ -67,7 +67,7 @@
         <div style="border-radius: 5px; overflow: hidden;" v-if="!isAudit">
           <img :src="require('@/assets/images/videoIsAudit.png')" style="width: 100%; height: 45vh;">
         </div>
-        <div style="border-radius: 5px; overflow: hidden;" v-else-if="status != 2">
+        <div style="border-radius: 5px; overflow: hidden;" v-else-if="status != 2 && status != 4">
           <img :src="require('@/assets/images/videoNotStart.png')" style="width: 100%; height: 45vh;">
         </div>
         <div style="border-radius: 5px; overflow: hidden;" v-else-if="liveType == 1">
@@ -105,6 +105,19 @@
             已播放:<span id="elapsedTime">00:00:00</span>
           </div>
         </div>
+        <div style="border-radius: 5px; overflow: hidden;" v-else-if="liveType == 3">
+          <video
+            controls
+            ref="liveReplay"
+            loop
+            autoplay
+            width="100%"
+            playsinline
+            style="display: block; background: #000; height: 40vh;"
+          >
+            <source :src="videoUrl" type="video/mp4">
+          </video>
+        </div>
         <div style="border-radius: 5px; overflow: hidden;" v-else>
           <img :src="require('@/assets/images/videoNotStart.png')" style="width: 100%; height: 45vh;">
         </div>
@@ -362,7 +375,6 @@ export default {
   deactivated() {
     this.saveChatScrollPosition();
   },
-
   activated() {
     this.$nextTick(() => {
       this.restoreChatScrollPosition();
@@ -399,25 +411,30 @@ export default {
           }
           this.isAudit = true
           this.status = res.data.status
-          if (res.data.status != 2) {
-            this.$message.error("当前直播间未直播");
-            this.loading = false
-            return
-          }
-          if (res.data.liveType == 1) {
-            this.livingUrl = res.data.flvHlsUrl
-            this.livingUrl = this.livingUrl.replace("flv","m3u8")
-            this.$nextTick(() => {
-              this.initPlayer()
-            })
-          } else {
-            this.liveType = 2
+          if(res.data.status == 4){
+            this.liveType = 3
             this.videoUrl = res.data.videoUrl;
-            this.$nextTick(() => {
-              const video = this.$refs.videoPlayer;
-              video.play()
-              this.initVideoPlayer(res.data.startTime)
-            })
+          }else {
+            if (res.data.status != 2) {
+              this.$message.error("当前直播间未直播");
+              this.loading = false
+              return
+            }
+            if (res.data.liveType == 1) {
+              this.livingUrl = res.data.flvHlsUrl
+              this.livingUrl = this.livingUrl.replace("flv","m3u8")
+              this.$nextTick(() => {
+                this.initPlayer()
+              })
+            } else {
+              this.liveType = 2
+              this.videoUrl = res.data.videoUrl;
+              this.$nextTick(() => {
+                const video = this.$refs.videoPlayer;
+                video.play()
+                this.initVideoPlayer(res.data.startTime)
+              })
+            }
           }
           this.loading = false
         } else {