feat(button): 添加SubmitButton组件并支持ant-design主题

packages/effects/common-ui/src/components/index.ts

@@ -8,6 +8,7 @@ export * from './json-viewer';
 export * from './loading';
 export * from './page';
 export * from './resize';
+export * from './submit-button';
 export * from './tippy';
 export * from './tree';
 export * from '@vben-core/form-ui';

packages/effects/common-ui/src/components/submit-button/button.vue

@@ -0,0 +1,60 @@
+<script lang="ts" setup>
+import type { ButtonTheme, ButtonVariants, ButtonVariantSize } from '@vben-core/shadcn-ui';
+
+import { ref } from 'vue';
+
+import { Button, VbenIcon } from '@vben-core/shadcn-ui';
+
+interface SubmitProps {
+  /**
+   * @zh_CN 主题
+   */
+  theme?: ButtonTheme;
+  class?: string;
+  /**
+   * @zh_CN 最小加载时间
+   * @en_US Minimum loading time
+   */
+  minLoadingTime?: number;
+  /**
+   * @zh_CN 文字
+   */
+  text?: string;
+  size?: ButtonVariantSize;
+  type?: ButtonVariants;
+  /**
+   * @zh_CN 提交函数
+   */
+  submit?: () => Promise<void>;
+}
+
+defineOptions({ name: 'Loading' });
+const props = defineProps<SubmitProps>();
+const spinning = ref(false);
+async function runSubmit() {
+  if (props.submit) {
+    spinning.value = true;
+    await new Promise((resolve) => setTimeout(resolve, props.minLoadingTime || 0));
+    await props.submit();
+    spinning.value = false;
+  }
+}
+</script>
+<template>
+  <Button
+    :disabled="spinning"
+    :theme="props.theme"
+    :type="props.type ?? 'primary'"
+    :size="props.size ?? 'default'"
+    :class="props.class"
+    @click="runSubmit()"
+  >
+    <VbenIcon
+      v-if="spinning"
+      class="mr-1 animate-spin"
+      icon="ant-design:loading-3-quarters-outlined"
+      fallback
+    />
+    {{ props.text || '提交' }}
+  </Button>
+</template>

packages/effects/common-ui/src/components/submit-button/index.ts

@@ -0,0 +1 @@
+export { default as SubmitButton } from './button.vue';