直播代码添加

src/api/live/liveGoods.js

@@ -50,4 +50,12 @@ export function exportLiveGoods(query) {
     method: 'get',
     params: query
   })
-}
+}
+
+// 导出直播商品
+export function listStoreProduct() {
+  return request({
+    url: '/store/storeProduct/list',
+    method: 'get'
+  })
+}

src/api/live/words.js

@@ -50,4 +50,4 @@ export function exportWords(query) {
     method: 'get',
     params: query
   })
-}
+}

src/views/live/liveConfig/index.vue

@@ -173,166 +173,6 @@
                 </div>
               </div>
             </template>
-<!--            <div v-if="marketItem.name == 'watchReward'">-->
-<!--              &lt;!&ndash; 提示信息 &ndash;&gt;-->
-<!--              <div class="tip-message">-->
-<!--                设置观看奖励，用户达到直播观看时长后可领取奖励-->
-<!--              </div>-->
-
-<!--              &lt;!&ndash; 开启观看奖励开关 &ndash;&gt;-->
-<!--              <div class="reward-switch">-->
-<!--                <span class="switch-label">开启观看奖励</span>-->
-<!--                <el-switch v-model="watchRewardForm.enabled"></el-switch>-->
-<!--              </div>-->
-
-<!--              &lt;!&ndash; 观看奖励设置 &ndash;&gt;-->
-<!--              <div v-if="watchRewardForm.enabled" class="section-block">-->
-<!--                <div class="section-title">观看奖励设置</div>-->
-
-<!--                &lt;!&ndash; 表单内容 &ndash;&gt;-->
-<!--                <el-form :model="watchRewardForm" ref="watchRewardForm" label-width="130px" class="reward-form">-->
-<!--                  &lt;!&ndash; 参与条件 &ndash;&gt;-->
-<!--                  <el-form-item label="参与条件" required>-->
-<!--                    <el-radio v-model="watchRewardForm.participateCondition" label="1">-->
-<!--                      达到指定观看时长-->
-<!--                    </el-radio>-->
-<!--                  </el-form-item>-->
-
-<!--                  &lt;!&ndash; 观看时长 &ndash;&gt;-->
-<!--                  <el-form-item label="观看时长" required>-->
-<!--                    <el-input v-model="watchRewardForm.watchDuration" placeholder="请输入观看时长" class="duration-input">-->
-<!--                      <template slot="append">分钟</template>-->
-<!--                    </el-input>-->
-<!--                  </el-form-item>-->
-
-<!--                  &lt;!&ndash; 实施动作 &ndash;&gt;-->
-<!--                  <el-form-item label="实施动作" required>-->
-<!--                    <el-select v-model="watchRewardForm.action" placeholder="请选择实施动作" style="width: 300px;">-->
-<!--                      <el-option-->
-<!--                        v-for="item in actionOptions"-->
-<!--                        :key="item.value"-->
-<!--                        :label="item.label"-->
-<!--                        :value="item.value">-->
-<!--                      </el-option>-->
-<!--                    </el-select>-->
-<!--                  </el-form-item>-->
-
-<!--                  &lt;!&ndash; 领取提示语 &ndash;&gt;-->
-<!--                  <el-form-item label="领取提示语" required>-->
-<!--                    <el-input v-model="watchRewardForm.receivePrompt" placeholder="请输入领取提示语"></el-input>-->
-<!--                  </el-form-item>-->
-<!--                </el-form>-->
-<!--              </div>-->
-
-<!--              &lt;!&ndash; 红包设置 &ndash;&gt;-->
-<!--              <div v-if="watchRewardForm.enabled" class="section-block">-->
-<!--                <div class="section-title">红包设置</div>-->
-<!--                <el-form :model="watchRewardForm" label-width="130px" class="reward-form">-->
-<!--                  &lt;!&ndash; 根据实施动作类型显示不同的表单内容 &ndash;&gt;-->
-<!--                  <template v-if="watchRewardForm.action === '1'">-->
-<!--                    &lt;!&ndash; 现金红包设置 &ndash;&gt;-->
-<!--                    &lt;!&ndash; 红包发放方式   1固定金额 2随机金额 &ndash;&gt;-->
-<!--                    <el-form-item label="红包发放方式" required>-->
-<!--                      <el-radio-group v-model="watchRewardForm.redPacketType">-->
-<!--                        <el-radio label="1">固定金额</el-radio>-->
-<!--                        <el-radio label="2">随机金额</el-radio>-->
-<!--                      </el-radio-group>-->
-<!--                    </el-form-item>-->
-
-<!--                    &lt;!&ndash; 红包金额 &ndash;&gt;-->
-<!--                    <el-form-item label="红包金额" required>-->
-<!--                      <el-input v-model="watchRewardForm.redPacketAmount" placeholder="请输入红包金额"></el-input>-->
-<!--                    </el-form-item>-->
-
-<!--                    &lt;!&ndash; 红包发放数量 &ndash;&gt;-->
-<!--                    <el-form-item label="红包发放数量">-->
-<!--                      <el-input v-model="watchRewardForm.redPacketCount" placeholder="红包数量+28888人数"></el-input>-->
-<!--                    </el-form-item>-->
-
-<!--                    &lt;!&ndash; 红包领取方式  1二维码核销 2微信提现&ndash;&gt;-->
-<!--                    <el-form-item label="红包领取方式" required>-->
-<!--                      <el-radio-group v-model="watchRewardForm.receiveMethod">-->
-<!--                        <el-radio label="1">二维码领取</el-radio>-->
-<!--                        <el-radio label="2">微信发放</el-radio>-->
-<!--                      </el-radio-group>-->
-<!--                    </el-form-item>-->
-<!--                  </template>-->
-
-<!--                  <template v-else>-->
-<!--                    &lt;!&ndash; 积分红包设置 &ndash;&gt;-->
-<!--                    &lt;!&ndash; 积分值 &ndash;&gt;-->
-<!--                    <el-form-item label="积分值" required>-->
-<!--                      <el-input v-model="watchRewardForm.scoreAmount" placeholder="请输入积分值" style="width: 300px;"></el-input>-->
-<!--                    </el-form-item>-->
-
-<!--                    &lt;!&ndash; 最大领取人数 &ndash;&gt;-->
-<!--                    <el-form-item label="最大领取人数" required>-->
-<!--                      <el-input v-model="watchRewardForm.maxReceivers" placeholder="请输入最大领取人数" style="width: 300px;"></el-input>-->
-<!--                    </el-form-item>-->
-<!--                  </template>-->
-<!--                </el-form>-->
-<!--              </div>-->
-
-<!--              &lt;!&ndash; 其他设置 &ndash;&gt;-->
-<!--              <div v-if="watchRewardForm.enabled" class="section-block">-->
-<!--                <div class="section-title">其他设置</div>-->
-<!--                <template v-if="watchRewardForm.action === '1'">-->
-<!--                  <el-form :model="watchRewardForm" label-width="130px" class="reward-form">-->
-<!--                    &lt;!&ndash; 客服引导  1跟进企业微信 2不设置&ndash;&gt;-->
-<!--                    <el-form-item label="客服引导" required>-->
-<!--                      <el-radio-group v-model="watchRewardForm.showGuide">-->
-<!--                        <el-radio label="1">跟进企业微信</el-radio>-->
-<!--                        <el-radio label="2">不设置</el-radio>-->
-<!--                      </el-radio-group>-->
-<!--                    </el-form-item>-->
-<!--                    <el-form-item label="客服引导语" required>-->
-<!--                      <el-input-->
-<!--                        v-model="watchRewardForm.guideText"-->
-<!--                        placeholder="请输入客服引导语"-->
-<!--                        style="width: 300px;"-->
-<!--                      ></el-input>-->
-<!--                    </el-form-item>-->
-<!--                  </el-form>-->
-<!--                </template>-->
-
-<!--                <template v-else>-->
-<!--                  <el-form :model="watchRewardForm" label-width="150px" class="reward-form">-->
-<!--                    &lt;!&ndash; 积分使用引导语 &ndash;&gt;-->
-<!--                    <el-form-item label="积分使用引导语" required>-->
-<!--                      <el-input-->
-<!--                        v-model="watchRewardForm.scoreGuideText"-->
-<!--                        placeholder="请输入积分使用引导语"-->
-<!--                        style="width: 300px;"-->
-<!--                      ></el-input>-->
-<!--                    </el-form-item>-->
-
-<!--                    &lt;!&ndash; 积分使用引导链接 &ndash;&gt;-->
-<!--                    <el-form-item label="积分使用引导链接" required>-->
-<!--                      <el-input-->
-<!--                        v-model="watchRewardForm.scoreGuideLink"-->
-<!--                        placeholder="请输入积分使用引导链接"-->
-<!--                        style="width: 300px;"-->
-<!--                      ></el-input>-->
-<!--                    </el-form-item>-->
-
-<!--                    &lt;!&ndash; 引导语 &ndash;&gt;-->
-<!--                    <el-form-item label="引导语" required>-->
-<!--                      <el-input-->
-<!--                        v-model="watchRewardForm.guideText"-->
-<!--                        placeholder="请输入引导语"-->
-<!--                        style="width: 300px;"-->
-<!--                      ></el-input>-->
-<!--                    </el-form-item>-->
-<!--                  </el-form>-->
-<!--                </template>-->
-<!--              </div>-->
-
-<!--              &lt;!&ndash; 保存按钮 &ndash;&gt;-->
-<!--              <div class="form-actions">-->
-<!--                <el-button type="primary" @click="saveWatchReward">保存</el-button>-->
-<!--              </div>-->
-<!--            </div>-->
-            <!-- 观看奖励 end -->
 
             <!-- 答题 start -->
             <div v-if="marketItem.name == 'answer'">
