refactor: 项目重构适配uni-halo，拆分首页组件

1. 统一环境变量前缀为VITE_UNI_HALO_BASEURL，替换原有VITE_SERVER_BASEURL 2. 新增首页home页面，将原index页面作为启动页跳转首页 3. 新增多个业务组件：模板组件、个人资料卡片、分类推荐卡片、文章卡片 4. 新增图片处理工具、数字格式化工具、URL验证工具 5. 重构tabbar配置，修正首页跳转路径 6. 更新站点统计API方法命名，优化请求逻辑
2026-07-27 04:20:43 +08:00 · 2026-06-12 15:48:58 +08:00
parent f105dedc23
commit d8ad0772bf
23 changed files with 491 additions and 338 deletions
@@ -0,0 +1,115 @@
+<script setup lang="ts">
+import { completeUrl } from '@/utils/url'
+import { timeFrom } from '@/utils/base/timeFrom'
+import type { ListedPostVo } from '@halo-dev/api-client'
+
+interface IProps {
+  post?: ListedPostVo
+  type?: 'default' | 'topCover' | 'rightCover'
+}
+
+const props = withDefaults(defineProps<IProps>(), {
+  type: 'default',
+  post: undefined,
+})
+
+const wrapClass = computed(() => {
+  if (props.type === 'topCover') {
+    return 'flex-col gap-y-4'
+  }
+  if (props.type === 'rightCover') {
+    return 'relative h-28 p-0! border-2 border-solid border-white'
+  }
+  return ''
+})
+
+const coverClass = computed(() => {
+  if (props.type === 'topCover') {
+    return 'h-32 w-full'
+  }
+  if (props.type === 'rightCover') {
+    return 'absolute right-0 top-0 bottom-0 w-32 rounded-lt-0 rounded-lb-0'
+  }
+  return 'h-22 w-22'
+})
+
+const textWrapClass = computed(() => {
+  if (props.type === 'topCover') {
+    return ''
+  }
+  if (props.type === 'rightCover') {
+    return 'p-4 pr-32 relative z-10'
+  }
+  return 'pl-4'
+})
+
+const textContainerClass = computed(() => {
+  if (props.type === 'topCover') {
+    return 'gap-y-2'
+  }
+  if (props.type === 'rightCover') {
+    return ''
+  }
+  return ''
+})
+
+const textFooterClass = computed(() => {
+  if (props.type === 'topCover') {
+    return 'justify-between gap-x-2'
+  }
+  if (props.type === 'rightCover') {
+    return 'gap-x-2'
+  }
+  return 'gap-x-2'
+})
+</script>
+
+<template>
+  <view v-if="post" class="uh-shadow-xs flex justify-center overflow-hidden rounded-2xl bg-white p-4" :class="wrapClass">
+    <view class="shrink-0 overflow-hidden rounded-lg" :class="coverClass">
+      <image :src="completeUrl(post.spec.cover)" mode="aspectFill" class="h-full w-full" />
+      <view v-if="props.type === 'rightCover'" class="absolute bottom-0 left-0 top-0 z-10 h-full w-full from-white/0 via-white/10 to-white bg-gradient-to-l" />
+    </view>
+    <view class="box-border flex-1" :class="textWrapClass">
+      <view class="h-full flex flex-1 flex-col justify-between" :class="textContainerClass">
+        <view class="line-clamp-1 text-sm text-gray-900 font-bold">
+          {{ post.spec.title }}
+        </view>
+        <view class="line-clamp-2 text-xs text-gray-500">
+          {{ post.status.excerpt }}
+        </view>
+        <view class="w-full flex items-center" :class="textFooterClass">
+          <view class="text-[11px] text-gray-600">
+            {{ timeFrom(post.spec.publishTime) }}
+          </view>
+          <view class="shrink-0 text-xs text-gray-600">
+            ·
+          </view>
+          <view class="line-clamp-1 text-[11px] text-gray-600">
+            {{ post.categories.map(c => c.spec.displayName).join('·') }}
+          </view>
+          <template v-if="props.type === 'topCover'">
+            <view class="shrink-0 text-xs text-gray-600">
+              ·
+            </view>
+            <view class="text-[11px] text-gray-600">
+              点赞 {{ post.stats.upvote }} 次
+            </view>
+          </template>
+          <view class="shrink-0 text-xs text-gray-600">
+            ·
+          </view>
+          <view class="text-[11px] text-gray-600">
+            浏览 {{ post.stats.visit }} 次
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+.uh-shadow-xs {
+  box-shadow: 0 0 24rpx rgba(0, 0, 0, 0.035);
+}
+</style>