Pārlūkot izejas kodu

按营期批量设置红包金额

caoliqin 1 mēnesi atpakaļ
vecāks
revīzija
cc65e82158

+ 10 - 2
src/api/course/userCoursePeriod.js

@@ -95,7 +95,7 @@ export function getPeriodCompanyList(query) {
   })
 }
 
-// 批量设置红包金额
+// 按照课程批量设置红包金额
 export function batchSaveRedPacket(data) {
   return request({
     url: '/course/period/batchRedPacket',
@@ -104,7 +104,7 @@ export function batchSaveRedPacket(data) {
   })
 }
 
-// 获取设置红包金额列表
+// 获取设置红包金额列表展示
 export function getPeriodRedPacketList(query) {
   return request({
     url: '/course/period/redPacketList',
@@ -113,3 +113,11 @@ export function getPeriodRedPacketList(query) {
   })
 }
 
+// 按照营期批量设置红包金额
+export function batchSaveRedPacketByPeriod(data) {
+  return request({
+    url: '/course/period/batchRedPacket/byPeriod',
+    method: 'post',
+    data: data
+  })
+}

+ 120 - 0
src/views/course/userCoursePeriod/batchRedPacket.vue

@@ -0,0 +1,120 @@
+<template>
+  <el-dialog
+    title="批量设置红包"
+    :visible.sync="visible"
+    width="800px"
+    append-to-body
+  >
+    <el-table
+      v-loading="loading"
+      :data="tableData"
+      border
+      style="width: 100%"
+    >
+      <el-table-column
+        type="index"
+        label="序号"
+        width="80"
+        align="center"
+      />
+      <el-table-column
+        prop="periodName"
+        label="营期"
+        align="center"
+      />
+      <el-table-column
+        label="金额"
+        align="center"
+        width="200"
+      >
+        <template slot-scope="scope">
+          <el-input-number
+            v-model="scope.row.amount"
+            :min="0.01"
+            :precision="2"
+            :step="0.01"
+            size="small"
+            style="width: 150px"
+          />
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleClose">取 消</el-button>
+      <el-button type="primary" @click="handleSave">保 存</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { batchSaveRedPacketByPeriod } from "@/api/course/userCoursePeriod";
+
+export default {
+  name: 'BatchRedPacket',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    selectedData: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      loading: false,
+      tableData: []
+    }
+  },
+  watch: {
+    visible(val) {
+      if (val) {
+        this.initTableData()
+      }
+    }
+  },
+  methods: {
+    // 初始化表格数据
+    initTableData() {
+      this.tableData = this.selectedData.map(item => ({
+        ...item,
+        amount: 0.01
+      }))
+    },
+    // 保存
+    handleSave() {
+      this.loading = true;
+      const saveData = this.tableData.map(item => ({
+        periodId: item.periodId,
+        redPacketMoney: item.amount
+      }));
+
+      batchSaveRedPacketByPeriod(saveData).then(response => {
+        if (response.code === 200) {
+          this.$message.success('设置成功');
+          this.$emit('success');
+          this.handleClose();
+        } else {
+          this.$message.error(response.msg || '批量设置失败');
+        }
+      }).catch(error => {
+        this.$message.error('批量设置失败:' + error.message);
+      }).finally(() => {
+        this.loading = false;
+      });
+    },
+    // 关闭
+    handleClose() {
+      this.$emit('update:visible', false)
+    }
+  }
+}
+</script>
+
+<style scoped>
+.el-input-number {
+  width: 100%;
+}
+</style>

+ 70 - 11
src/views/course/userCoursePeriod/index.vue

@@ -129,6 +129,7 @@
           <el-col :span="1.5">
             <el-button
               type="primary"
+              plain
               icon="el-icon-plus"
               size="mini"
               @click="handleAdd"
@@ -138,16 +139,29 @@
           <el-col :span="1.5">
             <el-button
               type="warning"
+              plain
               icon="el-icon-download"
               size="mini"
               @click="handleExport"
               v-hasPermi="['course:period:export']"
             >导出</el-button>
           </el-col>
+          <el-col :span="1.5">
+            <el-button
+              type="primary"
+              plain
+              icon="el-icon-edit"
+              size="mini"
+              @click="handleBatchSetRedPacket"
+              v-hasPermi="['course:period:export']"
+              :disabled="batchSetRedPacketDisabled"
+            >批量设置红包</el-button>
+          </el-col>
           <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
         </el-row>
 
-        <el-table v-loading="loading" :data="periodList">
+        <el-table v-loading="loading" :data="periodList" @selection-change="handleSelectionChange">
+          <el-table-column type="selection" width="55" align="center" />
           <el-table-column label="营期名称" align="center" prop="periodName" />
           <el-table-column label="公司名称" align="center" prop="companyName" />
           <el-table-column label="开营开始时间" align="center" prop="periodStartingTime" width="180" />
