From 1f50ed36f3b1b62f3c217f53653a0237971c24e6 Mon Sep 17 00:00:00 2001
From: Net <93821485+somnetsak123@users.noreply.github.com>
Date: Wed, 3 Apr 2024 14:21:02 +0700
Subject: [PATCH] =?UTF-8?q?feat:=20=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88?=
 =?UTF-8?q?=E0=B8=A1=20=20i18n?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/DrawerComponent.vue | 59 +++++++++++++++++++-----------
 1 file changed, 38 insertions(+), 21 deletions(-)

diff --git a/src/components/DrawerComponent.vue b/src/components/DrawerComponent.vue
index 7806ab15..8059ae9c 100644
--- a/src/components/DrawerComponent.vue
+++ b/src/components/DrawerComponent.vue
@@ -1,34 +1,50 @@
 <script setup lang="ts">
-import { ref } from 'vue';
+import { ref, watch } from 'vue';
 import { useRouter } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+
+const { t, locale } = useI18n();
 const router = useRouter();
 
 const currentRoute = ref<string>('');
-const labelMenu: {
-  label: string;
-  icon: string;
-  route: string;
-}[] = [
-  { label: 'Dashboard', icon: 'img:/file-account-outline.png', route: '' },
+
+const labelMenu = ref<{ label: string; icon: string; route: string }[]>([
   {
-    label: 'จัดการสาขา',
+    label: 'drawerDashboard',
+    icon: 'img:/file-account-outline.png',
+    route: '',
+  },
+  {
+    label: 'drawerBranchManagement',
     icon: 'mdi-sitemap-outline',
     route: '/branch-management',
   },
   {
-    label: 'จัดการบุคลากร',
-    icon: 'mdi-account-settings-outline',
+    label: 'drawerPersonnelManagement',
+    icon: 'mdi:account-settings-outline',
     route: '/personnel-management',
   },
-  { label: 'จัดการลูกค้า', icon: 'mdi-account-settings-outline', route: '' },
-  { label: 'สินค้าและบริการ', icon: 'mdi-package-variant', route: '' },
-  { label: 'ใบเสนอราคา', icon: 'mdi-package-variant', route: '' },
-  { label: 'รายการคำขอ', icon: 'mdi-package-variant', route: '' },
-  { label: 'ใบสั่งงาน', icon: 'mdi-package-variant', route: '' },
-  { label: 'ใบรับสินค้า', icon: 'mdi-package-variant', route: '' },
-  { label: 'รายการทางบัญชี', icon: 'mdi-account-cash-outline', route: '' },
-  { label: 'รายงาน', icon: 'mdi-file-chart-outline', route: '' },
-];
+  {
+    label: 'drawerCustomerManagement',
+    icon: 'mdi-account-settings-outline',
+    route: '',
+  },
+  {
+    label: 'drawerProductsAndServices',
+    icon: 'raphael:package',
+    route: '',
+  },
+  { label: 'drawerQuotation', icon: 'raphael:package', route: '' },
+  { label: 'drawerRequestList', icon: 'raphael:package', route: '' },
+  { label: 'drawerWorkOrder', icon: 'raphael:package', route: '' },
+  { label: 'drawerInvoice', icon: 'raphael:package', route: '' },
+  {
+    label: 'drawerAccountingLedger',
+    icon: 'mdi-account-cash-outline',
+    route: '',
+  },
+  { label: 'drawerReport', icon: 'mdi-file-chart-outline', route: '' },
+]);
 
 const leftDrawerOpen = defineModel<boolean>('leftDrawerOpen', {
   default: false,
@@ -70,9 +86,10 @@ function navigateTo(label: string, destination: string) {
         <q-item-section id="btn-drawer-back ">
           <q-item-label class="q-pl-lg">
             <div class="box-border-left" />
-            <q-icon :name="v.icon" size="sm" class="q-mr-xs" />
+            <iconify-icon :icon="v.icon" />
+            <!-- <q-icon :name="v.icon" size="sm" class="q-mr-xs" /> -->
 
-            {{ v.label }}
+            {{ $t(v.label) }}
           </q-item-label>
         </q-item-section>
       </q-item>