update search function

src/components/Section2Green.vue

@@ -14,8 +14,10 @@
         ขั้นตอนที่
         <v-avatar color="#f4c03f" class="text-subtitle">2</v-avatar>
       </div>
-      <div class="text-title my-3">มาลองสร้างตัวตนสมัคร สว.</div>
+      <!-- <div class="text-title my-3">มาลองสร้างตัวตนสมัคร สว.</div> -->
-      <div class="mb-8">ลงทะเบียนแสดงตัวตน แสดงความคิดเห็น สมัคร สว.</div>
+      <div class="mb-8">
+        ลงทะเบียนแสดงตัวตน / ค้นหาผู้แสดงตนเป็นผู้สมัคร สว.
+      </div>
 
       <v-btn
         elevated
@@ -29,19 +31,17 @@
           :aspect-ratio="1"
           src="../assets/Group 23.png"
           width="80"
-          style="position: absolute; bottom: -40px; right: 0"
+          style="position: absolute; bottom: -40px; left: 0"
         ></v-img>
         <span class="text-normal"> ลงทะเบียนผู้สมัคร</span>
       </v-btn>
     </div>
-    <div
+    <div class="text-center text-white pb-20 mx-auto" style="width: 90%">
-      class="text-center text-white py-10 pb-20 mx-auto"
+      <div v-if="getUsername" class="mt-10">
-      v-if="getUsername"
+        <div class="text-title my-3">ค้นหาผู้แสดงตนเป็นผู้สมัคร สว.</div>
-      style="width: 90%"
+        <div class="mb-8">
-    >
+          ค้นหาผู้แสดงตนเป็นผู้สมัคร สว. ใน จังหวัด/อำเภอ ที่ตัวเองเป็นผู้แสดงตน
-      <div class="text-title my-3">ค้นหาผู้แสดงตนเป็นผู้สมัคร สว.</div>
+        </div>
-      <div class="mb-8">
-        ค้นหาผู้แสดงตนเป็นผู้สมัคร สว. ใน จังหวัด/อำเภอ ที่ตัวเองเป็นผู้แสดงตน
       </div>
       <v-btn
         elevated

src/components/search/CardUser.vue

@@ -36,12 +36,15 @@
                     class="mx-auto img-display"
                   >
                   </v-img
-                  ><v-avatar
+                  >
-                    color="#635d56"
+                     <v-icon
-                    size="180"
+                      v-else
-                    class="mx-auto my-auto"
+                            icon="mdi-account"
-                    v-else
+                            size="180"
-                  ></v-avatar>
+                            color="#635d56"
+                            class="mx-auto my-auto"
+                          ></v-icon>
+                 
                 </v-col>
                 <v-col cols="12" md="" class="mx-auto">
                   <v-row>

src/components/search/CardUserGroup.vue

@@ -14,7 +14,7 @@
       <div class="text-subtitle text-left mb-md-3">
         <v-row align="center">
           <v-col cols="auto" class="pa-0 pl-2 pt-2">
-            <v-avatar color="#3d763d" class="text-normal" size="50"
+            <v-avatar color="#f5e010" class="text-normal" size="50"
               >{{ group.id }}
             </v-avatar></v-col
           >
@@ -22,6 +22,7 @@
         </v-row>
       </div>
       <!-- {{ result }} -->
+      <!-- {{ chunkedResults }} -->
       <v-container>
         <v-carousel
           v-model="model"
@@ -29,14 +30,14 @@
           style="max-width: 900px"
           class="mx-auto"
         >
-          <v-carousel-item v-for="(item, i) in result" :value="i" :key="i">
+          <v-carousel-item
+            v-for="(chunk, i) in chunkedResults"
+            :value="i"
+            :key="i"
+          >
             <v-row class="page-search">
               <v-col :key="i" cols="12" md="12" lg="12">
-                <v-card
+                <div class="text-sub2 mx-auto card-user" maxWidth="1000">
-                  class="text-sub2 mx-auto py-3 card-user"
-                  maxWidth="1000"
-                  rounded="xl"
-                >
                   <v-overlay
                     class="align-center justify-center"
                     scrim="#2a2a2adb"
@@ -55,140 +56,43 @@
                       ไม่พบข้อมูลผู้สมัคร
                     </div>
                   </v-overlay>
