培训班

2025-04-16 13:57:33 +08:00
parent c5749400c7
commit 5772a8ae9d
5 changed files with 472 additions and 156 deletions
--- a/src/views/modules/trainingCourse/training-course-list.vue
+++ b/src/views/modules/trainingCourse/training-course-list.vue
@@ -13,7 +13,7 @@
        >
        </el-input>
      </el-form-item>
-      <el-form-item label="年份">
+      <el-form-item label="培训年份">
        <el-input
          v-model="dataForm.year"
          placeholder="请输入年份(YYYY)"
@@ -47,33 +47,62 @@
      border
      v-loading="dataListLoading"
      style="width: 100%"
+      @sort-change="handleSortChange"
    >
-      <el-table-column label="标题" align="center">
+      <el-table-column
+        label="序号"
+        type="index"
+        align="center"
+        width="60">
+      </el-table-column>
+      <el-table-column label="培训日期" width="110" align="center" sortable="custom" :sort-orders="['ascending', 'descending']">
+        <template slot-scope="scope">
+          <span v-if="scope.row.trainingDate">
+            {{ scope.row.trainingDate.substring(0, 10) }}
+          </span>
+          <span v-else>-</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="创建时间" width="110" align="center" sortable="custom" :sort-orders="['ascending', 'descending']">
+        <template slot-scope="scope">
+          <span v-if="scope.row.createTime">
+            {{ scope.row.createTime.substring(0, 10) }}
+          </span>
+          <span v-else>-</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="标题" align="center" width="160">
        <template slot-scope="scope">{{ scope.row.title }}</template>
      </el-table-column>
-      <el-table-column label="年份" align="center">
-        <template slot-scope="scope">{{ scope.row.year }}</template>
+      <el-table-column label="海报" align="center" width="90">
+        <template slot-scope="scope">
+          <img width="50px" :src="scope.row.icon" v-if="scope.row.icon" alt="" />
+        </template>
      </el-table-column>
-      <el-table-column label="原价" align="center">
+      <el-table-column label="年份" align="center" prop="year" width="90"></el-table-column>
+      <el-table-column label="原价" align="center" width="80">
        <template slot-scope="scope">{{ scope.row.fee }}</template>
      </el-table-column>
-      <el-table-column label="vip价格" align="center">
+      <el-table-column label="vip价格" align="center" width="80">
        <template slot-scope="scope">{{ scope.row.vipFee }}</template>
      </el-table-column>
-      <el-table-column label="svip价格" align="center">
+      <el-table-column label="svip价格" align="center" width="80">
        <template slot-scope="scope">{{ scope.row.svipFee }}</template>
      </el-table-column>
-      <el-table-column label="湖粉价格" align="center">
-        <template slot-scope="scope">{{ scope.row.huFee }}</template>
+      <el-table-column label="湖粉价格" align="center" width="130">
+        <template slot-scope="scope">
+          三星湖粉 {{ scope.row.threeHuFee }}<br/>
+          五星湖粉 {{ scope.row.fiveHuFee }}
+        </template>
      </el-table-column>
-      <el-table-column label="活动类型" align="center" prop="type">
+      <el-table-column label="活动类型" align="center" prop="type" width="90">
        <template slot-scope="scope">
          <span v-if="scope.row.type==1">线上</span>
          <span v-else-if="scope.row.type==2">线下</span>
          <span v-else>--</span>
        </template>
      </el-table-column>
-      <el-table-column label="报名状态" align="center" width="220">
+      <el-table-column label="报名状态" align="center" width="200">
        <template slot-scope="scope">
          <el-switch
            @change="changeSingupFlag(scope.row)"
@@ -87,13 +116,13 @@
          </el-switch>
        </template>
      </el-table-column>
-      <el-table-column label="创建时间" align="center" prop="createTime">
-      </el-table-column>
+      
+      <el-table-column label="排序" align="center" prop="sort" width="90"></el-table-column>
+
      <el-table-column
        fixed="right"
        header-align="center"
        align="center"
-        width="120"
        label="操作"
      >
        <template slot-scope="scope">
@@ -107,7 +136,6 @@
            <el-button
              type="text"
              size="small"
-              @click="userHandle(scope.row)"
              >用户列表</el-button
            >
          </router-link>
@@ -141,21 +169,47 @@
        <el-form-item label="标题" prop="title">
          <el-input v-model="addForm.title" placeholder="请输入标题"></el-input>
        </el-form-item>
