UI ออกคำสั่งลงโทษทางวินัย step 1

src/modules/11_discipline/components/4_Order/Step01.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import { ref } from "vue";
 import { useQuasar } from "quasar";
+
+import type { DataOption } from "../../interface/index/Main";
 // importStroe
 import { useCounterMixin } from "@/stores/mixin";
 
@@ -20,9 +22,32 @@ const props = defineProps({
 });
 const next = () => props.next();
 
-const typeOrder = ref<string>("");
+const orderTypeOptions = ref<DataOption[]>([
+  { id: "0", name: "ประเภทคำสั่ง 1" },
+  { id: "1", name: "ประเภทคำสั่ง 2" },
+  { id: "2", name: "ประเภทคำสั่ง 3" },
+]);
+const orderByOptions = ref<DataOption[]>([
+  { id: "0", name: "คำสั่งโดย 1" },
+  { id: "1", name: "คำสั่งโดย 2" },
+  { id: "2", name: "คำสั่งโดย 3" },
+]);
+const listInvestigationOptions = ref<DataOption[]>([
+  { id: "0", name: "รายการสอบสวนความผิดทางวินัย 1" },
+  { id: "1", name: "รายการสอบสวนความผิดทางวินัย 2" },
+  { id: "2", name: "รายการสอบสวนความผิดทางวินัย 3" },
+]);
+
+const orderType = ref<string>("");
+const orderBy = ref<string>("");
+const listInvestigation = ref<string>("");
+const authority = ref<string>("");
+const orderNumber = ref<string>();
 const dateYear = ref<number>(2023);
 const date = ref<Date | null>(null);
+const authorityPosition = ref<string>("");
+const subject = ref<string>("");
+const mistakeDetail = ref<string>("");
 
 function onSubmit() {
   dialogConfirm(
@@ -45,7 +70,8 @@ function onSubmit() {
           <q-select
             dense
             outlined
-            v-model="typeOrder"
+            v-model="orderType"
+            :options="orderTypeOptions"
             option-value="id"
             option-label="name"
             emit-value
@@ -60,7 +86,8 @@ function onSubmit() {
           <q-select
             dense
             outlined
-            v-model="typeOrder"
+            v-model="orderBy"
+            :options="orderByOptions"
             option-value="id"
             option-label="name"
             emit-value
@@ -75,7 +102,8 @@ function onSubmit() {
           <q-select
             dense
             outlined
-            v-model="typeOrder"
+            v-model="listInvestigation"
+            :options="listInvestigationOptions"
             option-value="id"
             option-label="name"
             emit-value
@@ -92,7 +120,7 @@ function onSubmit() {
           <q-input
             dense
             outlined
-            v-model="typeOrder"
+            v-model="authority"
             placeholder="กรอกผู้มีอำนาจลงนาม"
             :rules="[(val) => !!val || `${'กรุณากรอกผู้มีอำนาจลงนาม'}`]"
             lazy-rules
@@ -104,7 +132,7 @@ function onSubmit() {
             <q-input
               outlined
               dense
-              v-model="typeOrder"
+              v-model="orderNumber"
               hide-bottom-space
               :rules="[(val) => !!val || `${'กรุณากรอรคำสั่งที่'}`]"
               lazy-rules
@@ -182,7 +210,7 @@ function onSubmit() {
           <q-input
             dense
             outlined
-            v-model="typeOrder"
+            v-model="authorityPosition"
             placeholder="กรอกตำแหน่งผู้มีอำนาจลงนาม"
             :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งผู้มีอำนาจลงนาม'}`]"
             lazy-rules
@@ -193,7 +221,7 @@ function onSubmit() {
           <q-input
             dense
             outlined
-            v-model="typeOrder"
+            v-model="subject"
             placeholder="กรอกคำสั่งเรื่อง"
             :rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]"
             lazy-rules
@@ -204,7 +232,7 @@ function onSubmit() {
           <q-input
             dense
             outlined
-            v-model="typeOrder"
+            v-model="mistakeDetail"
             placeholder="กรอกรายละเอียดการกระทำความผิด"
             :rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]"
             lazy-rules