จัดโค้ด ออกคำสั่ง/รายงาน
This commit is contained in:
setthawutttty
parent
0af2e8a5d1
commit
796c7e18cd
8 changed files with 141 additions and 60 deletions
|
|
@ -3,23 +3,15 @@ import { ref, onMounted } from "vue";
|
|||
import { useRouter } from "vue-router";
|
||||
import type { DataList, DataListRes } from "../../interface/response/order";
|
||||
|
||||
// importStroe
|
||||
import { useOrderStore } from "@/modules/11_discipline/store/OrderStore";
|
||||
// importComponents
|
||||
import tableOrder from "@/modules/11_discipline/components/4_Order/TableOrder.vue";
|
||||
|
||||
const router = useRouter();
|
||||
const OrderStore = useOrderStore();
|
||||
const { fetchOrder } = OrderStore; // function จาก stores
|
||||
|
||||
// filter ข้อมูลใน table
|
||||
const filterTable = ref<string>("");
|
||||
|
||||
onMounted(async () => {
|
||||
await fetchListOrder();
|
||||
});
|
||||
|
||||
// เรียกรายการคำสั่ง จาก API
|
||||
/** เรียกรายการคำสั่ง จาก API */
|
||||
async function fetchListOrder() {
|
||||
const listData: DataListRes[] = [
|
||||
{
|
||||
|
|
@ -50,10 +42,15 @@ async function fetchListOrder() {
|
|||
await fetchOrder(listData); // ส่งข้อมูลไปยัง stores
|
||||
}
|
||||
|
||||
// redirect ไปยังการเพิ่มออกคำสั่งลงโทษทางวินัย
|
||||
/** redirect ไปยังการเพิ่มออกคำสั่งลงโทษทางวินัย */
|
||||
function redirectToPageadd() {
|
||||
router.push(`/discipline-order/add`);
|
||||
}
|
||||
|
||||
/** โหลดข้อมูลเมื่อเข้าหน้านี้ */
|
||||
onMounted(async () => {
|
||||
await fetchListOrder();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -71,10 +68,12 @@ function redirectToPageadd() {
|
|||
color="primary"
|
||||
icon="mdi-plus"
|
||||
@click="redirectToPageadd()"
|
||||
><q-tooltip>เพิ่มรายการออกคำสั่งลงโทษทางวินัย </q-tooltip></q-btn
|
||||
>
|
||||
<q-tooltip>เพิ่มรายการออกคำสั่งลงโทษทางวินัย </q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
<q-space />
|
||||
|
||||
<q-input
|
||||
class="col-xs-12 col-sm-3 col-md-2"
|
||||
for="inputFilterTable"
|
||||
|
|
@ -87,6 +86,7 @@ function redirectToPageadd() {
|
|||
<q-icon name="search" />
|
||||
</template>
|
||||
</q-input>
|
||||
|
||||
<q-select
|
||||
for="selectVisibleColumns"
|
||||
class="col-xs-12 col-sm-3 col-md-2"
|
||||
|
|
@ -103,6 +103,7 @@ function redirectToPageadd() {
|
|||
options-cover
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<tableOrder :filterTable="filterTable" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -2,20 +2,21 @@
|
|||
import { ref } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
|
||||
// import step
|
||||
/** import step */
|
||||
import step01 from "@/modules/11_discipline/components/4_Order/Step01.vue";
|
||||
import step02 from "@/modules/11_discipline/components/4_Order/Step02.vue";
|
||||
import step03 from "@/modules/11_discipline/components/4_Order/Step03.vue";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const step = ref<number>(1);
|
||||
// nextStep
|
||||
|
||||
/** nextStep */
|
||||
const nextStep = async () => {
|
||||
localStorage.setItem("currentStep", step.value.toString());
|
||||
step.value++;
|
||||
};
|
||||
// previousStep
|
||||
|
||||
/** previousStep */
|
||||
const previousStep = async () => {
|
||||
localStorage.setItem("currentStep", step.value.toString());
|
||||
step.value--;
|
||||
|
|
|
|||
|
|
@ -14,6 +14,8 @@ const mixin = useCounterMixin();
|
|||
const { date2Thai, dialogConfirm } = mixin;
|
||||
const $q = useQuasar();
|
||||
|
||||
|
||||
/** รับ props มาจากหน้าหลัก */
|
||||
const props = defineProps({
|
||||
next: {
|
||||
type: Function,
|
||||
|
|
@ -24,8 +26,8 @@ const props = defineProps({
|
|||
default: () => console.log("not function"),
|
||||
},
|
||||
});
|
||||
const next = () => props.next();
|
||||
// Options ต่างๆ
|
||||
|
||||
/** Options ต่างๆ */
|
||||
const orderTypeOptions = ref<DataOption[]>([
|
||||
{ id: "0", name: "ประเภทคำสั่ง 1" },
|
||||
{ id: "1", name: "ประเภทคำสั่ง 2" },
|
||||
|
|
@ -41,7 +43,8 @@ const listInvestigationOptions = ref<DataOption[]>([
|
|||
{ id: "1", name: "รายการสอบสวนความผิดทางวินัย 2" },
|
||||
{ id: "2", name: "รายการสอบสวนความผิดทางวินัย 3" },
|
||||
]);
|
||||
// ตัวแปรทั้งหมด
|
||||
|
||||
/** ข้อมูล v-model ของฟอร์ม */
|
||||
const formData = reactive<FormData>({
|
||||
orderType: "",
|
||||
orderBy: "",
|
||||
|
|
@ -55,7 +58,7 @@ const formData = reactive<FormData>({
|
|||
mistakeDetail: "",
|
||||
});
|
||||
|
||||
// validateForm
|
||||
/** ตัวแปร ref สำหรับแสดง validate */
|
||||
const orderTypeRef = ref<Object | null>(null);
|
||||
const orderByRef = ref<Object | null>(null);
|
||||
const listInvestigationRef = ref<Object | null>(null);
|
||||
|
|
@ -66,6 +69,8 @@ const dateRef = ref<Object | null>(null);
|
|||
const authorityPositionRef = ref<Object | null>(null);
|
||||
const subjectRef = ref<Object | null>(null);
|
||||
const mistakeDetailRef = ref<Object | null>(null);
|
||||
|
||||
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
|
||||
const myObjectRef: MyObjectRef = {
|
||||
orderType: orderTypeRef,
|
||||
orderBy: orderByRef,
|
||||
|
|
@ -78,6 +83,13 @@ const myObjectRef: MyObjectRef = {
|
|||
subject: subjectRef,
|
||||
mistakeDetail: mistakeDetailRef,
|
||||
};
|
||||
|
||||
/**ฟังชั่น ไป step ต่อไป */
|
||||
function next() {
|
||||
props.next();
|
||||
}
|
||||
|
||||
/** ฟังชั่นตรวจสอบความถูกต้องก่อน บันทึก */
|
||||
function validateForm() {
|
||||
const hasError = [];
|
||||
for (const key in myObjectRef) {
|
||||
|
|
@ -96,6 +108,7 @@ function validateForm() {
|
|||
}
|
||||
}
|
||||
|
||||
/** ฟังชั่น บันทึก */
|
||||
function onSubmit() {
|
||||
console.log(formData);
|
||||
dialogConfirm(
|
||||
|
|
@ -131,6 +144,7 @@ function onSubmit() {
|
|||
use-input
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
คำสั่งโดย
|
||||
<q-select
|
||||
|
|
@ -149,6 +163,7 @@ function onSubmit() {
|
|||
use-input
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
เลือกรายการสอบสวนความผิดทางวินัย
|
||||
<q-select
|
||||
|
|
@ -169,6 +184,7 @@ function onSubmit() {
|
|||
use-input
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
ผู้มีอำนาจลงนาม
|
||||
<q-input
|
||||
|
|
@ -182,6 +198,7 @@ function onSubmit() {
|
|||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="row col-xs-7 col-sm-3">
|
||||
<div class="col-6">
|
||||
คำสั่งที่
|
||||
|
|
@ -197,6 +214,7 @@ function onSubmit() {
|
|||
>
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<label class="col-1 flex justify-center items-center text-bold"
|
||||
>/</label
|
||||
>
|
||||
|
|
@ -229,6 +247,7 @@ function onSubmit() {
|
|||
</datepicker>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-5 col-sm-3">
|
||||
วันที่มีผลคำสั่ง
|
||||
<datepicker
|
||||
|
|
@ -270,6 +289,7 @@ function onSubmit() {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
ตำแหน่งผู้มีอำนาจลงนาม
|
||||
<q-input
|
||||
|
|
@ -283,6 +303,7 @@ function onSubmit() {
|
|||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
คำสั่งเรื่อง
|
||||
<q-input
|
||||
|
|
@ -296,6 +317,7 @@ function onSubmit() {
|
|||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-12">
|
||||
รายละเอียดการกระทำความผิด
|
||||
<q-input
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
/** รับ props มาจากหน้าหลัก */
|
||||
const props = defineProps({
|
||||
next: {
|
||||
type: Function,
|
||||
|
|
@ -10,21 +12,25 @@ const props = defineProps({
|
|||
default: () => console.log("not function"),
|
||||
},
|
||||
});
|
||||
const next = () => props.next();
|
||||
const previous = () => props.previous();
|
||||
|
||||
|
||||
const name = ref<string>("");
|
||||
const lastname = ref<string>("");
|
||||
const age = ref<string>("");
|
||||
|
||||
/** ตัวแปร ref สำหรับแสดง validate */
|
||||
const nameRef = ref<any>(null);
|
||||
const ageRef = ref<any>(null);
|
||||
const lastnameRef = ref<any>(null);
|
||||
|
||||
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
|
||||
const myObject: MyObject = {
|
||||
name: nameRef,
|
||||
lastname: lastnameRef,
|
||||
age: ageRef,
|
||||
};
|
||||
|
||||
/** กำหนด type */
|
||||
interface MyObject {
|
||||
name: any;
|
||||
lastname: any;
|
||||
|
|
@ -32,6 +38,17 @@ interface MyObject {
|
|||
[key: string]: any;
|
||||
}
|
||||
|
||||
/**ฟังชั่น ไป step ต่อไป */
|
||||
function next() {
|
||||
props.next();
|
||||
}
|
||||
|
||||
/**ฟังชั่น ไป step ก่อนหน้า */
|
||||
function previous() {
|
||||
props.previous();
|
||||
}
|
||||
|
||||
/** ฟังชั่นตรวจสอบความถูกต้องก่อน บันทึก */
|
||||
function onSubmit() {
|
||||
const hasError = [];
|
||||
for (const key in myObject) {
|
||||
|
|
@ -63,6 +80,7 @@ function onSubmit() {
|
|||
lazy-rules
|
||||
:rules="[(val) => !!val || `${'Name and surname'}`]"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
ref="lastnameRef"
|
||||
filled
|
||||
|
|
@ -71,6 +89,7 @@ function onSubmit() {
|
|||
lazy-rules
|
||||
:rules="[(val) => !!val || `${'lastname'}`]"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
ref="ageRef"
|
||||
filled
|
||||
|
|
@ -94,6 +113,7 @@ function onSubmit() {
|
|||
@click="previous()"
|
||||
class="q-px-md"
|
||||
/>
|
||||
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
<script setup lang="ts">
|
||||
|
||||
/** รับ props มาจากหน้าหลัก */
|
||||
const props = defineProps({
|
||||
next: {
|
||||
type: Function,
|
||||
|
|
@ -9,8 +11,11 @@ const props = defineProps({
|
|||
default: () => console.log("not function"),
|
||||
},
|
||||
});
|
||||
const next = () => props.next();
|
||||
const previous = () => props.previous();
|
||||
|
||||
/**ฟังชั่น ไป step ก่อนหน้า */
|
||||
function previous() {
|
||||
props.previous();
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,13 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted } from "vue";
|
||||
// importType
|
||||
/** importType */
|
||||
import type { QTableProps } from "quasar";
|
||||
// importStroe
|
||||
/** importStroe */
|
||||
import { useOrderStore } from "@/modules/11_discipline/store/OrderStore";
|
||||
|
||||
const OrderStore = useOrderStore();
|
||||
|
||||
/** รับ props มาจากหน้าหลัก */
|
||||
const props = defineProps({
|
||||
filterTable: {
|
||||
type: String,
|
||||
|
|
@ -14,6 +15,7 @@ const props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
/** ข้อมูลที่เเสดงใน คอลัม */
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "subject",
|
||||
|
|
@ -70,6 +72,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
|
||||
/** หัวตาราง */
|
||||
const visibleColumns = ref<string[]>([
|
||||
"subject",
|
||||
"ordernumber",
|
||||
|
|
@ -79,12 +83,13 @@ const visibleColumns = ref<string[]>([
|
|||
"statusorder",
|
||||
]);
|
||||
|
||||
/** โหลดข้อมูลเมื่อเข้าหน้านี้ */
|
||||
onMounted(() => {
|
||||
OrderStore.columns = columns.value;
|
||||
OrderStore.visibleColumns = visibleColumns.value;
|
||||
});
|
||||
|
||||
//pagination
|
||||
/** pagination */
|
||||
const pagination = ref({
|
||||
descending: true,
|
||||
page: 1,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue