feat(classmates): 同学荟详情

.gitignore

@@ -11,6 +11,7 @@ node_modules
 .DS_Store
 dist
 *.local
+.yalc
 
 # Editor directories and files
 .idea

src/core/libs/requests.ts

@@ -101,5 +101,17 @@ export const getClassmates = () =>
       avatar: 'https://via.placeholder.com/35x35',
     },
   ])
+export const getClassmate = () =>
+  httpGetMock<any>({
+    title: '2023同学荟|清华空间环境艺术设计研修班 阔步向未来',
+    author: {
+      avatar: 'https://via.placeholder.com/35x35',
+      nickname: '苏小萌',
+      level: '0',
+    },
+    viewNum: 125,
+    createdAt: dayjs('2024-07-15').toDate(),
+    content: '<div>111111</div>',
+  })
 export const httpGetMock = <T>(data: T) =>
   new Promise<IResData<T>>((resolve) => resolve({ code: 1, msg: '', data } as IResData<T>))

src/pages.json

@@ -95,6 +95,14 @@
       }
     },
     {
+      "path": "pages/home/classmates-detail/index",
+      "type": "page",
+      "style": {
+        "navigationBarTitleText": "详情",
+        "navigationBarBackgroundColor": "#fff"
+      }
+    },
+    {
       "path": "pages/home/mall/index",
       "type": "page",
       "style": {

src/pages/home/classmates-detail/index.vue

@@ -0,0 +1,22 @@
+<route lang="yaml">
+style:
+  navigationBarTitleText: '详情'
+  navigationBarBackgroundColor: '#fff'
+</route>
+<script setup lang="ts">
+import { getClassmate, getMoment } from '@/core/libs/requests'
+import Article from '../components/article.vue'
+// import { Article } from '@pandora/ui'
+
+const { data, run } = useRequest(getClassmate)
+onMounted(run)
+</script>
+<template>
+  <!-- <view> -->
+  <Article :title="data?.title" :content="data?.content">
+    <template #avatar>1111</template>
+  </Article>
+
+  <!-- <SButton></SButton> -->
+  <!-- </view> -->
+</template>

src/pages/home/components/article.vue

@@ -0,0 +1,54 @@
+<script setup lang="ts">
+import dayjs from 'dayjs'
+
+defineProps({
+  title: {
+    type: String,
+    default: '',
+  },
+  author: {
+    type: Object,
+    default: () => ({ name: '匿名' }),
+  },
+  createdAt: {
+    type: Date,
+    default: () => new Date(),
+  },
+  viewNum: {
+    type: Number,
+    default: 0,
+  },
+  content: {
+    type: String,
+    default: '<div>1111</div>',
+  },
+})
+</script>
+<template>
+  <div class="px-3.5 bg-white flex-grow">
+    <div class="text-black text-xl font-normal font-['PingFang SC'] leading-loose">
+      {{ title }}
+    </div>
+    <div class="flex items-center my-5">
+      <div class="w-7 h-7 overflow-hidden roudnded-full">
+        <slot name="avatar"></slot>
+      </div>
+      <div class="flex-1 ml-1">
+        <div class="text-black/90 text-sm font-normal font-['PingFang SC'] leading-normal">
+          {{ author.name }}
+        </div>
+        <div class="text-black/40 text-xs font-normal font-['PingFang SC'] leading-normal">
+          编辑于
+          {{ dayjs(createdAt).format('YYYY/MM/DD') }}
+        </div>
+      </div>
+      <div class="flex items-center">
+        <slot name="viewLeft"></slot>
+        <div class="text-black/40 text-xs font-normal font-['PingFang SC'] leading-normal">
+          {{ viewNum }}
+        </div>
+      </div>
+    </div>
+    <div v-html="content"></div>
+  </div>
+</template>

src/pages/home/components/class-item.vue

@@ -11,9 +11,12 @@ defineProps({
     default: () => '',
   },
 })
+const handleClick = async () => {
+  await uni.navigateTo({ url: '/pages/home/classmates-detail/index' })
+}
 </script>
 <template>
-  <view class="my-6 relative h-43 flex items-end" :class="[customClass]">
+  <view class="my-6 relative h-43 flex items-end" :class="[customClass]" @click="handleClick">
     <view class="absolute left-0 bottom-0 rounded-2xl overflow-hidden">
       <wd-img
         custom-class="vertical-bottom"

src/types/auto-import.d.ts

@@ -106,7 +106,6 @@ declare module 'vue' {
     readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
     readonly getCurrentInstance: UnwrapRef<typeof import('vue')['getCurrentInstance']>
     readonly getCurrentScope: UnwrapRef<typeof import('vue')['getCurrentScope']>
-    readonly h: UnwrapRef<typeof import('vue')['h']>
     readonly inject: UnwrapRef<typeof import('vue')['inject']>
     readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
     readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
@@ -189,7 +188,6 @@ declare module '@vue/runtime-core' {
     readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
     readonly getCurrentInstance: UnwrapRef<typeof import('vue')['getCurrentInstance']>
     readonly getCurrentScope: UnwrapRef<typeof import('vue')['getCurrentScope']>
-    readonly h: UnwrapRef<typeof import('vue')['h']>
     readonly inject: UnwrapRef<typeof import('vue')['inject']>
     readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
     readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>

src/types/uni-pages.d.ts

@@ -11,6 +11,7 @@ interface NavigateToOptions {
        "/pages/mine/index" |
        "/pages/publish/index" |
        "/pages/home/classmates/index" |
+       "/pages/home/classmates-detail/index" |
        "/pages/home/mall/index" |
        "/pages/home/moment/index" |
        "/pages/home/offline-activity/index" |

vite.config.ts

@@ -82,6 +82,7 @@ export default ({ command, mode }) => {
         dirs: ['src/hooks'], // 自动导入 hooks
         eslintrc: { enabled: true },
         vueTemplate: true, // default false
+        ignore: ['h'],
       }),
 
       ViteRestart({

yalc.lock

@@ -0,0 +1,8 @@
+{
+  "version": "v1",
+  "packages": {
+    "@pandora/ui": {
+      "signature": "3bad5eee532e41648235669f006de1c3"
+    }
+  }
+}