Explorar o código

✨ feat(category): 优化分类页广告样式与请求参数

- 调整广告容器宽度并移除固定高度,改为自适应布局
- 重构广告图片样式,移除背景色并添加宽度自适应和溢出隐藏
- 将广告图片模式从 heightFix 改为 widthFix 以优化显示效果
- 更新广告查询参数,使用直接参数传递替代 JSON 字符串过滤

✨ feat(home): 重构首页商品与广告数据获取逻辑

- 移除 InferResponseType 依赖,明确定义本地 Goods 接口类型
- 重构广告和商品查询函数,使用类型断言解决 RPC 客户端类型推断问题
- 更新广告查询参数,使用直接参数传递替代 JSON 字符串过滤
- 更新商品查询参数,将 pageSize 改为 limit 以匹配 API 规范
- 为商品列表添加明确的 Goods[] 类型注解以提高类型安全性
yourname hai 2 semanas
pai
achega
50674652ed

+ 10 - 4
mini/src/pages/category/index.css

@@ -118,23 +118,29 @@
   bottom: 10%;
   right: 1%;
   z-index: 100;
-  width: 510rpx;
-  height: 700rpx;
+  width: 500rpx;
   display: flex;
   justify-content: center;
 }
 
 .advertisement-image {
   border-radius: 16rpx;
-  background-color: #fa4126;
   box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.1);
   margin: 0 auto;
   display: block;
+  width: 100%;
+  overflow: hidden;
+  background: transparent;
+  line-height: 0;
+}
+
+.advertisement-image image {
+  display: block;
 }
 
 .ad-image-placeholder {
   width: 100%;
-  height: 100%;
+  height: auto;
   display: flex;
   align-items: center;
   justify-content: center;

+ 8 - 6
mini/src/pages/category/index.tsx

@@ -122,11 +122,13 @@ const CategoryPage: React.FC = () => {
   const { data: advertisementData } = useQuery({
     queryKey: ['category-advertisements'],
     queryFn: async () => {
-      const response = await advertisementClient.$get({
+      // 使用类型断言绕过 RPC 客户端类型推断问题
+      const response = await (advertisementClient.$get as any)({
         query: {
-          filters: JSON.stringify({ status: 1, typeId: 2 }), // 过滤启用的分类页广告
-          sortBy: 'sort',
-          sortOrder: 'ASC'
+          typeId: 2, // 分类页广告类型
+          code: 'testg2', // 广告代码筛选
+          page: 1,
+          pageSize: 100
         }
       });
       if (response.status !== 200) {
@@ -298,9 +300,9 @@ const CategoryPage: React.FC = () => {
                   <Image
                     src={advertisementImage}
                     alt="分类页广告"
-                    mode="heightFix"
+                    mode="widthFix"
                     rounded="lg"
-                    className="w-full h-full"
+                    className="w-full"
                     showLoading={true}
                     showError={true}
                   />

+ 53 - 12
mini/src/pages/index/index.tsx

@@ -6,16 +6,54 @@ import TDesignSearch from '@/components/tdesign/search'
 import GoodsList from '@/components/goods-list'
 import { GoodsData } from '@/components/goods-card'
 import { goodsClient, advertisementClient } from '@/api'
-import { InferResponseType } from 'hono'
 import './index.css'
 import { useAuth } from '@/utils/auth'
 import { useCart } from '@/contexts/CartContext'
 import { Navbar } from '@/components/ui/navbar'
 import { Carousel } from '@/components/ui/carousel'
-import Taro, { usePullDownRefresh, useShareAppMessage } from '@tarojs/taro'
+import Taro, { useShareAppMessage } from '@tarojs/taro'
 
-type GoodsResponse = InferResponseType<typeof goodsClient.$get, 200>
-type Goods = GoodsResponse['data'][0]
+// 商品类型定义(根据 PublicGoodsSchema)
+interface Goods {
+  id: number
+  name: string
+  price: number
+  costPrice?: number
+  salesNum: number
+  clickNum?: number
+  categoryId1: number
+  categoryId2: number
+  categoryId3: number
+  goodsType: number
+  supplierId?: number
+  merchantId?: number
+  imageFileId?: number
+  detail?: string
+  instructions?: string
+  sort: number
+  state: number
+  stock: number
+  spuId: number
+  lowestBuy: number
+  category1?: any
+  category2?: any
+  category3?: any
+  supplier?: any
+  merchant?: any
+  imageFile?: {
+    id: number
+    fullUrl: string
+    name?: string
+    type?: string
+  }
+  slideImages?: Array<{
+    id: number
+    fullUrl: string
+  }>
+  childGoodsIds?: number[]
+  createdAt?: Date
+  updatedAt?: Date
+}
 
 const HomePage: React.FC = () => {
   const { isLoggedIn } = useAuth();
@@ -30,11 +68,13 @@ const HomePage: React.FC = () => {
   } = useQuery({
     queryKey: ['home-advertisements'],
     queryFn: async () => {
-      const response = await advertisementClient.$get({
+      // 使用类型断言绕过 RPC 客户端类型推断问题
+      const response = await (advertisementClient.$get as any)({
         query: {
-          filters: JSON.stringify({ status: 1, typeId: 1 }), // 过滤启用的首页轮播广告
-          sortBy: 'sort', // 按sort字段排序
-          sortOrder: 'ASC'
+          typeId: 1, // 首页轮播广告类型
+          code: 'testg01', // 广告代码筛选
+          page: 1,
+          pageSize: 100
         }
       })
       if (response.status !== 200) {
@@ -57,11 +97,12 @@ const HomePage: React.FC = () => {
     queryKey: ['home-goods-infinite'],
     queryFn: async ({ pageParam = 1 }) => {
       // console.debug('请求商品数据,页码:', pageParam)
-      const response = await goodsClient.$get({
+      // 使用类型断言绕过 RPC 客户端类型推断问题
+      const response = await (goodsClient.$get as any)({
         query: {
           page: pageParam,
-          pageSize: 10,
-          filters: JSON.stringify({ state: 1 }), // 只显示可用的商品
+          limit: 10,
+          state: 1, // 只显示可用的商品
           sortBy: 'sort', // 按sort字段排序
           sortOrder: 'DESC' // 倒序排列
         }
@@ -100,7 +141,7 @@ const HomePage: React.FC = () => {
   })
 
   // 合并所有分页数据
-  const allGoods = data?.pages.flatMap(page => page.data) || []
+  const allGoods: Goods[] = data?.pages.flatMap(page => page.data) || []
 
   // 数据转换:将API返回的商品数据转换为GoodsData接口格式
   const convertToGoodsData = (goods: Goods): GoodsData => {