@@ -488,6 +328,143 @@
               </el-dialog>
             </div>
             <!-- 答题 end -->
+
+            <!-- 直播商品start -->
+            <div v-if="marketItem.name == 'goods'">
+
+              <el-button type="primary" icon="el-icon-plus" style="margin: 20px 0;" @click="handleAddLiveGoods">添加商品</el-button>
+              <!-- 试题列表表格 -->
+              <el-table
+                :data="goodsLiveList"
+                style="width: 100%"
+                v-loading="loading"
+              >
+                <!-- 题干列：显示试题的主要内容 -->
+                <el-table-column
+                  prop="goodsId"
+                  label="商品id"
+                  show-overflow-tooltip
+                ></el-table-column>
+
+                <!-- 题型列：显示是单选还是多选 -->
+                <el-table-column
+                  prop="storeId"
+                  label="店铺id"
+                >
+                </el-table-column>
+
+                <!-- 创建时间列：显示试题创建的时间 -->
+                <el-table-column
+                  prop="productId"
+                  label="商品id"
+                ></el-table-column>
+
+                <!-- 操作列：包含编辑和删除按钮 -->
+                <el-table-column
+                  label="操作"
+                  width="180"
+                  fixed="right"
+                >
+                  <template slot-scope="scope">
+                    <!-- 删除按钮：用于移除试题 -->
+                    <el-button
+                      type="text"
+                      size="small"
+                      style="color: #F56C6C;"
+                      @click="handleGoodDelete(scope.row)"
+                    >删除</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+
+              <!-- 分页组件：用于分页展示试题列表 -->
+              <pagination
+                v-show="goodsTotal > 0"
+                :total="goodsTotal"
+                :page.sync="goodsParams.pageNum"
+                :limit.sync="goodsParams.pageSize"
+                @pagination="getLiveGoodsList"
+                style="margin-top: 20px;"
+              />
+
+              <!-- 添加商品弹窗 -->
+              <el-dialog
+                title="添加商品"
+                :visible.sync="goodsDialogVisible"
+                width="800px"
+                :close-on-click-modal="false"
+                :close-on-press-escape="false"
+              >
+                <div class="dialog-content">
+                  <div style="text-align: right; margin-bottom: 20px;">
+                    <el-input
+                      v-model="searchTitle"
+                      placeholder="请输入搜索内容"
+                      style="width: 300px;"
+                      @input="handleGoodsSearch"
+                    ></el-input>
+                  </div>
+
+                  <el-table
+                    ref="goodsTable"
+                    :data="goodsList"
+                    style="width: 100%"
+                    v-loading="goodsLoading"
+                    @selection-change="handleGoodsChange"
+                    @row-click="handleGoodsRowClick"
+                    row-key="id"
+                  >
+                    <!-- 复选框列：用于多选试题 -->
+                    <el-table-column
+                      type="selection"
+                      width="55"
+                    >
+                    </el-table-column>
+                    <!-- 题干列：显示试题的主要内容 -->
+                    <el-table-column
+                      prop="storeName"
+                      label="商铺名称"
+                      class-name="clickable-column"
+                    ></el-table-column>
+                    <el-table-column
+                      prop="productName"
+                      label="产品"
+                      class-name="clickable-column"
+                    ></el-table-column>
+                    <el-table-column
+                      prop="price"
+                      label="价格"
+                      class-name="clickable-column"
+                    ></el-table-column>
+                    <el-table-column
+                      prop="stock"
+                      label="库存"
+                      class-name="clickable-column"
+                    ></el-table-column>
+                  </el-table>
+
+                  <pagination
+                    v-show="total > 0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getStoreProductLists"
+                    style="margin-top: 20px;"
+                  />
+                </div>
+                <div slot="footer" class="dialog-footer">
+                  <div style="display: flex; justify-content: space-between; align-items: center;">
+                    <span class="selected-count">当前已选择 <span style="color: #00BFFF; font-style: italic;">{{ selectedGoods.length }}</span> 商品</span>
+                    <div>
+                      <el-button @click="goodsDialogVisible = false">取 消</el-button>
+                      <el-button type="primary" @click="confirmAddGoods">确 定</el-button>
+                    </div>
+                  </div>
+                </div>
+              </el-dialog>
+            </div>
+            <!-- 直播商品end -->
+
           </el-tab-pane>
         </el-tabs>
         <!-- 营销内容 end -->
