From 8f615c358290b263244f52d10f6783ac39c6948c Mon Sep 17 00:00:00 2001
From: jb-alvarado <jb@pixelcrusher.de>
Date: Thu, 2 Nov 2023 13:38:45 +0100
Subject: [PATCH] show configure page only for admin, formate code, choice if
 new user is admin

---
 components/Control.vue    | 12 ++++++------
 components/GuiConfig.vue  |  2 +-
 components/Menu.vue       |  2 +-
 components/UserConfig.vue | 39 ++++++++++++++++++++++++++++++++-------
 pages/index.vue           |  2 +-
 pages/media.vue           |  1 -
 stores/auth.ts            |  2 +-
 types/index.d.ts          |  1 +
 8 files changed, 43 insertions(+), 18 deletions(-)

diff --git a/components/Control.vue b/components/Control.vue
index 265687ab..16436fda 100644
--- a/components/Control.vue
+++ b/components/Control.vue
@@ -68,7 +68,7 @@
                                     <div>
                                         <button
                                             title="Start Playout Service"
-                                            data-tooltip=tooltip
+                                            data-tooltip="tooltip"
                                             class="btn btn-primary control-button control-button-play"
                                             :class="isPlaying"
                                             @click="controlProcess('start')"
@@ -81,7 +81,7 @@
                                     <div>
                                         <button
                                             title="Stop Playout Service"
-                                            data-tooltip=tooltip
+                                            data-tooltip="tooltip"
                                             class="btn btn-primary control-button control-button-stop"
                                             @click="controlProcess('stop')"
                                         >
@@ -93,7 +93,7 @@
                                     <div>
                                         <button
                                             title="Restart Playout Service"
-                                            data-tooltip=tooltip
+                                            data-tooltip="tooltip"
                                             class="btn btn-primary control-button control-button-restart"
                                             @click="controlProcess('restart')"
                                         >
@@ -106,7 +106,7 @@
                                     <div>
                                         <button
                                             title="Jump to last Clip"
-                                            data-tooltip=tooltip
+                                            data-tooltip="tooltip"
                                             class="btn btn-primary control-button control-button-control"
                                             @click="controlPlayout('back')"
                                         >
@@ -118,7 +118,7 @@
                                     <div>
                                         <button
                                             title="Reset Playout State"
-                                            data-tooltip=tooltip
+                                            data-tooltip="tooltip"
                                             class="btn btn-primary control-button control-button-control"
                                             @click="controlPlayout('reset')"
                                         >
@@ -130,7 +130,7 @@
                                     <div>
                                         <button
                                             title="Jump to next Clip"
-                                            data-tooltip=tooltip
+                                            data-tooltip="tooltip"
                                             class="btn btn-primary control-button control-button-control"
                                             @click="controlPlayout('next')"
                                         >
diff --git a/components/GuiConfig.vue b/components/GuiConfig.vue
index 33dac9c1..540431dd 100644
--- a/components/GuiConfig.vue
+++ b/components/GuiConfig.vue
@@ -112,7 +112,7 @@ async function addChannel() {
     newChannel.service = `ffplayout@${confName}.service`
 
     channels.push(newChannel)
-    configStore.configGui =channels
+    configStore.configGui = channels
     configStore.configID = configStore.configGui.length - 1
 }
 
diff --git a/components/Menu.vue b/components/Menu.vue
index e5db3650..ffb302de 100644
--- a/components/Menu.vue
+++ b/components/Menu.vue
@@ -36,7 +36,7 @@
                             <li class="nav-item">
                                 <NuxtLink class="btn btn-primary btn-sm" to="/logging">Logging</NuxtLink>
                             </li>
-                            <li class="nav-item">
+                            <li v-if="authStore.role.toLowerCase() == 'admin'" class="nav-item">
                                 <NuxtLink class="btn btn-primary btn-sm" to="/configure">Configure</NuxtLink>
                             </li>
                             <li v-if="configStore.configGui.length > 1" class="nav-item dropdown">
diff --git a/components/UserConfig.vue b/components/UserConfig.vue
index 8b40cb7e..43602244 100644
--- a/components/UserConfig.vue
+++ b/components/UserConfig.vue
@@ -54,7 +54,14 @@
             </form>
         </div>
 
