feat(teacher/formPage): 添加作业类型选择并调整频次为周期

- 新增 VanCheckboxGroup 组件支持 - 在作业设置中添加作品类型多选框 - 将频次相关字段和逻辑改为周期 - 更新样式类名以匹配周期字段

feat(teacher/formPage): 添加作业类型选择并调整频次为周期
- 新增 VanCheckboxGroup 组件支持 - 在作业设置中添加作品类型多选框 - 将频次相关字段和逻辑改为周期 - 更新样式类名以匹配周期字段
hookehuyr
Commit 18137bcda515ad901158d8be51f5a7ab5e5ef0d7 18137bcd 1 parent 7e21a510
Showing 2 changed files with 36 additions and 23 deletions
src/components.d.ts
src/views/teacher/formPage.vue
--- a/src/components.d.ts
View file @18137bc
+++ b/src/components.d.ts
View file @18137bc
@@ -39,6 +39,7 @@ declare module 'vue' {
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
     VanCheckbox: typeof import('vant/es')['Checkbox']
+    VanCheckboxGroup: typeof import('vant/es')['CheckboxGroup']
     VanCircle: typeof import('vant/es')['Circle']
     VanCol: typeof import('vant/es')['Col']
     VanConfigProvider: typeof import('vant/es')['ConfigProvider']
--- a/src/views/teacher/formPage.vue
View file @18137bc
+++ b/src/views/teacher/formPage.vue
View file @18137bc
@@ -2,7 +2,7 @@
  * @Author: hookehuyr hookehuyr@gmail.com
  * @Date: 2025-01-20 10:00:00
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2025-06-25 16:27:12
+ * @LastEditTime: 2025-09-30 15:46:22
  * @FilePath: /mlaj/src/views/teacher/formPage.vue
  * @Description: 教师作业新增表单页面
 -->
@@ -41,18 +41,29 @@
               <!-- 作业设置 -->
               <div class="mb-6">
                 <h3 class="section-title">{{ pageTitle }}</h3>
+
+                <!-- 作品类型选择 - 只在设置作业时显示 -->
+                <div v-if="$route.query.type === 'homework'" class="mb-4">
+                  <label class="setting-label">作业类型</label>
+                  <van-checkbox-group v-model="formData.attachment_type" direction="horizontal" checked-color="#4caf50" icon-size="15px">
+                    <van-checkbox name="image" shape="square"><span class="text-sm">图文打卡</span></van-checkbox>
+                    <van-checkbox name="video" shape="square"><span class="text-sm">视频打卡</span></van-checkbox>
+                    <van-checkbox name="audio" shape="square"><span class="text-sm">音频打卡</span></van-checkbox>
+                  </van-checkbox-group>
+                </div>
+
                 <van-row gutter="10">
                   <van-col span="12">
-                    <label class="setting-label">{{ pageTitle === '设置作业' ? '作业' : '打卡' }}频次</label>
+                    <label class="setting-label">{{ pageTitle === '设置作业' ? '作业' : '打卡' }}周期</label>
                     <van-field
-                      v-model="formData.frequency_text"
+                      v-model="formData.cycle_text"
                       is-link
                       readonly
-                      name="frequency_text"
+                      name="cycle_text"
-                      placeholder="请选择频次"
+                      placeholder="请选择周期"
                       :border="false"
-                      @click="showFrequencyPicker = true"
+                      @click="showCyclePicker = true"
-                      class="frequency-field"
+                      class="cycle-field"
                     />
                   </van-col>
                   <van-col span="12">
@@ -170,9 +181,9 @@
       </div>
     </div>
-    <!-- 频次选择器 -->
+    <!-- 周期选择器 -->
-    <van-popup v-model:show="showFrequencyPicker" position="bottom">
+    <van-popup v-model:show="showCyclePicker" position="bottom">
-      <van-picker :columns="frequencyOptions" @confirm="onFrequencyConfirm" @cancel="showFrequencyPicker = false" />
+      <van-picker :columns="cycleOptions" @confirm="onCycleConfirm" @cancel="showCyclePicker = false" />
     </van-popup>
     <!-- 开始时间选择器 -->
@@ -333,8 +344,8 @@ const formData = ref({
   title: '',
   note: '',
   task_type: $route.query.type === 'homework' ? 'upload' : 'checkin',
-  frequency_text: '',
+  cycle_text: '',
-  frequency: '',
+  cycle: '',
   target_number: 1,
   start_time: new Date(),
   end_time: new Date(),
@@ -347,13 +358,14 @@ const formData = ref({
   class_name: '',
   class_id: '',
   // group_name: ''
+  attachment_type: [] // 作品类型数组，用于设置作业时的多选
 });
 // 加载状态
 const loading = ref(false);
 // 弹窗显示状态
-const showFrequencyPicker = ref(false);
+const showCyclePicker = ref(false);
 const showStartTimePicker = ref(false);
 const showEndTimePicker = ref(false);
 const showCoursePicker = ref(false);
@@ -370,7 +382,7 @@ const endDate = ref(['2024', '12', '31']);
 const minDate = new Date(2020, 0, 1);
 const maxDate = new Date(2035, 11, 31);
-const frequencyOptions = ref([]);
+const cycleOptions = ref([]);
 // 搜索值
 const courseSearchValue = ref('');
@@ -505,13 +517,13 @@ const formatDateTime = (date) => {
 };
 /**
- * 频次选择确认
+ * 周期选择确认
  * @param {Object} option - 选中的选项
  */
-const onFrequencyConfirm = (option) => {
+const onCycleConfirm = (option) => {
-  formData.value.frequency_text = option.selectedOptions[0].text;
+  formData.value.cycle_text = option.selectedOptions[0].text;
-  formData.value.frequency = option.selectedOptions[0].value;
+  formData.value.cycle = option.selectedOptions[0].value;
-  showFrequencyPicker.value = false;
+  showCyclePicker.value = false;
 };
 /**
@@ -836,7 +848,7 @@ onMounted(async () => {
   // 这里可以调用API获取课程、活动、年级、班级、小组等数据
   const { code, data } = await getTeacherFindSettingsAPI();
   if (code) {
-    frequencyOptions.value = Object.entries(data.task_frequency).map(([value, text]) => ({
+    cycleOptions.value = Object.entries(data.task_cycle).map(([value, text]) => ({
       text,
       value: String(value) // 确保值为字符串类型
     }));
@@ -920,14 +932,14 @@ onMounted(async () => {
   margin-bottom: 8px;
 }
-/* 频次选择 */
+/* 周期选择 */
-.frequency-field {
+.cycle-field {
   background: #f5f5f5;
   border-radius: 8px;
   padding: 2px 0;
 }
-:deep(.frequency-field .van-field__control) {
+:deep(.cycle-field .van-field__control) {
   /* padding: 2px; */
   text-align: center;
 }