From 68c8c75dbb05a85d18d2d66fef6564f88b5c00a5 Mon Sep 17 00:00:00 2001
From: puri-ph4tt <puriphat001@gmail.com>
Date: Mon, 5 Feb 2024 18:00:15 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88=E0=B8=A1?=
 =?UTF-8?q?=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B9=80=E0=B8=A5=E0=B8=B7=E0=B9=88?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=99=E0=B9=81=E0=B8=8A=E0=B8=97=E0=B8=A1=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A5=E0=B9=88=E0=B8=B2=E0=B8=AA=E0=B8=B8=E0=B8=94=20(suppo?=
 =?UTF-8?q?rt)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/00_support/components/FormChat.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/modules/00_support/components/FormChat.vue b/src/modules/00_support/components/FormChat.vue
index 5c1a687..e60fb2b 100644
--- a/src/modules/00_support/components/FormChat.vue
+++ b/src/modules/00_support/components/FormChat.vue
@@ -1,19 +1,18 @@
 <script setup lang="ts">
 import { ref } from "vue";
+import { storeToRefs } from "pinia";
 import { useSupportStore } from "@/modules/00_support/store/Main";
 import ChatMessage from "@/modules/00_support/components/ChatMessage.vue";
 
 const store = useSupportStore();
 const content = ref<string>("");
+const { scrollContainer } = storeToRefs(store);
 
 function getOnlineStatus(option: "icon" | "status") {
   const isAdmin = store.userStatus.some((u) => u.role.includes("admin"));
   if (option === "icon") return isAdmin ? "green" : "grey";
   if (option === "status") return isAdmin ? "ออนไลน์" : "ออฟไลน์";
 }
-defineProps({
-  icon: String,
-});
 </script>
 
 <template>
@@ -24,7 +23,7 @@ defineProps({
     <div class="col row">
       <div style="border-radius: 50%; border: 1px solid teal">
         <q-avatar color="teal-1" text-color="white" size="40px">
-          <q-icon :name="icon" size="24px" color="teal" />
+          <q-icon :name="store.icon" size="24px" color="teal" />
         </q-avatar>
       </div>
       <div class="col column q-ml-md">
@@ -56,6 +55,7 @@ defineProps({
 
   <q-scroll-area
     style="background-color: #f5f4f4"
+    ref="scrollContainer"
     :style="{
       height: $q.screen.gt.md ? '600px' : '450px',
     }"