วินัยเพิ่มผู้ถูกร้องเรียน

src/components/Dialogs/AddPersonal.vue

@@ -27,15 +27,15 @@ interface tableType {
 }
 
 const rows = ref<tableType[]>([]);
-const type = ref<string>("001");
+const type = ref<string>("idcard");
 const search = ref<string>("");
 const selected = ref<any>([]);
 const dataObject = ref<any>([]);
 
 const typeOps = ref<typeOp[]>([
-  { id: "001", name: "เลขประจำตัวประชาชน" },
-  { id: "002", name: "ชื่อ" },
-  { id: "003", name: "นามสกุล" },
+  { id: "idcard", name: "เลขประจำตัวประชาชน" },
+  { id: "firstname", name: "ชื่อ" },
+  { id: "lastname", name: "นามสกุล" },
 ]);
 
 /** หัวข้อที่เเสดงในตาราง */
@@ -101,6 +101,11 @@ const props = defineProps({
   modal: {
     type: Boolean,
     default: false,
+    required: true,
+  },
+  btnTitle: {
+    type: String,
+    default: "เพิ่ม",
   },
   title: {
     type: String,
@@ -113,10 +118,12 @@ const props = defineProps({
   close: {
     type: Function,
     default: () => console.log("not function"),
+    required: true,
   },
   save: {
     type: Function,
     default: () => console.log("not function"),
+    required: true,
   },
 });
 
@@ -227,8 +234,9 @@ onMounted(() => {
       <q-separator />
       <q-card-section class="q-pa-md bg-grey-1">
         <div class="row col-12 q-col-gutter-sm items-start">
-          <div class="col-12 col-sm-6 col-md-4">
+          <div class="col-12 col-sm-6 col-md-3">
             <q-select
+              label="ค้นหาจาก"
               v-model="type"
               :options="typeOps"
               emit-value
@@ -241,31 +249,23 @@ onMounted(() => {
             />
           </div>
 
-          <div class="col-12 col-sm-6 col-md-4">
+          <div class="col-12 col-sm-6 col-md-6">
             <q-input
               v-model="search"
               outlined
               clearable
               @update:model-value="updateInput"
               dense
-              :label="
-                type === '001'
-                  ? 'ค้นหาจากเลขบัตรประชาชน'
-                  : type === '002'
-                  ? 'ค้นหาจากชื่อ'
-                  : type === '003'
-                  ? 'ค้นหาจากนามสกุล'
-                  : ''
-              "
+              label="คำค้น"
             />
           </div>
 
-          <div class="col-12 col-sm-6 col-md-4">
+          <div class="col-12 col-sm-6 col-md-2">
             <q-btn
-              color="public"
+              color="primary"
+              icon="search"
               label="ค้นหา"
-              class="full-width"
-              style="padding: 7px 0 7px 0"
+              class="full-width q-pa-sm"
               @click="searchInput()"
             >
             </q-btn>
@@ -342,17 +342,15 @@ onMounted(() => {
       <div class="row justify-end q-px-md q-py-sm items-center">
         <q-btn
           dense
-          push
-          unelevated
-          color="positive"
+          color="public"
           id="onSubmit"
           class="q-px-md q-py-xs"
           @click="savePost"
         >
-          <q-icon left name="add" />
-          <div>เพิ่ม</div>
+          <!-- <q-icon left name="add" /> -->
+          <div>{{ props.btnTitle }}</div>
           <!-- icon="mdi-content-save-outline" -->
-          <q-tooltip>บันทึก</q-tooltip>
+          <q-tooltip>{{ props.btnTitle }}</q-tooltip>
         </q-btn>
       </div>
     </q-card>