1
+ <script setup lang="ts">
2
+ import { NButton , NSpace , NImage , NAlert , NSpin , NInput } from ' naive-ui' ;
3
+ import { ref } from ' vue' ;
4
+ import { api } from ' ../api' ;
5
+ const codeVerifier = ref (' ' );
6
+ const codeResp = ref ({
7
+ uid: ' ' ,
8
+ time: 0 ,
9
+ qrcode: ' ' ,
10
+ sign: ' ' ,
11
+ });
12
+ const error1 = ref (' ' );
13
+ const qrCode = ref (' ' );
14
+ const gettingQrCode = ref (false );
15
+ async function generateQrcode() {
16
+ gettingQrCode .value = true ;
17
+ error1 .value = ' ' ;
18
+ const res = await fetch (api (' /alist/115/auth_device_code' ))
19
+ const data = await res .json ()
20
+ gettingQrCode .value = false ;
21
+ if (data .error ) {
22
+ error1 .value = data .error ;
23
+ return ;
24
+ }
25
+ codeVerifier .value = data .code_verifier ;
26
+ codeResp .value = data .resp ;
27
+ const url = new URL (api (' /qr' ))
28
+ url .searchParams .set (" text" , codeResp .value .qrcode )
29
+ qrCode .value = url .toString ();
30
+ }
31
+ const gettingToken = ref (false );
32
+ const error2 = ref (' ' );
33
+ const tokenResp = ref ({
34
+ access_token: ' ' ,
35
+ refresh_token: ' ' ,
36
+ expires_in: 0 ,
37
+ });
38
+ async function getToken() {
39
+ gettingToken .value = true ;
40
+ error2 .value = ' ' ;
41
+ const res = await fetch (api (' /alist/115/get_token' ), {
42
+ method: ' POST' ,
43
+ body: JSON .stringify ({
44
+ code_verifier: codeVerifier .value ,
45
+ uid: codeResp .value .uid ,
46
+ }),
47
+ })
48
+ const data = await res .json ()
49
+ gettingToken .value = false ;
50
+ if (data .error ) {
51
+ error2 .value = data .error ;
52
+ return ;
53
+ }
54
+ tokenResp .value = data .resp ;
55
+ }
56
+ </script >
57
+
58
+ <template >
59
+ <NSpace vertical size =" large" >
60
+ <NButton block type =" primary" @click =" generateQrcode" v-if =" !codeVerifier" :loading =" gettingQrCode" >Generate Qrcode</NButton >
61
+ <NAlert title =" Error" type =" error" v-if =" error1" >
62
+ {{ error1 }}
63
+ </NAlert >
64
+ <NSpace v-if =" qrCode" vertical >
65
+ <NSpace justify =" center" >
66
+ <NImage width =" 300" :src =" qrCode" />
67
+ </NSpace >
68
+ <NAlert title =" Scan the QrCode" type =" info"
69
+ >Use 115 APP To Scan Then Click the Button Below</NAlert
70
+ >
71
+ <NButton
72
+ size =" large"
73
+ @click =" getToken"
74
+ type =" info"
75
+ block
76
+ :loading =" gettingToken"
77
+ >I have scan</NButton
78
+ >
79
+ <NAlert title =" Error" type =" error" v-if =" error2" >
80
+ {{ error2 }}
81
+ </NAlert >
82
+ </NSpace >
83
+ <NSpace vertical v-if =" tokenResp.refresh_token" >
84
+ <b >refresh_token:</b >
85
+ <NInput
86
+ type =" textarea"
87
+ autosize
88
+ readonly
89
+ :value =" tokenResp.refresh_token"
90
+ />
91
+ <b >access_token:</b >
92
+ <NInput
93
+ type =" textarea"
94
+ autosize
95
+ readonly
96
+ :value =" tokenResp.access_token"
97
+ />
98
+ </NSpace >
99
+ </NSpace >
100
+ </template >
0 commit comments