ต่อ api(รอต่อ บางส่วน)

This commit is contained in:
setthawutttty 2023-11-21 16:36:05 +07:00
parent 18e1e0d2bd
commit 7399f967d0
15 changed files with 506 additions and 155 deletions

View file

@ -0,0 +1,18 @@
import env from "../index";
const discipline = `${env.API_URI}/discipline`;
export default {
directorList:(page:number,pageSize:number,keyword:string) => `${discipline}/director?page=${page}&pageSize=${pageSize}&keyword=${keyword}`,
director:() => `${discipline}/director`,
directorbyId:(id:string) => `${discipline}/director/${id}`,
/**ช่องทางการร้องเรียน */
complaintChannel:() => `${discipline}/complaint_Channel`,
/**
* @param id type
*/
complaintChannelbyId:(id:string) => `${discipline}/complaint_Channel/${id}`
};

View file

@ -46,6 +46,8 @@ import reports from "./api/reports/api.report";
/** API ระบบลงเวลา */
import leave from "./api/09_leave/api.leave";
/** API วินัย */
import discipline from './api/11_discipline/api.discipline'
// environment variables
export const compettitivePanel = import.meta.env.VITE_COMPETITIVE_EXAM_PANEL;
export const qualifyDisableExamPanel = import.meta.env
@ -92,6 +94,9 @@ const API = {
/**leave */
...leave,
/**discipline */
...discipline,
};
export default {

View file

@ -1,13 +1,17 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useQuasar, QForm } from "quasar";
import { useQuasar } from "quasar";
import { useRouter, useRoute } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import type { QTableProps } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import Form from '@/modules/11_discipline/components/6_BasicInformation/Channel/Form.vue'
/**
* รวมตวแปร
*/
const $q = useQuasar()
const mixin = useCounterMixin();
const {
date2Thai,
@ -21,9 +25,9 @@ const {
} = mixin;
const router = useRouter();
const route = useRoute();
const myForm = ref<QForm | null>(null); //form data input
//form data input
const edit = ref<boolean>(false);
const channel = ref<string>("");
/**
* เรยกขอมลจากรายการ
@ -38,19 +42,27 @@ const fetchData = async () => {};
const deleteData = async (id: string) => {};
/* บันทึกข้อมูล**/
const SaveData = async () => {};
const checkSave = () => {};
function onSubmit(channelReturn:string){
dialogConfirm($q,()=>saveData(channelReturn))
}
/**
* เพมขอม
*/
const addData = async () => {};
/**
* แกไขขอม
* @param id องทาง
*/
const editData = async (id: string) => {};
function saveData(channelReturn:string){
console.log(channelReturn)
showLoader()
http
.post(config.API.complaintChannel(),{
name:channelReturn
})
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
router.push(`/discipline/channel`);
});
};
/**
* อนกลบหนารายการ
@ -74,33 +86,6 @@ const clickBack = () => {
/>
{{ edit ? "ช่องทางการร้องเรียน" : "เพิ่มช่องทางการร้องเรียน" }}
</div>
<q-form ref="myForm">
<div class="col-12">
<q-card bordered>
<div class="col-12 row q-col-gutter-md q-pa-md">
<div class="col-xs-12 col-sm-12 row">
<q-separator />
<div class="col-12 row q-pa-sm q-col-gutter-sm">
<q-input
class="col-12"
dense
outlined
v-model="channel"
for="channel"
hide-bottom-space
label="กรอกชื่อช่องทาง"
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อช่องทาง'}`]"
/>
</div>
</div>
</div>
<q-separator />
<div class="row col-12 q-pa-sm">
<q-space />
<q-btn label="บันทึก" color="public" @click="checkSave"> </q-btn>
</div>
</q-card>
</div>
</q-form>
<Form :on-submit="onSubmit" />
</div>
</template>

View file

@ -0,0 +1,93 @@
<script setup lang="ts">
import { ref, onMounted, reactive } from "vue";
import Form from "@/modules/11_discipline/components/6_BasicInformation/Channel/Form.vue";
import type { FormData } from "@/modules/11_discipline/interface/request/director";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import { useRoute } from "vue-router";
import router from "@/router";
import http from "@/plugins/http";
import config from "@/app.config";
const route = useRoute();
const typeId = ref<string>(route.params.id.toString());
const $q = useQuasar();
const mixin = useCounterMixin();
const { messageError, showLoader, hideLoader, dialogConfirm, success } = mixin;
/**
* เรยกใชงาน fetchData เพอดงขอม
*/
onMounted(() => {
fetchData();
});
/**
* get อมลเกากรณแกไขขอม
*/
const data = reactive<FormData>({
personalId:"",
prefix: "",
firstname: "",
lastname: "",
position: "",
phone: "",
email: "",
});
/**
* งคาจาก api
*/
const fetchData = async () => {
data.prefix = "นาง";
data.firstname = "เกสินี";
data.lastname = "เจียรสุมัย";
data.position = "ครู";
data.phone = "0800808080";
data.email = "e@email.com";
};
/**
* นทกขอมลทเเกไข
* @param id ระบ คคล
*/
function onSubmit(type:string) {
dialogConfirm($q, () => putData(type));
}
function putData(type: string) {
showLoader();
http
.put(config.API.complaintChannelbyId(typeId.value), {
name:type
})
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
router.push(`/discipline/channel`);
});
}
</script>
<template>
<div class="col-xs-12 col-sm-12 col-md-11">
<div class="toptitle col-12 row items-center">
<q-btn
icon="mdi-arrow-left"
unelevated
round
dense
flat
color="primary"
class="q-mr-sm"
@click="router.push(`/discipline/channel`)"
/>
แกไขชองทางการรองเรยน
</div>
<Form :on-submit="onSubmit"/>
</div>
</template>