-                  <v-card-item>
+                  <div
-                    <v-row
+                    style="
-                      align="left"
+                      background: white;
-                      style="min-height: 450px"
+                      border-radius: 10px;
-                      class="mobile-col"
+                      min-height: 180px;
-                    >
+                    "
-                      <v-col cols="12" md="5" class="text-cente my-auto">
+                    class="py-5"
-                        <!-- {{ item.image }} -->
+                  >
-                        <v-img
+                    <div v-for="(item, j) in chunk" :key="j" cols="12" md="4">
-                          v-if="item && item.image"
+                      <div class="font-weight-bold my-2">
-                          :src="item.image"
-                          cover
-                          rounded="xl"
-                          class="mx-auto img-display-g"
-                        >
-                        </v-img>
-                        <div v-else>
-                          <v-icon
-                            icon="mdi-account"
-                            size="180"
-                            color="#635d56"
-                            class="mx-auto my-auto"
-                          ></v-icon>
-                        </div>
-                      </v-col>
-                      <v-col cols="12" md="" class="mx-auto">
-                        <v-row>
-                          <v-col>
-                            <div class="box-group">
-                              <div>กลุ่มที่</div>
-                              <div
-                                class="font-weight-bold"
-                                style="font-size: xxx-large"
-                                v-if="item.group && item.group.id"
-                              >
-                                {{ item.group.id }}
-                              </div>
-                              <div v-else>-</div>
-                            </div>
-                          </v-col>
-                          <v-col>
-                            <div class="box-group">
-                              <div>หมายเลขผู้สมัคร</div>
-                              <div style="font-size: xxx-large">
-                                <div
-                                  class="font-weight-bold"
-                                  v-if="item.registerno"
-                                >
-                                  {{ item.registerno }}
-                                </div>
-                                <div class="font-weight-bold" v-else>-</div>
-                              </div>
-                            </div></v-col
-                          >
-                          <v-col cols="12" md="" class="d-none">
-                            <div class="box-group">
-                              <div
-                                v-if="item.zone.province"
-                                class="font-weight-bold px-3 my-auto"
-                              >
-                                {{ item.zone.province.name }}
-                                <hr />
-                                <span class="font-weight-medium">{{
-                                  item.zone.name
-                                }}</span>
-                              </div>
-                              <div v-else>-</div>
-                            </div>
-                          </v-col>
-                        </v-row>
                         <div
-                          class="py-2 text-sub2 box-province mx-auto mx-md-1 my-4 mobile-box2"
+                          class="mt-3 mb-2 mx-auto txt-subtitle"
-                          v-if="item.zone.province"
+                          style="width: 90%; margin: auto"
+                          v-if="item.firstName"
                         >
-                          <div class="font-weight-bold px-3">
+                          <span>{{ item.firstName }}</span>
-                            {{ item.zone.province.name }} |
+                          <span class="ml-3">{{ item.lastName }}</span>
-                            <span class="font-weight-medium">{{
-                              item.zone.name
-                            }}</span>
-                          </div>
                         </div>
                         <div v-else>-</div>
-                        <div class="font-weight-bold my-2 text-md-left">
+                      </div>
-                          <div
+                    </div>
-                            class="mt-3 mb-2"
+                    <!-- <div class="font-weight-bold my-2 text-md-left">
-                            style="font-size: xx-large"
+                      <div
-                            v-if="item.firstName"
+                        class="mt-3 mb-2"
-                          >
+                        style="font-size: xx-large"
-                            <span> {{ item.firstName }}</span>
+                        v-if="item.firstName"
-                            <span class="ml-3">
+                      >
-                              {{ item.lastName }}
+                        <span> {{ item.firstName }}</span>
-                            </span>
+                        <span class="ml-3">
-                          </div>
+                          {{ item.lastName }}
-                          <div v-else>-</div>
+                        </span>
-                          <!-- <div
+                      </div>
-                          v-if="item.group.name"
+                      <div v-else>-</div>
-                            class="mx-auto text-md-left text-sub2 my-1 more w-100 d-none"
+                    </div> -->
-                          >
+                  </div>
-                            {{ item.group.name }}
+                </div></v-col
-                          </div>
+              >
-                          <div v-else > - </div> -->
-                          <div
-                            class="text-sub2 text-left mt-5 text-medium-emphasis"
-                          >
-                            <div class="font-weight-medium">
-                              <span class="font-weight-bold"> อายุ :</span>
-
-                              <span v-if="item.age">{{ item.age }}</span>
-                              <span v-else> - </span> ปี
-                            </div>
-
-                            <div
-                              class="font-weight-medium text-medium-emphasis"
-                            >
-                              <span class="font-weight-bold">อาชีพ :</span>
-                              <span v-if="item.job"> {{ item.job }}</span>
-                              <span v-else> - </span>
-                            </div>
-                            <div
-                              class="font-weight-medium text-medium-emphasis"
-                            >
-                              <span class="font-weight-bold">การศึกษา :</span>
-                              <span v-if="item.education">
-                                {{ item.education }}</span
-                              >
-                              <span v-else> - </span>
-                            </div>
-                            <br />
-                          </div>
-                        </div>
-                      </v-col>
-                    </v-row>
-                  </v-card-item> </v-card
-              ></v-col>
             </v-row>
           </v-carousel-item>
         </v-carousel>
