From 9f808717d288a446520c9424cd649da4d749ffd3 Mon Sep 17 00:00:00 2001
From: James Collins <james.collins@outlook.com.au>
Date: Fri, 23 Jun 2023 18:30:32 +1000
Subject: [PATCH] fix page padding

---
 .../js/views/dashboard/ShortlinkEdit.vue      | 68 ++++++++++---------
 1 file changed, 35 insertions(+), 33 deletions(-)

diff --git a/resources/js/views/dashboard/ShortlinkEdit.vue b/resources/js/views/dashboard/ShortlinkEdit.vue
index 21ec246..952f5c0 100644
--- a/resources/js/views/dashboard/ShortlinkEdit.vue
+++ b/resources/js/views/dashboard/ShortlinkEdit.vue
@@ -1,37 +1,37 @@
 <template>
-    <SMMastHead
-        :title="pageHeading"
-        :back-link="
-            route.params.id || isCreating
-                ? { name: 'dashboard-shortlink-list' }
-                : { name: 'dashboard' }
-        "
-        :back-title="
-            route.params.id || isCreating
-                ? 'Back to Shortlinks'
-                : 'Back to Dashboard'
-        " />
-    <SMContainer>
-        <SMForm :model-value="form" @submit="handleSubmit">
-            <SMRow>
-                <SMColumn><SMInput control="code" /></SMColumn>
-                <SMColumn
-                    ><SMInput type="static" v-model="used" label="Times used"
-                /></SMColumn>
-            </SMRow>
-            <SMRow>
-                <SMColumn><SMInput control="url" /></SMColumn>
-            </SMRow>
-            <SMRow>
-                <SMColumn>
-                    <input
-                        role="button"
-                        type="submit"
-                        :value="saveButtonLabel" />
-                </SMColumn>
-            </SMRow>
-        </SMForm>
-    </SMContainer>
+    <SMPageStatus v-if="!userHasPermission('admin/shortlinks')" :status="403" />
+    <template v-else>
+        <SMMastHead
+            :title="pageHeading"
+            :back-link="
+                route.params.id || isCreating
+                    ? { name: 'dashboard-shortlink-list' }
+                    : { name: 'dashboard' }
+            "
+            :back-title="
+                route.params.id || isCreating
+                    ? 'Back to Shortlinks'
+                    : 'Back to Dashboard'
+            " />
+        <SMLoading v-if="form.loading()" />
+        <div v-else class="max-w-4xl mx-auto px-4 mt-12">
+            <SMForm :model-value="form" @submit="handleSubmit">
+                <SMInput class="mt-4" control="code" />
+                <SMInput
+                    class="mt-4"
+                    type="static"
+                    v-model="used"
+                    label="Times used" />
+                <SMInput class="mt-4" control="url" />
+
+                <input
+                    role="button"
+                    type="submit"
+                    class="font-medium px-6 py-1.5 rounded-md hover:shadow-md transition text-sm bg-sky-600 hover:bg-sky-500 text-white cursor-pointer"
+                    :value="saveButtonLabel" />
+            </SMForm>
+        </div>
+    </template>
 </template>
 
 <script setup lang="ts">
@@ -45,6 +45,8 @@ import { Form, FormControl } from "../../helpers/form";
 import { And, Length, Max, Min, Required } from "../../helpers/validate";
 import SMMastHead from "../../components/SMMastHead.vue";
 import { useToastStore } from "../../store/ToastStore";
+import SMPageStatus from "../../components/SMPageStatus.vue";
+import { userHasPermission } from "../../helpers/utils";
 
 const route = useRoute();
 const router = useRouter();