Merge pull request #32 from TCC-Klaiton-Diogo/develop

TKD-44 - Criar Dashboard
Get-Workers · Sep 9, 2022 · 91a569d · 91a569d
2 parents 938f4bd + e5e006a
commit 91a569d
Show file tree

Hide file tree

Showing 12 changed files with 147 additions and 8 deletions.
diff --git a/resources/js/Components/Headers/Header.vue b/resources/js/Components/Headers/Header.vue
@@ -0,0 +1,21 @@
+<script setup>
+import Logo from '@/Components/Logos/Logo.vue';
+</script>
+
+<template>
+    <header class="fixed inset-0 h-16 bg-gray-200 border-b border-solid border-gray-300">
+        <div class="flex h-16 w-full">
+            <!-- Logo -->
+            <Logo class="items-center ml-6 my-auto"/>
+
+            <!-- Links -->
+            <div class="w-fit h-full my-auto ml-20 mr-auto">
+                <slot name="links" />
+            </div>
+
+            <div class="justify-end mr-6 my-auto">
+                <slot name="profile" />
+            </div>
+        </div>
+    </header>
+</template>
diff --git a/resources/js/Components/Headers/HeaderGuest.vue b/resources/js/Components/Headers/HeaderGuest.vue
@@ -0,0 +1,16 @@
+<script setup>
+import Header from './Header.vue';
+import Link from '../Links/Link.vue';
+</script>
+
+<template>
+    <Header>
+        <template #profile>
+            <div class="space-x-1">
+                <Link :href="route('login')" class="inline-block">Login</Link>
+                <span>or</span>
+                <Link :href="route('register')" class="inline-block">Register</Link>
+            </div>
+        </template>
+    </Header>
+</template>
diff --git a/resources/js/Components/Links/Link.vue b/resources/js/Components/Links/Link.vue
@@ -0,0 +1,9 @@
+<script setup>
+import { Link } from '@inertiajs/inertia-vue3';
+</script>
+
+<template>
+    <Link class="text-blue-600">
+        <slot />
+    </Link>
+</template>
diff --git a/resources/js/Components/Logos/Logo.vue b/resources/js/Components/Logos/Logo.vue
@@ -0,0 +1,13 @@
+<script setup>
+import { Link } from '@inertiajs/inertia-vue3';
+</script>
+
+<template>
+    <div class="w-fit">
+        <Link :href="route('landingpage')">
+            <h1 class="font-bold text-3xl">
+                GetWorkers
+            </h1>
+        </Link>
+    </div>
+</template>
diff --git a/resources/js/Components/Mains/Main.vue b/resources/js/Components/Mains/Main.vue
@@ -0,0 +1,9 @@
+<template>
+    <main>
+        <div class="pt-24 pb-6 min-h-screen">
+            <div class="container mx-auto bg-gray-100 rounded p-5">
+                <slot />
+            </div>
+        </div>
+    </main>
+</template>
diff --git a/resources/js/Components/Menus/Items/ItemX.vue b/resources/js/Components/Menus/Items/ItemX.vue
@@ -0,0 +1,5 @@
+<template>
+    <div class="flex h-full items-center">
+        <slot />
+    </div>
+</template>
diff --git a/resources/js/Components/Menus/MenuHeaderX.vue b/resources/js/Components/Menus/MenuHeaderX.vue
@@ -0,0 +1,5 @@
+<template>
+    <div class="flex items-center">
+        <slot />
+    </div>
+</template>
diff --git a/resources/js/Layouts/BaseLayout.vue b/resources/js/Layouts/BaseLayout.vue
@@ -0,0 +1,23 @@
+<script setup>
+import { Head } from '@inertiajs/inertia-vue3';
+
+defineProps({
+    title: String,
+});
+</script>
+
+<template>
+    <div class="min-h-screen">
+        <Head :title="title" />
+
+        <!-- Header -->
+        <slot name="header" />
+
+        <!-- Main -->
+        <slot name="main" />
+
+        <!-- Footer -->
+        <slot name="footer" />
+    </div>
+
+</template>
diff --git a/resources/js/Layouts/GuestLayout.vue b/resources/js/Layouts/GuestLayout.vue
@@ -0,0 +1,23 @@
+<script setup>
+import Main from '../Components/Mains/Main.vue';
+import BaseLayout from './BaseLayout.vue';
+import HeaderGuest from '../Components/Headers/HeaderGuest.vue';
+
+defineProps({
+    title: String,
+});
+</script>
+
+<template>
+    <BaseLayout :title="title">
+        <template #header>
+            <HeaderGuest />
+        </template>
+
+        <template #main>
+            <Main>
+                <slot name="main" />
+            </Main>
+        </template>
+    </BaseLayout>
+</template>
diff --git a/resources/js/Pages/Landingpage.vue b/resources/js/Pages/Landingpage.vue
@@ -0,0 +1,11 @@
+<script setup>
+import GuestLayout from '../Layouts/GuestLayout.vue';
+</script>
+
+<template>
+    <GuestLayout title="Welcome">
+        <template #main>
+            <div class="h-96"></div>
+        </template>
+    </GuestLayout>
+</template>
diff --git a/resources/views/app.blade.php b/resources/views/app.blade.php
@@ -14,7 +14,7 @@
         @vite('resources/js/app.js')
         @inertiaHead
     </head>
-    <body class="font-sans antialiased">
+    <body class="font-sans antialiased bg-gray-200">
         @inertia
     </body>
 </html>
diff --git a/routes/web.php b/routes/web.php
@@ -15,14 +15,18 @@
 |
 */
 
+// Route::get('/', function () {
+//     return Inertia::render('Welcome', [
+//         'canLogin' => Route::has('login'),
+//         'canRegister' => Route::has('register'),
+//         'laravelVersion' => Application::VERSION,
+//         'phpVersion' => PHP_VERSION,
+//     ]);
+// });
+
 Route::get('/', function () {
-    return Inertia::render('Welcome', [
-        'canLogin' => Route::has('login'),
-        'canRegister' => Route::has('register'),
-        'laravelVersion' => Application::VERSION,
-        'phpVersion' => PHP_VERSION,
-    ]);
-});
+    return Inertia::render('Landingpage');
+})->name('landingpage');
 
 Route::middleware([
     'auth:sanctum',