ソースを参照

fix(order-api): 修复RPC类型推断语法错误并添加hono依赖

- 修复types.ts中的InferResponseType/InferRequestType语法错误:将.property改为['property']格式
- 添加hono依赖到package.json,支持RPC类型推断
- 移除不存在的接口类型,仅保留实际存在的企业专用API类型
- 更新故事文档,添加RPC类型推断实现说明
- 导出types.ts文件,供订单详情页使用

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
yourname 3 週間 前
コミット
61f1efeb14

+ 29 - 0
docs/stories/011.004.story.md

@@ -235,6 +235,35 @@ Ready for Review
   - `PUT /videos/{id}/status` - 更新视频审核状态接口(支持pending/verified/rejected状态更新)
   - `GET /video-statistics` - 视频统计接口(分类统计、类型分布)
 
+### RPC类型推断实现
+参考 `allin-packages/disability-person-management-ui/src/api/types.ts` 的实现模式,使用Hono的类型推导工具 `InferResponseType` 和 `InferRequestType` 从API客户端自动推导请求和响应类型,避免手动定义重复的自定义类型。
+
+**实现示例**:
+```typescript
+import type { InferResponseType, InferRequestType } from 'hono/client';
+import { enterpriseOrderClient } from './enterpriseOrderClient';
+
+// 使用Hono类型推导
+export type OrderDetailResponse = InferResponseType<typeof enterpriseOrderClient.detail[':id'].$get, 200>;
+export type OrderListResponse = InferResponseType<typeof enterpriseOrderClient['company-orders'].$get, 200>;
+export type OrderData = InferResponseType<typeof enterpriseOrderClient['company-orders'].$get, 200>['data'][0];
+
+export type CreateOrderRequest = InferRequestType<typeof enterpriseOrderClient.create.$post>['json'];
+export type UpdateOrderRequest = InferRequestType<typeof enterpriseOrderClient.update[':id'].$put>['json'];
+
+// 分页响应类型(通用)
+export type PaginatedResponse<T> = {
+  data: T[];
+  total: number;
+};
+```
+
+**优势**:
+- 类型安全:自动与后端路由类型保持同步
+- 减少重复:避免手动定义重复的类型定义
+- 维护性:后端路由变更时,前端类型自动更新
+- 一致性:确保请求/响应类型与API契约完全匹配
+
 **技术集成**:
 - **RPC客户端工具**:使用`@d8d/mini-shared-ui-components/utils/rpc/rpc-client`提供的RPC客户端工具,在UI包内创建企业专用API客户端
 - **企业专用API路径前缀**:`api/v1/yongren`

+ 1 - 0
mini-ui-packages/yongren-order-management-ui/package.json

@@ -44,6 +44,7 @@
     "@tarojs/react": "4.1.4",
     "@tarojs/taro": "4.1.4",
     "@tanstack/react-query": "^5.90.12",
+    "hono": "^4.8.5",
     "react": "^18.0.0",
     "react-dom": "^18.0.0"
   },

+ 2 - 1
mini-ui-packages/yongren-order-management-ui/src/api/index.ts

@@ -1,3 +1,4 @@
 // API客户端导出
 export * from './orderClient'
-export * from './enterpriseOrderClient'
+export * from './enterpriseOrderClient'
+export * from './types'

+ 30 - 0
mini-ui-packages/yongren-order-management-ui/src/api/types.ts

@@ -0,0 +1,30 @@
+import type { InferResponseType, InferRequestType } from 'hono/client';
+import { enterpriseOrderClient } from './enterpriseOrderClient';
+
+// 订单列表查询参数类型(企业专用)
+export type CompanyOrdersQueryParams = InferRequestType<typeof enterpriseOrderClient['company-orders']['$get']>['query'];
+
+// 分页响应类型
+export type PaginatedResponse<T> = {
+  data: T[];
+  total: number;
+};
+
+// 使用Hono类型推导
+export type OrderDetailResponse = InferResponseType<typeof enterpriseOrderClient.detail[':id']['$get'], 200>;
+export type OrderListResponse = InferResponseType<typeof enterpriseOrderClient['company-orders']['$get'], 200>;
+export type OrderData = InferResponseType<typeof enterpriseOrderClient['company-orders']['$get'], 200>['data'][0];
+
+
+// 企业专用扩展API
+export type CheckinStatisticsResponse = InferResponseType<typeof enterpriseOrderClient['checkin-statistics']['$get'], 200>;
+export type VideoStatisticsResponse = InferResponseType<typeof enterpriseOrderClient['video-statistics']['$get'], 200>;
+export type CompanyVideosResponse = InferResponseType<typeof enterpriseOrderClient['company-videos']['$get'], 200>;
+export type BatchDownloadRequest = InferRequestType<typeof enterpriseOrderClient['batch-download']['$post']>['json'];
+export type UpdateVideoStatusRequest = InferRequestType<typeof enterpriseOrderClient.videos[':id']['status']['$put']>['json'];
+
+// 查询参数类型
+export type CheckinStatisticsParams = InferRequestType<typeof enterpriseOrderClient['checkin-statistics']['$get']>['query'];
+export type VideoStatisticsParams = InferRequestType<typeof enterpriseOrderClient['video-statistics']['$get']>['query'];
+export type CompanyVideosParams = InferRequestType<typeof enterpriseOrderClient['company-videos']['$get']>['query'];
+export type BatchDownloadParams = InferRequestType<typeof enterpriseOrderClient['batch-download']['$post']>['json'];

+ 1 - 0
mini-ui-packages/yongren-order-management-ui/src/pages/OrderDetail/OrderDetail.tsx

@@ -4,6 +4,7 @@ import Taro from '@tarojs/taro'
 import { useQuery } from '@tanstack/react-query'
 import { Navbar } from '@d8d/mini-shared-ui-components/components/navbar'
 import { enterpriseOrderClient } from '../../api'
+import type { OrderDetailResponse, CompanyVideosResponse, CheckinStatisticsResponse, VideoStatisticsResponse } from '../../api'
 
 
 interface OrderDetailData {

+ 3 - 0
pnpm-lock.yaml

@@ -1617,6 +1617,9 @@ importers:
       '@tarojs/taro':
         specifier: 4.1.4
         version: 4.1.4(@tarojs/components@4.1.4(@tarojs/helper@4.1.4)(@types/react@18.3.26)(html-webpack-plugin@5.6.4(webpack@5.91.0))(postcss@8.5.6)(rollup@3.29.5)(vue@3.5.22(typescript@5.9.3))(webpack-chain@6.5.1)(webpack-dev-server@4.15.2(webpack@5.91.0))(webpack@5.91.0))(@tarojs/helper@4.1.4)(@tarojs/shared@4.1.4)(@types/react@18.3.26)(html-webpack-plugin@5.6.4(webpack@5.91.0))(postcss@8.5.6)(rollup@3.29.5)(vue@3.5.22(typescript@5.9.3))(webpack-chain@6.5.1)(webpack-dev-server@4.15.2(webpack@5.91.0))(webpack@5.91.0)
+      hono:
+        specifier: ^4.8.5
+        version: 4.8.5
       react:
         specifier: ^18.0.0
         version: 18.3.1