-        <el-form-item label="年份" prop="year">
-          <el-input v-model="addForm.year" placeholder="请输入年份(YYYY)"></el-input>
+        <el-form-item label="培训日期" prop="trainingDate">
+          <el-date-picker
+            v-model="addForm.trainingDate"
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="请选择日期">
+          </el-date-picker>
        </el-form-item>
        <el-form-item label="原价" prop="fee">
          <el-input v-model="addForm.fee" placeholder="请输入原价"></el-input>
        </el-form-item>
+        <el-form-item label="排序" prop="sort">
+          <el-input v-model="addForm.sort" placeholder="请输入排序"></el-input>
+        </el-form-item>
+        <el-form-item label="vip类型">
+          <el-checkbox-group v-model="vipType" @change="handleCheckedVip" class="checkbox-group">
+            <el-checkbox v-for="item in vipList" :label="item.type" :key="item.type">{{item.title}}</el-checkbox>
+          </el-checkbox-group>
+        </el-form-item>
        <el-form-item label="vip价格" prop="vipFee">
          <el-input v-model="addForm.vipFee" placeholder="请输入vip价格"></el-input>
        </el-form-item>
+        <el-form-item label="svip类型">
+          <el-checkbox-group v-model="svipType" @change="handleCheckedSvip" class="checkbox-group">
+            <el-checkbox v-for="item in svipList" :label="item.type" :key="item.type">{{item.title}}</el-checkbox>
+          </el-checkbox-group>
+        </el-form-item>
        <el-form-item label="svip价格" prop="svipFee">
          <el-input v-model="addForm.svipFee" placeholder="请输入svip价格"></el-input>
        </el-form-item>
-        <el-form-item label="湖粉价格" prop="huFee">
-          <el-input v-model="addForm.huFee" placeholder="请输入湖粉价格"></el-input>
+        <el-form-item label="湖粉价格">
+          <div class="hufen_block">
+            <span>三星湖粉</span>
+            <el-input v-model="addForm.threeHuFee" placeholder="请输入湖粉价格(90湖分以上)"></el-input>
+          </div>
+          <div class="hufen_block">
+            <span>五星湖粉</span>
+            <el-input v-model="addForm.fiveHuFee" placeholder="请输入湖粉价格(150湖分以上)"></el-input>
+          </div>
        </el-form-item>
+        
        <el-form-item label="活动类型" prop="type">
          <el-radio-group v-model="addForm.type">
            <el-radio :label="1">线上</el-radio>
@@ -174,6 +228,25 @@
            >
          </el-switch>
        </el-form-item>
+        <el-form-item label="上传海报" prop="icon">
+          <el-upload
+            :limit="1"
+            class="el-uploadfeng"
+            :action="baseUrl + '/oss/fileoss'"
+            list-type="picture-card"
+            :on-preview="handlePreview"
+            :file-list="fileList"
+            :on-success="handleSuccess"
+            accept=".jpeg,.jpg,.gif,.png"
+            :on-remove="handleRemove"
+          >
+            <i class="el-icon-plus"></i>
+          </el-upload>
+          <span>支持图片类型：.jpeg,.jpg,.gif,.png</span>
+          <el-dialog :visible.sync="dialogVisible" :append-to-body="true">
+            <img width="100%" :src="addForm.icon" alt="" />
+          </el-dialog>
+        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="cancleClose">取 消</el-button>
@@ -183,12 +256,13 @@
  </div>
 </template>
 <script>
