1、启用完课优惠卷

.env.prod-tyt

@@ -27,7 +27,7 @@ VUE_APP_VIDEO_LINE_1 = https://tyttcpv.ylrzcloud.com
 # 线路二地址
 VUE_APP_VIDEO_LINE_2 = https://tytobs.ylrztop.com
 #火山云视频地址域名
-VUE_APP_VIDEO_URL = https://tytvolcengine.ylrztop.com/
+VUE_APP_VIDEO_URL = https://tytvolcengine.ylrztop.com
 #火山云视频点播空间名
 VUE_APP_HSY_SPACE = tyt-2114522511
 

src/views/live/liveConfig/watchReward.vue

@@ -27,6 +27,7 @@
           <el-radio-group v-model="watchRewardForm.participateCondition">
             <el-radio label="1">达到指定观看时长</el-radio>
             <el-radio label="2" v-if="liveType == 2">启用完课积分</el-radio>
+            <el-radio label="3" v-if="liveType == 2">启用完课优惠券</el-radio>
           </el-radio-group>
         </el-form-item>
 
@@ -67,6 +68,47 @@
           </div>
         </el-form-item>
 
+        <!-- 完课优惠券配置（仅在启用完课优惠券时显示） -->
+        <template v-if="watchRewardForm.participateCondition === '3'">
+          <!-- 优惠券选择 - 与运营自动化一致的下拉框样式 -->
+          <el-form-item label="选择优惠券" prop="finishCouponId">
+            <el-select v-model="watchRewardForm.finishCouponId" placeholder="请选择优惠券" style="width: 300px;">
+              <el-option
+                v-for="item in couponSelectOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+
+          <!-- 已选优惠券详情展示 -->
+          <el-form-item label="优惠券详情" v-if="selectedFinishCoupon.couponId">
+            <div class="coupon-detail-box">
+              <div class="coupon-detail-item">
+                <span class="detail-label">优惠券名称：</span>
+                <span class="detail-value">{{ selectedFinishCoupon.title }}</span>
+              </div>
+              <div class="coupon-detail-item">
+                <span class="detail-label">优惠券面值：</span>
+                <span class="detail-value">¥{{ selectedFinishCoupon.couponPrice }}</span>
+              </div>
+              <div class="coupon-detail-item">
+                <span class="detail-label">最低消费：</span>
+                <span class="detail-value">¥{{ selectedFinishCoupon.useMinPrice }}</span>
+              </div>
+              <div class="coupon-detail-item">
+                <span class="detail-label">有效期限：</span>
+                <span class="detail-value">{{ selectedFinishCoupon.couponTime }}天</span>
+              </div>
+              <div class="coupon-detail-item">
+                <span class="detail-label">优惠券类型：</span>
+                <span class="detail-value">{{ selectedFinishCoupon.type === 0 ? '普通券' : selectedFinishCoupon.type === 1 ? '套餐券' : selectedFinishCoupon.type === 2 ? '制单券' : '无门槛券' }}</span>
+              </div>
+            </div>
+          </el-form-item>
+        </template>
+
         <!-- 实施动作（仅在达到指定观看时长时显示） -->
         <el-form-item label="实施动作" prop="action" v-if="watchRewardForm.participateCondition === '1'">
           <el-select v-model="watchRewardForm.action" placeholder="请选择实施动作" style="width: 300px;">
@@ -84,9 +126,9 @@
 <!--          <el-input v-model="watchRewardForm.receivePrompt" placeholder="请输入领取提示语"></el-input>-->
 <!--        </el-form-item>-->
 
-        <!-- 红包设置（仅在达到指定观看时长时显示） -->
+        <!-- 红包/优惠券设置（仅在达到指定观看时长时显示） -->
         <div v-if="watchRewardForm.participateCondition === '1'">
-          <div class="section-title">红包设置</div>
+          <div class="section-title">{{ watchRewardForm.action === '3' ? '优惠券设置' : '红包设置' }}</div>
 
           <!-- 根据实施动作类型显示不同的表单内容 -->
           <template v-if="watchRewardForm.action === '1'">
@@ -118,7 +160,7 @@
             </el-form-item>
           </template>
 
-          <template v-else>
+          <template v-if="watchRewardForm.action === '2'">
             <!-- 积分红包设置 -->
             <!-- 积分值 -->
             <el-form-item label="积分值" prop="scoreAmount">
@@ -136,6 +178,47 @@
 <!--              ></el-input>-->
 <!--            </el-form-item>-->
           </template>
