|
|
@@ -1,11 +1,36 @@
|
|
|
import React from 'react'
|
|
|
import { render, screen, fireEvent } from '@testing-library/react'
|
|
|
import '@testing-library/jest-dom'
|
|
|
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
|
|
|
import OrderDetail from '../src/pages/OrderDetail/OrderDetail'
|
|
|
import { setupTestEnv } from './__helpers__/local-test-utils'
|
|
|
|
|
|
setupTestEnv()
|
|
|
|
|
|
+// 创建测试用的QueryClient
|
|
|
+const createTestQueryClient = () => new QueryClient({
|
|
|
+ defaultOptions: {
|
|
|
+ queries: {
|
|
|
+ retry: false,
|
|
|
+ },
|
|
|
+ },
|
|
|
+})
|
|
|
+
|
|
|
+// 测试包装器组件
|
|
|
+const TestWrapper = ({ children }: { children: React.ReactNode }) => {
|
|
|
+ const queryClient = createTestQueryClient()
|
|
|
+ return (
|
|
|
+ <QueryClientProvider client={queryClient}>
|
|
|
+ {children}
|
|
|
+ </QueryClientProvider>
|
|
|
+ )
|
|
|
+}
|
|
|
+
|
|
|
+// 包装的render函数
|
|
|
+const renderWithQueryClient = (component: React.ReactElement) => {
|
|
|
+ return render(<TestWrapper>{component}</TestWrapper>)
|
|
|
+}
|
|
|
+
|
|
|
// Mock Taro组件
|
|
|
jest.mock('@tarojs/components', () => ({
|
|
|
View: ({ children, className, ...props }: any) => (
|
|
|
@@ -60,20 +85,84 @@ jest.mock('@d8d/mini-shared-ui-components/utils/rpc/rpc-client', () => ({
|
|
|
ok: true,
|
|
|
json: () => Promise.resolve({
|
|
|
id: 1,
|
|
|
- orderName: '测试订单',
|
|
|
+ orderName: '阿里巴巴2023-11',
|
|
|
orderStatus: 'in_progress',
|
|
|
createTime: new Date().toISOString(),
|
|
|
- updateTime: new Date().toISOString()
|
|
|
+ updateTime: new Date().toISOString(),
|
|
|
+ companyId: 1,
|
|
|
+ platformId: 1,
|
|
|
+ expectedPersonCount: 30,
|
|
|
+ expectedStartDate: new Date().toISOString(),
|
|
|
+ actualStartDate: new Date().toISOString(),
|
|
|
+ orderPersons: [
|
|
|
+ { id: 1, workStatus: 'working', joinDate: new Date().toISOString(), person: { name: '张三', gender: '男', disabilityType: '肢体残疾', phone: '13800138001' } },
|
|
|
+ { id: 2, workStatus: 'pre_working', joinDate: new Date().toISOString(), person: { name: '李四', gender: '女', disabilityType: '听力残疾', phone: '13800138002' } },
|
|
|
+ { id: 3, workStatus: 'working', joinDate: new Date().toISOString(), person: { name: '王五', gender: '男', disabilityType: '视力残疾', phone: '13800138003' } }
|
|
|
+ ]
|
|
|
})
|
|
|
}))
|
|
|
}
|
|
|
+ },
|
|
|
+ 'company-videos': {
|
|
|
+ $get: jest.fn(() => Promise.resolve({
|
|
|
+ ok: true,
|
|
|
+ json: () => Promise.resolve({
|
|
|
+ data: [
|
|
|
+ { id: 1, assetType: 'checkin_video', file: { name: '打卡视频_2023-12-01.mp4', size: 10485760, uploadTime: new Date().toISOString() } },
|
|
|
+ { id: 2, assetType: 'salary_video', file: { name: '工资视频_2023-11-30.mp4', size: 15728640, uploadTime: new Date().toISOString() } }
|
|
|
+ ]
|
|
|
+ })
|
|
|
+ }))
|
|
|
+ },
|
|
|
+ 'checkin-statistics': {
|
|
|
+ $get: jest.fn(() => Promise.resolve({
|
|
|
+ ok: true,
|
|
|
+ json: () => Promise.resolve({
|
|
|
+ companyId: 1,
|
|
|
+ checkinVideoCount: 15,
|
|
|
+ totalVideos: 30
|
|
|
+ })
|
|
|
+ }))
|
|
|
+ },
|
|
|
+ 'video-statistics': {
|
|
|
+ $get: jest.fn(() => Promise.resolve({
|
|
|
+ ok: true,
|
|
|
+ json: () => Promise.resolve({
|
|
|
+ companyId: 1,
|
|
|
+ stats: [
|
|
|
+ { assetType: 'checkin_video', count: 15, percentage: 50 },
|
|
|
+ { assetType: 'salary_video', count: 10, percentage: 33 },
|
|
|
+ { assetType: 'tax_video', count: 5, percentage: 17 }
|
|
|
+ ],
|
|
|
+ total: 30
|
|
|
+ })
|
|
|
+ }))
|
|
|
}
|
|
|
}))
|
|
|
}))
|
|
|
|
|
|
+// 模拟Taro方法
|
|
|
+import Taro from '@tarojs/taro'
|
|
|
+
|
|
|
describe('OrderDetail 组件测试', () => {
|
|
|
+ beforeEach(() => {
|
|
|
+ // 模拟useRouter返回订单ID
|
|
|
+ (Taro.useRouter as jest.Mock).mockReturnValue({ params: { id: '1' } })
|
|
|
+ // 模拟企业用户信息
|
|
|
+ (Taro.getStorageSync as jest.Mock).mockReturnValue(JSON.stringify({
|
|
|
+ data: JSON.stringify({
|
|
|
+ id: 1,
|
|
|
+ companyId: 1,
|
|
|
+ name: '测试企业'
|
|
|
+ })
|
|
|
+ }))
|
|
|
+ })
|
|
|
+
|
|
|
+ afterEach(() => {
|
|
|
+ jest.clearAllMocks()
|
|
|
+ })
|
|
|
test('渲染订单详情页面', () => {
|
|
|
- render(<OrderDetail />)
|
|
|
+ renderWithQueryClient(<OrderDetail />)
|
|
|
|
|
|
// 验证Navbar存在
|
|
|
expect(screen.getByTestId('navbar')).toBeInTheDocument()
|
|
|
@@ -82,7 +171,7 @@ describe('OrderDetail 组件测试', () => {
|
|
|
|
|
|
// 验证订单信息
|
|
|
expect(screen.getByText('阿里巴巴2023-11')).toBeInTheDocument()
|
|
|
- expect(screen.getByText('订单编号: ALIBABA-2023-11')).toBeInTheDocument()
|
|
|
+ expect(screen.getByText('订单编号: ORDER-1')).toBeInTheDocument()
|
|
|
expect(screen.getAllByText('进行中').length).toBeGreaterThan(0)
|
|
|
|
|
|
// 验证基本信息卡片
|
|
|
@@ -90,7 +179,7 @@ describe('OrderDetail 组件测试', () => {
|
|
|
expect(screen.getByText('预计人数')).toBeInTheDocument()
|
|
|
expect(screen.getByText('30人')).toBeInTheDocument()
|
|
|
expect(screen.getByText('实际人数')).toBeInTheDocument()
|
|
|
- expect(screen.getByText('24人')).toBeInTheDocument()
|
|
|
+ expect(screen.getByText('3人')).toBeInTheDocument()
|
|
|
|
|
|
// 验证打卡统计卡片
|
|
|
expect(screen.getByText('打卡数据统计')).toBeInTheDocument()
|
|
|
@@ -124,7 +213,7 @@ describe('OrderDetail 组件测试', () => {
|
|
|
})
|
|
|
|
|
|
test('状态变更功能', () => {
|
|
|
- render(<OrderDetail />)
|
|
|
+ renderWithQueryClient(<OrderDetail />)
|
|
|
|
|
|
// 初始状态为"进行中"
|
|
|
const inProgressButton = screen.getByRole('button', { name: '进行中' })
|
|
|
@@ -138,7 +227,7 @@ describe('OrderDetail 组件测试', () => {
|
|
|
})
|
|
|
|
|
|
test('添加备注功能', () => {
|
|
|
- render(<OrderDetail />)
|
|
|
+ renderWithQueryClient(<OrderDetail />)
|
|
|
|
|
|
const textarea = screen.getByPlaceholderText('请输入备注内容...')
|
|
|
const saveButton = screen.getByText('保存备注')
|
|
|
@@ -152,14 +241,14 @@ describe('OrderDetail 组件测试', () => {
|
|
|
})
|
|
|
|
|
|
test('查看详细打卡记录', () => {
|
|
|
- render(<OrderDetail />)
|
|
|
+ renderWithQueryClient(<OrderDetail />)
|
|
|
|
|
|
const viewDetailButton = screen.getByText('查看详细打卡记录')
|
|
|
fireEvent.click(viewDetailButton)
|
|
|
})
|
|
|
|
|
|
test('视频播放和下载按钮', () => {
|
|
|
- render(<OrderDetail />)
|
|
|
+ renderWithQueryClient(<OrderDetail />)
|
|
|
|
|
|
const playButtons = screen.getAllByText('播放')
|
|
|
const downloadButtons = screen.getAllByText('下载')
|
yourname