client initial commit

Services/client/src/views/MainLayout.vue

@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import { useLoader } from '@/stores/loader'
+import { storeToRefs } from 'pinia'
+import profile from '@/components/Profile.vue'
+
+const loaderStore = useLoader()
+const { loader } = storeToRefs(loaderStore)
+</script>
+
+<template>
+  <q-layout view="hHh lpR fFf">
+    <q-header class="bg-white text-black" bordered>
+      <q-toolbar class="q-py-sm">
+        <q-img
+          src="@/assets/logo.png"
+          spinner-color="white"
+          style="height: 32px; max-width: 32px"
+        />
+        <div class="column q-px-md" id="app-toolbar-title">
+          <span class="text-body1">ระบบทรัพยากรบุคคล</span>
+          <span class="text-caption text-grey">
+            จัดเก็บข้อมูลผลการประเมิน
+          </span>
+        </div>
+
+        <q-space></q-space>
+        <profile v-if="$route.meta.statusAccount" />
+      </q-toolbar>
+    </q-header>
+
+    <q-page-container>
+      <QPage>
+        <router-view :key="$route.fullPath" />
+      </QPage>
+    </q-page-container>
+    <full-loader :visibility="loader" />
+  </q-layout>
+</template>
+
+<style scoped>
+.q-layout {
+  background: var(--q-secondary);
+}
+</style>