fix: แก้ขนาดการแสดงเลือกสินค้า

src/pages/04_product-service/MainPage.vue

@@ -1170,7 +1170,8 @@ watch(currentStatus, async () => {
 
         <div
           v-if="product && product.length > 0"
-          class="row q-col-gutter-md flex q-pa-md"
+          class="row q-col-gutter-lg flex"
+          style="padding: 20px"
         >
           <div
             :class="`${$q.screen.gt.sm ? 'col-3' : $q.screen.gt.xs ? 'col-6' : 'col-12'}`"
@@ -1375,16 +1376,8 @@ watch(currentStatus, async () => {
       }
     "
   >
-    <div
-      style="
-        width: 75vw;
-        display: grid;
-        background: none;
-        grid-template-rows: auto;
-        gap: var(--size-3);
-      "
-    >
-      <div class="row items-center" style="max-height: 20%">
+    <div class="full-width">
+      <div class="row items-center">
         <q-space />
         <q-input
           outlined
@@ -1400,10 +1393,11 @@ watch(currentStatus, async () => {
           </template>
         </q-input>
       </div>
-
-      <AppBox class="row q-gutter-md" no-padding>
+      <div>
+        <AppBox class="row">
           <div
-          class="co-2"
+            class="q-pa-xs"
+            :class="`${$q.screen.gt.sm ? 'col-3 ' : $q.screen.gt.xs ? 'col-6' : 'col-12'}`"
             v-for="i in (!!searchTotalProduct
               ? resultSearchProduct
               : product
@@ -1465,6 +1459,7 @@ watch(currentStatus, async () => {
           </div>
         </AppBox>
       </div>
+    </div>
   </FormDialog>
 
   <!-- Add Product -->