diff --git a/src/modules/01_dashboard/views/Dashboard.vue b/src/modules/01_dashboard/views/Dashboard.vue
index d823fad..d67d776 100644
--- a/src/modules/01_dashboard/views/Dashboard.vue
+++ b/src/modules/01_dashboard/views/Dashboard.vue
@@ -71,6 +71,14 @@ const items = ref<any>([
 		path: "/retire",
 		active: false,
 	},
+	{
+		icon: "mdi-scale-balance",
+		title: "อุทธรณ์ร้องทุกข์",
+		sub: "ทำเรื่องขออุทธรณ์ หรือร้องทุกข์",
+		color: "green-3",
+		path: "/appeal-complain",
+		active: false,
+	},	
 ])
 onMounted(async () => {
 	await fetchlistInbox()
diff --git a/src/modules/06_appealComplain/router.ts b/src/modules/06_appealComplain/router.ts
new file mode 100644
index 0000000..349d879
--- /dev/null
+++ b/src/modules/06_appealComplain/router.ts
@@ -0,0 +1,36 @@
+/**
+ * Router ขอโอน
+ */
+
+const mainPage = () => import("@/modules/06_appealComplain/views/Main.vue");
+const addPage = () => import("@/modules/06_appealComplain/views/Add.vue");
+
+export default [
+  {
+    path: "/appeal-complain",
+    name: "appealComplain",
+    component: mainPage,
+    meta: {
+      Auth: true,
+      Key: [7],
+    },
+  },
+  {
+    path: "/appeal-complain/add",
+    name: "appealComplainAdd",
+    component: addPage,
+    meta: {
+      Auth: true,
+      Key: [7],
+    },
+  },
+  {
+    path: "/appeal-complain/:id",
+    name: "appealComplainView",
+    component: addPage,
+    meta: {
+      Auth: true,
+      Key: [7],
+    },
+  },
+];
diff --git a/src/modules/06_appealComplain/store.ts b/src/modules/06_appealComplain/store.ts
new file mode 100644
index 0000000..17af986
--- /dev/null
+++ b/src/modules/06_appealComplain/store.ts
@@ -0,0 +1,5 @@
+import { defineStore } from "pinia";
+
+export const useAppealComplainStore = defineStore("appealComplainStore", () => {
+  return {};
+});
diff --git a/src/modules/06_appealComplain/views/Add.vue b/src/modules/06_appealComplain/views/Add.vue
new file mode 100644
index 0000000..30370b8
--- /dev/null
+++ b/src/modules/06_appealComplain/views/Add.vue
@@ -0,0 +1,205 @@
+<script setup lang="ts">
+import { ref, onMounted } from "vue"
+import { useQuasar } from "quasar"
+import { useRouter, useRoute } from "vue-router"
+import { useCounterMixin } from "@/stores/mixin"
+import http from "@/plugins/http"
+import config from "@/app.config"
+import type { QForm } from "quasar"
+
+const router = useRouter()
+const $q = useQuasar()
+const mixin = useCounterMixin()
+const myform = ref<QForm | null>(null)
+const { fails, success, messageError, showLoader, hideLoader } = mixin
+
+/**
+ * ตัวแปรที่ใช้งาน
+ */
+const route = useRoute()
+const files = ref<any>()
+const tranferOrg = ref("")
+const noteReason = ref("")
+const id = ref<string>("")
+const nameFile = ref<string>("")
+const routeName = router.currentRoute.value.name
+
+/**
+ * เรียกฟังก์ชันทั้งหมดตอนเรียกใช้ไฟล์นี้
+ */
+onMounted(() => {
+	if (route.params.id !== undefined) {
+		id.value = route.params.id.toString()
+		fecthDataTransfer(id.value)
+	}
+})
+
+const saveData = async () => {
+	if (myform.value != null) {
+		await myform.value.validate().then(async (saveDataTest: Boolean) => {
+			if (saveDataTest) {
+				saveTransfer()
+			}
+		})
+	}
+}
+
+//บันทึกข้อมูลการโอน
+const saveTransfer = () => {
+	$q.dialog({
+		title: "ยืนยันการยื่นข้อมูลการโอน",
+		message: "ต้องการยื่นข้อมูลการโอนนี้ใช่หรือไม่?",
+		cancel: {
+			flat: true,
+			color: "negative",
+		},
+		persistent: true,
+	})
+		.onOk(async () => {
+			if (files.value == undefined) {
+				fails($q, "กรุณากรอกอัพโหลดเอกสารเพิ่มเติม")
+			} else {
+				createTransfer()
+			}
+		})
+		.onCancel(() => {})
+		.onDismiss(() => {})
+}
+
+/**
+ * ฟังก์ชั่นสร้างขอโอน
+ */
+const createTransfer = async () => {
+	const formData = new FormData()
+
+	const blob = files.value.slice(0, files.value[0].size)
+	const newFile = new File(blob, nameFile.value, {
+		type: files.value[0].type,
+	})
+	formData.append("Organization", tranferOrg.value)
+	formData.append("Reason", noteReason.value)
+	formData.append("file", newFile)
+	await http
+		.post(config.API.listtransfer(), formData)
+		.then((res: any) => {
+			success($q, "บันทึกข้อมูลสำเร็จ")
+			router.push(`/transfer`)
+		})
+		.catch((e: any) => {
+			messageError($q, e)
+		})
+}
+
+/**
+ * ฟังก์ชั่นเรียกข้อมูลจาก Api
+ * @param id ไอดีของข้อมูล
+ */
+const fecthDataTransfer = async (id: string) => {
+	showLoader()
+	await http
+		.get(config.API.transferByid(id))
+		.then((res: any) => {
+			let data = res.data.result
+			tranferOrg.value = data.organization
+			noteReason.value = data.reason
+			files.value = data.docs
+		})
+		.catch((e: any) => {
+			messageError($q, e)
+		})
+		.finally(() => {
+			hideLoader()
+		})
+}
+
+/**
+ * ฟังก์ชั่นดาว์โหลดอัพโหลดไฟล์
+ */
+const fileDocDataUpload = ref<File[]>([])
+const filesNull = () => {
+	files.value = null
+}
+//อัพโหลดไฟล์
+const fileUploadDoc = async (file: any) => {
+	fileDocDataUpload.value.push(file)
+	nameFile.value = file[0].name
+	files.value = file
+}
+</script>
+
+<template>
+	<div class="col-12 row justify-center">
+		<div class="col-xs-12 col-sm-12 col-md-11">
+			<div class="toptitle text-white col-12 row items-center">
+				<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
+				<div v-if="routeName == 'addTransfer'">เพิ่มเรื่องขอโอน</div>
+				<div v-else>รายละเอียดเรื่องขอโอน</div>
+			</div>
+			<q-form ref="myform" 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">
+							<div class="col-12 row q-pa-sm q-col-gutter-sm">
+								<q-input
+									class="col-12"
+									dense
+									outlined
+									v-model="tranferOrg"
+									label="หน่วยงานที่ขอโอนไป"
+									:readonly="routeName != 'addTransfer'"
+									:rules="[(val:string) => !!val || `${'กรุณากรอกหน่วยงานที่ขอโอนไป'}`]"
+								/>
+								<q-input
+									class="col-12"
+									dense
+									outlined
+									v-model="noteReason"
+									label="เหตุผล"
+									type="textarea"
+									:readonly="routeName != 'addTransfer'"
+									:rules="[(val:string) => !!val || `${'กรุณากรอกเหตุผล'}`]"
+								/>
+								<div class="col-12 row" v-if="routeName == 'addTransfer'">
+									<q-uploader
+										bordered
+										flat
+										class="col-12"
+										accept=".jpg,.png,.pdf,.csv,.doc"
+										url="http://localhost:4444/upload"
+										label="เอกสารเพิ่มเติม"
+										type="file"
+										@added="fileUploadDoc"
+										@removed="filesNull"
+									/>
+								</div>
+								<div class="col-12 row" v-if="routeName != 'addTransfer'">
+									<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
+										<div class="q-pl-sm text-weight-bold text-dark">เอกสารเพิ่มเติม</div>
+									</div>
+									<q-card bordered flat class="full-width">
+										<q-list separator>
+											<q-item v-for="file in files" :key="file.key" class="q-my-xs">
+												<q-item-section>
+													<q-item-label class="full-width ellipsis">
+														{{ file.fileName }}
+													</q-item-label>
+
+													<q-item-label caption> </q-item-label>
+												</q-item-section>
+											</q-item>
+										</q-list>
+									</q-card>
+								</div>
+							</div>
+						</div>
+					</div>
+					<q-separator v-if="routeName == 'addTransfer'" />
+					<div class="row col-12 q-pa-md" v-if="routeName == 'addTransfer'">
+						<q-space />
+						<q-btn unelevated dense class="q-px-md items-center" color="primary" label="ยื่นเรื่องขอโอน" @click="saveData" />
+					</div>
+				</q-card>
+			</q-form>
+		</div>
+	</div>
+</template>
diff --git a/src/modules/06_appealComplain/views/Main.vue b/src/modules/06_appealComplain/views/Main.vue
new file mode 100644
index 0000000..a29b5db
--- /dev/null
+++ b/src/modules/06_appealComplain/views/Main.vue
@@ -0,0 +1,233 @@
+<script setup lang="ts">
+import type { QTableProps } from "quasar";
+import { ref, onMounted } from "vue";
+import { useQuasar } from "quasar";
+import { useRouter } from "vue-router";
+import { useCounterMixin } from "@/stores/mixin";
+import { useTransferDataStore } from "@/modules/02_transfer/store";
+import http from "@/plugins/http";
+import config from "@/app.config";
+import Table from "@/components/Table.vue";
+
+const transferData = useTransferDataStore();
+const { statusText } = transferData;
+const router = useRouter();
+const $q = useQuasar();
+const mixin = useCounterMixin();
+const { date2Thai, messageError, showLoader, hideLoader } = mixin;
+
+/**
+ * ตั้งค่า pagination
+ */
+const initialPagination = ref({
+  rowsPerPage: 0,
+});
+
+/**
+ * เพิ่มหัวข้อตาราง
+ */
+const filter = ref<string>("");
+const rows = ref<any>([]);
+const visibleColumns = ref<String[]>([
+  "no",
+  "date",
+  "position",
+  "noPos",
+  "level",
+  "salary",
+  "transfer",
+  "statustext",
+]);
+const columns = ref<QTableProps["columns"]>([
+  {
+    name: "no",
+    align: "left",
+    label: "ลำดับ",
+    sortable: true,
+    field: "no",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px; width:5px;",
+  },
+  {
+    name: "date",
+    align: "left",
+    label: "วันที่",
+    sortable: true,
+    field: "date",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px; width:15%;",
+  },
+  {
+    name: "position",
+    align: "left",
+    label: "ตำแหน่ง",
+    sortable: true,
+    field: "position",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px; width:15%;",
+  },
+  {
+    name: "noPos",
+    align: "left",
+    label: "ตำแหน่งเลขที่",
+    sortable: true,
+    field: "noPos",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "level",
+    align: "left",
+    label: "อันดับ/ระดับ",
+    sortable: true,
+    field: "level",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "salary",
+    align: "left",
+    label: "เงินเดือน",
+    sortable: true,
+    field: "salary",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "transfer",
+    align: "left",
+    label: "หน่วยงานที่ขอโอนไป",
+    sortable: true,
+    field: "transfer",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "statustext",
+    align: "left",
+    label: "สถานะ",
+    sortable: true,
+    field: "statustext",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px; width:10%;",
+  },
+]);
+
+/**
+ * เรียกฟังก์ชันทั้งหมดตอนเรียกใช้ไฟล์นี้
+ */
+onMounted(async () => {
+  await fecthListTransfer();
+});
+
+//นำข้อมูลมาแสดง
+const fecthListTransfer = async () => {
+//   showLoader();
+//   await http
+//     .get(config.API.listUserTransfer())
+//     .then((res: any) => {
+//       let data = res.data.result;
+//       rows.value = data.map((e: any) => ({
+//         id: e.id,
+//         date: date2Thai(e.createdAt),
+//         status: e.status,
+//         statustext: statusText(e.status),
+//         position: e.organizationPositionOld,
+//         noPos: e.posNo,
+//         level: e.positionLevel,
+//         salary: e.salary,
+//         transfer: e.organization,
+//       }));
+//     })
+//     .catch((e: any) => {
+//       messageError($q, e);
+//     })
+//     .finally(() => {
+//       hideLoader();
+//     });
+};
+
+/**
+ * ฟังก์ชั่นกดเพิ่มไปหน้าเพิ่ม
+ */
+const clickAdd = async () => {
+  router.push(`/appeal-complain/add`);
+};
+
+/**
+ * กดเพื่อย้อนกลับ
+ */
+const clickBack = () => {
+  router.push(`/`);
+};
+</script>
+<template>
+  <div class="col-12 row justify-center">
+    <div class="col-xs-12 col-sm-12 col-md-11">
+      <div class="toptitle text-white col-12 row items-center">
+        <q-btn
+          icon="mdi-arrow-left"
+          unelevated
+          round
+          dense
+          flat
+          color="primary"
+          class="q-mr-sm"
+          @click="clickBack"
+        />
+        อุทธรณ์ร้องทุกข์
+      </div>
+      <div class="col-12">
+        <q-card bordered class="q-pa-md">
+          <Table
+            style="max-height: 80vh"
+            :rows="rows"
+            :columns="columns"
+            :filter="filter"
+            :visible-columns="visibleColumns"
+            v-model:inputfilter="filter"
+            v-model:inputvisible="visibleColumns"
+            :pagination="initialPagination"
+            :inputShow="false"
+            :add="clickAdd"
+            :titleText="''"
+          >
+            <template #columns="props">
+              <q-tr
+                :props="props"
+                class="cursor-pointer"
+                @click="router.push(`/transfer/` + props.row.id)"
+              >
+                <q-td key="no" :props="props">
+                  {{ props.rowIndex + 1 }}
+                </q-td>
+                <q-td key="date" :props="props">
+                  {{ props.row.date }}
+                </q-td>
+                <q-td key="position" :props="props">
+                  {{ props.row.position }}
+                </q-td>
+                <q-td key="noPos" :props="props">
+                  {{ props.row.noPos }}
+                </q-td>
+                <q-td key="level" :props="props">
+                  {{ props.row.level }}
+                </q-td>
+                <q-td key="salary" :props="props">
+                  {{ props.row.salary }}
+                </q-td>
+                <q-td key="transfer" :props="props">
+                  {{ props.row.transfer }}
+                </q-td>
+                <q-td key="statustext" :props="props">
+                  {{ props.row.statustext }}
+                </q-td>
+              </q-tr>
+            </template>
+          </Table>
+        </q-card>
+      </div>
+    </div>
+  </div>
+</template>
+<style></style>
diff --git a/src/router/index.ts b/src/router/index.ts
index 3d71f48..88d2cfa 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -3,10 +3,11 @@ import { createRouter, createWebHistory } from "vue-router"
 const MainLayout = () => import("@/views/MainLayout.vue")
 const Dashboard = () => import("@/modules/01_dashboard/views/Dashboard.vue")
 
-import ModuleTransfer from "@/modules/02_transfer/router.ts"
+import ModuleTransfer from "@/modules/02_transfer/router"
 import ModuleRetire from "@/modules/03_retire/router"
-import ModuleCheckin from "@/modules/04_checkin/router.ts"
-import ModuleLeave from "@/modules/05_leave/router.ts"
+import ModuleCheckin from "@/modules/04_checkin/router"
+import ModuleLeave from "@/modules/05_leave/router"
+import ModuleAppealComplain from "@/modules/06_appealComplain/router"
 // TODO: ใช้หรือไม่?
 import keycloak from "@/plugins/keycloak"
 
@@ -30,7 +31,8 @@ const router = createRouter({
 				...ModuleTransfer,
 				...ModuleRetire,
 				...ModuleCheckin,
-				...ModuleLeave
+				...ModuleLeave,
+				...ModuleAppealComplain
 			],
 		},
 	],