diff --git a/src/api/transfer/api.transfer.ts b/src/api/transfer/api.transfer.ts
new file mode 100644
index 0000000..8c3e87d
--- /dev/null
+++ b/src/api/transfer/api.transfer.ts
@@ -0,0 +1,9 @@
+import env from "../index"
+
+const placementTransfer = `${env.API_URI}/placement`
+
+export default {
+	listUserTransfer: () => `${placementTransfer}/transfer/user`,
+	listtransfer: () => `${placementTransfer}/transfer`,
+	// transferByid: (id: string) => `${placementTransfer}/transfer/${id}`,
+}
diff --git a/src/app.config.ts b/src/app.config.ts
index 86820c7..539475a 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -3,10 +3,13 @@
 /** API Metadata */
 import testtest from "./api/test/api.test"
 import retirementResign from "./api/leave/api.leave"
+import placementTransfer from "./api/transfer/api.transfer"
+
 
 const API = {
 	...testtest,
-	...retirementResign
+	...retirementResign,
+    ...placementTransfer
 }
 
 export default {
diff --git a/src/modules/02_transfer/views/AddTransfer.vue b/src/modules/02_transfer/views/AddTransfer.vue
index a4480db..3f86efb 100644
--- a/src/modules/02_transfer/views/AddTransfer.vue
+++ b/src/modules/02_transfer/views/AddTransfer.vue
@@ -23,6 +23,7 @@
 										url="http://localhost:4444/upload"
 										label="เอกสารเพิ่มเติม"
 										multiple
+										@added="fileUploadDoc"
 										style="max-width: px"
 									/>
 
@@ -288,7 +289,7 @@
 					<q-separator /> -->
 					<div class="row col-12 q-pa-sm" v-if="routeName == 'addTransfer'">
 						<q-space />
-						<q-btn unelevated dense class="q-px-md items-center" color="primary" label="ยื่นเรื่องขอโอน" @click="router.go(-1)" />
+						<q-btn unelevated dense class="q-px-md items-center" color="primary" label="ยื่นเรื่องขอโอน" @click="saveTransfer" />
 					</div>
 				</q-card>
 			</div>
@@ -297,23 +298,63 @@
 </template>
 <script setup lang="ts">
 import type { QTableProps } from "quasar"
-import { ref } from "vue"
+import { ref, onMounted } from "vue"
 import { useQuasar } from "quasar"
-import { useRouter } from "vue-router"
+import { useRouter, useRoute } from "vue-router"
+import { useCounterMixin } from "@/stores/mixin"
+import http from "@/plugins/http"
+import config from "@/app.config"
 
 const router = useRouter()
 const $q = useQuasar()
 
-const file = ref(null)
+const mixin = useCounterMixin()
+const { date2Thai, dateToISO, success, messageError, showLoader, hideLoader } = mixin
+const fileDocDataUpload = ref<File[]>([])
+const files = ref<any>()
 const tranferOrg = ref("")
 const noteReason = ref("")
-const noPos = ref("")
-const level = ref("")
-const salary = ref("")
-const positionNew = ref("")
-const salaryNew = ref("")
-const transfer = ref("")
-const note = ref("")
 
 const routeName = router.currentRoute.value.name
+
+onMounted(() => {})
+const saveTransfer = () => {
+	$q.dialog({
+		title: "ยืนยันการยื่นข้อมูลลาออก",
+		message: "ต้องการยื่นข้อมูลลาออกนี้ใช่หรือไม่?",
+		cancel: {
+			flat: true,
+			color: "negative",
+		},
+		persistent: true,
+	})
+		.onOk(async () => {
+			createTransfer()
+		})
+		.onCancel(() => {})
+		.onDismiss(() => {})
+}
+
+const createTransfer = async () => {
+	const formData = new FormData()
+	formData.append("Organization", tranferOrg.value)
+	formData.append("Reason", noteReason.value)
+	formData.append("file", files.value)
+	console.log(formData)
+	await http
+		.post(config.API.listtransfer(), formData)
+		.then((res: any) => {
+			console.log(res)
+			success($q, "บันทึกข้อมูลสำเร็จ")
+			router.push(`/transfer`)
+		})
+		.catch((e: any) => {
+			messageError($q, e)
+			console.log(e)
+		})
+}
+
+const fileUploadDoc = async (files: any) => {
+	fileDocDataUpload.value.push(files)
+}
 </script>
diff --git a/src/modules/02_transfer/views/Main.vue b/src/modules/02_transfer/views/Main.vue
index 041f9b6..7425cfb 100644
--- a/src/modules/02_transfer/views/Main.vue
+++ b/src/modules/02_transfer/views/Main.vue
@@ -1,12 +1,16 @@
 <script setup lang="ts">
 import type { QTableProps } from "quasar"
-import { ref } from "vue"
+import { ref, onMounted } from "vue"
 import { useQuasar } from "quasar"
 import { useRouter } from "vue-router"
+import { useCounterMixin } from "@/stores/mixin"
+import http from "@/plugins/http"
+import config from "@/app.config"
 
 const router = useRouter()
 const $q = useQuasar()
-
+const mixin = useCounterMixin()
+const { date2Thai, messageError, showLoader, hideLoader } = mixin
 import Table from "@/components/Table.vue"
 
 const filter = ref<string>("")
@@ -94,6 +98,41 @@ const columns = ref<QTableProps["columns"]>([
 		style: "font-size: 14px; width:10%;",
 	},
 ])
+
+onMounted(async () => {
+	await fecthListTransfer()
+})
+
+const fecthListTransfer = async () => {
+	console.log(config.API.listUserTransfer())
+
+	//showLoader()
+	await http
+		.get(config.API.listUserTransfer())
+		.then((res: any) => {
+			// console.log(res);
+			// let data = res.data.result
+			// console.log(data)
+			// rows.value = data.map((e: any) => ({
+			// 	id: e.id,
+			// 	date: date2Thai(e.date),
+			// 	status: e.status,
+			// 	position: e.organizationPositionOld,
+			// 	noPos: e.posNo,
+			// 	level: e.positionLevel,
+			// 	salary: e.salary,
+			// 	transfer: e.organization,
+			// }))
+		})
+		.catch((e: any) => {
+			console.log("e")
+			//messageError($q, e)
+		})
+		.finally(() => {
+			//hideLoader()
+		})
+}
+
 const clickAdd = async () => {
 	router.push(`/transfer/add`)
 }