auto focus pin code input when open desktop unlock page

mayswind · Jul 2, 2023 · 7cf53ac · 7cf53ac
1 parent 748cf68
commit 7cf53ac
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git a/src/components/common/PinCodeInput.vue b/src/components/common/PinCodeInput.vue
@@ -7,6 +7,7 @@
                    :ref="`pin-code-input-${index}`"
                    :value="codes[index].value"
                    :type="codes[index].inputType"
+                   :autofocus="autofocus && index === 0 ? 'autofocus' : undefined"
                    @focus="codes[index].focused = true"
                    @blur="codes[index].focused = false"
                    @keydown="onKeydown(index, $event)"
@@ -21,6 +22,7 @@
 export default {
     props: [
         'modelValue',
+        'autofocus',
         'secure',
         'length'
     ],

diff --git a/src/views/desktop/UnlockPage.vue b/src/views/desktop/UnlockPage.vue
@@ -19,7 +19,8 @@
                         <v-form>
                             <v-row>
                                 <v-col cols="12">
-                                    <pin-code-input :secure="true" :length="6" v-model="pinCode" @pincode:confirm="unlockByPin" />
+                                    <pin-code-input :autofocus="true" :secure="true" :length="6"
+                                                    v-model="pinCode" @pincode:confirm="unlockByPin" />
                                 </v-col>
 
                                 <v-col cols="12">