@@ -218,6 +122,16 @@ export default {
       type: Object,
     },
   },
+  computed: {
+    chunkedResults() {
+      const chunkSize = 3;
+      let chunks = [];
+      for (let i = 0; i < this.result.length; i += chunkSize) {
+        chunks.push(this.result.slice(i, i + chunkSize));
+      }
+      return chunks;
+    },
+  },
   data() {
     return {
       overlay: false,
@@ -241,18 +155,18 @@ export default {
     this.$emit("valueSent", true);
     // this.load2 = true;
     let data = {};
-    if (this.province && this.province.id) {
+    if (this.province) {
-      data.province = this.province.id;
+      data.province = this.province;
     }
     if (this.district) {
-      data.zone = this.district.id;
+      data.zone = this.district;
     }
     if (this.group) {
       data.group = this.group.id;
     }
-    data.limit = 5;
+    data.limit = 30;
     if (data) {
-      client.user.getAllUser
+       client.user.getAllUser
         .query(data)
         .then((rs) => {
           this.cardCount = rs.length;
@@ -302,10 +216,69 @@ export default {
         })
         .catch((error) => {
           this.load = false;
-
-          // alert("ไม่สามารถโหลดข้อมูลได้");
           console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error);
         });
+        
+      // let param = { input: JSON.stringify({ 0: data }) };
+      // var axios = require("axios");
+
+      // const config = {
+      //   method: "get",
+      //   url: "http://localhost:3000/api/user.getAllUser",
+      //   params: param,
+      //   headers: {},
+      // };
+
+      // axios(config)
+      //   .then((response) => {
+      //     const rs = response.data.result.data;
+      //     this.cardCount = rs.length;
+      //     if (rs.length) {
+      //       this.show = true;
+      //       this.result = rs;
+      //     } else {
+      //       this.overlay = true;
+      //       this.show = false;
+      //       this.result = [
+      //         {
+      //           show: false,
+      //           id: 56,
+      //           firstName: "",
+      //           lastName: "",
+      //           title: "",
+      //           cid: "1767250304480",
+      //           age: " -",
+      //           job: " -",
+      //           education: " -",
+      //           vision: null,
+      //           reason: null,
+      //           group: {
+      //             id: this.group.id,
+      //             name: " -",
+      //           },
+      //           zone: {
+      //             id: " -",
+      //             name: this.district.name,
+      //             province: {
+      //               id: "",
+      //               name: this.province.name,
+      //             },
+      //           },
+      //         },
+      //       ];
+      //     }
+      //     console.log(rs);
+      //     this.load = false;
+      //     if (rs.length == 0) {
+      //       this.show = true;
+      //     }
+      //     this.$emit("valueSent", false);
+      //   })
+      //   .catch((error) => {
+      //     this.load = false;
+      //     console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error);
+      //   });
+     
     }
   },
 };
@@ -334,13 +307,15 @@ export default {
 div.v-window__container
   > div.v-window__controls
   > button.v-btn.v-btn--elevated.v-btn--icon.v-theme--light.v-btn--density-default.v-btn--size-default.v-btn--variant-elevated {
-  background-color: #00000078;
+  background-color: #3d763d8c;
   color: white;
 }
 .v-carousel__controls {
-  border-bottom-right-radius: 24px;
+  margin-top: 40px;
-  border-bottom-left-radius: 24px;
+  border-bottom-right-radius: 10px;
-  background-color: #00000078;
+  border-bottom-left-radius: 10px;
+  background-color: #3d763d8c;
+  height: 23px;
 }
 .img-display-g {
   height: 450px;
@@ -398,7 +373,7 @@ div.v-window__container
     margin-bottom: 0px !important;
   }
   .v-carousel__controls {
-    height: 35px;
+    height: 23px;
   }
   div.mx-auto.text-md-left.text-sub2.my-1 {
     margin: 0 !important;

src/components/search/SearchMain.vue

@@ -17,10 +17,9 @@
       </div>
       <v-container>
         <!-- {{ checkdata }} -->
-        <v-row>
+        <v-row class="d-none" v-if="fasle">
           <v-col cols="12" md="4">
             <v-text-field
-              v-if="province"
               label="จังหวัด"
               variant="solo"
               v-model="province"
@@ -44,7 +43,6 @@
           </v-col>
           <v-col cols="12" md="4">
             <v-text-field
-              v-if="province"
               label="อำเภอ / เขต"
               variant="solo"
               v-model="district"
@@ -67,7 +65,6 @@
           </v-col>
           <v-col cols="12" md="4">
             <v-text-field
-              v-if="province"
               label="กลุ่มอาชีพ"
               variant="solo"
               v-model="group"
@@ -94,8 +91,109 @@
             </v-autocomplete> -->
           </v-col>
         </v-row>
+        <v-row>
+          <v-col cols="12" md="4">
+            <!-- <v-text-field
+              label="จังหวัด"
+              variant="solo"
+              v-model="province"
+
+            ></v-text-field> -->
+
+            <v-autocomplete
+              clearable
+              label="จังหวัด"
+              :items="provinceItems"
+              variant="solo"
+              item-title="name"
+              item-value="id"
+              v-model="province"
+              placeholder="จังหวัด"
+              @update:modelValue="filterData"
+              hide-details
+            ></v-autocomplete>
+          </v-col>
+          <v-col cols="12" md="4">
+            <!-- <v-text-field
+              label="อำเภอ / เขต"
+              variant="solo"
+              v-model="district"
+          
+   
+            ></v-text-field> -->
+            <v-autocomplete
+              clearable
+              label="อำเภอ / เขต"
+              :items="districtItems"
+              variant="solo"
+              item-title="name"
+              v-model="district"
+              item-value="id"
+              placeholder="อำเภอ / เขต"
+              hide-details
+              :disabled="province == null"
+            ></v-autocomplete>
+          </v-col>
+          <v-col cols="12" md="4">
+            <!-- <v-text-field
+              label="กลุ่มอาชีพ"
+              variant="solo"
+              v-model="group"
+            ></v-text-field> -->
+
+            <v-autocomplete
+              v-model="group"
+              clearable
+              label="กลุ่มอาชีพ"
+              :items="items"
+              variant="solo"
+              :item-title="(item) => item.id + ' ' + item.name"
+              return-object
+              placeholder="กลุ่มอาชีพ"
+              hide-details
+              @update:modelValue="filterName"
+            >
+              <template v-slot:item="{ props, item }">
+                <v-list-item
+                  v-bind="props"
+                  :title="item.raw.id + ' ' + item.raw.name"
+                ></v-list-item>
+              </template>
+            </v-autocomplete>
+          </v-col>
+          <v-col cols="12" md="12">
+            <!-- <v-text-field
+              label="กลุ่มอาชีพ"
+              variant="solo"
+              v-model="group"
+            ></v-text-field> -->
+            <!-- {{ nameUser }} -->
+            <v-autocomplete
+              clearable
+              label="รายชื่อ"
+              :items="nameUserItems"
+              variant="solo"
+              :item-title="(item) => item.firstName + ' ' + item.lastName"
+              item-value="id"
+              placeholder="รายชื่อ"
+              :loading="loadname"
+              hide-details
+              v-model="nameUser"
+              :disabled="nameUserItems.length == 0 || group == null"
+            >
+              <!-- <template v-slot:selection="{ item }">
+                {{ item.firstName }} {{ item.lastName }}
+              </template> -->
+              <template v-slot:item="{ props, item }">
+                <v-list-item
+                  v-bind="props"
+                  :title="item.raw.firstName + ' ' + item.raw.lastName"
+                ></v-list-item>
+              </template>
+            </v-autocomplete>
+          </v-col>
+        </v-row>
         <v-btn
-         v-if="province"
           color="#e23972"
           class="mt-8"
           elevated
@@ -104,6 +202,7 @@
             searchUserApi(0, '');
             showGroup = false;
           "
+          :disabled="district == null || group == null || province == null"
           :loading="load || load2"
           width="300"
           height="52px"
@@ -112,17 +211,20 @@
         </v-btn>
         <!-- @click="searchUserApi(0, 'all')" -->
         <v-btn
-         v-if="province"
           color="#4c884c"
           class="mx-5 mt-8"
           elevated
           size="large"
           width="300"
-          @click="showGroup = true"
+          @click="clickShowGroup"
           :loading="load || load2"
           height="52px"
+          stack
+          :disabled="district == null || group == null || province == null"
         >
-          <span class="text-sub">ค้นหาทุกกลุ่มอาชีพ</span>
+          <div class="text-sub">ค้นหาต่างกลุ่มอาชีพ</div>
+
+          <!-- <div class="txt-small">(ยกเว้นอาชีพตนเอง)</div> -->
         </v-btn>
       </v-container>
       <div v-if="!showGroup">
@@ -169,10 +271,10 @@
       </div>
       <!-- </v-container>  -->
 
-      <div v-for="(group, i) in apiGroup" :key="i">
+      <div v-for="(groupx, i) in apiGroup" :key="groupxKey + '-' + i">
         <CardUserGroup
           :check="checkbox1"
-          :group="group"
+          :group="groupx"
           :province="province"
           :district="district"
           v-if="showGroup"
@@ -188,14 +290,22 @@
 import CardUser from "./CardUser.vue";
 import CardUserGroup from "./CardUserGroup.vue";
 import { client } from "@/utils/trpc";
+import { mapGetters } from "vuex";
 
 export default {
+  computed: {
+    ...mapGetters(["getUsername", "getImg"]),
+  },
   components: {
     CardUser,
     CardUserGroup,
   },
   data() {
     return {
+      groupxKey: 0,
+      loadname: false,
+      nameUser: null,
+      nameUserItems: [],
       load2: false,
       checkbox1: true,
       showGroup: false,
@@ -217,11 +327,77 @@ export default {
     };
   },
   methods: {
+    clickShowGroup() {
+      // this.showGroup = false;
+      this.groupxKey += 1;
+      this.showGroup = true;
+    },
+    filterName() {
+      // console.log("grop", this.group);
+      this.nameUser = null;
+      this.getUserItems(0);
+      let filteredGroup = [...this.items].filter((x) => x.id !== this.group.id);
+      this.apiGroup = filteredGroup;
+    },
     handleValueSent(value) {
       this.load2 = value;
       console.log("Received value from child:", value);
       // ทำงานกับค่าที่ได้รับ
     },
+    getUserItems(offset) {
+      this.show = false;
+      this.loadname = true;
+      if (offset == 0) {
+        this.page = 1;
+      }
+      let data = {
+        offset: offset,
+      };
+      if (this.province) {
+        data.province = this.province;
+        // data.province = this.province;
+      }
+      if (this.group && this.group.id) {
+        // console.log(this.group.id);
+        data.group = this.group.id;
+      }
+      if (this.district) {
+        data.zone = this.district;
+      }
+
+      // let param = { input: JSON.stringify({ 0: data }) };
+      // var axios = require("axios");
+      // var config = {
+      //   method: "get",
+      //   url: "http://localhost:3000/api/user.getAllUser",
+      //   params: param,
+      //   headers: {},
+      // };
+
+      // axios(config)
+      //   .then((response) => {
+      //     this.nameUserItems = response.data.result.data;
+      //     this.loadname = false;
+      //     console.log("nameUserItems", this.nameUserItems);
+      //   })
+      //   .catch((error) => {
+      //     this.loadname = false;
+      //     console.log(error);
+      //   });
+
+      client.user.getAllUser
+        .query(data)
+        .then((rs) => {
+          this.nameUserItems = rs;
+          console.log(rs);
+          this.loadname = false;
+        })
+        .catch((error) => {
+          this.loadname = false;
+          alert("ไม่สามารถโหลดข้อมูลรายชื่อได้ได้");
+          console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error);
+        });
+    },
     searchUser(offset) {
       this.show = false;
       this.load = true;
@@ -233,7 +409,7 @@ export default {
         limit: 2,
       };
       if (this.province) {
-        data.province = this.province.id;
+        data.province = this.province;
         // data.province = this.province;
       }
       if (this.group) {
@@ -242,10 +418,12 @@ export default {
         }
       }
       if (this.district) {
-        data.zone = this.district.id;
+        data.zone = this.district;
+      }
+      if (this.nameUser) {
+        data.userId = this.nameUser;
       }
 
-      // console.log(data);
       client.user.getAllUser
         .query(data)
         .then((rs) => {
@@ -255,8 +433,6 @@ export default {
           if (rs.length == 0) {
             this.show = true;
           }
-
-          // this.districtItems = rs;
         })
         .catch((error) => {
           this.load = false;
@@ -278,7 +454,7 @@ export default {
         limit: 2,
       };
       if (this.province) {
-        data.province = this.province.id;
+        data.province = this.province;
         // data.province = this.province;
       }
 
@@ -288,19 +464,65 @@ export default {
         }
       }
       if (this.district) {
-        data.zone = this.district.id;
+        data.zone = this.district;
       }
 
-      // console.log(data);
+      if (this.nameUser) {
-      client.user.getAllUserCount
+        data.userId = this.nameUser;
-        .query(data)
+      }
-        .then((rs) => {
+
-          this.count = rs;
+      // let param = { input: JSON.stringify({ 0: data }) };
-        })
+      // var axios = require("axios");
-        .catch((error) => {
+      // if (this.nameUser) {
-          alert("ไม่สามารถโหลดข้อมูลได้");
+      //   this.count = 1;
-          console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error);
+      // } else {
-        });
+      //   var config = {
+      //     method: "get",
+      //     url: "http://localhost:3000/api/user.getAllUserCount",
+      //     params: param,
+      //     headers: {},
+      //   };
+
+      //   axios(config)
+      //     .then((response) => {
+      //       this.count = response.data.result.data;
+      //       console.log("getAllUserCount", this.count);
+      //     })
+      //     .catch((error) => {
+      //       console.log(error);
+      //     });
+      // }
+      if (this.nameUser) {
+        this.count = 1;
+      } else {
+        client.user.getAllUserCount
+          .query(data)
+          .then((rs) => {
+            this.count = rs;
+          })
+          .catch((error) => {
+            alert("ไม่สามารถโหลดข้อมูลได้");
+            console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error);
+          });
+      }
+      // var config2 = {
+      //   method: "get",
+      //   url: "http://localhost:3000/api/user.getAllUser",
+      //   params: param,
+      //   headers: {},
+      // };
+
+      // axios(config2)
+      //   .then((response) => {
+      //     this.result = response.data.result.data;
+      //     this.load = false;
+      //     console.log("nameUserItems", this.nameUserItems);
+      //   })
+      //   .catch((error) => {
+      //     this.load = false;
+
+      //     console.log(error);
+      //   });
 
       client.user.getAllUser
         .query(data)
@@ -312,11 +534,9 @@ export default {
             this.show = true;
           }
 
-          // this.districtItems = rs;
         })
         .catch((error) => {
           this.load = false;
-
           // alert("ไม่สามารถโหลดข้อมูลได้");
           console.error("เกิดข้อผิดพลาดในการโหลดข้อมูล:", error);
         });
@@ -373,7 +593,9 @@ export default {
       .query({})
       .then((data) => {
         this.provinceItems = data;
-        this.getUser(data);
+        if (this.getUsername) {
+          this.getUser(data);
+        }
       })
       .catch((error) => {
         // alert("ไม่สามารถโหลดข้อมูลได้");
@@ -383,6 +605,9 @@ export default {
 };
 </script>
 <style>
+.v-input__control {
+  background: white;
+}
 .check-card .v-selection-control {
   align-items: center !important;
   font-size: 25px;

src/config.js

@@ -1,4 +1,5 @@
 export const CONFIG = {
-  // api_url: "http://178.128.18.156:3000",
   api_url: process.env.VUE_APP_API_URL || "http://localhost:3000",
+  // api_url: "https://info67.org/api/",
+  // api_url: "http://178.128.18.156:3000",
 };

src/views/SearchUser.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
-    <FormMain v-if="getUsername" />
+    <FormMain  />
-    <div
+    <!-- <div
       v-if="
         getUsername == '' || getUsername == null || getUsername == undefined
       "
@@ -9,7 +9,7 @@
     >
       <v-icon icon="mdi-alert-circle-outline" size="35" color="red"></v-icon>
       ไม่สามารถเข้าถึงได้ กรุณาเข้าสู่ระบบ
-    </div>
+    </div> -->
   </div>
 </template>
 <script>