From 8048045afe6c70790590d5dd7c2fed46fa73f591 Mon Sep 17 00:00:00 2001
From: vben <ann.vben@gmail.com>
Date: Sun, 10 Nov 2024 10:00:34 +0800
Subject: [PATCH] feat: pinInput supports disabled props

---
 .../src/components/pin-input/input.vue        | 24 +++++++++++--------
 .../src/components/pin-input/types.ts         |  4 ++++
 2 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/input.vue b/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/input.vue
index d55fa7e1298..9eb85a865b1 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/input.vue
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/input.vue
@@ -10,12 +10,14 @@ defineOptions({
   inheritAttrs: false,
 });
 
-const props = withDefaults(defineProps<PinInputProps>(), {
-  btnLoading: false,
-  codeLength: 6,
-  handleSendCode: async () => {},
-  maxTime: 60,
-});
+const {
+  codeLength = 6,
+  createText = async () => {},
+  disabled = false,
+  handleSendCode = async () => {},
+  loading = false,
+  maxTime = 60,
+} = defineProps<PinInputProps>();
 
 const emit = defineEmits<{
   complete: [];
@@ -30,11 +32,11 @@ const countdown = ref(0);
 
 const btnText = computed(() => {
   const countdownValue = countdown.value;
-  return props.createText?.(countdownValue);
+  return createText?.(countdownValue);
 });
 
 const btnLoading = computed(() => {
-  return props.loading || countdown.value > 0;
+  return loading || countdown.value > 0;
 });
 
 watch(
@@ -51,8 +53,8 @@ function handleComplete(e: string[]) {
 
 async function handleSend(e: Event) {
   e?.preventDefault();
-  await props.handleSendCode();
-  countdown.value = props.maxTime;
+  await handleSendCode();
+  countdown.value = maxTime;
   startCountdown();
 }
 
@@ -77,6 +79,7 @@ const id = useId();
   <PinInput
     :id="id"
     v-model="inputValue"
+    :disabled="disabled"
     class="flex w-full justify-between"
     otp
     placeholder="○"
@@ -92,6 +95,7 @@ const id = useId();
         />
       </PinInputGroup>
       <VbenButton
+        :disabled="disabled"
         :loading="btnLoading"
         class="flex-grow"
         size="lg"
diff --git a/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/types.ts b/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/types.ts
index 0439d3b24f1..182d88443dd 100644
--- a/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/types.ts
+++ b/packages/@core/ui-kit/shadcn-ui/src/components/pin-input/types.ts
@@ -8,6 +8,10 @@ interface PinInputProps {
    * 发送验证码按钮文本
    */
   createText?: (countdown: number) => string;
+  /**
+   * 是否禁用
+   */
+  disabled?: boolean;
   /**
    * 自定义验证码发送逻辑
    * @returns