แก้การแสดงผลหน้าแจ้งปัญหา (support)

src/modules/00_support/components/FormChat.vue

@@ -19,14 +19,15 @@ function getOnlineStatus(option: "icon" | "status") {
   <div
     class="row q-py-md q-px-lg justify-between items-center"
     v-if="store.currentTitle && store.currentTitle.length > 0"
+    style="flex-wrap: nowrap"
   >
-    <div class="col row items-center">
+    <div class="row items-center" style="flex-wrap: nowrap">
       <q-btn
         flat
         padding="none"
         class="q-mr-md"
         icon="mdi-chevron-left"
-        @click="store.isOpen = false"
+        @click="store.openChat = false"
         v-if="!$q.screen.gt.xs"
       />
       <div style="border-radius: 50%; border: 1px solid teal">
@@ -34,8 +35,8 @@ function getOnlineStatus(option: "icon" | "status") {
           <q-icon :name="store.icon" size="24px" color="teal" />
         </q-avatar>
       </div>
-      <div class="col column q-ml-md">
-        <span class="col text-weight-bold">
+      <div class="column q-ml-md">
+        <span class="text-weight-bold ellipsis-2-lines">
           {{ store.currentTitle }}
         </span>
         <span>
@@ -74,7 +75,10 @@ function getOnlineStatus(option: "icon" | "status") {
   </q-scroll-area>
 
   <q-separator />
-  <div class="row q-py-md q-px-lg justify-between items-center q-gutter-x-lg">
+  <div
+    class="row q-py-md q-px-lg justify-between items-center q-gutter-x-lg"
+    style="flex-wrap: nowrap"
+  >
     <!-- <div>
       <q-btn flat disable class="col-1">
         <q-icon
@@ -118,8 +122,10 @@ function getOnlineStatus(option: "icon" | "status") {
         flat
         class="col-2"
         style="color: #009789"
-        label="ส่งข้อความ"
-      />
+      >
+        <span v-if="$q.screen.gt.xs">ส่งข้อความ</span>
+        <q-icon v-else name="mdi-send" size="xs" color="primary" />
+      </q-btn>
     </div>
   </div>
 </template>