+import global from "../../common/common.vue"; //引入共用组间
 export default {
  data() {
    // 通用校验规则：正数且大于 0
    const validatePositiveNumber = (rule, value, callback) => {
      if (!value) {
-        return callback(new Error('不能为空'));
+        return callback(new Error('原价不能为空'));
      }
      if (!/^\d+(\.\d+)?$/.test(value)) {
        return callback(new Error('必须是正数或小数'));
@@ -199,10 +273,12 @@ export default {
      callback();
    };
    return {
+      baseUrl: global.baseUrl,
      dataForm: {
        title: '',
        type: '',  //1线上 2线下
-        year: '',
+        year: '',  //日期
+        trainingDate: '',
        singupFlag: '',  //1可报名 0不可报名
      },
      addForm: {
@@ -211,12 +287,16 @@ export default {
        type: 1,  //1线上 2线下
        icon: '',
        year: '',
+        trainingDate: '',
        fee: '',
+        vipType: '',
        vipFee: '',
+        svipType: '',
        svipFee: '',
-        huFee: '',
+        threeHuFee: '',
+        fiveHuFee: '',
        singupFlag: 1,  //1可报名 0不可报名
-        sort: 0
+        sort: ''
      },
      editId: "",
      addFormRule: {
@@ -226,10 +306,11 @@ export default {
            message: "请输入标题",
          },
        ],
-        year: [
+        trainingDate: [
          {
            required: true,
-            message: "请输入年份",
+            message: "请选择日期",
+            trigger: 'change'
          },
        ],
        fee: [
@@ -247,12 +328,44 @@ export default {
      addOrUpdateVisible: false,
      titlesub: '新增',
      statusType: 0,  //区分新增还是修改
+      value: '',  //选择日期
+      fileList: [], //图片数组
+      dialogVisible: false,
+      //保存数据
+      vipList: [],
+      svipList: [],
+      //勾选值
+      vipType: [],
+      svipType: [],
+      //日期排序
+      sortParams: {
+        date1: '',
+        date2: ''
+      }
    };
  },
-  created() {
+  activated(){
    this.getDataList();
+    this.getVipData();
  },
  methods: {
+    //排序变化事件
+    handleSortChange({ column, prop, order }) {
+      // 更新当前列的排序状态
+      var name = column.label;
+      if(name=='培训日期'){
+        this.sortParams.date1 = order 
+          ? (order === 'ascending' ? '2' : '1') 
+          : null;
+      }else{
+        this.sortParams.date2 = order 
+          ? (order === 'ascending' ? '2' : '1') 
+          : null;
+      }
+      this.getDataList();
+    },
+    
+
    // 获取数据列表
    getDataList() {
      this.dataListLoading = true;
@@ -262,6 +375,8 @@ export default {
        data: this.$http.adornData({
          current: this.pageIndex,
          limit: this.pageSize,
+          trainingDateSort: this.sortParams.date1,
+          createTimeSort:  this.sortParams.date2,
          title: this.dataForm.title,
          type: this.dataForm.type,
          year: this.dataForm.year,
@@ -291,35 +406,41 @@ export default {
        type: 1,  //1线上 2线下
        icon: '',
        year: '',
+        trainingDate: '',
        fee: '',
+        vipType: '',
        vipFee: '',
+        svipType: '',
        svipFee: '',
-        huFee: '',
+        threeHuFee: '',
+        fiveHuFee: '',
        singupFlag: 1,  //1可报名 0不可报名
-        sort: 0
+        sort: ''
      }
+      this.fileList = [];
+      this.vipType = [];
+      this.svipType = [];
    },
-    //关闭
-    cancleClose(){
-      this.addOrUpdateVisible = false;
-    },
+    //点击确定
    addOrEditCate(){
-      //如果是新增
-      if(this.statusType==0){
+      if(this.statusType==0){  //如果是新增
        this.addCate();
      }else if(this.statusType==1){  //如果是修改
        this.editCate(this.addForm);
      }
    },
-
    //取消
    cancleClose(){
      this.addOrUpdateVisible = false;
    },
-    //确定
+    //修改
    editCate(data){
      this.$refs["addFormRef"].validate(valid => {
        if (valid) {
+          var icon = '';
+          if(this.fileList&&this.fileList.length>0){
+            icon = this.fileList[0].url
+          }
          this.$http({
            url: this.$http.adornUrl("/master/trainingClass/editTrainingClass"),
            method: "post",
@@ -328,12 +449,16 @@ export default {
              title: data.title,
              type: data.type,
              year: data.year,
+              trainingDate: data.trainingDate,
              singupFlag: data.singupFlag,
-              icon: data.icon,
+              icon: icon,
              fee: data.fee,
+              vipType: String(this.vipType),
              vipFee: data.vipFee,
+              svipType: String(this.svipType),
              svipFee: data.svipFee,
-              huFee: data.huFee,
+              threeHuFee: data.threeHuFee,
+              fiveHuFee: data.fiveHuFee,
              sort: data.sort
            }),
          }).then(({ data }) => {
@@ -365,6 +490,10 @@ export default {
    addCate(){
      this.$refs["addFormRef"].validate(valid => {
        if (valid) {
+          var icon = '';
+          if(this.fileList&&this.fileList.length>0){
+            icon = this.fileList[0].url
+          }
          this.$http({
            url: this.$http.adornUrl("/master/trainingClass/addTrainingClass"),
            method: "post",
@@ -372,13 +501,16 @@ export default {
              id: this.addForm.id,
              title: this.addForm.title,
              type: String(this.addForm.type),
-              year: this.addForm.year,
+              trainingDate: this.addForm.trainingDate,
              singupFlag: String(this.addForm.singupFlag),
-              icon: this.addForm.icon,
+              icon: icon,
              fee: this.addForm.fee,
+              vipType: String(this.vipType),
              vipFee: this.addForm.vipFee,
+              svipType: String(this.svipType),
              svipFee: this.addForm.svipFee,
-              huFee: this.addForm.huFee,
+              threeHuFee: this.addForm.threeHuFee,
+              fiveHuFee: this.addForm.fiveHuFee,
              sort: this.addForm.sort
            }),
          }).then(({ data }) => {
@@ -399,6 +531,7 @@ export default {
    //操作
    //点击修改
    editHandle(data){
+      this.fileList = [];
      this.addOrUpdateVisible = true;
      this.titlesub = '修改';
      this.statusType = 1;  //修改
@@ -407,17 +540,69 @@ export default {
      this.addForm.title = data.title;
      this.addForm.type = Number(data.type);
      this.addForm.year = data.year;
+      this.addForm.trainingDate = data.trainingDate;
      this.addForm.singupFlag = Number(data.singupFlag);
      this.addForm.icon = data.icon;
+      //图片赋值
+      if(data.icon){
+        this.fileList.push({
+          url: data.icon
+        });
+      }
      this.addForm.fee = data.fee;
+      this.vipType = data.vipType.split(',').map(item => parseInt(item, 10));
      this.addForm.vipFee = data.vipFee;
+      this.svipType = data.svipType.split(',').map(item => parseInt(item, 10));
      this.addForm.svipFee = data.svipFee;
-      this.addForm.huFee = data.huFee;
+      this.addForm.threeHuFee = data.threeHuFee;
+      this.addForm.fiveHuFee = data.fiveHuFee;
      this.addForm.sort = data.sort;
    },
-    //点击用户列表
-    userHandle(data){
-      console.log('用户列表')
+    //上传图片
+    handlePreview(file) {
+      this.fileList = [];
+      this.addForm.icon = file.url;
+      this.fileList.push({
+        url: file.url
+      });
+      this.dialogVisible = true;
+    },
+    //图片上传成功
+    handleSuccess(res, file) {
+      if (res.msg == "success") {
+        this.fileList.push({
+          url: res.url
+        });
+        this.$message.success("图片上传成功");
+      } else {
+        this.$message.error("图片上传失败");
+      }
+    },
+    //图片删除操作
+    handleRemove(file, fileList) {
+      this.fileList = [];
+    },
+
+    //获取vip数据
+    getVipData(){
+      this.$http({
+        url: this.$http.adornUrl("/master/trainingClass/getVipBuyConfigList"),
+        method: "post",
+        data: this.$http.adornData({}),
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.vipList = data.vipBuyConfigList.filter(item => item.type >= 4 && item.type <= 9);
+          this.svipList = data.vipBuyConfigList.filter(item => item.type === 1 || item.type === 2);
+        }
+      });
+    },
+    //勾选vip
+    handleCheckedVip(value){
+      console.log('vip的值', value)
+    },
+    //勾选svip
+    handleCheckedSvip(value){
+      console.log('svip的值', value)
    },
  },
 };
@@ -440,7 +625,7 @@ export default {

 .dialog_box {
  .el-form-item__content {
-    width: calc(100% - 90px) !important;
+    width: calc(100% - 120px) !important;
  }
  .form_item {
    width: 100%;
@@ -452,4 +637,35 @@ export default {
    }
  }
 }
+.checkbox-group .el-checkbox{
+  margin-left: 0;
+  margin-right: 20px;
+
+  .el-checkbox__label{
+    padding-left: 6px;
+    font-size: 13px;
+  }
+}
+.hufen_block{
+  display: flex;
+  align-items: center;
+
+  span{
+    width: 70px;
+    display: inline-block;
+  }
+  .el-input{
+    width: 90%;
+    line-height: 34px;
+  }
+  .el-input__inner{
+    width: 220px;
+    height: 30px;
+    line-height: 34px;
+    padding: 0 8px;
+  }
+  .el-input__inner::placeholder {
+    font-size: 12px;
+  }
+}
 </style>