refactor: 重构项目并新增多项功能

1. 新增全局配置管理store，拉取uni-halo插件配置 2. 新增post-card文章卡片组件，简化首页文章列表代码 3. 优化tabbar样式与切换逻辑，调整图标库类型 4. 新增随机图片工具函数，重构首页横幅与分类模块 5. 调整openapi生成配置，新增工具类与样式类 6. 移除废弃的tabbar关于页面配置项
2026-07-27 04:20:43 +08:00 · 2026-06-12 14:32:21 +08:00
parent c847dfb1c4
commit f105dedc23
11 changed files with 293 additions and 78 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>