fix(app): 优化设计游学

packages/app/src/components/moment-item.vue

@@ -1,7 +1,6 @@
 <script lang="ts" setup>
 import Card from '@/components/card.vue'
 import dayjs from 'dayjs'
-import TiltedButton from './tilted-button.vue'
 import { beforeNow } from '../utils/date-util'
 import Tag from './tag.vue'
 import { stringify } from 'qs'
@@ -59,7 +58,7 @@ const toDetail = () => {
 
 onMounted(async () => {
   // console.log('加载')
-  if (props.options.bannerUrls.length === 1) {
+  if (props.options.bannerUrls?.length === 1) {
     const { width, height } = await uni.getImageInfo({
       src: props.options.bannerUrls[0],
     })
@@ -90,14 +89,14 @@ onMounted(async () => {
     </view>
     <view
       :class="[
-        props.options.bannerUrls.length > 1 ? 'grid grid-cols-3 grid-gap-1' : 'w-full',
+        props.options.bannerUrls?.length > 1 ? 'grid grid-cols-3 grid-gap-1' : 'w-full',
         'my-6',
       ]"
     >
       <template v-for="it of props.options.bannerUrls" :key="it">
         <view
           :class="[
-            props.options.bannerUrls.length > 1 ? 'aspect-square' : '',
+            props.options.bannerUrls?.length > 1 ? 'aspect-square' : '',
             'rounded-lg overflow-hidden',
             imgClass,
           ]"
@@ -106,8 +105,8 @@ onMounted(async () => {
             custom-class="vertical-bottom"
             :width="'100%'"
             :src="it"
-            :height="props.options.bannerUrls.length > 1 ? '100%' : 'auto'"
-            :mode="props.options.bannerUrls.length > 1 ? 'aspectFill' : 'widthFix'"
+            :height="props.options.bannerUrls?.length > 1 ? '100%' : 'auto'"
+            :mode="props.options.bannerUrls?.length > 1 ? 'aspectFill' : 'widthFix'"
           ></wd-img>
         </view>
       </template>

packages/app/src/components/section-heading.vue

@@ -31,6 +31,10 @@ const props = defineProps({
     type: Boolean,
     default: () => false,
   },
+  endClass: {
+    type: String,
+    default: '',
+  },
 })
 const handleMore = async () => {
   props.path && (await uni.navigateTo({ url: props.path }))
@@ -57,7 +61,13 @@ const handleMore = async () => {
     <div class="overflow-hidden flex-1">
       <slot name="start"></slot>
     </div>
-    <div class="flex items-center gap-1 text-right text-black/30 text-sm font-normal leading-tight">
+    <template v-if="$slots.append">
+      <slot name="append"></slot>
+    </template>
+    <div
+      v-else
+      class="flex items-center gap-1 text-right text-black/30 text-sm font-normal leading-tight"
+    >
       <template v-if="endText ?? '' !== ''">{{ endText }}</template>
       <template v-if="path || endArrow">
         <wd-img :src="right" width="12" height="12"></wd-img>

packages/app/src/pages/home/index.vue

@@ -98,9 +98,9 @@ onShareAppMessage(() => ({}))
     <view class="bg-[#f6f6f6] relative bottom-4 rounded-t-2xl py-1">
       <!-- <ScheduleCard custom-class="my-6 mx-3.5"></ScheduleCard> -->
       <menus></menus>
-      <view class="my-6 mx-3.5">
+      <!-- <view class="my-6 mx-3.5">
         <HotActivity></HotActivity>
-      </view>
+      </view> -->
       <view class="my-6 mx-3.5" @click="toAbout()">
         <Card>
           <div class="flex items-center gap-2">

packages/app/src/pages/home/study-tour/components/time-line.vue

@@ -0,0 +1,60 @@
+<script lang="ts" setup>
+import SectionHeading from '@/components/section-heading.vue'
+const data = ref([{ title: '意大利' }, { title: '日本' }, { title: '苏州' }, { title: '北京' }])
+const current = ref(0)
+</script>
+<template>
+  <div
+    class="relative flex flex-col justify-between aspect-[1.73/1] box-border pt-3 pb-6 px-6 bg-[url(https://image.zhuchaohui.com/zhucaohui/582dbfa59a3dc840839322108ae52adf6e9665b40f34dfbfd553ab8cf55af11f.png)] bg-[length:100%]"
+  >
+    <SectionHeading
+      title="游学时间表"
+      end-text="查看全部"
+      end-class="text-white!"
+      path="/pages/home/study-tour/list"
+    >
+      <template #append>
+        <div class="flex items-center">
+          <div class="text-right text-white text-xs font-normal font-['PingFang SC']">查看全部</div>
+          <wd-icon name="arrow-right" color="#ffffff" size="12"></wd-icon>
+        </div>
+      </template>
+    </SectionHeading>
+    <div class="overflow-x-auto whitespace-nowrap">
+      <template v-for="(it, i) in data" :key="i">
+        <div class="inline-block w-[calc(25%-0rpx)] box-border">
+          <div class="flex flex-col gap-2 items-center">
+            <div class="text-black/40 text-sm font-normal font-['PingFang SC'] leading-[10.18px]">
+              3月
+            </div>
+            <div class="w-full flex items-center">
+              <div class="h-0.5 flex-1 bg-[#d9d9d9]"></div>
+              <div class="w-[13px] h-[13px] relative">
+                <div
+                  class="w-[13px] h-[13px] left-0 top-0 absolute bg-[#d9d9d9] rounded-full"
+                ></div>
+                <div
+                  class="w-[7px] h-[7px] left-[3px] top-[3px] absolute rounded-full"
+                  :class="[i === current ? 'bg-black' : 'bg-[#999]']"
+                ></div>
+              </div>
+              <div class="h-0.5 flex-1 bg-[#d9d9d9]"></div>
+            </div>
+            <div
+              class="text-sm font-normal leading-[10.18px]"
+              :class="[i === current ? 'text-black' : 'text-black/40']"
+            >
+              {{ it.title }}
+            </div>
+            <div
+              class="px-2 py-1 bg-[#eaeaea] rounded justify-center items-center gap-2.5 inline-flex"
+              :class="[i === current ? 'bg-black text-white' : 'text-black/40']"
+            >
+              <div class="text-xs font-normal">已结束</div>
+            </div>
+          </div>
+        </div>
+      </template>
+    </div>
+  </div>
+</template>

packages/app/src/pages/home/study-tour/index.vue

@@ -1,7 +1,10 @@
-<route lang="yaml">
-style:
-  navigationBarTitleText: 设计游学
-  navigationBarBackgroundColor: '#fff'
+<route lang="json">
+{
+  "style": {
+    "navigationBarTitleText": "设计游学",
+    "navigationBarBackgroundColor": "#fff"
+  }
+}
 </route>
 <script lang="ts" setup>
 import AvatarGroupCasual from '@/components/avatar-group-casual/avatar-group-casual.vue'
@@ -10,17 +13,18 @@ import MomentItem from '@/components/moment-item.vue'
 import SectionHeading from '@/components/section-heading.vue'
 import TiltedButton from '@/components/tilted-button.vue'
 import ClassItem from '../components/class-item.vue'
+import TimeLine from './components/time-line.vue'
 
 const toList = () => {
   uni.navigateTo({ url: '/pages/home/study-tour/list' })
 }
 </script>
 <template>
-  <view class="px-3.5">
-    <view class="my-6" @click="toList">
-      <card class="">查看全部</card>
-    </view>
-    <card custom-class="my-6 p-0!">
+  <view class="flex-grow flex flex-col gap-6 p-3.5">
+    <div class="mx--2.5 mb--2.5">
+      <TimeLine></TimeLine>
+    </div>
+    <card custom-class="p-0!">
       <view class="relative">
         <wd-img
           custom-class="vertical-bottom"
@@ -79,7 +83,7 @@ const toList = () => {
         </view>
       </div>
     </card>
-    <card custom-class="my-6">
+    <card custom-class="">
       <div class="my-7.5 text-black text-xl font-normal font-['PingFang SC'] leading-[10.18px]">
         筑巢荟-设计游学
       </div>

packages/app/src/pages/material/detail/index.vue

@@ -178,7 +178,7 @@ onLoad(async (query: { id: number }) => {
               height="100%"
               :src="materialHomePageData.brandAdvantageUrl"
               mode="aspectFill"
-              custom-class="aspect-[1.72/1] "
+              custom-class="aspect-[1.72/1]"
             ></wd-img>
           </div>
           <div class="text-black/90 text-base font-normal font-['PingFang SC'] leading-[10.18px]">

packages/app/src/pages/mine/setting/index.vue

@@ -51,7 +51,7 @@ const handleChooseAvatar = async ({ detail: { avatarUrl } }) => {
           width="97"
           height="97"
           :src="
-            (userInfo.avatar ?? '' === '') ? 'https://via.placeholder.com/97x97' : userInfo.avatar
+            (userInfo.avatar ?? '') === '' ? 'https://via.placeholder.com/97x97' : userInfo.avatar
           "
           custom-class="border border-white border-solid"
         ></wd-img>