From f08fb98c17fb1ef115303487ce0053b1d9804f71 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=8E=E5=A4=A9=E4=BD=91?= <66231260+You-Hw-Y@users.noreply.github.com> Date: Tue, 20 Feb 2024 03:15:01 -0800 Subject: [PATCH] docs(time-select): [time-select] optimize docs and demos (#1403) * docs(time-select): [time-select] optimize docs and demos * docs(time-select): [time-select] optimize docs and demos * docs(time-select): [time-select] optimize docs and demos --- examples/sites/demos/apis/time-select.js | 2 +- examples/sites/demos/pc/app/time-select/basic-usage.spec.ts | 2 +- examples/sites/demos/pc/app/time-select/clear-icon.spec.ts | 2 +- .../sites/demos/pc/app/time-select/default-value.spec.ts | 2 +- .../demos/pc/app/time-select/event-blur-composition-api.vue | 6 +++--- examples/sites/demos/pc/app/time-select/event-blur.spec.ts | 2 +- examples/sites/demos/pc/app/time-select/event-blur.vue | 6 +++--- .../demos/pc/app/time-select/focus-composition-api.vue | 2 +- examples/sites/demos/pc/app/time-select/focus.vue | 2 +- .../demos/pc/app/time-select/range-placeholder.spec.ts | 4 ++-- 10 files changed, 15 insertions(+), 15 deletions(-) diff --git a/examples/sites/demos/apis/time-select.js b/examples/sites/demos/apis/time-select.js index b6eb9a390..b1033c376 100644 --- a/examples/sites/demos/apis/time-select.js +++ b/examples/sites/demos/apis/time-select.js @@ -188,7 +188,7 @@ export default { ], methods: [ { - name: 'handleFocus', + name: 'focus', type: '( ) => void', defaultValue: '', desc: { diff --git a/examples/sites/demos/pc/app/time-select/basic-usage.spec.ts b/examples/sites/demos/pc/app/time-select/basic-usage.spec.ts index 8e3cd648f..7e7ca69b9 100644 --- a/examples/sites/demos/pc/app/time-select/basic-usage.spec.ts +++ b/examples/sites/demos/pc/app/time-select/basic-usage.spec.ts @@ -6,7 +6,7 @@ test('基础用法', async ({ page }) => { const input = page.locator('#basic-usage').locator('.tiny-input__inner') const timeInput = page.locator('#basic-usage').getByRole('textbox', { name: '选择时间' }) await timeInput.click() - await page.getByText('10:00').nth(1).click() + await page.getByText('10:00').click() await expect(input).toHaveValue('10:00') // 手动输入 diff --git a/examples/sites/demos/pc/app/time-select/clear-icon.spec.ts b/examples/sites/demos/pc/app/time-select/clear-icon.spec.ts index 715c54a22..b0c684a19 100644 --- a/examples/sites/demos/pc/app/time-select/clear-icon.spec.ts +++ b/examples/sites/demos/pc/app/time-select/clear-icon.spec.ts @@ -7,7 +7,7 @@ test('自定义清空图标', async ({ page }) => { const timeInput = page.getByRole('textbox', { name: '选择时间' }) const input = demo.locator('.tiny-input__inner') await timeInput.click() - await page.getByText('10:00').nth(1).click() + await page.getByText('10:00').click() await input.hover() // 点击图标，清除输入框内容 await page.locator('#clear-icon svg').first().click() diff --git a/examples/sites/demos/pc/app/time-select/default-value.spec.ts b/examples/sites/demos/pc/app/time-select/default-value.spec.ts index 28d85ba5c..4bf4b3e92 100644 --- a/examples/sites/demos/pc/app/time-select/default-value.spec.ts +++ b/examples/sites/demos/pc/app/time-select/default-value.spec.ts @@ -5,6 +5,6 @@ test('选择器打开时默认时间设置', async ({ page }) => { await page.goto('time-select#default-value') const demo = page.locator('#default-value') await demo.locator('.tiny-date-editor').click() - const defaultSelect = page.getByText('10:00').nth(1) + const defaultSelect = page.getByText('10:00') await expect(defaultSelect).toHaveClass(/default/) }) diff --git a/examples/sites/demos/pc/app/time-select/event-blur-composition-api.vue b/examples/sites/demos/pc/app/time-select/event-blur-composition-api.vue index fce45f975..138cd7668 100644 --- a/examples/sites/demos/pc/app/time-select/event-blur-composition-api.vue +++ b/examples/sites/demos/pc/app/time-select/event-blur-composition-api.vue @@ -17,15 +17,15 @@ import { TimeSelect as TinyTimeSelect, Modal } from '@opentiny/vue' const value1 = ref('08:30') function bulr() { - Modal.message('blur事件') + Modal.message({ message: 'blur事件', status: 'info' }) } function change() { - Modal.message('change事件') + Modal.message({ message: 'change事件', status: 'info' }) } function focus() { - Modal.message('focus事件') + Modal.message({ message: 'focus事件', status: 'info' }) } diff --git a/examples/sites/demos/pc/app/time-select/event-blur.spec.ts b/examples/sites/demos/pc/app/time-select/event-blur.spec.ts index 69e12fd6c..31c242ec3 100644 --- a/examples/sites/demos/pc/app/time-select/event-blur.spec.ts +++ b/examples/sites/demos/pc/app/time-select/event-blur.spec.ts @@ -6,7 +6,7 @@ test('事件', async ({ page }) => { await page.getByPlaceholder('选择时间范围').getByTitle('08:30').first().click() const focusDiv = page.locator('div').filter({ hasText: 'focus事件' }).nth(1) await expect(focusDiv).toBeVisible() - await page.getByText('10:00').nth(1).click() + await page.getByText('10:00').click() const change = page.locator('div:nth-child(9) > .tiny-modal__box') await expect(change).toBeVisible const blurDiv = page.locator('div').filter({ hasText: 'blur事件' }).nth(1) diff --git a/examples/sites/demos/pc/app/time-select/event-blur.vue b/examples/sites/demos/pc/app/time-select/event-blur.vue index 739797a18..b0881e9dd 100644 --- a/examples/sites/demos/pc/app/time-select/event-blur.vue +++ b/examples/sites/demos/pc/app/time-select/event-blur.vue @@ -24,13 +24,13 @@ export default { }, methods: { bulr() { - Modal.message('blur事件') + Modal.message({ message: 'blur事件', status: 'info' }) }, change(value) { - Modal.message(value) + Modal.message({ message: value, status: 'info' }) }, focus() { - Modal.message('focus事件') + Modal.message({ message: 'focus事件', status: 'info' }) } } } diff --git a/examples/sites/demos/pc/app/time-select/focus-composition-api.vue b/examples/sites/demos/pc/app/time-select/focus-composition-api.vue index ddb2d0e61..828dd3f08 100644 --- a/examples/sites/demos/pc/app/time-select/focus-composition-api.vue +++ b/examples/sites/demos/pc/app/time-select/focus-composition-api.vue @@ -13,7 +13,7 @@ const value = ref('') const timeSelectRef = ref() function hanleFocus() { - timeSelectRef.value.handleFocus() + timeSelectRef.value.$el.querySelector('input').focus() } diff --git a/examples/sites/demos/pc/app/time-select/focus.vue b/examples/sites/demos/pc/app/time-select/focus.vue index 15cb802e8..9a8c5cc90 100644 --- a/examples/sites/demos/pc/app/time-select/focus.vue +++ b/examples/sites/demos/pc/app/time-select/focus.vue @@ -20,7 +20,7 @@ export default { }, methods: { hanleFocus() { - this.$refs.timeSelect.handleFocus() + this.$refs.timeSelect.$el.querySelector('input').focus() } } } diff --git a/examples/sites/demos/pc/app/time-select/range-placeholder.spec.ts b/examples/sites/demos/pc/app/time-select/range-placeholder.spec.ts index 4fe1208d9..c32cb048c 100644 --- a/examples/sites/demos/pc/app/time-select/range-placeholder.spec.ts +++ b/examples/sites/demos/pc/app/time-select/range-placeholder.spec.ts @@ -4,7 +4,7 @@ test('固定时间范围', async ({ page }) => { page.on('pageerror', (exception) => expect(exception).toBeNull()) await page.goto('time-select#range-placeholder') const timeInput = page.getByRole('textbox', { name: '起始时间' }) - const options = page.locator('.tiny-picker-panel').nth(3).locator('div') + const options = page.locator('.tiny-picker-panel').nth(1).locator('div') await timeInput.click() // options的第一条是options.first()，时间是08:30；最后一条（最大时间）是options.nth(43)，时间是18：30 await expect(options.first()).toContainText('08:30') @@ -14,7 +14,7 @@ test('固定时间范围', async ({ page }) => { await expect(page.locator('.tiny-input-suffix .tiny-input__inner').first()).toHaveValue('10:00') const timeEnd = page.getByRole('textbox', { name: '结束时间' }) - const endOptions = page.locator('.tiny-picker-panel').nth(3).locator('div') + const endOptions = page.locator('.tiny-picker-panel').nth(1).locator('div') await timeEnd.click() await expect(endOptions.first()).toContainText('08:30') await expect(endOptions.nth(43)).toContainText('18:30')