จัดสรร

src/modules/07_insignia/components/4_Allocate/DialogForm.vue

@@ -0,0 +1,171 @@
+<script setup lang="ts">
+import { ref, watch, computed } from "vue";
+import { QForm, useQuasar } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
+import { useResultDataStore } from "@/modules/07_insignia/storeResult";
+
+import http from "@/plugins/http";
+import config from "@/app.config";
+import type { DataOption } from "@/modules/04_registry/components/profileType";
+import { useRouter, useRoute } from "vue-router";
+const DataStore = useResultDataStore();
+const $q = useQuasar();
+const myForm = ref<QForm>();
+const mixin = useCounterMixin();
+const {
+  date2Thai,
+  dialogConfirm,
+  success,
+  messageError,
+  showLoader,
+  hideLoader,
+  notifyError,
+} = mixin;
+const router = useRouter();
+const routeName = router.currentRoute.value.name;
+const amount = ref<number | null>();
+const Org = ref<string | null>("");
+const grandCross = ref<string | null>("");
+const grandCrossOp = ref<DataOption[]>([
+  { id: "xxx1", name: "เครื่อง ราช" },
+  { id: "xxx2", name: "เครื่อง ราชฯ" },
+]);
+const OrgOp = ref<DataOption[]>([
+  { id: "xxx1", name: "หน่วยงาน กทม" },
+  { id: "xxx2", name: "หน่วยงาน กทมฯ" },
+]);
+
+const closeModal = () => {
+  props.close();
+  grandCross.value = null;
+  amount.value = null;
+};
+const props = defineProps({
+  modal: Boolean,
+  save: {
+    type: Function,
+    default: () => console.log("not function"),
+  },
+  close: {
+    type: Function,
+    default: () => console.log("not function"),
+  },
+  roundId: {
+    type: String,
+  },
+  action: {
+    type: String,
+  },
+  personId: {
+    type: String,
+  },
+  profileType: {
+    type: String,
+  },
+});
+
+const clickSave = async () => {
+  dialogConfirm($q, () => dataSave());
+};
+const dataSave = async () => {
+  if (routeName == "insigniaAllocate") {
+    const data = {
+        id: grandCross.value,
+        amount: amount.value,
+    };
+    console.log("saveMainPopup", data);
+    props.close();
+        grandCross.value = null;
+        amount.value = null;
+  }
+   else if(routeName == 'allocateDetail'){
+    const data = {
+        id: Org.value,
+        amount: amount.value,
+    };
+    console.log("saveDetailPopup", data);
+    props.close();
+        Org.value = null;
+        amount.value = null;
+   }
+};
+</script>
+
+<template>
+  <q-dialog v-model="props.modal" persistent>
+    <q-card style="width: 800px">
+      <q-toolbar class="q-py-sm">
+        <q-toolbar-title class="text-h6">บันทึกผล </q-toolbar-title>
+        <q-btn
+          icon="close"
+          unelevated
+          round
+          dense
+          @click="closeModal"
+          style="color: #ff8080; background-color: #ffdede"
+        />
+      </q-toolbar>
+      <q-separator />
+
+      <q-form ref="myForm">
+        <div class="q-pa-md">
+          <div
+            class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
+          >
+            <div class="col-6">
+              <q-select
+                v-if="routeName == 'insigniaAllocate'"
+                hide-bottom-space
+                :options="DataStore.insigniaOp2"
+                dense
+                borderless
+                option-label="name"
+                option-value="id"
+                emit-value
+                map-options
+                outlined
+                options-cover
+                v-model="grandCross"
+                :label="`เครื่องราชฯ`"
+              />
+              <q-select
+                v-else-if="routeName == 'allocateDetail'"
+                hide-bottom-space
+                :options="OrgOp"
+                dense
+                borderless
+                option-label="name"
+                option-value="id"
+                emit-value
+                map-options
+                outlined
+                v-model="Org"
+                :label="`เครื่องราชฯ`"
+              />
+            </div>
+            <div class="col-xs-12 col-sm-6">
+              <q-input
+                hide-bottom-space
+                outlined
+                class="inputgreen"
+                v-model="amount"
+                dense
+                lazy-rules
+                type="number"
+                label="จำนวน"
+              />
+              <!-- :rules="[(val:any) =>val.length != 13 ||`${'กรุณากรอกเลขบัตรประจำตัวประชาชนให้ครบ'}`,]" -->
+            </div>
+          </div>
+        </div>
+      </q-form>
+
+      <q-separator />
+      <div class="row justify-end q-py-sm">
+        <div class="q-px-md">
+          <q-btn label="บันทึก" @click="clickSave" color="public" />
+        </div>
+      </div>
+    </q-card>
+  </q-dialog>
+</template>

