php
/
ZhiHuiJiaoWu_UniApp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

feat(timetable): 优化课表页面功能和展示 

- 修改学生课程安排接口，增加获取排课日历功能
- 优化课表页面布局和数据展示- 添加日历打点功能，显示有课的日期
-调整课程状态显示逻辑- 修复部分功能，如选择日期后未及时更新数据等问题
master
liutong 10 months ago
parent
21118b5d40
commit
5503e8d44a
2 changed files with 127 additions and 51 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 9
      api/apiRoute.js
  2. 163
      pages/student/timetable/index.vue

9
api/apiRoute.js
View File

@ -515,7 +515,7 @@ export default {
})
},
//学生端-学生课程安排-详情
//学生端-学生课程安排-修改请假状态
xy_personCourseScheduleEditStatus(data = {}) {
let url = '/xy/personCourseSchedule/editStatus'
return http.post(url, data).then(res => {
@ -523,6 +523,13 @@ export default {
})
},
//学生端-学生课程安排-获取排课日历
xy_personCourseScheduleGetCalendar(data = {}) {
let url = '/xy/personCourseSchedule/getCalendar'
return http.get(url, data).then(res => {
return res;
})
},

163
pages/student/timetable/index.vue
View File

@ -12,9 +12,9 @@
<view class="li" v-for="(v,k) in dateList" :key="k" @click="selectDate(v.date)">
<text>{{v.week}}</text>
<text :class="[filteredData.schedule_date == v.date ? 'today':'']">{{today == v.date ? '今':v.today}}</text>
<text :class="[filteredData.course_date == v.date ? 'today':'']">{{today == v.date ? '今':v.today}}</text>
<text :class="[v.status == 2 ?'select_plan':'']"></text>
<text :class="[v.is_sign == 1 ? 'select_plan':'']"></text>
</view>
</view>
<view class="btn" @click="show_calendar=true">
@ -24,7 +24,7 @@
<view class="section_2">
<view class="item_box">
{{venuesInfo.name}}
<text v-if="venuesInfo.id || ''">{{venuesInfo.name}}</text>
</view>
<view class="item_box" style="text-align: right;color: #F59A23;" @click="more">
更多
@ -43,29 +43,31 @@
<view v-for="(v,k) in tableList" :key="k" class="li" @click="openViewCourseInfo(v)">
<view class="top_box">
<view class="center_box">
<view>班级：{{v.classes_name}}</view>
<view>时间：{{v.date}}</view>
<view>课室：{{v.address}}</view>
<view>课程：{{v.courses_name}}</view>
<view>教练：{{v.courseScheduleHasOne.coach.name}}</view>
<view>课程：{{v.courseScheduleHasOne.course.course_name}}</view>
<view>时间：{{v.course_date}}</view>
<view>课室：{{v.courseScheduleHasOne.campus_name}} {{v.courseScheduleHasOne.venue.venue_name}}</view>
</view>
<view class="right_box">
<!-- v.status|1=未开始,2=进行中,3=已结束-->
<view class="tag" :style="{background: v.status == 1 ? '#1cd188' : v.status == 2 ? '#fad24e' : '#ff4d4f'}">
{{ v.status === 1 ? '未开始' : v.status === 2 ? '上课中' : '已结束' }}
<view class="tag"
v-if="v.status != null"
:style="{background: v.status == 1 ? '#1cd188' : v.status == 2 ? '#fad24e' : '#ff4d4f'}">
{{ v.status == 0 ? '待上课' : v.status == 1 ? '已上课' : '请假' }}
</view>
<!-- <view class="tag" style="background:#1cd188;">待上课</view>-->
</view>
</view>
<view class="bottom_box">
<view class="hint">
已签到学生 ({{v.sign_list.length }}/{{v.max_students.split(',').length }})
<!-- 已签到学生 ({{v.sign_list.length }}/{{v.max_students.split(',').length }})-->
</view>
<view class="list_box">
<view class="list">
<view class="itme" v-for="(item,index) in v.sign_list || 0" :key="index">
<image :src="$util.img(item.header)"></image>
</view>
</view>
<!-- <view class="list">-->
<!-- <view class="itme" v-for="(item,index) in v.sign_list || 0" :key="index">-->
<!-- <image :src="$util.img(item.header)"></image>-->
<!-- </view>-->
<!-- </view>-->
<view class="btn">
详情
</view>
@ -99,6 +101,7 @@
</template>
<script>
import apiRoute from '@/api/apiRoute.js';
import memberApi from '@/api/member.js';
import commonApi from '@/api/common.js';
import AQTabber from "@/components/AQ/AQTabber.vue"
@ -114,12 +117,15 @@ export default {
lowerThreshold: 100,//距离底部多远触发
isReachedBottom: false,//防止重复加载|true=不可加载|false=可加载
memberInfo:{},//当前登录的学生详情
//筛选条件
filteredData: {
page: 1,//当前页码
limit: 10,//每页返回数据条数
total: 10,//数据总条数
schedule_date: '',//日期
resources_id:'',//客户资源表id
course_date: '',//上课日期
venue_id: '',//场地id
},
tableList: [],//表格数据
@ -134,7 +140,16 @@ export default {
show_calendar:false,//是否展示日期
startDate:'',//开始日期
endDate:'',//结束日期
calendarSelected: [],//日历打点
calendarSelected: [
// {
// date: '2025-04-07',//需要上课的日期
// },
// {
// date: '2025-04-09',//需要上课的日期
// },
],//日历打点(有课的日期)
}
},
onLoad(options) {
@ -148,27 +163,58 @@ export default {
//下拉刷新
async onPullDownRefresh() {
//重置为第一页
let schedule_date = this.filteredData.schedule_date
let course_date = this.filteredData.course_date
await this.loadData()
this.filteredData.schedule_date = schedule_date
this.filteredData.course_date = course_date
await this.getList()
},
methods: {
//初始化
async init() {
await this.getThisDate()
await this.getHeadDate()
await this.getList()
await this.getMemberInfo()//获取当前登录的学生信息
await this.getThisDate()//获取当前日期
await this.getList()//获取列表
await this.getHeadDate()//获取课程头日期
this.getDateRange()
this.setCalendarSelected()
this.getDateRange()//获取日期范围
this.setCalendarSelected()//设置日期打点
},
//获取当前登录的学生信息
async getMemberInfo() {
let res = await apiRoute.xy_memberInfo({})
if(res.code != 1){
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
this.memberInfo = res.data
this.filteredData.resources_id = res.data.id
},
//获取课程头日期
async getHeadDate() {
let res = await commonApi.getDate()
// 计算开始日期：从今天往前推2天
let startDate = new Date();
startDate.setDate(startDate.getDate() - 2);
let start_date = startDate.toISOString().split('T')[0];
// 计算结束日期：从今天往后推4天
let endDate = new Date();
endDate.setDate(endDate.getDate() + 4);
let end_date = endDate.toISOString().split('T')[0];
let params = {
resources_id: this.memberInfo.id, // 客户资源ID
start_date: start_date, // 开始日期(Y-m-d)
end_date: end_date, // 结束日期(Y-m-d)
}
let res = await apiRoute.xy_personCourseScheduleGetCalendar(params)
if (res.code != 1) {
//提示
uni.showToast({
@ -180,12 +226,12 @@ export default {
this.dateList = []
res.data.forEach((v, k) => {
let today = v.date.split("-")[2]; // "09"
this.dateList.push({
date: v.date,
status: v.status,//1是正常 2请假
week: v.week,
today: today,
today: v.today,
is_sign: v.is_sign,
})
})
@ -206,15 +252,15 @@ export default {
let res = `${year}-${month}-${day}`; // 格式化日期
this.today = res;
this.filteredData.schedule_date = res;
this.filteredData.course_date = res;
},
//加载更过(下一页)
loadMoreData() {
async loadMoreData() {
//判断是否加载
if (!this.isReachedBottom) {
this.isReachedBottom = true;//设置为不可请求状态
this.getList();
await this.getList();
}
},
//重置为第一页
@ -230,6 +276,9 @@ export default {
this.loading = true
let data = {...this.filteredData}
if(this.filteredData.page == 1){
this.tableList = []
}
//判断是否还有数据
if ((this.filteredData.page - 1) * this.filteredData.limit >= this.filteredData.total) {
@ -241,7 +290,7 @@ export default {
return
}
let res = await memberApi.courseList(data)
let res = await apiRoute.xy_personCourseSchedule(data)
this.loading = false
this.isReachedBottom = false;
if (res.code != 1) {
@ -252,18 +301,19 @@ export default {
return
}
this.tableList = res.data.list.data
this.tableList = this.tableList.concat(res.data.data); // 使用 concat 方法 将新数据追加到数组中
//场地信息
this.venuesInfo = res.data.venues_info
this.filteredData.total = res.data.list.total
this.filteredData.total = res.data.total
this.filteredData.page++
},
//选择日期
async selectDate(date) {
this.loadData()
this.filteredData.schedule_date = date
this.filteredData.course_date = date
this.getList()
},
@ -296,25 +346,43 @@ export default {
//设置日期打点
async setCalendarSelected(){
//获取当前月份
let month = new Date().getMonth() + 1;
const today = new Date(); // 获取当前日期
const year = today.getFullYear(); // 获取年份
const month = today.getMonth(); // 获取月份（0-11）
let res = await commonApi.getMonthDate({month:month})
if (res.code != 1){
//提示
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
})
return
// 计算本月第一天
const firstDay = new Date(year, month, 1);
// 计算本月最后一天（下个月的第一天减去1天）
const lastDay = new Date(year, month + 1, 0);
// 格式化日期为 YYYY-MM-DD
const formatDate = (date) => {
const y = date.getFullYear();
const m = String(date.getMonth() + 1).padStart(2, '0'); // 月份补零
const d = String(date.getDate()).padStart(2, '0'); // 日期补零
return `${y}-${m}-${d}`;
};
let start_date = formatDate(firstDay); // 本月第一天
let end_date = formatDate(lastDay); // 本月最后一天
let params = {
resources_id: this.memberInfo.id, // 客户资源ID
start_date: start_date, // 开始日期(Y-m-d)
end_date: end_date, // 结束日期(Y-m-d)
}
let res = await apiRoute.xy_personCourseScheduleGetCalendar(params)
this.calendarSelected = []
res.data.forEach((v,k)=>{
if(v.is_sign == 1){
this.calendarSelected.push({
date: v.date,
})
}
})
// this.calendarSelected = [
// {
// date: '2025-04-07',
@ -334,20 +402,21 @@ export default {
console.log('日历',e)
this.show_calendar = false
this.loadData()
this.filteredData.schedule_date = e.fulldate
this.filteredData.course_date = e.fulldate
this.getList()
},
//打开课表详情页
openViewCourseInfo(item) {
let person_course_schedule_id = item.id
uni.navigateTo({
url: `/pages/student/timetable/info?id=${item.id}`
url: `/pages/student/timetable/info?person_course_schedule_id=${person_course_schedule_id}`
})
},
//体育馆列表
more() {
let schedule_date = this.filteredData.schedule_date
let schedule_date = this.filteredData.course_date
let venue_id = this.venuesInfo.id//当前场馆id
uni.navigateTo({
url: `/pages/student/timetable/list?schedule_date=${schedule_date}&venue_id=${venue_id}`

Write Preview
Loading…
Cancel
Save