-        <div id="userModal" ref="userModal" class="modal" tabindex="-1" aria-labelledby="userModalLabel" aria-hidden="true">
+        <div
+            id="userModal"
+            ref="userModal"
+            class="modal"
+            tabindex="-1"
+            aria-labelledby="userModalLabel"
+            aria-hidden="true"
+        >
             <div class="modal-dialog modal-dialog-centered">
                 <div class="modal-content">
                     <div class="modal-header">
@@ -87,7 +94,7 @@
                                 class="form-control"
                                 id="pass-input"
                                 aria-describedby="Password"
-                                v-model.number="user.password"
+                                v-model.string="user.password"
                                 required
                             />
                             <label for="confirm-input" class="form-label mt-2">Confirm Password</label>
@@ -96,9 +103,18 @@
                                 class="form-control"
                                 id="confirm-input"
                                 aria-describedby="Confirm Password"
-                                v-model.number="user.confirm"
+                                v-model.string="user.confirm"
                                 required
                             />
+                            <div class="form-check mt-3">
+                                <input
+                                    class="form-check-input"
+                                    type="checkbox"
+                                    id="isAdmin"
+                                    v-model.number="user.admin"
+                                />
+                                <label class="form-check-label" for="isAdmin">Admin</label>
+                            </div>
                         </div>
                         <div class="modal-footer">
                             <button type="reset" class="btn btn-primary" data-bs-dismiss="modal" aria-label="Cancel">
@@ -133,18 +149,28 @@ const user = ref({
     mail: '',
     password: '',
     confirm: '',
-    role_id: 1,
-})
+    admin: false,
+    role_id: 2,
+} as User)
 
 async function clearUser() {
     user.value.username = ''
     user.value.mail = ''
     user.value.password = ''
     user.value.confirm = ''
-    user.value.role_id = 1
+    user.value.admin = false,
+    user.value.role_id = 2
 }
 
 async function addUser() {
+    if (user.value.admin) {
+        user.value.role_id = 1
+    } else {
+        user.value.role_id = 2
+    }
+
+    delete user.value.admin
+
     if (user.value.password === user.value.confirm) {
         // @ts-ignore
         const modal = $bootstrap.Modal.getOrCreateInstance(userModal.value)
@@ -162,7 +188,6 @@ async function addUser() {
         }
 
         clearUser()
-
     } else {
         indexStore.alertVariant = 'alert-danger'
         indexStore.alertMsg = 'Password mismatch!'
diff --git a/pages/index.vue b/pages/index.vue
index aff24594..aa21ad5c 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -18,7 +18,7 @@
                             <NuxtLink to="/media" class="btn btn-primary">Media</NuxtLink>
                             <NuxtLink to="/message" class="btn btn-primary">Message</NuxtLink>
                             <NuxtLink to="logging" class="btn btn-primary">Logging</NuxtLink>
-                            <NuxtLink to="/configure" class="btn btn-primary"> Configure </NuxtLink>
+                            <NuxtLink v-if="authStore.role.toLowerCase() == 'admin'" to="/configure" class="btn btn-primary"> Configure </NuxtLink>
                             <button class="btn btn-primary" @click="logout()">Logout</button>
                         </div>
                     </div>
diff --git a/pages/media.vue b/pages/media.vue
index aea7d1cf..b856938a 100644
--- a/pages/media.vue
+++ b/pages/media.vue
@@ -477,7 +477,6 @@ async function getPath(path: string) {
     browserIsLoading.value = false
 }
 
-
 function setPreviewData(path: string) {
     /*
         Set path and player options for video preview.
diff --git a/stores/auth.ts b/stores/auth.ts
index 1a01476d..0dd412e7 100644
--- a/stores/auth.ts
+++ b/stores/auth.ts
@@ -1,5 +1,5 @@
 import { defineStore } from 'pinia'
-import jwtDecode, { JwtPayload } from 'jwt-decode'
+import jwtDecode,  { type JwtPayload } from 'jwt-decode'
 
 interface JwtPayloadExt extends JwtPayload {
     role: string
diff --git a/types/index.d.ts b/types/index.d.ts
index 71bd4b65..045e7e1c 100644
--- a/types/index.d.ts
+++ b/types/index.d.ts
@@ -16,6 +16,7 @@ declare global {
         mail: String
         password?: String
         confirm?: String
+        admin?: Boolean
         role_id?: Number
     }