+
+          <template v-if="watchRewardForm.action === '3'">
+            <!-- 优惠券设置 - 与运营自动化一致的下拉框样式 -->
+            <!-- 选择优惠券 -->
+            <el-form-item label="选择优惠券" prop="actionCouponId">
+              <el-select v-model="watchRewardForm.actionCouponId" placeholder="请选择优惠券" style="width: 300px;">
+                <el-option
+                  v-for="item in couponSelectOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+
+            <!-- 已选优惠券详情展示 -->
+            <el-form-item label="优惠券详情" v-if="selectedActionCoupon.couponId">
+              <div class="coupon-detail-box">
+                <div class="coupon-detail-item">
+                  <span class="detail-label">优惠券名称：</span>
+                  <span class="detail-value">{{ selectedActionCoupon.title }}</span>
+                </div>
+                <div class="coupon-detail-item">
+                  <span class="detail-label">优惠券面值：</span>
+                  <span class="detail-value">¥{{ selectedActionCoupon.couponPrice }}</span>
+                </div>
+                <div class="coupon-detail-item">
+                  <span class="detail-label">最低消费：</span>
+                  <span class="detail-value">¥{{ selectedActionCoupon.useMinPrice }}</span>
+                </div>
+                <div class="coupon-detail-item">
+                  <span class="detail-label">有效期限：</span>
+                  <span class="detail-value">{{ selectedActionCoupon.couponTime }}天</span>
+                </div>
+                <div class="coupon-detail-item">
+                  <span class="detail-label">优惠券类型：</span>
+                  <span class="detail-value">{{ selectedActionCoupon.type === 0 ? '普通券' : selectedActionCoupon.type === 1 ? '套餐券' : selectedActionCoupon.type === 2 ? '制单券' : '无门槛券' }}</span>
+                </div>
+              </div>
+            </el-form-item>
+          </template>
         </div>
 
         <!-- 其他设置（仅在达到指定观看时长时显示） -->
@@ -160,7 +243,7 @@
             </el-form-item>
           </template>
 
-          <template v-else>
+          <template v-if="watchRewardForm.action === '2'">
             <!-- 积分使用引导语 -->
             <el-form-item label="积分使用引导语" prop="scoreGuideText">
               <el-input
@@ -185,6 +268,17 @@
 <!--              ></el-input>-->
 <!--            </el-form-item>-->
           </template>
+
+          <template v-if="watchRewardForm.action === '3'">
+            <!-- 优惠券使用引导语 -->
+            <el-form-item label="优惠券使用引导语" prop="couponGuideText">
+              <el-input
+                v-model="watchRewardForm.couponGuideText"
+                placeholder="请输入优惠券使用引导语"
+                style="width: 300px;"
+              ></el-input>
+            </el-form-item>
+          </template>
         </div>
 
         <!-- 保存按钮 -->
@@ -198,6 +292,7 @@
 
 <script>
 import {addConfig, getConfig, updateConfig} from "@/api/live/liveQuestionLive";
+import {listLiveCouponOn} from "@/api/live/liveCoupon";
 
 export default {
   props: {
@@ -247,7 +342,15 @@ export default {
         // 完课率要求（1-100）
         completionRate: 90,
         // 连续完课积分配置（第1-10天）
-        pointsConfig: [100, 110, 120, 130, 140, 150, 160, 170, 180, 200]
+        pointsConfig: [100, 110, 120, 130, 140, 150, 160, 170, 180, 200],
+        // 完课优惠券相关配置（participateCondition为3时使用）
+        // 完课优惠券ID
+        finishCouponId: null,
+        // 实施动作为3（优惠券）时的配置
+        // 优惠券ID
+        actionCouponId: null,
+        // 优惠券引导语
+        couponGuideText: ''
       },
       rules:{
         participateCondition:[
@@ -303,6 +406,38 @@ export default {
             trigger: 'change'
           }
         ],
+        finishCouponId:[
+          {
+            validator: (rule, value, callback) => {
+              if (this.watchRewardForm.participateCondition === '3') {
+                if (!value) {
+                  callback(new Error('请选择完课优惠券'));
+                } else {
+                  callback();
+                }
+              } else {
+                callback();
+              }
+            },
+            trigger: 'change'
+          }
+        ],
+        actionCouponId:[
+          {
+            validator: (rule, value, callback) => {
+              if (this.watchRewardForm.participateCondition === '1' && this.watchRewardForm.action === '3') {
+                if (!value) {
+                  callback(new Error('请选择优惠券'));
+                } else {
+                  callback();
+                }
+              } else {
+                callback();
+              }
+            },
+            trigger: 'change'
+          }
+        ],
         // receivePrompt:[
         //   { required: true, message: '请输入领取提示语', trigger: 'blur'}
         // ],
@@ -331,8 +466,20 @@ export default {
         {
           label: '积分红包',
           value: '2'
+        },
+        {
+          label: '优惠券',
+          value: '3'
         }
       ],
+      // 优惠券下拉选项（与运营自动化一致）
+      couponSelectOptions: [],
+      // 优惠券完整数据列表
+      couponListData: [],
+      // 选中的完课优惠券信息
+      selectedFinishCoupon: {},
+      // 选中的实施动作优惠券信息
+      selectedActionCoupon: {}
 
     };
   },
@@ -359,27 +506,85 @@ export default {
         }
       }
     },