View file

@ -0,0 +1,75 @@
<script setup lang="ts">
import { ref, watch } from "vue";
const channel = ref<string>("");
const channelRef = ref<any>();
/**
* props มาจาก page หล
*/
const props = defineProps({
data: {
type: Object,
default: null,
},
onSubmit: {
type: Function,
default: () => "",
},
});
/**
* เชคขอมลจาก props
* เมอมอม
* เกบขอมลลง formData
*/
watch(props.data, async () => {});
/** ฟังชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function save() {
channelRef.value.validate().then(async (result: boolean) => {
console.log("1");
if (result) {
if (channel.value) {
props.onSubmit(channel.value);
}
}
});
}
</script>
<template>
<q-form ref="channelRef">
<div class="col-12">
<q-card bordered>
<div class="col-12 row q-col-gutter-md q-pa-md">
<div class="col-xs-12 col-sm-12 row">
<q-separator />
<div class="col-12 row q-pa-sm q-col-gutter-sm">
<q-input
class="col-12"
dense
outlined
v-model="channel"
for="channel"
hide-bottom-space
label="กรอกชื่อช่องทาง"
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อช่องทาง'}`]"
/>
</div>
</div>
</div>
<q-separator />
<div class="row col-12 q-pa-sm">
<q-space />
<q-btn
for="ButtonOnSubmit"
id="formSubmit"
label="บันทึก"
color="public"
@click="save"
>
</q-btn>
</div>
</q-card>
</div>
</q-form>
</template>

View file

@ -10,7 +10,7 @@ import http from "@/plugins/http";
const dataStore = useDisciplineChannelDataStore();
const mixin = useCounterMixin();
const { dialogRemove } = mixin;
const { dialogRemove, showLoader, messageError, hideLoader, success } = mixin;
const $q = useQuasar(); // noti quasar
/**
@ -42,41 +42,53 @@ const clickAdd = () => {
router.push(`/discipline/channel/add`);
};
/** get data */
async function getComplaintChanal() {
showLoader();
await http
.get(config.API.complaintChannel())
.then((res) => {
const data = res.data.result.data;
dataStore.fetchData(data);
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
}
/**
* ลบขอม,
* ลบขอม
* @param id ไอดของขอม
*/
const clickDelete = (id: string) => {
dialogRemove(
$q,
async () => {
// await deleteData(id);
// await getData();
},
`ลบข้อมูล`
// ` ${name}`
);
};
function clickDelete(id: string) {
dialogRemove($q, async () => deleteData(id), `ลบข้อมูล`);
}
/**
* งขอมลจำลองไปย store
/**
* ลบขอม
* @param id type
*/
async function deleteData(id: string) {
showLoader();
await http
.delete(config.API.complaintChannelbyId(id))
.then((res) => {
success($q, "ลบข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await getComplaintChanal();
});
}
/**เมื่อเริ่มโหลดหน้า เรียกใช้ฟังชั่น*/
onMounted(() => {
// get store
dataStore.fetchData([
{
subject: " จดหมาย",
},
{
subject: " อีเมล์",
},
{
subject: " โทรศัพท์",
},
{
subject: " บอกเล่า",
},
]);
getComplaintChanal();
});
</script>
<template>
@ -157,11 +169,18 @@ onMounted(() => {
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="subject" :props="props">
{{ props.row.subject }}
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="$router.push(`/discipline/channel/${props.row.id}`)"
>
<div v-if="col.name === 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else>
{{ col.value}}
</div>
</q-td>
<q-td>
<q-btn

View file

@ -2,16 +2,46 @@
import Form from "@/modules/11_discipline/components/6_BasicInformation/Director/Form.vue";
import { useCounterMixin } from "@/stores/mixin";
import { useRoute, useRouter } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
import { useQuasar } from "quasar";
import type { FormDataPost } from "@/modules/11_discipline/interface/request/director";
const $q = useQuasar();
const mixin = useCounterMixin();
const { messageError, showLoader, hideLoader, dialogConfirm, success } = mixin;
const router = useRouter();
/** บันทึกข้อมูลเเละ route กลับหน้าหลัก */
const onSubmit = async () => {
// post
router.push(`/discipline/director`);
};
/**
* นทกขอมลทเเกไข
* @param id ระบ คคล
*/
function onSubmit(formData:FormDataPost) {
dialogConfirm($q, () => addData(formData));
}
function addData(formData: FormDataPost) {
showLoader();
http
.post(config.API.director(), {
personalId:formData.personalId ?? '',
prefix: formData.prefix,
firstName: formData.firstname,
lastName: formData.lastname,
position: formData.position,
email: formData.email,
phone: formData.phone,
})
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
router.push(`/discipline/director`);
});
}
</script>
<template>
<div class="col-xs-12 col-sm-12 col-md-11">

View file

@ -1,9 +1,17 @@
<script setup lang="ts">
import { onMounted, reactive } from "vue";
import { ref, onMounted, reactive } from "vue";
import Form from "@/modules/11_discipline/components/6_BasicInformation/Director/Form.vue";
import type { FormData } from "@/modules/11_discipline/interface/request/director";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import { useRoute } from "vue-router";
import router from "@/router";
import http from "@/plugins/http";
import config from "@/app.config";
const route = useRoute();
const personalId = ref<string>(route.params.id.toString());
const $q = useQuasar();
const mixin = useCounterMixin();
const { messageError, showLoader, hideLoader, dialogConfirm, success } = mixin;
@ -18,12 +26,12 @@ onMounted(() => {
* get อมลเกากรณแกไขขอม
*/
const data = reactive<FormData>({
personalId:"",
prefix: "",
firstname: "",
lastname: "",
position: "",
phone: "",
responsibilities: "",
email: "",
});
@ -36,7 +44,6 @@ const fetchData = async () => {
data.lastname = "เจียรสุมัย";
data.position = "ครู";
data.phone = "0800808080";
data.responsibilities = "ประธาน";
data.email = "e@email.com";
};
@ -44,9 +51,31 @@ const fetchData = async () => {
* นทกขอมลทเเกไข
* @param id ระบ คคล
*/
const onSubmit = async (id: string) => {
// put
};
function onSubmit(formData:FormData) {
dialogConfirm($q, () => putData(formData));
}
function putData(formData: FormData) {
showLoader();
http
.put(config.API.directorbyId(personalId.value), {
prefix: formData.prefix,
firstName: formData.firstname,
lastName: formData.lastname,
position: formData.position,
email: formData.email,
phone: formData.phone,
})
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
router.push(`/discipline/director`);
});
}
</script>
<template>
<div class="col-xs-12 col-sm-12 col-md-11">
@ -59,11 +88,11 @@ const onSubmit = async (id: string) => {
flat
color="primary"
class="q-mr-sm"
@click="$router.push(`/discipline/director`)"
@click="router.push(`/discipline/director`)"
/>
แกไขรายชอกรรมการ
</div>
<Form @onSubmit="onSubmit" :data="data" />
<Form :on-submit="onSubmit" :data="data"/>
</div>
</template>

View file

@ -19,6 +19,9 @@ const props = defineProps({
},
});
const emit = defineEmits([
"formDataReturn"
])
/**
* อมลรหสบตรประชาชน
*/
@ -30,13 +33,13 @@ const idCardRef = ref<any>(null);
* อมลทงกอน form
*/
const formData = reactive<FormData>({
personalId:"",
prefix: "",
firstname: "",
lastname: "",
position: "",
phone: "",
email: "",
responsibilities: "",
email: ""
});
/**
@ -94,7 +97,7 @@ function onValidate() {
}
}
if (hasError.every((result) => result === true)) {
props.onSubmit();
props.onSubmit(formData);
}
}
</script>

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, useAttrs, onMounted } from "vue";
import { ref, useAttrs, onMounted, watch } from "vue";
import type { QTableProps } from "quasar";
import router from "@/router";
import { useCounterMixin } from "@/stores/mixin";
@ -11,28 +11,95 @@ import http from "@/plugins/http";
const $q = useQuasar();
const dataStore = useDisciplineDirectorDataStore();
const mixin = useCounterMixin();
const { messageError, showLoader, hideLoader, dialogConfirm, dialogRemove } =
mixin;
const {
messageError,
showLoader,
hideLoader,
dialogConfirm,
dialogRemove,
success,
} = mixin;
const currentPage = ref<number>(1);
const maxPage = ref<number>(1);
const page = ref<number>(1);
const rowsPerPage = ref<number>(1);
/**
*pagination ของตาราง
*/
const pagination = ref({
descending: false,
page: page.value,
rowsPerPage: rowsPerPage.value,
});
watch(() => currentPage.value,() => {
rowsPerPage.value = pagination.value.rowsPerPage;
getList();
});
watch(()=>pagination.value.rowsPerPage,()=>{
rowsPerPage.value = pagination.value.rowsPerPage;
currentPage.value = 1
getList();
})
async function getList() {
showLoader();
await http
.get(
config.API.directorList(
currentPage.value,
rowsPerPage.value,
filterKeyword.value
)
)
.then((res) => {
maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
const data = res.data.result.data
dataStore.fetchData(data);
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
}
/**
* ลบขอม
* @param id ไอดของขอม
*/
function clickDelete(id: string) {
dialogRemove($q, async () => deleteData(id), `ลบข้อมูล`);
}
/**
* ลบขอม
* @param id type
*/
async function deleteData(id: string) {
showLoader();
await http
.delete(config.API.directorbyId(id))
.then((res) => {
success($q, "ลบข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await getList();
});
}
/**
* งขอมลจำลองไปย store
*/
onMounted(() => {
getList();
// get store
dataStore.fetchData([
{
name: "นางเกสินี เจียรสุมัย",
position: "ครู",
email: "e@email.com",
phone: "0800808080",
},
{
name: "นายสรวิชญ์ พลสิทธิ์",
position: "ทดลองงาน",
email: "g@gmail.com",
phone: "0614565145",
},
]);
});
/**
@ -47,36 +114,9 @@ function resetFilter() {
}
}
/**
*pagination ของตาราง
*/
const pagination = ref({
// sortBy: "desc",
descending: false,
page: 1,
rowsPerPage: 25,
});
/**
* ลบขอม
* @param id ของกรรมการแตละบคคล
*/
function clickDelete(id: string) {
dialogRemove($q, async () => {
//
// showLoader();
// await http
// .delete(config.API.periodExamId(id))
// .then((res) => {
// success($q, "");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// hideLoader();
// });
});
function filterFn(){
getList()
console.log('enter',filterKeyword.value)
}
</script>
<template>
@ -108,6 +148,7 @@ function clickDelete(id: string) {
outlined
debounce="300"
placeholder="ค้นหา"
@keydown.enter.prevent="filterFn"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
@ -150,6 +191,17 @@ function clickDelete(id: string) {
v-model:pagination="pagination"
:visible-columns="dataStore.visibleColumns"
>
<template v-slot:pagination="scope">
<q-pagination
v-model="currentPage"
active-color="primary"
color="dark"
:max="Number(maxPage)"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
@ -164,7 +216,7 @@ function clickDelete(id: string) {
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="$router.push(`/discipline/director/${props.row.no}`)"
@click="$router.push(`/discipline/director/${props.row.id}`)"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}

View file

@ -1,11 +1,20 @@
interface FormData {
personalId:string
prefix: string;
firstname: string;
lastname: string;
position: string;
phone: string;
email: string;
}
interface FormDataPost {
personalId:string
prefix: string;
firstname: string;
lastname: string;
position: string;
phone: string;
email: string;
responsibilities:string
}
interface FormRef {
prefix: object | null;
@ -19,5 +28,6 @@ interface FormRef {
export type {
FormData,
FormRef
FormRef,
FormDataPost
};

View file

@ -1,10 +1,21 @@
interface DirectorRows {
name: string;
id:string
prefix:string
firstName:string
lastName:string
position: string;
email: string;
phone: string;
}
interface DirectorRowsResponse {
id:string
fullName:string
position:string
email:string
phone:string
}
export type {
DirectorRows
DirectorRows,
DirectorRowsResponse
};

View file

@ -38,6 +38,10 @@ const channelAdd = () =>
import(
"@/modules/11_discipline/components/6_BasicInformation/Channel/AddPage.vue"
);
const channelEdit = () =>
import(
"@/modules/11_discipline/components/6_BasicInformation/Channel/EditPage.vue"
);
const complaintAdd = () =>
import("@/modules/11_discipline/components/1_Complaint/AddComplaintPage.vue");
const complaintEdit = () =>
@ -223,6 +227,16 @@ export default [
Role: "coin",
},
},
{
path: "/discipline/channel/:id",
name: "/discipline-channelEdit",
component: channelEdit,
meta: {
Auth: true,
Key: [11.2],
Role: "coin",
},
},
{
path: "/discipline-order/add",
name: "/disciplineorder-add",

View file

@ -10,7 +10,7 @@ export const useDisciplineChannelDataStore = defineStore(
//ค้นหา คอลัมน์ คอลัมน์ที่แสดง
const visibleColumns = ref<string[]>([
"no",
"subject",
"name",
"interrogated",
"fault",
"status",
@ -28,11 +28,11 @@ export const useDisciplineChannelDataStore = defineStore(
style: "font-size: 14px",
},
{
name: "subject",
name: "name",
align: "left",
label: "ชื่อประเภท",
sortable: true,
field: "subject",
field: "name",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},

View file

@ -1,6 +1,6 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import type { DirectorRows } from "@/modules/11_discipline/interface/response/director";
import type { DirectorRows,DirectorRowsResponse } from "@/modules/11_discipline/interface/response/director";
import type { QTableProps } from "quasar";
// store ระบบวินัย >> ข้อมูลพื้นฐาน >> กรรมการ
@ -10,7 +10,7 @@ export const useDisciplineDirectorDataStore = defineStore(
//ค้นหา คอลัมน์ คอลัมน์ที่แสดง
const visibleColumns = ref<string[]>([
"no",
"name",
"fullName",
"position",
"email",
"phone",
@ -28,11 +28,11 @@ export const useDisciplineDirectorDataStore = defineStore(
style: "font-size: 14px",
},
{
name: "name",
name: "fullName",
align: "left",
label: "ชื่อ-นามสกุล",
sortable: true,
field: "name",
field: "fullName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
@ -66,9 +66,16 @@ export const useDisciplineDirectorDataStore = defineStore(
]);
// ข้อมูลในตาราง
const rows = ref<DirectorRows[]>([]);
const rows = ref<DirectorRowsResponse[]>([]);
function fetchData(data: DirectorRows[]) {
rows.value = data
const dataList:DirectorRowsResponse[] = data.map((item:DirectorRows)=>({
id:item.id,
fullName:`${item.prefix}${item.firstName} ${item.lastName}`,
position:item.position,
email:item.email,
phone:item.phone
}))
rows.value = dataList
}
return {