From ab533c190d298b9f61cf24d3f46e95517db7130f Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Fri, 19 Apr 2024 11:09:36 +0700
Subject: [PATCH] fix: drawer width

---
 src/components/DrawerInfo.vue | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/DrawerInfo.vue b/src/components/DrawerInfo.vue
index 18e82154..48881be5 100644
--- a/src/components/DrawerInfo.vue
+++ b/src/components/DrawerInfo.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref } from 'vue';
+import { ref, watch } from 'vue';
 
 defineProps<{
   title: string;
@@ -12,6 +12,7 @@ defineProps<{
   undo?: (...args: unknown[]) => void;
 }>();
 
+// const drawerWidth = ref(window.screen.width * 0.8);
 const drawerOpen = defineModel<boolean>('drawerOpen', {
   default: false,
 });
@@ -23,13 +24,22 @@ function reset() {
     myForm.value.resetValidation();
   }
 }
+
+// watch(
+//   () => window.screen.width,
+//   (v) => {
+//     console.log(v);
+
+//     drawerWidth.value = v;
+//   },
+// );
 </script>
 <template>
   <q-drawer
     @before-hide="reset"
     @hide="close"
-    :width="1300"
-    :breakpoint="500"
+    :width="$q.screen.gt.md ? 1200 : $q.screen.gt.xs ? 700 : 900"
+    :breakpoint="1366"
     v-model="drawerOpen"
     behavior="mobile"
     side="right"