1
1
<template >
2
2
<div class =" cron-demo" >
3
3
<p >Flavor</p >
4
- <v-btn-toggle
5
- v-model =" toggle"
6
- tile
7
- color =" secondary"
8
- group
9
- density =" compact"
10
- class =" mb-5 elevation-5"
11
- mandatory >
12
-
13
- <v-btn v-for =" item in flavors" :key =" item.name" @click =" flavor = item" >
14
- {{item.name}}
15
- </v-btn >
16
-
17
- </v-btn-toggle >
4
+ <v-select
5
+ :model-value =" flavor"
6
+ @update:model-value =" selectFlavor"
7
+ :items =" flavors"
8
+ item-value =" name"
9
+ item-title =" name" >
10
+ </v-select >
18
11
19
12
<p >Locale</p >
20
- <v-btn-toggle
21
- v-model =" locale"
22
- tile
23
- color =" secondary"
24
- group
25
- density =" compact"
26
- class =" mb-5 elevation-5" >
27
-
28
- <v-btn v-for =" item in locales" :value =" item" :key =" item" >
29
- {{item}}
30
- </v-btn >
31
- </v-btn-toggle >
13
+ <v-select v-model =" locale" :items =" locales" item-title =" name" >
14
+ <template #item =" { item , props } " >
15
+ <v-list-item v-bind =" props" :subtitle =" 'locale: '+item.value" ></v-list-item >
16
+ </template >
17
+ </v-select >
32
18
33
19
<p >Format</p >
34
20
<v-btn-toggle
@@ -79,7 +65,50 @@ export default {
79
65
name: ' Vuetify' ,
80
66
},
81
67
]
82
- const locales = [' en' , ' de' , ' pt' , ' es' , ' da' , ' zh-cn' ]
68
+ const locales = [
69
+ {
70
+ name: ' English' ,
71
+ value: ' en'
72
+ },
73
+ {
74
+ name: ' German' ,
75
+ value: ' de' ,
76
+ },
77
+ {
78
+ name: ' Portuguese' ,
79
+ value: ' pt' ,
80
+ },
81
+ {
82
+ name: ' Spanish' ,
83
+ value: ' es' ,
84
+ },
85
+ {
86
+ name: ' Danish' ,
87
+ value: ' da' ,
88
+ },
89
+ {
90
+ name: ' Chinese' ,
91
+ value: ' zh-cn' ,
92
+ },
93
+ {
94
+ name: ' Russian (GPT-4)' ,
95
+ value: ' ru' ,
96
+ },
97
+ {
98
+ name: ' French (GPT-4)' ,
99
+ value: ' fr' ,
100
+ },
101
+ {
102
+ name: ' Japanese (GPT-4)' ,
103
+ value: ' ja' ,
104
+ },
105
+ {
106
+ name: ' Hindi (GPT-4)' ,
107
+ value: ' hi' ,
108
+ },
109
+ ]
110
+ locales .sort ((a , b ) => a .name .localeCompare (b .name ))
111
+
83
112
const formats = [' crontab' , ' quartz' ]
84
113
85
114
const flavor = ref (flavors[0 ])
@@ -88,9 +117,10 @@ export default {
88
117
const disabled = ref (false )
89
118
90
119
const selectFlavor = (name ) => {
120
+ console .log (name)
91
121
let i = flavors .map (f => f .name ).indexOf (name)
92
122
i = i >= 0 ? i : 0
93
- return flavors[i]
123
+ flavor . value = flavors[i]
94
124
}
95
125
96
126
const src = computed (() => {
0 commit comments