|
@@ -1,29 +1,26 @@
|
|
|
<script setup lang="ts">
|
|
|
import SectionHeading from '@/components/section-heading.vue'
|
|
|
-import { scheduleCardBg } from '@/core/libs/pngs'
|
|
|
+import { scheduleCardBg } from '../../../core/libs/pngs'
|
|
|
+import { MyStudyTour, StudyTour } from '../../../core/libs/models'
|
|
|
+import { group } from 'radash'
|
|
|
+import dayjs from 'dayjs'
|
|
|
|
|
|
-const props = defineProps({
|
|
|
- customClass: {
|
|
|
- type: String,
|
|
|
- default: () => '',
|
|
|
- },
|
|
|
- options: {
|
|
|
- type: Object,
|
|
|
- default: () => ({
|
|
|
- items: [
|
|
|
- { date: '9:00', title: '早稻田大学课程', desc: '学习灯光设计师课程' },
|
|
|
- { date: '11:00', title: '早稻田大学博物馆参观', desc: '了解博物馆历史' },
|
|
|
- { date: '15:00', title: '早稻田大学设计交流会', desc: '交流学习设计心得' },
|
|
|
- ],
|
|
|
- }),
|
|
|
- },
|
|
|
+const props = withDefaults(defineProps<{ customClass?: string; items?: MyStudyTour[] }>(), {
|
|
|
+ items: () => [],
|
|
|
})
|
|
|
const data = ref()
|
|
|
+const dates = computed(() => {
|
|
|
+ const a = props.items.at(0)?.studyTravelDOList
|
|
|
+ // 使用radash将studyTravelDOList 中的travelTime字段按天分组
|
|
|
+ const b = group(a, (it) => dayjs(it.travelTime).format('YYYY-MM-DD'))
|
|
|
+ console.log(b)
|
|
|
+ return b
|
|
|
+})
|
|
|
const pull = () => {
|
|
|
- data.value = props.options.items.slice(0, 3)
|
|
|
+ data.value = props.items.at(0)?.studyTravelDOList.slice(0, 3)
|
|
|
}
|
|
|
const push = () => {
|
|
|
- data.value = props.options.items.slice(0, 2)
|
|
|
+ data.value = props.items.at(0)?.studyTravelDOList.slice(0, 2)
|
|
|
}
|
|
|
const handleClick = async () => {
|
|
|
uni.navigateTo({ url: '/pages/home/schedule/index' })
|
|
@@ -38,12 +35,16 @@ onMounted(() => {
|
|
|
<div
|
|
|
class="w-full my-3.5 text-[#acacac] text-sm font-normal font-['PingFang_SC'] leading-normal"
|
|
|
>
|
|
|
- 6月26日 第二天
|
|
|
+ <!-- 6月26日 第二天 -->
|
|
|
+ <!-- {{ dates }} -->
|
|
|
+ <!-- {{ items?.at(0)?.studyTravelDOList?.at(0)?.travelTime }} -->
|
|
|
+ {{ Object.keys(dates).at(0) }}
|
|
|
+ 第{{ 1 }}天
|
|
|
</div>
|
|
|
<div
|
|
|
class="w-80 bg-gradient-to-r from-[#141414] to-[#4b4949] rounded-tl-2xl rounded-tr-2xl p-6 box-border"
|
|
|
>
|
|
|
- <template v-for="(it, index) in data" :key="index">
|
|
|
+ <template v-for="(it, index) in Object.values(dates)" :key="index">
|
|
|
<view class="relative mb-4">
|
|
|
<view class="flex items-center">
|
|
|
<div class="w-2 h-2 left-0 top-0 rounded-full border-2 border-solid border-white"></div>
|
|
@@ -51,14 +52,17 @@ onMounted(() => {
|
|
|
<div
|
|
|
class="w-12 ml-3.5 text-white text-base font-normal font-['PingFang_SC'] leading-normal"
|
|
|
>
|
|
|
- 9:00
|
|
|
+ <!-- 9:00 -->
|
|
|
+ {{ dayjs(it.at(0)?.travelTime).format('HH:mm') }}
|
|
|
</div>
|
|
|
<div class="text-white text-base font-normal font-['PingFang_SC'] leading-normal">
|
|
|
- 早稻田大学课程
|
|
|
+ <!-- 早稻田大学课程 -->
|
|
|
+ {{ it.at(0)?.title }}
|
|
|
</div>
|
|
|
</view>
|
|
|
<div class="ml-6.5 text-white/40 text-sm font-normal font-['PingFang_SC'] leading-normal">
|
|
|
- 学习灯光设计师课程
|
|
|
+ <!-- 学习灯光设计师课程 -->
|
|
|
+ {{ it.at(0)?.travelDesc }}
|
|
|
</div>
|
|
|
<div
|
|
|
v-if="index !== data?.length - 1"
|