106 lines
3.1 KiB
Vue
106 lines
3.1 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
import type { CourseModel } from '~/stores/modules/course'
|
|
import CourseActionSheet from '~/components/timetable/CourseActionSheet.vue'
|
|
import TimetableContent from '~/components/timetable/TimetableContent.vue'
|
|
import UBasePage from '~/components/UnoUI/UBasePage/UBasePage.vue'
|
|
|
|
import { useAppStore } from '~/stores/modules/app'
|
|
import { usePageStore } from '~/stores/modules/page'
|
|
import { useCourseStore } from '~/stores/modules/course'
|
|
|
|
const { customBarHeight, statusBarHeight, classinfo } = storeToRefs(useAppStore())
|
|
const { setPageConfig } = usePageStore()
|
|
const { currentWeekIndex, isStart } = storeToRefs(useCourseStore())
|
|
const {
|
|
getCourseList,
|
|
setStartDay,
|
|
} = useCourseStore()
|
|
|
|
onShow(() => {
|
|
setPageConfig({ showNavBar: false })
|
|
})
|
|
|
|
setStartDay()
|
|
const showCourseAction = ref(false)
|
|
|
|
function handleCreateCourse() {
|
|
uni.navigateTo({
|
|
url: '/pages/course/detail',
|
|
})
|
|
}
|
|
|
|
// handle course item click
|
|
const showActionSheet = ref(false)
|
|
const clickedCourseItem = ref<CourseModel>()
|
|
function handleShowActionSheet(courseItem: CourseModel) {
|
|
showActionSheet.value = true
|
|
clickedCourseItem.value = courseItem
|
|
}
|
|
|
|
function handleCloseActionSheet() {
|
|
showActionSheet.value = false
|
|
}
|
|
|
|
const onFabClick = async () => {
|
|
uni.showModal({
|
|
cancelText: '取消',
|
|
confirmText: '确认',
|
|
title: '刷新课表?',
|
|
content: '是否在线刷新课表，确认后将会覆盖课表',
|
|
success: async () => {
|
|
if (classinfo.value) {
|
|
await getCourseList(classinfo.value.value)
|
|
}
|
|
else {
|
|
uni.showToast({
|
|
icon: 'error',
|
|
title: '请先配置班级~',
|
|
})
|
|
}
|
|
},
|
|
})
|
|
}
|
|
const formattedWeek = computed(() => {
|
|
return `第${currentWeekIndex.value + 1}周${!isStart.value ? '(未开学)' : ''}`
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<UBasePage>
|
|
<view
|
|
class="bg-primary text-white w-full top-0 z-200 fixed font-bold"
|
|
:style="{ height: `${customBarHeight}px` }"
|
|
>
|
|
<view
|
|
:style="{
|
|
'padding-top': `${statusBarHeight}px`,
|
|
'height': `${customBarHeight - statusBarHeight}px`,
|
|
}"
|
|
>
|
|
<view class="h-full text-center px-6 relative">
|
|
<view class="h-full text-xl left-4 i-carbon-add absolute" @click="handleCreateCourse" />
|
|
<view
|
|
class="flex h-full mx-auto justify-center items-center inline-block text-lg"
|
|
@click="showCourseAction = !showCourseAction"
|
|
>
|
|
{{ formattedWeek }}
|
|
<view
|
|
class="transition-transform duration-300 i-carbon-chevron-up"
|
|
:class="showCourseAction ? 'rotate-180' : 'rotate-0'"
|
|
/>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- timetable main content -->
|
|
<TimetableContent :show-course-action="showCourseAction" @course-item-click="handleShowActionSheet" />
|
|
<!-- course card -->
|
|
<CourseActionSheet
|
|
:show-action-sheet="showActionSheet" :course-item="clickedCourseItem"
|
|
@cancel="handleCloseActionSheet"
|
|
/>
|
|
</UBasePage>
|
|
<uni-fab horizontal="right" :pattern="{ icon: 'loop' }" @fab-click="onFabClick" />
|
|
</template>
|