Bläddra i källkod

chore: 提交最近改动

xw 1 månad sedan
förälder
incheckning
9f22a48fcc
1 ändrade filer med 100 tillägg och 31 borttagningar
  1. 100 31
      src/views/course/userCoursePeriod/index.vue

+ 100 - 31
src/views/course/userCoursePeriod/index.vue

@@ -165,6 +165,13 @@
           <el-table-column label="营期名称" align="center" prop="periodName" />
           <el-table-column label="公司名称" align="center" prop="companyName" />
           <el-table-column label="营期状态" align="center" prop="periodStatus" width="100" :formatter="periodStatusFormatter" />
+          <el-table-column label="自由模式" align="center" prop="freeMode" width="100">
+            <template slot-scope="scope">
+              <el-tag :type="scope.row.freeMode === 1 ? 'success' : 'info'">
+                {{ scope.row.freeMode === 1 ? '开启' : '关闭' }}
+              </el-tag>
+            </template>
+          </el-table-column>
           <el-table-column label="营期线" align="center" prop="periodLine" width="180" />
           <el-table-column label="开营开始时间" align="center" prop="periodStartingTime" width="180" />
           <el-table-column label="开营结束时间" align="center" prop="periodEndTime" width="180" />
@@ -265,32 +272,61 @@
         <el-form-item label="销售提前查看天数" prop="maxViewNum">
           <el-input-number :min="0" v-model="form.maxViewNum" style="width: 200px" />
         </el-form-item>
+        <el-form-item prop="freeMode">
+          <span slot="label">
+            是否开启自由模式
+            <el-tooltip content="开启后,学员可以自由安排学习进度,不受营期时间限制" placement="top">
+              <i class="el-icon-question" style="margin-left: 5px; color: #909399; cursor: help;"></i>
+            </el-tooltip>
+          </span>
+          <el-radio-group v-model="form.freeMode">
+            <el-radio :label="1">开启</el-radio>
+            <el-radio :label="0">关闭</el-radio>
+          </el-radio-group>
+        </el-form-item>
         <el-form-item label="开营日期" prop="periodStartingTime">
-          <el-date-picker
-            :style="{display: form.periodType == 1 ? '' : 'none !important'}"
-            v-model="form.dateRange"
-            @change="timeChange(1)"
-            type="daterange"
-            range-separator="至"
-            start-placeholder="开始日期"
-            end-placeholder="结束日期"
-            value-format="yyyy-MM-dd"
-            :picker-options="{}"
-            :clearable="false"
-          >
-          </el-date-picker>
-          <el-date-picker
-            :disabled = "isDisabledDateRange"
-            :style="{display: form.periodType == 2 ? '' : 'none !important'}"
-            @change="timeChange(2)"
-            v-model="form.date"
-            type="date"
-            value-format="yyyy-MM-dd"
-            placeholder="选择日期"
-            :picker-options="{}"
-            :clearable="false"
-          >
-          </el-date-picker>
+          <div style="display: flex; flex-direction: column; gap: 10px; width: 100%;">
+            <div style="display: flex; align-items: center; gap: 10px;">
+              <el-date-picker
+                :style="{display: form.periodType == 1 ? '' : 'none !important', flex: 1}"
+                v-model="form.dateRange"
+                @change="timeChange(1)"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                value-format="yyyy-MM-dd"
+                :picker-options="{}"
+                :clearable="false"
+              >
+              </el-date-picker>
+              <el-date-picker
+                :disabled = "isDisabledDateRange"
+                :style="{display: form.periodType == 2 ? '' : 'none !important', flex: 1}"
+                @change="timeChange(2)"
+                v-model="form.date"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="选择日期"
+                :picker-options="{}"
+                :clearable="false"
+              >
+              </el-date-picker>
+              <el-button 
+                v-if="form.periodType == 1"
+                type="warning" 
+                size="small" 
+                icon="el-icon-setting"
+                @click="setEndDateTo2099"
+                title="一键将结束日期设置为2099-12-31"
+              >
+                永久营期
+              </el-button>
+            </div>
+            <div v-if="form.periodType == 1" style="color: #909399; font-size: 12px;">
+              <i class="el-icon-info"></i> 点击"永久营期"可将结束日期设置为2099-12-31
+            </div>
+          </div>
         </el-form-item>
         <el-form-item prop="periodLine">
           <span slot="label">
@@ -559,17 +595,27 @@
             <el-table-column type="selection" width="55" align="center" />
             <el-table-column label="课程" align="center" prop="courseName" width="180" />
             <el-table-column label="小节" align="center" prop="videoName" />
-            <el-table-column label="开课状态" align="center" prop="status" width="100" :formatter="courseStatusFormatter" />
+            <el-table-column label="开课状态" align="center" prop="status" width="100">
+              <template slot-scope="scope">
+                <span v-if="periodSettingsData.freeMode === 1">
+                  <el-tag type="success">进行中</el-tag>
+                </span>
+                <span v-else>{{ courseStatusFormatter(scope.row) }}</span>
+              </template>
+            </el-table-column>
             <el-table-column label="营期时间" align="center" prop="dayDate" width="100"/>
             <el-table-column label="开始时间" align="center" prop="startDateTime" width="100">
 <!--              <template slot-scope="scope">-->
 <!--                <el-tag>{{scope.row.startDateTime}}</el-tag>-->
 <!--              </template>-->
             </el-table-column>
-            <el-table-column label="结束时间" align="center" prop="endDateTime" width="100">
-<!--              <template slot-scope="scope">-->
-<!--                <el-tag type="success">{{parseTime(scope.row.endDateTime, '{h}:{i}:{s}')}}</el-tag>-->
-<!--              </template>-->
+            <el-table-column label="结束时间" align="center" prop="endDateTime" width="120">
+              <template slot-scope="scope">
+                <span v-if="periodSettingsData.freeMode === 1">
+                  <el-tag type="warning">永不过期</el-tag>
+                </span>
+                <span v-else>{{ scope.row.endDateTime }}</span>
+              </template>
             </el-table-column>
             <el-table-column label="领取红包时间" align="center" prop="lastJoinTime" width="160">
               <template slot-scope="scope">
@@ -1152,7 +1198,8 @@ export default {
         timeRange: [], // 看课时间范围
         viewStartTime: null, // 看课开始时间
         viewEndTime: null, // 看课结束时间
-        lastJoinTime: null // 领取红包时间
+        lastJoinTime: null, // 领取红包时间
+        freeMode: 0 // 是否开启自由模式,默认关闭
       };
       this.resetForm("form");
     },
@@ -1413,6 +1460,28 @@ export default {
         this.form.days = [];
       }
     },
+    /** 一键设置结束日期为2099-12-31 */
+    setEndDateTo2099() {
+      // 检查是否有开始日期
+      if (!this.form.dateRange || !this.form.dateRange[0]) {
+        this.$message.warning('请先选择开始日期');
+        return;
+      }
+      
+      this.$confirm('是否将结束日期设置为 2099-12-31?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'info'
+      }).then(() => {
+        // 保持开始日期,修改结束日期
+        this.form.dateRange = [this.form.dateRange[0], '2099-12-31'];
+        // 触发时间变更事件
+        this.timeChange(1);
+        this.$message.success('已将结束日期设置为 2099-12-31');
+      }).catch(() => {
+        this.$message.info('已取消操作');
+      });
+    },
     getDiff(start, end) {
       if(start == null || start == undefined || start == '') return 0;
       if(end == null || end == undefined || end == '') return 0;