diff --git a/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap b/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap
new file mode 100644
index 0000000000000000000000000000000000000000..d3f163e2a8042e3d2f5b79db9d5ac06aed0c0453
--- /dev/null
+++ b/src/packages/timeselect/__test__/__snapshots__/timeselect.spec.tsx.snap
@@ -0,0 +1,69 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`timeselect props test 1`] = `
+
+`;
diff --git a/src/packages/timeselect/__test__/timeselect.spec.tsx b/src/packages/timeselect/__test__/timeselect.spec.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..7d5845d5258ae8ee4a6ab1e439f1983cec41cfb5
--- /dev/null
+++ b/src/packages/timeselect/__test__/timeselect.spec.tsx
@@ -0,0 +1,97 @@
+import * as React from 'react'
+
+import { render, waitFor } from '@testing-library/react'
+import '@testing-library/jest-dom'
+import ReactTestUtils from 'react-dom/test-utils'
+
+import { TimeSelect } from '../timeselect'
+
+const state = {
+ visible1: true,
+ height: '50%',
+ title: '取件时间 1',
+ currentKey: 0,
+ dates: [
+ {
+ 'pannel-key': '0',
+ date: '5月20日(今天)',
+ },
+ {
+ 'pannel-key': '1',
+ date: '5月21日(星期三)',
+ },
+ ],
+ times: [
+ {
+ key: '0',
+ list: ['9:00-10:00', '10:00-11:00', '11:00-12:00'],
+ },
+ {
+ key: '1',
+ list: ['9:00-10:00', '10:00-11:00'],
+ },
+ ],
+}
+test('timeselect props test', async () => {
+ const App = () => {
+ return (
+
+ )
+ }
+ const { container } = render()
+
+ await waitFor(
+ () => {
+ const titleDoms = container.querySelectorAll('.nut-timeselect__title')
+ expect(titleDoms[0].innerHTML).toBe(state.title)
+ container.querySelectorAll('.nut-timepannel').forEach((item, index) => {
+ expect(item.innerHTML).toBe(state.dates[index].date)
+ })
+ },
+ { timeout: 2000 }
+ )
+
+ await waitFor(
+ () => {
+ expect(container.querySelector('.nut-timedetail')).toBeInTheDocument()
+ expect(container).toMatchSnapshot()
+ },
+ { timeout: 2000 }
+ )
+})
+
+test('timeselect event test', async () => {
+ const App = () => {
+ return (
+
+ )
+ }
+ const { container } = render()
+ await waitFor(
+ () => {
+ container
+ .querySelectorAll('.nut-timedetail__item')
+ .forEach((item, index) => {
+ ReactTestUtils.Simulate.click(item)
+ expect(item).toHaveClass('nut-timedetail__item-active')
+ })
+ },
+ { timeout: 2000 }
+ )
+})
diff --git a/src/packages/timeselect/demo.tsx b/src/packages/timeselect/demo.tsx
index 103d350da6f211e336dfef7e2af0acd1de0fc813..0e2574f1f3c47b2dec9434fe90dea3e76513aa0d 100644
--- a/src/packages/timeselect/demo.tsx
+++ b/src/packages/timeselect/demo.tsx
@@ -1,5 +1,6 @@
import React, { useState } from 'react'
import { TimeSelect } from './timeselect'
+import { TimeType } from '../timedetail/timedetail'
import { Cell } from '../cell/cell'
import Toast from '../toast'
import { useTranslate } from '../../sites/assets/locale'
@@ -57,16 +58,19 @@ const TimeSelectDemo = () => {
SetVisible1(true)
}
// 点击弹层 X 或者弹层外区域触发事件
- const handleSelect = (selectTimeData: any) => {
+ const handleSelect = (selectTimeData: TimeType[]) => {
SetVisible1(false)
Toast.text(`${translated.text1}: ${JSON.stringify(selectTimeData)}`)
}
// 选择日期触发回调事件
- const handlePannelChange = (pannelKey: any, selectTimeData: any) => {
+ const handlePannelChange = (
+ pannelKey: string | number,
+ selectTimeData: TimeType[]
+ ) => {
console.log('pannelKey, selectTimeData: ', pannelKey, selectTimeData)
}
// 选择配送时间触发回调事件
- const handleTimeChange = (time: any, selectTimeData: any) => {
+ const handleTimeChange = (time: string, selectTimeData: TimeType[]) => {
console.log('time, selectTimeData: ', time, selectTimeData)
}
return (