@@ -507,6 +484,7 @@ import {
   addConfig,
   updateConfig
 } from '@/api/live/liveQuestionLive'
+import {listLiveGoods, delLiveGoods, listStoreProduct} from '@/api/live/liveGoods'
 export default {
   name: 'LiveConfig',
   data() {
@@ -534,16 +512,23 @@ export default {
           label: '答题',
           name: 'answer'
         },
+        {
+          label: '直播商品',
+          name: 'goods'
+        },
         {
           label: '观看积分 ',
           name: 'watchScore'
         }
       ],
       questionDialogVisible: false,
+      goodsDialogVisible: false,
       questionLoading: false,
+      goodsLoading: false,
       searchTitle: '',
       questionList: [],
       selectedQuestions: [],
+      selectedGoods: [],
       total: 0,
       queryParams: {
         pageNum: 1,
@@ -551,13 +536,28 @@ export default {
         title: null,
         liveId: null
       },
-      questionLiveList: [],
       questionTotal: 0,
       questionParams: {
         pageNum: 1,
         pageSize: 10,
         liveId: null
       },
+      goodsList: [],
+      goodsTotal: 0,
+      questionLiveList: [],
+      goodsLiveList: [],
+      goodsLiveTotal: 0,
+      goodsParams: {
+        pageNum: 1,
+        pageSize: 10,
+        liveId: null
+      },
+      queryGoodParams: {
+        pageNum: 1,
+        pageSize: 10,
+        title: null,
+        liveId: null
+      },
       rules:{
         participateCondition:[
           { required: true, message: '请选择参与条件', trigger: 'blur'}
@@ -637,6 +637,7 @@ export default {
   created() {
     this.liveId = this.$route.params.liveId
     this.queryParams.liveId = this.liveId
+    this.goodsParams.liveId = this.liveId
     this.questionParams.liveId = this.liveId
     this.watchRewardForm.liveId = this.liveId
     // this.getLiveQuestionLiveList()
@@ -645,7 +646,7 @@ export default {
   methods: {
     getLiveConfig(){
       getConfig(this.liveId).then(response => {
-        if(response.code == 200){
+        if(response.code === 200){
           this.watchRewardForm = JSON.parse(response.data)
         }
       })
@@ -657,10 +658,21 @@ export default {
       this.$router.push('/live/liveQuestionBank')
     },
     handleTabClick(tab) {
-      if(tab.name == 'answer') {
-        this.getLiveQuestionLiveList()
+      if(tab.name === 'answer') {
+        // this.getLiveQuestionLiveList()
+      }
+      if(tab.name === 'goods'){
+        this.getLiveGoodsList();
       }
     },
+    getLiveGoodsList() {
+      this.loading = true
+      listLiveGoods().then(response => {
+        this.goodsLiveList = response.rows
+        this.goodsLiveTotal = response.total
+        this.loading = false
+      })
+    },
     getLiveQuestionLiveList() {
       this.loading = true
       listLiveQuestionLive(this.questionParams).then(response => {
@@ -673,6 +685,10 @@ export default {
       this.questionDialogVisible = true
       this.getQuestionList()
     },
+    handleAddLiveGoods(){
+      this.goodsDialogVisible = true;
+      this.getStoreProductLists()
+    },
     getQuestionList() {
       this.questionLoading = true
       listLiveQuestionOptionList(this.queryParams).then(response => {
@@ -686,9 +702,17 @@ export default {
       this.queryParams.title = this.searchTitle
       this.getQuestionList()
     },
+    handleGoodsSearch(){
+      this.queryParams.pageNum = 1
+      this.queryParams.title = this.searchTitle
+      this.getQuestionList()
+    },
     handleSelectionChange(selection) {
       this.selectedQuestions = selection
     },
+    handleGoodsChange(goods) {
+      this.selectedGoods = goods
+    },
     handleCurrentChange() {
       this.getQuestionList()
     },
@@ -709,6 +733,22 @@ export default {
         this.getLiveQuestionLiveList()
       })
     },
+    confirmAddGoods(){
+      if (this.selectedGoods.length === 0) {
+        this.$message({
+          message: '请选择要添加的商品',
+          type: 'warning'
+        })
+        return
+      }
+      addLiveGoods({
+        liveId: this.liveId,
+        goodsIds: this.selectedGoods.map(item => item.goodsId).join(',')
+      }).then(response => {
+        this.goodsDialogVisible = false
+        this.getLiveGoodsList()
+      })
+    },
     handleDelete(row) {
       // 调用删除直播间试题接口
       deleteLiveQuestionLive({
@@ -718,6 +758,11 @@ export default {
         this.getLiveQuestionLiveList()
       })
     },
+    handleGoodDelete(row){
+      delLiveGoods(row.goodsId).then(response => {
+        this.getLiveGoodsList()
+      })
+    },
     /** 处理行点击事件 */
     handleRowClick(row, column) {
       // 如果点击的是复选框列，不进行处理
@@ -737,6 +782,25 @@ export default {
       // 切换选中状态
       table.toggleRowSelection(row, !isSelected)
     },
+    /** 处理行点击事件 */
+    handleGoodsRowClick(row, column) {
+      // 如果点击的是复选框列，不进行处理
+      if (column.type === 'selection') {
+        return
+      }
+
+      // 获取表格实例
+      const table = this.$refs.goodsTable[0]
+      if (!table) {
+        return
+      }
+
+      // 判断当前行是否已经被选中
+      const isSelected = this.selectedGoods.some(item => item.id === row.id)
+
+      // 切换选中状态
+      table.toggleRowSelection(row, !isSelected)
+    },
     saveWatchReward() {
       this.$refs["watchRewardForm"][0].validate(valid => {
         if (valid) {
@@ -756,6 +820,13 @@ export default {
         }
       })
 
+    },
+    getStoreProductLists() {
+      listStoreProduct().then(response => {
+        this.goodsList = response.rows
+        this.goodsTotal = response.total
+        this.loading = false
+      })
     }
   }
 }

src/views/live/words/index.vue

@@ -114,14 +114,6 @@
         <el-form-item label="敏感词" prop="word">
           <el-input v-model="form.word" placeholder="请输入需要过滤的敏感词" />
         </el-form-item>
-        <el-form-item label="敏感词添加时间" prop="createdAt" >
-          <el-date-picker clearable size="small"
-            v-model="form.createdAt"
-            type="date"
-            value-format="yyyy-MM-dd"
-            placeholder="选择敏感词添加时间">
-          </el-date-picker>
-        </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>
@@ -132,7 +124,7 @@
 </template>
 
 <script>
-import { listWords, getWords, delWords, addWords, updateWords, exportWords } from "@/api/live/words";
+import {listWords, getWords, delWords, addWords, updateWords, exportWords} from "@/api/live/words";
 
 export default {
   name: "Words",