1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
from trame.app import get_server
from trame.ui.vuetify3 import SinglePageLayout
from trame.widgets import vuetify3
# -----------------------------------------------------------------------------
# Trame setup
# -----------------------------------------------------------------------------
server = get_server(client_type="vue3")
state, ctrl = server.state, server.controller
# -----------------------------------------------------------------------------
# i18n
# -----------------------------------------------------------------------------
LANG = {
"en": {
"stepper": {
"next": "Next",
"prev": "Previous",
},
},
"fr": {
"stepper": {
"next": "Suivant(me)",
"prev": "Precedent(me)",
},
},
}
CONFIG = {
"locale": {
"locale": "en",
"fallback": "en",
"messages": LANG,
}
}
# -----------------------------------------------------------------------------
# UI setup
# -----------------------------------------------------------------------------
with SinglePageLayout(server, vuetify_config=CONFIG) as layout:
# Toolbar
with layout.toolbar as toolbar:
vuetify3.VSpacer()
vuetify3.VSelect(
v_model=("$vuetify.locale.current",),
items=("langs", ["en", "fr"]),
density="compact",
)
with layout.content:
with vuetify3.VStepper(
items=("steps", ["Step 1", "Step 2", "Step 3"]),
):
for i in range(3):
with vuetify3.Template(raw_attrs=[f"v-slot:item.{i + 1}"]):
vuetify3.VCardTitle(title=f"Step {i + 1}")
# -----------------------------------------------------------------------------
# start server
# -----------------------------------------------------------------------------
if __name__ == "__main__":
server.start()
|
