From 26556ad3096a3c80c486b8896e6aff3d6b999c1a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rn-Michael=20Miehe?= <jmm@yavook.de>
Date: Mon, 11 Sep 2023 22:50:11 +0000
Subject: [PATCH] ConfigView rendering

---
 api/advent22_api/routers/admin.py | 18 +++++++++++-------
 ui/src/components/ConfigView.vue  | 18 ++++++++++++------
 2 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/api/advent22_api/routers/admin.py b/api/advent22_api/routers/admin.py
index 8636e4f..93b1ca0 100644
--- a/api/advent22_api/routers/admin.py
+++ b/api/advent22_api/routers/admin.py
@@ -34,9 +34,13 @@ class ConfigModel(BaseModel):
         doors: list[int]
 
     class __Image(BaseModel):
+        class __Font(BaseModel):
+            file: str
+            size: int
+
         size: int
         border: int
-        fonts: list[tuple[str, int]]
+        fonts: list[__Font]
 
     class __WebDAV(BaseModel):
         url: str
@@ -61,9 +65,9 @@ async def get_config_model(
             "puzzle": {
                 "solution": cfg.puzzle.solution,
                 "shuffled": shuffled_solution,
-                "begin": date.today(),
-                "end": date.today(),
-                "closing": date.today(),
+                "begin": date.today(),  # TODO
+                "end": date.today(),  # TODO
+                "closing": date.today(),  # TODO
                 "seed": cfg.puzzle.random_seed,
             },
             "calendar": {
@@ -72,9 +76,9 @@ async def get_config_model(
                 "doors": [door.day for door in cal_cfg.doors],
             },
             "image": {
-                "size": 500,
-                "border": 30,
-                "fonts": [(cfg.server.font, 50)],
+                "size": 500,  # TODO
+                "border": 30,  # TODO
+                "fonts": [{"file": cfg.server.font, "size": 50}],
             },
             "webdav": {
                 "url": SETTINGS.webdav.url,
diff --git a/ui/src/components/ConfigView.vue b/ui/src/components/ConfigView.vue
index 99db282..afd8d8a 100644
--- a/ui/src/components/ConfigView.vue
+++ b/ui/src/components/ConfigView.vue
@@ -31,7 +31,9 @@
               <dd>{{ admin_config_model.puzzle.closing }}</dd>
 
               <dt>Zufalls-Seed</dt>
-              <dd>{{ admin_config_model.puzzle.seed }}</dd>
+              <dd class="is-family-monospace">
+                "{{ admin_config_model.puzzle.seed }}"
+              </dd>
             </dl>
           </div>
         </div>
@@ -47,7 +49,7 @@
 
               <dt>Türchen</dt>
               <dd>
-                {{ admin_config_model.calendar.doors }}
+                <span>{{ admin_config_model.calendar.doors.join(", ") }}</span>
                 <span class="tag is-danger ml-2">
                   <span class="icon">
                     <font-awesome-icon icon="fa-solid fa-bolt" />
@@ -65,8 +67,12 @@
               <dd>{{ admin_config_model.image.border }} px</dd>
 
               <dt>Schriftarten</dt>
-              <dd>{{ admin_config_model.image.fonts }}</dd>
-              <dd>files/foobar.ttf (Größe 33)</dd>
+              <dd
+                v-for="(font, idx) in admin_config_model.image.fonts"
+                :key="`font-${idx}`"
+              >
+                {{ font.file }} (Größe {{ font.size }})
+              </dd>
             </dl>
           </div>
         </div>
@@ -132,7 +138,7 @@ interface ConfigModel {
   image: {
     size: number;
     border: number;
-    fonts: (string | number)[];
+    fonts: { file: string; size: number }[];
   };
   webdav: {
     url: string;
@@ -164,7 +170,7 @@ export default class extends Vue {
     image: {
       size: 500,
       border: 30,
-      fonts: ["files/Lena.ttf", 50],
+      fonts: [{ file: "files/Lena.ttf", size: 50 }],
     },
     webdav: {
       url: "https://example.com/remote.php/webdav/advent22",