first commit

src/views/HomeView.vue

@@ -0,0 +1,15 @@
+<template>
+  <Navigation />
+  <div class="flex flex-col flex-1 md:pl-80">
+    <MenuProvider>
+      <RouterView />
+    </MenuProvider>
+  </div>
+</template>
+
+<script setup lang="ts">
+import MenuProvider from '@/components/Menus/MenuProvider.vue';
+import Navigation from '@/components/Navigation.vue';
+
+import { RouterView } from 'vue-router'
+</script>

src/views/LoginView.vue

@@ -0,0 +1,42 @@
+<script setup lang="ts">
+import { useAuthStore } from '@/stores/auth';
+import Icon from '@/assets/images/pln-with-text.png';
+import Hero from '@/assets/images/hero.png';
+import Button from '@/components/ButtonPrimary.vue';
+import InputText from '@/components/InputText.vue';
+
+const authStore = useAuthStore();
+</script>
+
+<template>
+    <div class="flex flex-col items-center justify-center min-h-screen py-2 bg-layout">
+        <div class="flex flex-col px-6 py-6 bg-white shadow rounded-xl shadow-gray-50">
+            <div class="flex flex-row">
+                <div class="flex flex-col md:mr-6">
+                    <img :src="Icon" alt="logo" class="w-[266px] mb-8" />
+                    <h1 class="mb-2 text-3xl text-dark">Login</h1>
+                    <p class="mb-6 font-medium text-gray-400">Selamat datang kembali</p>
+
+                    <form @submit.prevent="authStore.login" class="flex flex-col">
+                        <label for="username" class="mb-2 text-xs font-medium text-dark">Username</label>
+                        <InputText class-name="mb-3 text-sm placeholder:text-sm" placeholder="Masukan Username"
+                            :value="authStore.username" @update:value="authStore.username = $event" />
+
+                        <label for="password" class="mb-2 text-xs font-medium text-dark">Password</label>
+                        <InputText class-name="mb-3 text-sm placeholder:text-sm" type="password"
+                            placeholder="Masukan Password" :value="authStore.password"
+                            @update:value="authStore.password = $event" />
+
+                        <Button type="submit" label="Login" :disabled="authStore.isLoading"
+                            :is-loading="authStore.isLoading" />
+                    </form>
+                </div>
+                <div class="hidden grow md:block">
+                    <img :src="Hero" alt="logo" class="h-full" />
+                </div>
+            </div>
+
+        </div>
+    </div>
+</template>
+

src/views/NotFoundView.vue

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { RouterLink } from 'vue-router'
+</script>
+
+<template>
+  <main class="grid min-h-full px-6 py-24 bg-white place-items-center sm:py-32 lg:px-8">
+    <div class="text-center">
+      <p class="text-base font-semibold text-indigo-600">404</p>
+      <h1 class="mt-4 text-3xl font-bold tracking-tight text-gray-900 sm:text-5xl">Tidak ditemukan</h1>
+      <p class="mt-6 text-base leading-7 text-gray-600">Maaf, kami tidak menemukan halaman yang Anda cari.</p>
+      <div class="flex items-center justify-center mt-10 gap-x-6">
+        <RouterLink to="/"
+          class="rounded-md bg-indigo-600 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">
+          Kembali ke home</RouterLink>
+        <a href="#" class="text-sm font-semibold text-gray-900">Hubungi bantuan <span aria-hidden="true">&rarr;</span></a>
+      </div>
+    </div>
+  </main>
+</template>