Procházet zdrojové kódy

feat:会员营期的课程修改看课时间改成可以选择日期范围

caoliqin před 1 týdnem
rodič
revize
9934db1961
1 změnil soubory, kde provedl 64 přidání a 30 odebrání
  1. 64 30
      src/views/course/userCoursePeriod/index.vue

+ 64 - 30
src/views/course/userCoursePeriod/index.vue

@@ -371,7 +371,6 @@
             range-separator="至"
             start-placeholder="开始时间"
             value-format="HH:mm:ss"
-            format="HH:mm:ss"
             end-placeholder="结束时间">
           </el-time-picker>
         </el-form-item>
@@ -379,7 +378,6 @@
           <el-time-picker
             v-model="course.form.joinTime"
             value-format="HH:mm:ss"
-            format="HH:mm:ss"
             placeholder="选择时间范围">
           </el-time-picker>
           <p style="color: red;margin: 0;font-size: 12px">超过领取红包时间,只允许看课,不允许领取红包</p>
@@ -391,27 +389,39 @@
       </div>
     </el-dialog>
 
-    <el-dialog title="修改看课时间" :visible.sync="updateCourse.open" width="500px" append-to-body>
+    <el-dialog title="修改看课时间" :visible.sync="updateCourse.open" width="600px" append-to-body>
       <el-form ref="courseUpdateForm" :model="updateCourse.form" :rules="courseUpdateRules" label-width="100px">
-        <el-form-item label="看课时间" prop="timeRange">
-          <el-time-picker
-            is-range
-            v-model="updateCourse.form.timeRange"
+        <el-form-item label="看课时间" prop="timeRange" label-width="110px">
+          <el-date-picker
+              v-model="updateCourse.form.timeRange"
+              type="datetimerange"
             range-separator="至"
             start-placeholder="开始时间"
             end-placeholder="结束时间"
-            value-format="HH:mm:ss"
-            @change="onTimeRangeChange"
-            placeholder="选择时间范围">
-          </el-time-picker>
+            value-format="yyyy-MM-dd HH:mm:ss"
+            :default-time="['00:00:00', '23:59:59']"
+            :picker-options="{
+            shortcuts: [{
+              text: '今天',
+              onClick(picker) {
+                const end = new Date();
+                const start = new Date();
+                picker.$emit('pick', [start, end]);
+              }
+            }]
+          }"
+          >
+          </el-date-picker>
         </el-form-item>
-        <el-form-item label="领取红包时间" prop="joinTime">
-          <el-time-picker
-            v-model="updateCourse.form.joinTime"
-            value-format="HH:mm:ss"
-            :picker-options="getPickerOptions()"
-            placeholder="选择时间范围">
-          </el-time-picker>
+        <el-form-item label="领取红包时间" prop="joinTime" label-width="110px">
+          <el-date-picker
+              v-model="updateCourse.form.joinTime"
+              type="datetime"
+            placeholder="选择时间"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            :default-time="'23:59:59'"
+          >
+          </el-date-picker>
           <p style="color: red;margin: 0;font-size: 12px">超过领取红包时间,只允许看课,不允许领取红包</p>
         </el-form-item>
       </el-form>
@@ -493,20 +503,20 @@
             <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="dayDate" />
+            <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>{{parseTime(scope.row.startDateTime, '{h}:{i}:{s}')}}</el-tag>
-              </template>
+<!--              <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>
+<!--              <template slot-scope="scope">-->
+<!--                <el-tag type="success">{{parseTime(scope.row.endDateTime, '{h}:{i}:{s}')}}</el-tag>-->
+<!--              </template>-->
             </el-table-column>
-            <el-table-column label="领取红包时间" align="center" prop="lastJoinTime" width="100">
+            <el-table-column label="领取红包时间" align="center" prop="lastJoinTime" width="160">
               <template slot-scope="scope">
-                <el-tag type="danger">{{parseTime(scope.row.lastJoinTime, '{h}:{i}:{s}')}}</el-tag>
+                <el-tag type="danger">{{scope.row.lastJoinTime}}</el-tag>
               </template>
             </el-table-column>
             <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
@@ -729,7 +739,15 @@ export default {
               if (!value || !Array.isArray(value) || value.length !== 2) {
                 callback(new Error('请选择完整的看课时间范围'));
               } else {
-                callback();
+                // 检查时间格式是否正确(yyyy-MM-dd HH:mm:ss)
+                const timeRegex = /^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/;
+                if (!timeRegex.test(value[0]) || !timeRegex.test(value[1])) {
+                  callback(new Error('时间格式不正确'));
+                } else if (value[0] >= value[1]) {
+                  callback(new Error('结束时间必须大于开始时间'));
+                } else {
+                  callback();
+                }
               }
             },
             trigger: 'change'
@@ -739,10 +757,26 @@ export default {
           {
             required: true,
             validator: (rule, value, callback) => {
-              if (!value || typeof value !== 'string') {
+              if (!value) {
                 callback(new Error('请选择领取红包时间'));
               } else {
-                callback();
+                // 检查时间格式是否正确(yyyy-MM-dd HH:mm:ss)
+                const timeRegex = /^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/;
+                if (!timeRegex.test(value)) {
+                  callback(new Error('时间格式不正确'));
+                } else {
+                  // 检查领取红包时间是否在看课时间范围内
+                  const timeRange = this.updateCourse.form.timeRange;
+                  if (timeRange && Array.isArray(timeRange) && timeRange.length === 2) {
+                    if (value < timeRange[0] || value > timeRange[1]) {
+                      callback(new Error('领取红包时间必须在看课时间范围内'));
+                    } else {
+                      callback();
+                    }
+                  } else {
+                    callback();
+                  }
+                }
               }
             },
             trigger: 'change'