feat(教师表单): 优化时间选择器交互并完善表单提交逻辑

重构时间选择器点击事件为独立函数，提高代码可维护性扩展最大可选日期至2035年移除未使用的活动和小组成员选择代码完善表单提交数据格式，包含章节选择和日期格式化

feat(教师表单): 优化时间选择器交互并完善表单提交逻辑
重构时间选择器点击事件为独立函数，提高代码可维护性扩展最大可选日期至2035年移除未使用的活动和小组成员选择代码完善表单提交数据格式，包含章节选择和日期格式化
hookehuyr
Commit 47efe26d452ba01d2948f1d44302a2a5b06dca9b 47efe26d 1 parent e06eec5c
Showing 2 changed files with 55 additions and 8 deletions
src/api/teacher.js
src/views/teacher/formPage.vue
--- a/src/api/teacher.js 0 → 100644
View file @47efe26
+++ b/src/api/teacher.js 0 → 100644
View file @47efe26
--- a/src/views/teacher/formPage.vue
View file @47efe26
+++ b/src/views/teacher/formPage.vue
View file @47efe26
@@ -2,7 +2,7 @@
  * @Author: hookehuyr hookehuyr@gmail.com
  * @Date: 2025-01-20 10:00:00
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2025-06-23 11:38:17
+ * @LastEditTime: 2025-06-23 11:54:22
  * @FilePath: /mlaj/src/views/teacher/formPage.vue
  * @Description: 教师作业新增表单页面
 -->
@@ -78,7 +78,7 @@
                   <div class="time-item">
                     <van-icon name="calendar-o" class="time-icon" />
                     <span class="time-label">开始日期：</span>
-                    <span class="time-value" @click="showStartTimePicker = true">
+                    <span class="time-value" @click="openStartTimePicker">
                       {{ startTimeDisplay || '2025-05-13' }}
                     </span>
                     <van-icon name="arrow" class="arrow-icon" />
@@ -88,7 +88,7 @@
                   <div class="time-item">
                     <van-icon name="calendar-o" class="time-icon" />
                     <span class="time-label">结束日期：</span>
-                    <span class="time-value" @click="showEndTimePicker = true">
+                    <span class="time-value" @click="openEndTimePicker">
                       {{ endTimeDisplay || '2025-06-13' }}
                     </span>
                     <van-icon name="arrow" class="arrow-icon" />
@@ -132,7 +132,7 @@
                     <van-icon name="arrow" class="arrow-icon" @click="showChapterPicker = true" />
                   </div>
                 </div>
-                <div class="select-row">
+                <!-- <div class="select-row">
                   <div class="select-item">
                     <van-icon name="fire-o" class="select-icon" />
                     <span class="select-label">所在活动：</span>
@@ -147,7 +147,7 @@
                     <span class="select-value" @click="showGroupPicker = true">{{ formData.group_name || '请选择小组' }}</span>
                     <van-icon name="arrow" class="arrow-icon" @click="showGroupPicker = true" />
                   </div>
-                </div>
+                </div> -->
               </div>
               <!-- 提交按钮 -->
@@ -365,7 +365,7 @@ const showGroupPicker = ref(false);
 const startDate = ref(['2024', '01', '01']);
 const endDate = ref(['2024', '12', '31']);
 const minDate = new Date(2020, 0, 1);
-const maxDate = new Date(2030, 11, 31);
+const maxDate = new Date(2035, 11, 31);
 // 选项数据
 const typeOptions = ref([
@@ -573,6 +573,22 @@ const onFrequencyConfirm = (option) => {
 };
 /**
+ * 打开开始时间选择器
+ */
+const openStartTimePicker = () => {
+  // 同步当前的开始时间到选择器
+  if (formData.value.start_time) {
+    const date = new Date(formData.value.start_time);
+    startDate.value = [
+      date.getFullYear().toString(),
+      (date.getMonth() + 1).toString().padStart(2, '0'),
+      date.getDate().toString().padStart(2, '0')
+    ];
+  }
+  showStartTimePicker.value = true;
+};
+
+/**
  * 开始时间确认
  */
 const onStartTimeConfirm = () => {
@@ -582,6 +598,22 @@ const onStartTimeConfirm = () => {
 };
 /**
+ * 打开结束时间选择器
+ */
+const openEndTimePicker = () => {
+  // 同步当前的结束时间到选择器
+  if (formData.value.end_time) {
+    const date = new Date(formData.value.end_time);
+    endDate.value = [
+      date.getFullYear().toString(),
+      (date.getMonth() + 1).toString().padStart(2, '0'),
+      date.getDate().toString().padStart(2, '0')
+    ];
+  }
+  showEndTimePicker.value = true;
+};
+
+/**
  * 结束时间确认
  */
 const onEndTimeConfirm = () => {
@@ -813,8 +845,23 @@ const handleSubmit = async (values) => {
       return;
     }
+    // 准备提交的数据，包含课程章节选择和格式化的日期
+    const submitData = {
+      ...formData.value,
+      // 格式化日期为YYYY-MM-DD格式
+      start_time: formatDateTime(formData.value.start_time),
+      end_time: formatDateTime(formData.value.end_time),
+      // 添加课程章节选择数据
+      selected_chapters: selectedChapters.value.map(chapter => ({
+        id: chapter.id,
+        name: chapter.name,
+        start_time: formatDateTime(chapter.startTime),
+        end_time: formatDateTime(chapter.endTime)
+      }))
+    };
+
     // 这里可以调用API提交数据
-    console.log('提交的表单数据:', formData.value);
+    console.log('提交的表单数据:', submitData);
     // 模拟API调用
     await new Promise(resolve => setTimeout(resolve, 1000));
@@ -822,7 +869,7 @@ const handleSubmit = async (values) => {
     showToast('保存成功');
     // 返回上一页或跳转到列表页
-    $router.back();
+    // $router.back();
   } catch (error) {
     console.error('提交失败:', error);