Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor Pagination component #567

Open
25 tasks done
Lydanne opened this issue Feb 20, 2021 · 1 comment
Open
25 tasks done

refactor Pagination component #567

Lydanne opened this issue Feb 20, 2021 · 1 comment
Labels
refactor Refactor old code

Comments

@Lydanne
Copy link
Contributor

Lydanne commented Feb 20, 2021

Target

  • 兼容旧的API功能
  • 使用TDD进行重构

Tasking

  • 实现简单的分页显示
    • 基于 layout 实现显示 total\pager\next\prev
    • 基于 current-page page-count 页码的显示
    • 基于 total page-size自动推算页码
    • 基于 hide-on-single-page 实现当只有一页的时候自动隐藏页码
    • currentPage >= 1 && currentPage <=pageCount 的时候才可点击prev和next
    • pageCount > pagerCount的时候实现折叠
  • 实现简单的页码切换
    • 基于 layout next\prev\pager 实现页码变更
    • currentPage 发生变化后触发 current-change 事件
    • pageSize 发生变化后触发 size-change 事件
    • 当点击上一页按钮后触发 prev-click 事件
    • 当点击下一页按钮后触发 next-click 事件
    • 在点击Pager的页码的时候可以进行切换,当点击折叠当时候可以触发快速跳页
  • 实现 page-size 变更下拉选择框
    • 基于 layout sizes 实现下拉选择框
    • 基于 page-sizes 实现对下拉选择框控制
    • 基于 popper-class 实现下拉条目的样式控制
  • 实现自定义内容的展示
    • 当设置 layout 为 slot后, 基于 #default 自定义插槽
    • 当设置 layout 为 next 后,基于 next-text 实现将下一页图标改为文字
    • 当设置 layout 为 prev 后,基于 prev-text 实现将上一页图标改为文字
    • 基于layout -> 实现自定义布局对齐
  • 实现禁用功能
    • 基于 disabled 实现组件禁用
  • 实现页码跳转输入框
    • 基于 layout jumper 实现页码跳转功能
  • 实现通过选项变更大小
    • 基于 small 实现缩小整个页码组件
  • 实现pager的背景样式
    • 基于background 实现对 layout pager 背景变更
@Lydanne
Copy link
Contributor Author

Lydanne commented Mar 11, 2021

解决了 #560 的问题

@Lydanne Lydanne linked a pull request Mar 12, 2021 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
refactor Refactor old code
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant