From f0baaa987df85fdf01e65adf504bb0f18dc58f5c Mon Sep 17 00:00:00 2001 From: Kagol Date: Fri, 18 Mar 2022 11:06:55 +0800 Subject: [PATCH 1/2] =?UTF-8?q?refactor(pagination):=20=E4=BF=AE=E5=A4=8DP?= =?UTF-8?q?agination=E7=BB=84=E4=BB=B6=E7=9A=84ESLint=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../devui/pagination/__tests__/pagination.spec.ts | 10 +++++----- packages/devui-vue/devui/pagination/index.ts | 6 +----- .../devui/pagination/src/components/config-menu.tsx | 6 +++--- packages/devui-vue/devui/pagination/src/pagination.tsx | 4 ++-- 4 files changed, 11 insertions(+), 15 deletions(-) diff --git a/packages/devui-vue/devui/pagination/__tests__/pagination.spec.ts b/packages/devui-vue/devui/pagination/__tests__/pagination.spec.ts index b3fdd71287..e8e54db5b6 100644 --- a/packages/devui-vue/devui/pagination/__tests__/pagination.spec.ts +++ b/packages/devui-vue/devui/pagination/__tests__/pagination.spec.ts @@ -1,4 +1,4 @@ -import { mount } from '@vue/test-utils'; +import { DOMWrapper, mount } from '@vue/test-utils'; import { reactive } from 'vue'; import { Pagination } from '../index'; import { Select } from '../../select'; @@ -46,7 +46,7 @@ describe('pagination: ', () => { expect((wrapper.find('.devui-select-input').element as HTMLInputElement).value).toEqual('20'); const btns = wrapper.findAll('a.devui-pagination-link'); - expect(btns.map((ele: any) => ele.text()).join()).toEqual('<,1,...,4,5,6,...,16,>'); + expect(btns.map((ele: DOMWrapper) => ele.text()).join()).toEqual('<,1,...,4,5,6,...,16,>'); expect(wrapper.find('.devui-pagination-list').classes()).toContain('devui-pagination-sm'); // 跳转按钮 @@ -57,7 +57,7 @@ describe('pagination: ', () => { await btns[0].trigger('click'); expect(wrapper.find('.devui-pagination-item.active').text()).toEqual('4'); const btns1 = wrapper.findAll('a.devui-pagination-link'); - expect(btns1.map((ele: any) => ele.text()).join()).toEqual('<,1,...,3,4,5,...,16,>'); + expect(btns1.map((ele: DOMWrapper) => ele.text()).join()).toEqual('<,1,...,3,4,5,...,16,>'); // 改变每页条数 await wrapper.find('.devui-select-input').trigger('click'); @@ -65,7 +65,7 @@ describe('pagination: ', () => { expect((wrapper.find('.devui-select-input').element as HTMLInputElement).value).toEqual('10'); const btns2 = wrapper.findAll('a.devui-pagination-link'); - expect(btns2.map((ele: any) => ele.text()).join()).toEqual('<,1,...,3,4,5,...,31,>'); + expect(btns2.map((ele: DOMWrapper) => ele.text()).join()).toEqual('<,1,...,3,4,5,...,31,>'); }); it('test callback', async () => { @@ -101,7 +101,7 @@ describe('pagination: ', () => { expect(wrapper.find('.devui-pagination-list').classes()).toContain('devui-pagination-lg'); const btns = wrapper.findAll('a.devui-pagination-link'); - const pageIndexs = btns.map((ele: any) => ele.text()); + const pageIndexs = btns.map((ele: DOMWrapper) => ele.text()); expect(pageIndexs.join()).toEqual('<,1,...,6,7,8,9,10,11,12,13,...,31,>'); // 当前页改变回调 diff --git a/packages/devui-vue/devui/pagination/index.ts b/packages/devui-vue/devui/pagination/index.ts index a4d82a7882..5c1fbda359 100644 --- a/packages/devui-vue/devui/pagination/index.ts +++ b/packages/devui-vue/devui/pagination/index.ts @@ -1,10 +1,6 @@ import { App } from 'vue'; import Pagination from './src/pagination'; -Pagination.install = (app: App): void => { - app.component(Pagination.name, Pagination); -}; - export { Pagination }; export default { @@ -12,6 +8,6 @@ export default { category: '导航', status: '100%', install(app: App): void { - app.use(Pagination as any); + app.component(Pagination.name, Pagination); } }; diff --git a/packages/devui-vue/devui/pagination/src/components/config-menu.tsx b/packages/devui-vue/devui/pagination/src/components/config-menu.tsx index a9790d3e26..fc1767c6c1 100644 --- a/packages/devui-vue/devui/pagination/src/components/config-menu.tsx +++ b/packages/devui-vue/devui/pagination/src/components/config-menu.tsx @@ -15,6 +15,9 @@ export default defineComponent({ setup() { const paginationConfig = ref(null); const isShowConfig = ref(false); + const closeConfigMenu = (e: Event) => { + isShowConfig.value = isShowConfig.value ? false : !!e; + }; onMounted(() => { on(paginationConfig.value, 'click', closeConfigMenu); @@ -22,9 +25,6 @@ export default defineComponent({ onUnmounted(() => { off(paginationConfig.value, 'click', closeConfigMenu); }); - const closeConfigMenu = (e: Event) => { - isShowConfig.value = isShowConfig.value ? false : !!e; - }; return { paginationConfig, diff --git a/packages/devui-vue/devui/pagination/src/pagination.tsx b/packages/devui-vue/devui/pagination/src/pagination.tsx index 1101400ae1..f3a4b5c769 100644 --- a/packages/devui-vue/devui/pagination/src/pagination.tsx +++ b/packages/devui-vue/devui/pagination/src/pagination.tsx @@ -18,6 +18,8 @@ export default defineComponent({ props: componentProps, emits: ['pageIndexChange', 'pageSizeChange', 'update:pageSize', 'update:pageIndex'], setup(props: ComponentProps, { emit }) { + // 总页数 + const totalPages = computed(() => Math.ceil(props.total / props.pageSize)); // 极简模式下，可选的下拉选择页码 const litePageOptions = computed(() => liteSelectOptions(totalPages.value)); @@ -45,8 +47,6 @@ export default defineComponent({ emit('update:pageSize', val); } }); - // 总页数 - const totalPages = computed(() => Math.ceil(props.total / props.pageSize)); const changeCursorEmit = (val: number) => { cursor.value = val; From 37de606f5df0314b84910e09a8184529de49cbd5 Mon Sep 17 00:00:00 2001 From: Kagol Date: Fri, 18 Mar 2022 12:14:18 +0800 Subject: [PATCH 2/2] =?UTF-8?q?refactor(pagination):=20=E4=BF=AE=E6=94=B9?= =?UTF-8?q?=E7=B1=BB=E5=9E=8B=E6=96=87=E4=BB=B6=E5=90=8D=E4=BF=9D=E6=8C=81?= =?UTF-8?q?=E5=91=BD=E5=90=8D=E9=A3=8E=E6=A0=BC=E7=BB=9F=E4=B8=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pagination/src/{use-pagination.ts => pagination-types.ts} | 0 packages/devui-vue/devui/pagination/src/pagination.tsx | 2 +- 2 files changed, 1 insertion(+), 1 deletion(-) rename packages/devui-vue/devui/pagination/src/{use-pagination.ts => pagination-types.ts} (100%) diff --git a/packages/devui-vue/devui/pagination/src/use-pagination.ts b/packages/devui-vue/devui/pagination/src/pagination-types.ts similarity index 100% rename from packages/devui-vue/devui/pagination/src/use-pagination.ts rename to packages/devui-vue/devui/pagination/src/pagination-types.ts diff --git a/packages/devui-vue/devui/pagination/src/pagination.tsx b/packages/devui-vue/devui/pagination/src/pagination.tsx index f3a4b5c769..21007674b6 100644 --- a/packages/devui-vue/devui/pagination/src/pagination.tsx +++ b/packages/devui-vue/devui/pagination/src/pagination.tsx @@ -1,5 +1,5 @@ import { defineComponent, computed, nextTick } from 'vue'; -import { ComponentProps, componentProps } from './use-pagination'; +import { ComponentProps, componentProps } from './pagination-types'; import { liteSelectOptions } from './utils'; import ConfigMenu from './components/config-menu';