@@ -351,12 +365,12 @@
       </div>
     </el-dialog>
 
-    <red-packet
-      :visible.sync="redPacketVisible"
-      :periodId="currentRedPacketData.periodId"
-      :videoId="currentRedPacketData.videoId"
-      @success="handleRedPacketSuccess"
-    />
+<!--    <red-packet-->
+<!--      :visible.sync="redPacketVisible"-->
+<!--      :periodId="currentRedPacketData.periodId"-->
+<!--      :videoId="currentRedPacketData.videoId"-->
+<!--      @success="handleRedPacketSuccess"-->
+<!--    />-->
 
     <!-- 营期相关设置抽屉 -->
   <el-drawer
@@ -368,7 +382,7 @@
     append-to-body
     custom-class="period-settings-drawer"
   >
-    <div class="drawer-content" style="margin-left:25px">
+    <div class="drawer-content" style="margin-left: 25px">
       <el-tabs v-model="activeTab">
         <el-tab-pane label="课程管理" name="course">
           <el-row :gutter="10" class="mb8">
@@ -402,6 +416,13 @@
     </div>
   </el-drawer>
 
+  <batch-red-packet
+    :visible.sync="batchRedPacketVisible"
+    :selected-data="selectedPeriods"
+    @save="handleBatchRedPacketSave"
+    @success="handleBatchRedPacketSuccess"
+  />
+
   </div>
 </template>
 
@@ -411,11 +432,13 @@ import {getCompanyList} from "@/api/company/company";
 import { listCamp, addCamp, editCamp, delCamp, copyCamp } from "@/api/course/userCourseCamp";
 import { courseList,videoList } from '@/api/course/courseRedPacketLog'
 import RedPacket from './redPacket.vue'
+import BatchRedPacket from './batchRedPacket.vue'
 
 export default {
   name: "Period",
   components: {
-    RedPacket
+    RedPacket,
+    BatchRedPacket
   },
   data() {
     return {
@@ -518,7 +541,13 @@ export default {
       companyList: [],
       courseDialogVisible: false,
       redPacketList: [],
-      currentCompany: null
+      currentCompany: null,
+      // 选中的营期数据
+      selectedPeriods: [],
+      // 批量设置红包按钮是否禁用
+      batchSetRedPacketDisabled: true,
+      // 批量设置红包弹出框
+      batchRedPacketVisible: false,
     };
   },
   created() {
@@ -595,11 +624,14 @@ export default {
       this.queryParams.companyIdList = [];
       this.handleQuery();
     },
-    // 多选框选中数据
+    /** 多选框选中数据 */
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.periodId)
       this.single = selection.length!==1
       this.multiple = !selection.length
+      // 更新批量设置红包相关数据
+      this.selectedPeriods = selection;
+      this.batchSetRedPacketDisabled = selection.length === 0;
     },
     /** 新增按钮操作 */
     handleAdd() {
@@ -677,6 +709,29 @@ export default {
           this.download(response.msg);
         }).catch(function() {});
     },
+
+    /** 批量设置红包 */
+    handleBatchSetRedPacket() {
+      if (this.selectedPeriods.length === 0) {
+        this.$message.warning('请至少选择一个营期');
+        return;
+      }
+      this.batchRedPacketVisible = true;
+    },
+
+    /** 处理批量设置红包保存 */
+    // handleBatchRedPacketSave(data) {
+    //   // 这里等待接口提供后补充具体实现
+    //   // 示例代码:
+    //   // batchSetRedPacket(data).then(response => {
+    //   //   if (response.code === 200) {
+    //   //     this.$message.success('批量设置成功');
+    //   //     this.getList();
+    //   //   }
+    //   // });
+    //   this.batchRedPacketVisible = false;
+    // },
+
     /** 获取公司下拉列表*/
     getCompanyList() {
       this.loading = true;
@@ -1081,6 +1136,10 @@ export default {
         this.redPacketVisible = true;
       }
     },
+    handleBatchRedPacketSuccess() {
+      this.batchRedPacketVisible = false;
+      this.getCourseList();
+    },
   },
 };
 </script>

+ 6 - 1
src/views/course/userCoursePeriod/redPacket.vue

@@ -87,10 +87,15 @@ export default {
       currentCompany: null
     };
   },
+  created() {
+    if(this.activeTab == "company"){
+      this.getCompanyList();
+    }
+  },
   watch: {
     activeTab(val) {
       this.activeTab = val;
-      if (val) {
+      if (val == "company") {
         this.getCompanyList();
       }
     },