Merge pull request #1749 from DevCloudFE/dev

feat(button&pagniation): 按钮增加nativeType参数&&pagniation增加最大分页数参数 (#1748)

Author: GreatZPP

Diff for: packages/devui-vue/devui/button/src/button-types.ts

@@ -1,9 +1,10 @@
-import type { ComputedRef, ExtractPropTypes, PropType ,InjectionKey, Ref } from 'vue';
+import type { ComputedRef, ExtractPropTypes, PropType, InjectionKey, Ref } from 'vue';
 
 export type IButtonVariant = 'solid' | 'outline' | 'text';
 export type IButtonColor = 'secondary' | 'primary' | 'danger';
 export type IButtonSize = 'lg' | 'md' | 'sm';
 export type IButtonShape = 'round' | 'circle';
+export type IButtonType = 'button' | 'submit' | 'reset';
 
 export const buttonProps = {
   variant: {
@@ -31,14 +32,18 @@ export const buttonProps = {
   },
   shape: {
     type: String as PropType<IButtonShape>,
-  }
+  },
+  nativeType: {
+    type: String as PropType<IButtonType>,
+    default: 'button',
+  },
 } as const;
 
 export const buttonGroupProps = {
   size: {
     type: String as PropType<IButtonSize>,
     default: 'md',
-  }
+  },
 } as const;
 
 export type ButtonProps = ExtractPropTypes<typeof buttonProps>;
@@ -55,6 +60,4 @@ interface ButtonGroupInjection {
   size: Ref<IButtonSize>;
 }
 
-export const buttonGroupInjectionKey: InjectionKey<ButtonGroupInjection> =
-  Symbol('d-button-group');
-
+export const buttonGroupInjectionKey: InjectionKey<ButtonGroupInjection> = Symbol('d-button-group');

Diff for: packages/devui-vue/devui/button/src/button.tsx

@@ -14,7 +14,7 @@ export default defineComponent({
   props: buttonProps,
   emits: ['click'],
   setup(props: ButtonProps, ctx: SetupContext) {
-    const { icon, disabled, loading } = toRefs(props);
+    const { icon, disabled, loading, nativeType } = toRefs(props);
     const { classes, iconClass } = useButton(props, ctx);
 
     const onClick = (e: MouseEvent) => {
@@ -26,7 +26,7 @@ export default defineComponent({
 
     return () => {
       return (
-        <button class={classes.value} disabled={disabled.value} onClick={onClick}>
+        <button class={classes.value} disabled={disabled.value} onClick={onClick} type={nativeType.value}>
           {icon.value && <Icon name={icon.value} size="var(--devui-font-size, 12px)" color="" class={iconClass.value} />}
           <div class="loading-icon__container" v-show={loading.value}>
             <d-icon name="icon-loading" class="button-icon-loading" color="#BBDEFB"></d-icon>

Diff for: packages/devui-vue/devui/pagination/src/pagination-types.ts

@@ -99,6 +99,10 @@ export const paginationProps = {
   onPageSizeChange: {
     type: Function as PropType<(v: number) => void>,
   },
+  maxPage: {
+    type: Number,
+    default: 0,
+  },
 } as const;
 
 // 组件props

Diff for: packages/devui-vue/devui/pagination/src/pagination.tsx

@@ -43,11 +43,17 @@ export default defineComponent({
       pageIndex,
       showJumpButton,
       haveConfigMenu,
+      maxPage,
     } = toRefs(props);
     const ns = useNamespace('pagination');
 
     // 总页数
-    const totalPages = computed(() => Math.ceil(props.total / props.pageSize));
+    const totalPages = computed(() => {
+      if (maxPage.value) {
+        return Math.min(Math.ceil(props.total / props.pageSize), maxPage.value);
+      }
+      return Math.ceil(props.total / props.pageSize);
+    });
 
     // 极简模式下，可选的下拉选择页码
     const litePageOptions = computed(() => liteSelectOptions(totalPages.value));

Diff for: packages/devui-vue/docs/components/button/index.md

@@ -75,6 +75,7 @@ button/buttonGroup
 | shape    | [IButtonShape](#ibuttonshape)     | --          | 可选，按钮形状(圆形/圆角) | [图标按钮](#图标按钮)     |
 | disabled | `boolean`                         | false       | 可选，是否禁用 button     | [禁用状态](#禁用状态)     |
 | loading  | `boolean`                         | false       | 可选，设置加载中状态      | [加载中状态](#加载中状态) |
+| native-type  | [IButtonType](#ibuttontype)    | 'button'       | 可选，按钮原生type属性      |  |
 
 ### Button 类型定义
 
@@ -102,11 +103,17 @@ type IButtonColor = 'primary' | 'secondary' | 'danger';
 type IButtonShape = 'circle' | 'round';
 ```
 
+#### IButtonType
+
+```ts
+type IButtonType = 'button' | 'submit' | 'reset';
+```
+
 ### ButtonGroup 参数
 
 | 参数名 | 类型                             | 默认 | 说明             | 跳转 Demo         |
 | :----- | :------------------------------- | :--- | :--------------- | :---------------- |
-| size   | [IButtonSize](#iButtonGroupSize) | 'md' | 可选，按钮组尺寸 | [按钮组](#按钮组) |
+| size   | [IButtonSize](#ibuttongroupsize) | 'md' | 可选，按钮组尺寸 | [按钮组](#按钮组) |
 
 ### ButtonGroup 类型定义
 

Diff for: packages/devui-vue/docs/components/pagination/index.md

@@ -58,6 +58,7 @@
     go-to-text="Jump to"
     :pre-link="preLink"
     :next-link="nextLink"
+    :max-page="20"
   />
 </template>
 <script>
@@ -442,6 +443,7 @@ export default defineComponent({
 | have-config-menu     | `boolean`                                                                                             | false                                                          | 可选，`极简模式`下是否显示配置                                                                                     | [极简模式](#极简模式) |
 | auto-fix-page-index  | `boolean`                                                                                             | true                                                           | 可选，改变 pageSize 时是否自动修正页码，<br>若`pageSizeChange`事件中会对<br>`pageIndex`做处理，则推荐设置为`false` | [极简模式](#极简模式) |
 | auto-hide            | `boolean`                                                                                             | false                                                          | 可选，是否自动隐藏，<br>当 auto-hide 为 true，<br>并且 pageSizeOptions 最小值大于 total，<br>则不展示分页          | [极简模式](#极简模式) |
+| max-page                 | `number`                                                                                | --                                                             | 可选，可展示的分页最大页数                                                                                                 |   [基本用法](#基本用法) |
 
 ### Pagination 事件
 

Diff for: packages/devui-vue/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-devui",
-  "version": "1.5.15-hotfix.3",
+  "version": "1.5.15-hotfix.4",
   "license": "MIT",
   "description": "DevUI components based on Vite and Vue3",
   "keywords": [