Hooke / mlaj

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
da8e5509 1 parent 54ed8a14

feat(teacher): 优化教师打卡和作业表单页面 

- 在打卡页面添加顶部间距并区分打卡和作业按钮功能
- 重构表单页面，根据类型动态显示标题并简化代码结构
- 移除不必要的类型选择字段，默认根据路由参数设置类型
Inline Side-by-side
Showing 2 changed files with 279 additions and 431 deletions
<!--
* @Date: 2025-05-29 15:34:17
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-06-20 10:40:58
* @LastEditTime: 2025-06-20 10:56:22
* @FilePath: /mlaj/src/views/teacher/checkinPage.vue
* @Description: 文件描述
-->
......@@ -21,13 +21,13 @@
@select="onSelectDay"
@click-subtitle="onClickSubtitle">
</van-calendar>
<div style="padding: 0 1rem;">
<div style="padding: 0 1rem; margin-top: 1rem;">
<van-row gutter="15">
<van-col span="12">
<van-button type="primary" block icon="photo" @click="handleAdd">安排打卡</van-button>
<van-button type="primary" block icon="photo" @click="handleAdd('checkin')">安排打卡</van-button>
</van-col>
<van-col span="12">
<van-button type="primary" block icon="video">设置作业</van-button>
<van-button type="primary" block icon="video" @click="handleAdd('homework')">设置作业</van-button>
</van-col>
</van-row>
</div>
......@@ -817,12 +817,12 @@ const formatData = (data) => {
return formattedData;
}
const handleAdd = () => {
const handleAdd = (type) => {
router.push({
path: '/teacher/form',
query: {
post_id: route.query.id,
type: 'image',
type: type,
status: 'add',
}
})
......
......@@ -2,31 +2,24 @@
* @Author: hookehuyr hookehuyr@gmail.com
* @Date: 2025-01-20 10:00:00
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-06-18 11:43:03
* @LastEditTime: 2025-06-20 10:58:03
* @FilePath: /mlaj/src/views/teacher/formPage.vue
* @Description: 教师作业新增表单页面
-->
<template>
<AppLayout title="新增作业">
<div class="bg-gradient-to-br from-green-50 via-green-100/30 to-blue-50/30 min-h-screen">
<div class="px-4 py-6">
<FrostedGlass class="rounded-xl overflow-hidden">
<div class="py-4">
<van-form @submit="handleSubmit">
<van-cell-group inset>
<!-- 作业名称 -->
<van-field
v-model="formData.homework_name"
name="homework_name"
label="作业名称"
placeholder="请输入作业名称"
required
:border="false"
:rules="[{ required: true, message: '请输入作业名称' }]"
/>
<!-- 类型 -->
<van-field
<AppLayout>
<div class="bg-gradient-to-br from-green-50 via-green-100/30 to-blue-50/30 min-h-screen">
<div class="px-4 py-6">
<FrostedGlass class="rounded-xl overflow-hidden">
<div class="py-4">
<van-form @submit="handleSubmit">
<van-cell-group inset>
<!-- 作业名称 -->
<van-field v-model="formData.homework_name" name="homework_name" label="作业名称" placeholder="请输入作业名称"
required :border="false" :rules="[{ required: true, message: '请输入作业名称' }]" />
<!-- 类型 -->
<!-- <van-field
v-model="formData.type"
is-link
readonly
......@@ -35,281 +28,134 @@
placeholder="请选择类型"
:border="false"
@click="showTypePicker = true"
/>
<!-- 频次 -->
<van-field
v-model="formData.frequency"
is-link
readonly
name="frequency"
label="频次"
placeholder="请选择频次"
:border="false"
@click="showFrequencyPicker = true"
/>
<!-- 目标总数 -->
<van-field
v-model="formData.target_count"
type="number"
name="target_count"
label="目标总数"
:border="false"
placeholder="请输入目标数量"
/>
<!-- 开始时间 -->
<van-field
v-model="startTimeDisplay"
is-link
readonly
name="start_time"
label="开始时间"
placeholder="请选择开始时间"
:border="false"
@click="showStartTimePicker = true"
/>
<!-- 结束时间 -->
<van-field
v-model="endTimeDisplay"
is-link
readonly
name="end_time"
label="结束时间"
placeholder="请选择结束时间"
:border="false"
@click="showEndTimePicker = true"
/>
<!-- 课程 -->
<van-field
v-model="formData.course"
is-link
readonly
name="course"
label="课程"
placeholder="请选择课程"
:border="false"
@click="showCoursePicker = true"
/>
<!-- 活动 -->
<van-field
v-model="formData.activity"
is-link
readonly
name="activity"
label="活动"
placeholder="请选择活动"
:border="false"
@click="showActivityPicker = true"
/>
<!-- 年级 -->
<van-field
v-model="formData.grade"
is-link
readonly
name="grade"
label="年级"
placeholder="请选择年级"
:border="false"
@click="showGradePicker = true"
/>
<!-- 班级 -->
<van-field
v-model="formData.class_name"
is-link
readonly
name="class_name"
label="班级"
placeholder="请选择班级"
:border="false"
@click="showClassPicker = true"
/>
<!-- 小组 -->
<van-field
v-model="formData.group_name"
is-link
readonly
name="group_name"
label="小组"
placeholder="请选择小组"
:border="false"
@click="showGroupPicker = true"
/>
</van-cell-group>
<!-- 提交按钮 -->
<div style="margin: 16px;">
<van-button
native-type="submit"
type="primary"
block
round
:loading="loading"
class="bg-green-500 hover:bg-green-600 transition-colors"
>
确认并保存
</van-button>
</div>
</van-form>
</div>
</FrostedGlass>
</div>
</div>
<!-- 类型选择器 -->
<van-popup v-model:show="showTypePicker" position="bottom">
<van-picker
:columns="typeOptions"
@confirm="onTypeConfirm"
@cancel="showTypePicker = false"
/>
</van-popup>
<!-- 频次选择器 -->
<van-popup v-model:show="showFrequencyPicker" position="bottom">
<van-picker
:columns="frequencyOptions"
@confirm="onFrequencyConfirm"
@cancel="showFrequencyPicker = false"
/>
</van-popup>
<!-- 开始时间选择器 -->
<van-popup v-model:show="showStartTimePicker" position="bottom">
<van-date-picker
v-model="startDate"
title="选择开始时间"
:min-date="minDate"
:max-date="maxDate"
@confirm="onStartTimeConfirm"
@cancel="showStartTimePicker = false"
/>
</van-popup>
<!-- 结束时间选择器 -->
<van-popup v-model:show="showEndTimePicker" position="bottom">
<van-date-picker
v-model="endDate"
title="选择结束时间"
:min-date="minDate"
:max-date="maxDate"
@confirm="onEndTimeConfirm"
@cancel="showEndTimePicker = false"
/>
</van-popup>
<!-- 课程选择器 -->
<van-popup v-model:show="showCoursePicker" position="bottom">
<div class="p-4">
<van-search
v-model="courseSearchValue"
placeholder="搜索课程"
@search="searchCourse"
/>
<van-list>
<van-cell
v-for="course in filteredCourses"
:key="course.id"
:title="course.name"
is-link
:border="false"
@click="onCourseSelect(course)"
/>
</van-list>
</div>
</van-popup>
<!-- 活动选择器 -->
<van-popup v-model:show="showActivityPicker" position="bottom">
<div class="p-4">
<van-search
v-model="activitySearchValue"
placeholder="搜索活动"
@search="searchActivity"
/>
<van-list>
<van-cell
v-for="activity in filteredActivities"
:key="activity.id"
:title="activity.name"
is-link
:border="false"
@click="onActivitySelect(activity)"
/>
</van-list>
</div>
</van-popup>
<!-- 年级选择器 -->
<van-popup v-model:show="showGradePicker" position="bottom">
<div class="p-4">
<van-search
v-model="gradeSearchValue"
placeholder="搜索年级"
@search="searchGrade"
/>
<van-list>
<van-cell
v-for="grade in filteredGrades"
:key="grade.id"
:title="grade.name"
is-link
:border="false"
@click="onGradeSelect(grade)"
/>
</van-list>
</div>
</van-popup>
<!-- 班级选择器 -->
<van-popup v-model:show="showClassPicker" position="bottom">
<div class="p-4">
<van-search
v-model="classSearchValue"
placeholder="搜索班级"
@search="searchClass"
/>
<van-list>
<van-cell
v-for="classItem in filteredClasses"
:key="classItem.id"
:title="classItem.name"
is-link
:border="false"
@click="onClassSelect(classItem)"
/>
</van-list>
</div>
</van-popup>
<!-- 小组选择器 -->
<van-popup v-model:show="showGroupPicker" position="bottom">
<div class="p-4">
<van-search
v-model="groupSearchValue"
placeholder="搜索小组"
@search="searchGroup"
/>
<van-list>
<van-cell
v-for="group in filteredGroups"
:key="group.id"
:title="group.name"
is-link
:border="false"
@click="onGroupSelect(group)"
/>
</van-list>
</div>
</van-popup>
</AppLayout>
/> -->
<!-- 频次 -->
<van-field v-model="formData.frequency" is-link readonly name="frequency" label="频次" placeholder="请选择频次"
:border="false" @click="showFrequencyPicker = true" />
<!-- 目标总数 -->
<van-field v-model="formData.target_count" type="number" name="target_count" label="目标总数"
:border="false" placeholder="请输入目标数量" />
<!-- 开始时间 -->
<van-field v-model="startTimeDisplay" is-link readonly name="start_time" label="开始时间"
placeholder="请选择开始时间" :border="false" @click="showStartTimePicker = true" />
<!-- 结束时间 -->
<van-field v-model="endTimeDisplay" is-link readonly name="end_time" label="结束时间" placeholder="请选择结束时间"
:border="false" @click="showEndTimePicker = true" />
<!-- 课程 -->
<van-field v-model="formData.course" is-link readonly name="course" label="课程" placeholder="请选择课程"
:border="false" @click="showCoursePicker = true" />
<!-- 活动 -->
<van-field v-model="formData.activity" is-link readonly name="activity" label="活动" placeholder="请选择活动"
:border="false" @click="showActivityPicker = true" />
<!-- 年级 -->
<van-field v-model="formData.grade" is-link readonly name="grade" label="年级" placeholder="请选择年级"
:border="false" @click="showGradePicker = true" />
<!-- 班级 -->
<van-field v-model="formData.class_name" is-link readonly name="class_name" label="班级"
placeholder="请选择班级" :border="false" @click="showClassPicker = true" />
<!-- 小组 -->
<van-field v-model="formData.group_name" is-link readonly name="group_name" label="小组"
placeholder="请选择小组" :border="false" @click="showGroupPicker = true" />
</van-cell-group>
<!-- 提交按钮 -->
<div style="margin: 16px;">
<van-button native-type="submit" type="primary" block round :loading="loading">
确认并保存
</van-button>
</div>
</van-form>
</div>
</FrostedGlass>
</div>
</div>
<!-- 类型选择器 -->
<van-popup v-model:show="showTypePicker" position="bottom">
<van-picker :columns="typeOptions" @confirm="onTypeConfirm" @cancel="showTypePicker = false" />
</van-popup>
<!-- 频次选择器 -->
<van-popup v-model:show="showFrequencyPicker" position="bottom">
<van-picker :columns="frequencyOptions" @confirm="onFrequencyConfirm" @cancel="showFrequencyPicker = false" />
</van-popup>
<!-- 开始时间选择器 -->
<van-popup v-model:show="showStartTimePicker" position="bottom">
<van-date-picker v-model="startDate" title="选择开始时间" :min-date="minDate" :max-date="maxDate"
@confirm="onStartTimeConfirm" @cancel="showStartTimePicker = false" />
</van-popup>
<!-- 结束时间选择器 -->
<van-popup v-model:show="showEndTimePicker" position="bottom">
<van-date-picker v-model="endDate" title="选择结束时间" :min-date="minDate" :max-date="maxDate"
@confirm="onEndTimeConfirm" @cancel="showEndTimePicker = false" />
</van-popup>
<!-- 课程选择器 -->
<van-popup v-model:show="showCoursePicker" position="bottom">
<div class="p-4">
<van-search v-model="courseSearchValue" placeholder="搜索课程" @search="searchCourse" />
<van-list>
<van-cell v-for="course in filteredCourses" :key="course.id" :title="course.name" is-link :border="false"
@click="onCourseSelect(course)" />
</van-list>
</div>
</van-popup>
<!-- 活动选择器 -->
<van-popup v-model:show="showActivityPicker" position="bottom">
<div class="p-4">
<van-search v-model="activitySearchValue" placeholder="搜索活动" @search="searchActivity" />
<van-list>
<van-cell v-for="activity in filteredActivities" :key="activity.id" :title="activity.name" is-link
:border="false" @click="onActivitySelect(activity)" />
</van-list>
</div>
</van-popup>
<!-- 年级选择器 -->
<van-popup v-model:show="showGradePicker" position="bottom">
<div class="p-4">
<van-search v-model="gradeSearchValue" placeholder="搜索年级" @search="searchGrade" />
<van-list>
<van-cell v-for="grade in filteredGrades" :key="grade.id" :title="grade.name" is-link :border="false"
@click="onGradeSelect(grade)" />
</van-list>
</div>
</van-popup>
<!-- 班级选择器 -->
<van-popup v-model:show="showClassPicker" position="bottom">
<div class="p-4">
<van-search v-model="classSearchValue" placeholder="搜索班级" @search="searchClass" />
<van-list>
<van-cell v-for="classItem in filteredClasses" :key="classItem.id" :title="classItem.name" is-link
:border="false" @click="onClassSelect(classItem)" />
</van-list>
</div>
</van-popup>
<!-- 小组选择器 -->
<van-popup v-model:show="showGroupPicker" position="bottom">
<div class="p-4">
<van-search v-model="groupSearchValue" placeholder="搜索小组" @search="searchGroup" />
<van-list>
<van-cell v-for="group in filteredGroups" :key="group.id" :title="group.name" is-link :border="false"
@click="onGroupSelect(group)" />
</van-list>
</div>
</van-popup>
</AppLayout>
</template>
<script setup>
......@@ -322,21 +168,23 @@ import { useTitle } from '@vueuse/core';
const $route = useRoute();
const $router = useRouter();
useTitle($route.meta.title || '新增作业');
useTitle($route.query.type === 'homework' ? '设置作业' : '安排打卡');
const type = ref('');
// 表单数据
const formData = ref({
homework_name: '',
type: '',
frequency: '',
target_count: '',
start_time: new Date(),
end_time: new Date(),
course: '',
activity: '',
grade: '',
class_name: '',
group_name: ''
homework_name: '',
type: $route.query.type === 'homework' ? '上传附件' : '签到',
frequency: '',
target_count: '',
start_time: new Date(),
end_time: new Date(),
course: '',
activity: '',
grade: '',
class_name: '',
group_name: ''
});
// 加载状态
......@@ -361,17 +209,17 @@ const maxDate = new Date(2030, 11, 31);
// 选项数据
const typeOptions = ref([
{ text: '签到', value: 'checkin' },
{ text: '作业', value: 'homework' },
{ text: '考试', value: 'exam' },
{ text: '活动', value: 'activity' }
{ text: '签到', value: 'checkin' },
{ text: '作业', value: 'homework' },
{ text: '考试', value: 'exam' },
{ text: '活动', value: 'activity' }
]);
const frequencyOptions = ref([
{ text: '一次', value: 'once' },
{ text: '每日', value: 'daily' },
{ text: '每周', value: 'weekly' },
{ text: '每月', value: 'monthly' }
{ text: '一次', value: 'once' },
{ text: '每日', value: 'daily' },
{ text: '每周', value: 'weekly' },
{ text: '每月', value: 'monthly' }
]);
// 搜索值
......@@ -383,85 +231,85 @@ const groupSearchValue = ref('');
// 数据列表
const courses = ref([
{ id: 1, name: '数学课程' },
{ id: 2, name: '语文课程' },
{ id: 3, name: '英语课程' },
{ id: 4, name: '物理课程' }
{ id: 1, name: '数学课程' },
{ id: 2, name: '语文课程' },
{ id: 3, name: '英语课程' },
{ id: 4, name: '物理课程' }
]);
const activities = ref([
{ id: 1, name: '春游活动' },
{ id: 2, name: '运动会' },
{ id: 3, name: '文艺汇演' },
{ id: 4, name: '科技节' }
{ id: 1, name: '春游活动' },
{ id: 2, name: '运动会' },
{ id: 3, name: '文艺汇演' },
{ id: 4, name: '科技节' }
]);
const grades = ref([
{ id: 1, name: '一年级' },
{ id: 2, name: '二年级' },
{ id: 3, name: '三年级' },
{ id: 4, name: '四年级' }
{ id: 1, name: '一年级' },
{ id: 2, name: '二年级' },
{ id: 3, name: '三年级' },
{ id: 4, name: '四年级' }
]);
const classes = ref([
{ id: 1, name: '一班' },
{ id: 2, name: '二班' },
{ id: 3, name: '三班' },
{ id: 4, name: '四班' }
{ id: 1, name: '一班' },
{ id: 2, name: '二班' },
{ id: 3, name: '三班' },
{ id: 4, name: '四班' }
]);
const groups = ref([
{ id: 1, name: '第一小组' },
{ id: 2, name: '第二小组' },
{ id: 3, name: '第三小组' },
{ id: 4, name: '第四小组' }
{ id: 1, name: '第一小组' },
{ id: 2, name: '第二小组' },
{ id: 3, name: '第三小组' },
{ id: 4, name: '第四小组' }
]);
// 计算属性 - 时间显示格式
const startTimeDisplay = computed(() => {
if (!formData.value.start_time) return '';
return formatDateTime(formData.value.start_time);
if (!formData.value.start_time) return '';
return formatDateTime(formData.value.start_time);
});
const endTimeDisplay = computed(() => {
if (!formData.value.end_time) return '';
return formatDateTime(formData.value.end_time);
if (!formData.value.end_time) return '';
return formatDateTime(formData.value.end_time);
});
// 过滤后的数据
const filteredCourses = computed(() => {
if (!courseSearchValue.value) return courses.value;
return courses.value.filter(course =>
course.name.toLowerCase().includes(courseSearchValue.value.toLowerCase())
);
if (!courseSearchValue.value) return courses.value;
return courses.value.filter(course =>
course.name.toLowerCase().includes(courseSearchValue.value.toLowerCase())
);
});
const filteredActivities = computed(() => {
if (!activitySearchValue.value) return activities.value;
return activities.value.filter(activity =>
activity.name.toLowerCase().includes(activitySearchValue.value.toLowerCase())
);
if (!activitySearchValue.value) return activities.value;
return activities.value.filter(activity =>
activity.name.toLowerCase().includes(activitySearchValue.value.toLowerCase())
);
});
const filteredGrades = computed(() => {
if (!gradeSearchValue.value) return grades.value;
return grades.value.filter(grade =>
grade.name.toLowerCase().includes(gradeSearchValue.value.toLowerCase())
);
if (!gradeSearchValue.value) return grades.value;
return grades.value.filter(grade =>
grade.name.toLowerCase().includes(gradeSearchValue.value.toLowerCase())
);
});
const filteredClasses = computed(() => {
if (!classSearchValue.value) return classes.value;
return classes.value.filter(classItem =>
classItem.name.toLowerCase().includes(classSearchValue.value.toLowerCase())
);
if (!classSearchValue.value) return classes.value;
return classes.value.filter(classItem =>
classItem.name.toLowerCase().includes(classSearchValue.value.toLowerCase())
);
});
const filteredGroups = computed(() => {
if (!groupSearchValue.value) return groups.value;
return groups.value.filter(group =>
group.name.toLowerCase().includes(groupSearchValue.value.toLowerCase())
);
if (!groupSearchValue.value) return groups.value;
return groups.value.filter(group =>
group.name.toLowerCase().includes(groupSearchValue.value.toLowerCase())
);
});
/**
......@@ -470,12 +318,12 @@ const filteredGroups = computed(() => {
* @returns {string} 格式化后的日期时间字符串
*/
const formatDateTime = (date) => {
if (!date) return '';
const d = new Date(date);
const year = d.getFullYear();
const month = String(d.getMonth() + 1).padStart(2, '0');
const day = String(d.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
if (!date) return '';
const d = new Date(date);
const year = d.getFullYear();
const month = String(d.getMonth() + 1).padStart(2, '0');
const day = String(d.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
};
/**
......@@ -483,8 +331,8 @@ const formatDateTime = (date) => {
* @param {Object} option - 选中的选项
*/
const onTypeConfirm = (option) => {
formData.value.type = option.selectedOptions[0].text;
showTypePicker.value = false;
formData.value.type = option.selectedOptions[0].text;
showTypePicker.value = false;
};
/**
......@@ -492,26 +340,26 @@ const onTypeConfirm = (option) => {
* @param {Object} option - 选中的选项
*/
const onFrequencyConfirm = (option) => {
formData.value.frequency = option.selectedOptions[0].text;
showFrequencyPicker.value = false;
formData.value.frequency = option.selectedOptions[0].text;
showFrequencyPicker.value = false;
};
/**
* 开始时间确认
*/
const onStartTimeConfirm = () => {
const [year, month, day] = startDate.value;
formData.value.start_time = new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
showStartTimePicker.value = false;
const [year, month, day] = startDate.value;
formData.value.start_time = new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
showStartTimePicker.value = false;
};
/**
* 结束时间确认
*/
const onEndTimeConfirm = () => {
const [year, month, day] = endDate.value;
formData.value.end_time = new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
showEndTimePicker.value = false;
const [year, month, day] = endDate.value;
formData.value.end_time = new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
showEndTimePicker.value = false;
};
/**
......@@ -519,9 +367,9 @@ const onEndTimeConfirm = () => {
* @param {Object} course - 选中的课程
*/
const onCourseSelect = (course) => {
formData.value.course = course.name;
showCoursePicker.value = false;
courseSearchValue.value = '';
formData.value.course = course.name;
showCoursePicker.value = false;
courseSearchValue.value = '';
};
/**
......@@ -529,9 +377,9 @@ const onCourseSelect = (course) => {
* @param {Object} activity - 选中的活动
*/
const onActivitySelect = (activity) => {
formData.value.activity = activity.name;
showActivityPicker.value = false;
activitySearchValue.value = '';
formData.value.activity = activity.name;
showActivityPicker.value = false;
activitySearchValue.value = '';
};
/**
......@@ -539,9 +387,9 @@ const onActivitySelect = (activity) => {
* @param {Object} grade - 选中的年级
*/
const onGradeSelect = (grade) => {
formData.value.grade = grade.name;
showGradePicker.value = false;
gradeSearchValue.value = '';
formData.value.grade = grade.name;
showGradePicker.value = false;
gradeSearchValue.value = '';
};
/**
......@@ -549,9 +397,9 @@ const onGradeSelect = (grade) => {
* @param {Object} classItem - 选中的班级
*/
const onClassSelect = (classItem) => {
formData.value.class_name = classItem.name;
showClassPicker.value = false;
classSearchValue.value = '';
formData.value.class_name = classItem.name;
showClassPicker.value = false;
classSearchValue.value = '';
};
/**
......@@ -559,9 +407,9 @@ const onClassSelect = (classItem) => {
* @param {Object} group - 选中的小组
*/
const onGroupSelect = (group) => {
formData.value.group_name = group.name;
showGroupPicker.value = false;
groupSearchValue.value = '';
formData.value.group_name = group.name;
showGroupPicker.value = false;
groupSearchValue.value = '';
};
/**
......@@ -569,7 +417,7 @@ const onGroupSelect = (group) => {
* @param {string} value - 搜索值
*/
const searchCourse = (value) => {
courseSearchValue.value = value;
courseSearchValue.value = value;
};
/**
......@@ -577,7 +425,7 @@ const searchCourse = (value) => {
* @param {string} value - 搜索值
*/
const searchActivity = (value) => {
activitySearchValue.value = value;
activitySearchValue.value = value;
};
/**
......@@ -585,7 +433,7 @@ const searchActivity = (value) => {
* @param {string} value - 搜索值
*/
const searchGrade = (value) => {
gradeSearchValue.value = value;
gradeSearchValue.value = value;
};
/**
......@@ -593,7 +441,7 @@ const searchGrade = (value) => {
* @param {string} value - 搜索值
*/
const searchClass = (value) => {
classSearchValue.value = value;
classSearchValue.value = value;
};
/**
......@@ -601,7 +449,7 @@ const searchClass = (value) => {
* @param {string} value - 搜索值
*/
const searchGroup = (value) => {
groupSearchValue.value = value;
groupSearchValue.value = value;
};
/**
......@@ -609,64 +457,64 @@ const searchGroup = (value) => {
* @param {Object} values - 表单值
*/
const handleSubmit = async (values) => {
try {
loading.value = true;
try {
loading.value = true;
// 验证必填项
if (!formData.value.homework_name) {
showToast('请输入作业名称');
return;
}
// 验证必填项
if (!formData.value.homework_name) {
showToast('请输入作业名称');
return;
}
// 这里可以调用API提交数据
console.log('提交的表单数据:', formData.value);
// 这里可以调用API提交数据
console.log('提交的表单数据:', formData.value);
// 模拟API调用
await new Promise(resolve => setTimeout(resolve, 1000));
// 模拟API调用
await new Promise(resolve => setTimeout(resolve, 1000));
showToast('保存成功');
showToast('保存成功');
// 返回上一页或跳转到列表页
$router.back();
// 返回上一页或跳转到列表页
$router.back();
} catch (error) {
console.error('提交失败:', error);
showToast('保存失败，请重试');
} finally {
loading.value = false;
}
} catch (error) {
console.error('提交失败:', error);
showToast('保存失败，请重试');
} finally {
loading.value = false;
}
};
/**
* 组件挂载时初始化数据
*/
onMounted(() => {
// 这里可以调用API获取课程、活动、年级、班级、小组等数据
console.log('页面初始化');
// 这里可以调用API获取课程、活动、年级、班级、小组等数据
console.log('页面初始化');
});
</script>
<style scoped>
/* 自定义样式 */
:deep(.van-field__label) {
color: #333;
font-weight: 500;
color: #333;
font-weight: 500;
}
:deep(.van-field--required .van-field__label::before) {
color: #ee0a24;
color: #ee0a24;
}
:deep(.van-button--primary) {
background: linear-gradient(135deg, #10b981 0%, #059669 100%);
border: none;
background: linear-gradient(135deg, #10b981 0%, #059669 100%);
border: none;
}
:deep(.van-popup) {
border-radius: 16px 16px 0 0;
border-radius: 16px 16px 0 0;
}
:deep(.van-picker__toolbar) {
border-radius: 16px 16px 0 0;
border-radius: 16px 16px 0 0;
}
</style>
......