src/modules/07_insignia/components/4_Allocate/detail.vue

@@ -1,5 +1,15 @@
 <template>
   <div class="toptitle text-dark col-12 row items-center">
+    <q-btn
+      icon="mdi-arrow-left"
+      unelevated
+      round
+      dense
+      flat
+      color="primary"
+      class="q-mr-sm"
+      @click="backHistory"
+    />
     หน่วยงานจัดสรรเครื่องราชอิสริยาภรณ์ {{ name }}
   </div>
   <q-card bordered class="q-py-sm row col-12">
@@ -142,6 +152,10 @@
       </div>
     </div>
   </q-card>
+  <DialogForm
+      :modal="modal"
+      :close="close"
+    />
 </template>
 
 <script setup lang="ts">
@@ -150,8 +164,7 @@ import type { QTableProps } from "quasar";
 import router from "@/router";
 import { useQuasar } from "quasar";
 import cardTop from "@/modules/07_insignia/components/2_Manage/StatCard.vue";
-import type { FormProprsalsRound } from " @/modules/07_insignia/interface/request/Main.ts";
-
+import DialogForm from "@/modules/07_insignia/components/4_Allocate/DialogForm.vue";
 const name = ref<string>("");
 const $q = useQuasar(); //ใช้ noti quasar
 const modal = ref<boolean>(false);
@@ -166,7 +179,12 @@ const stat = ref<any>({
   sendInsig: 9,
   remainInsig: 1,
 });
-
+const backHistory = () => {
+  router.push(`/insignia/allocate/list-allocate`)
+}
+const close = () => {
+  modal.value = false;
+};
 const visibleColumns = ref<string[]>([
   "no",
   "organization",
@@ -256,24 +274,9 @@ const rows = ref<any[]>([
   },
 ]);
 
-// หัวตาราง2
-const clickDelete = (id: string) => {
-  $q.dialog({
-    title: "ยืนยันการลบข้อมูล",
-    message: "ต้องการลบข้อมูลนี้ใช่หรือไม่?",
-    cancel: {
-      flat: true,
-      color: "negative",
-    },
-    persistent: true,
-  })
-    .onOk(async () => {})
-    .onCancel(() => {})
-    .onDismiss(() => {});
-};
 
 const clickAdd = () => {
-  router.push({ name: "allocateDetailAdd" });
+  modal.value = true
 };
 
 // const redirectToPage = (id?: string) => {

src/modules/07_insignia/interface/request/Main.ts

@@ -1,9 +1,8 @@
 interface FormProprsalsRound {
-  id: number;
-  name: string;
-  year: number;
-  startDate: number;
-  endDate: number;
-  status: string;
+  id: string;
+  insignia: string;
+  total: number;
+  done: number;
+  remain: number;
 }
 export type { FormProprsalsRound };

src/modules/07_insignia/router.ts

@@ -141,7 +141,7 @@ export default [
     },
   },
   {
-    path: "/insignia/allocate/detail",
+    path: "/insignia/allocate/detail/:id",
     name: "allocateDetail",
     component: allocateDetail,
     meta: {