-    // 监听直播类型变化，直播时不支持完课积分
+    // 监听直播类型变化，直播时不支持完课积分和完课优惠券
     liveType: {
       handler(newValue) {
-        // 如果是直播（liveType == 1）且当前选择了完课积分，则切换到观看时长
-        if (newValue == 1 && this.watchRewardForm.participateCondition === '2') {
+        // 如果是直播（liveType == 1）且当前选择了完课积分或完课优惠券，则切换到观看时长
+        if (newValue == 1 && (this.watchRewardForm.participateCondition === '2' || this.watchRewardForm.participateCondition === '3')) {
           this.watchRewardForm.participateCondition = '1';
         }
       },
       immediate: true
+    },
+    // 监听完课优惠券选择变化
+    'watchRewardForm.finishCouponId': {
+      handler(newVal) {
+        if (newVal) {
+          const coupon = this.couponListData.find(item => item.couponId === newVal);
+          if (coupon) {
+            this.selectedFinishCoupon = coupon;
+          }
+        } else {
+          this.selectedFinishCoupon = {};
+        }
+      }
+    },
+    // 监听实施动作优惠券选择变化
+    'watchRewardForm.actionCouponId': {
+      handler(newVal) {
+        if (newVal) {
+          const coupon = this.couponListData.find(item => item.couponId === newVal);
+          if (coupon) {
+            this.selectedActionCoupon = coupon;
+          }
+        } else {
+          this.selectedActionCoupon = {};
+        }
+      }
     }
   },
   created() {
   },
   methods: {
     getLiveConfig(){
-      getConfig(this.liveId).then(response => {
-        if(response.code === 200 && response.data != null && response.data.length > 0){
-          this.watchRewardForm = JSON.parse(response.data)
-        }
-        this.loading = false
-      })
+      // 先加载优惠券列表
+      this.loadCouponList().then(() => {
+        getConfig(this.liveId).then(response => {
+          if(response.code === 200 && response.data != null && response.data.length > 0){
+            const parsedData = JSON.parse(response.data);
+            // 合并默认值，避免新增字段丢失
+            this.watchRewardForm = Object.assign({}, this.watchRewardForm, parsedData);
+            // 恢复优惠券详情显示
+            if (this.watchRewardForm.finishCouponId) {
+              const coupon = this.couponListData.find(item => item.couponId === this.watchRewardForm.finishCouponId);
+              if (coupon) {
+                this.selectedFinishCoupon = coupon;
+              }
+            }
+            if (this.watchRewardForm.actionCouponId) {
+              const coupon = this.couponListData.find(item => item.couponId === this.watchRewardForm.actionCouponId);
+              if (coupon) {
+                this.selectedActionCoupon = coupon;
+              }
+            }
+          }
+          this.loading = false
+        }).catch(() => {
+          this.loading = false
+        });
+      });
+    },
+    // 加载优惠券列表（与运营自动化一致）
+    loadCouponList() {
+      return listLiveCouponOn({ liveId: this.liveId }).then(response => {
+        const list = response.rows || [];
+        this.couponListData = list;
+        // 组装下拉选项
+        this.couponSelectOptions = list.map(item => ({
+          value: item.couponId,
+          label: item.title
+        }));
+      });
     },
     // 自动保存开关状态
     autoSaveEnabled() {
@@ -426,7 +631,7 @@ export default {
           }
         }
       })
-    },
+    }
   }
 };
 </script>
@@ -532,4 +737,33 @@ export default {
   padding: 8px 20px;
   font-size: 13px;
 }
+
+/* 优惠券详情展示样式 */
+.coupon-detail-box {
+  background-color: #f5f7fa;
+  border-radius: 4px;
+  padding: 15px 20px;
+  width: 400px;
+}
+
+.coupon-detail-item {
+  display: flex;
+  margin-bottom: 10px;
+  font-size: 14px;
+}
+
+.coupon-detail-item:last-child {
+  margin-bottom: 0;
+}
+
+.detail-label {
+  color: #606266;
+  width: 100px;
+  flex-shrink: 0;
+}
+
+.detail-value {
+  color: #333;
+  font-weight: 500;
+}
 </style>