diff --git a/resources/assets/js/pages/settings/admin-bank-setting.vue b/resources/assets/js/pages/settings/admin-bank-setting.vue
index e8e597d5..5aa5cbe8 100644
--- a/resources/assets/js/pages/settings/admin-bank-setting.vue
+++ b/resources/assets/js/pages/settings/admin-bank-setting.vue
@@ -44,10 +44,7 @@
 </template>
 
 <script type="text/javascript">
-var axios = require('axios');
-var client = axios.create({
-    baseURL: 'http://localhost:8000'
-});
+import axios from 'axios'
 
 export default {
     // TODO : update credit limit and timeout 
@@ -71,12 +68,12 @@ export default {
     methods :{
         UpdateMalaysiaBankOption : function(){
             var malaysiaBankData;
-            client.get('api/setting-malaysia-bank')
+            axios.get('/api/setting-malaysia-bank')
                 .then((response) => {
                     malaysiaBankData = response.data;
                     this.options_CIEF = malaysiaBankData.map(function(item){
                         return {
-                            value : item.acc_no,
+                            value : item.id,
                             label : item.acc_no,
                         };
                     });
@@ -93,12 +90,12 @@ export default {
         },
         UpdateChinaBankOption : function(){
             var chinaBankData;
-            client.get('api/setting-beneficiary')
+            axios.get('/api/setting-beneficiary')
                 .then((response) => {
                     chinaBankData = response.data;
                     this.options_china_bank = chinaBankData.map(function(item){
                         return {
-                            value : item.acc_no,
+                            value : item.id,
                             label : item.acc_no,
                         };
                     });
@@ -114,7 +111,7 @@ export default {
                 });
         },
         UpdateActiveBankSetting : function(){
-            client.get('api/setting-active-bank')
+            axios.get('/api/setting-active-bank')
                 .then((response) => {
                     this.active_bank_setting = response.data;
                 })
@@ -130,7 +127,7 @@ export default {
         },
         EditActiveBankSetting : function(){
             this.loading_btn = true;
-            client.put('/api/setting-active-bank', this.active_bank_setting)
+            axios.put('/api/setting-active-bank', this.active_bank_setting)
             .then((response) => {
                 this.loading_btn = false;
                 this.$message({
diff --git a/resources/assets/js/pages/settings/admin-china-bank.vue b/resources/assets/js/pages/settings/admin-china-bank.vue
index 6ae7529f..b743ccf9 100644
--- a/resources/assets/js/pages/settings/admin-china-bank.vue
+++ b/resources/assets/js/pages/settings/admin-china-bank.vue
@@ -125,10 +125,7 @@
 </template>
 
 <script>
-	var axios = require('axios');
-	var client = axios.create({
-		baseURL: 'http://localhost:8000'
-	});
+	import axios from 'axios'
 
 	export default {
 		data() {
@@ -157,7 +154,7 @@
 		methods: {
 			CreateBeneficiaries : function(){
 				this.AddDatadialogVisible = false;
-				client.post('api/setting-beneficiary', this.beneficiariesForm)
+				axios.post('/api/setting-beneficiary', this.beneficiariesForm)
 					.then((response) => {
 						this.DoneAddDatadialogVisible = true;
 						this.ClearBeneficiariesForm();
@@ -175,7 +172,7 @@
 					});
 			},
 			UpdateTableData : function(){
-				client.get('api/setting-beneficiary', this.beneficiariesForm)
+				axios.get('/api/setting-beneficiary', this.beneficiariesForm)
 					.then((response) => {
 						this.tableData = response.data;
 					})
@@ -191,7 +188,7 @@
 			},
 			DeleteBeneficiaries : function(beneficiaries_id){
 				this.DeleteAdddialogVisible = true;
-				client.delete('api/setting-beneficiary/' + beneficiaries_id)
+				axios.delete('/api/setting-beneficiary/' + beneficiaries_id)
 					.then((response) => {
 						this.UpdateTableData();
 					})
@@ -209,7 +206,7 @@
 				this.EditDatadialogVisible = false; 
 				this.DoneUpdateDatadialogVisible = true;
 
-				client.put('api/setting-beneficiary/' + this.currentEdit, this.beneficiariesForm)
+				axios.put('/api/setting-beneficiary/' + this.currentEdit, this.beneficiariesForm)
 					.then((response) => {
 						this.UpdateTableData();
 					})
diff --git a/resources/assets/js/pages/settings/admin-malaysia-bank.vue b/resources/assets/js/pages/settings/admin-malaysia-bank.vue
index 192ca756..3f9345de 100644
--- a/resources/assets/js/pages/settings/admin-malaysia-bank.vue
+++ b/resources/assets/js/pages/settings/admin-malaysia-bank.vue
@@ -125,10 +125,7 @@
 </template>
 
 <script>
-	var axios = require('axios');
-	var client = axios.create({
-		baseURL: 'http://localhost:8000'
-	});
+	import axios from 'axios'
 
 	export default {
 		data() {
@@ -157,7 +154,7 @@
 		methods: {
 			CreateMalaysiaBank : function(){
 	            this.AddDatadialogVisible = false;
-				client.post('api/setting-malaysia-bank', this.malaysiaBankForm)
+				axios.post('/api/setting-malaysia-bank', this.malaysiaBankForm)
 					.then((response) => {
 						this.DoneAddDatadialogVisible = true;
 						this.ClearMalaysiaBankForm();
@@ -175,7 +172,7 @@
 					});
 			},
 			UpdateTableData : function(){
-				client.get('api/setting-malaysia-bank', this.malaysiaBankForm)
+				axios.get('/api/setting-malaysia-bank', this.malaysiaBankForm)
 					.then((response) => {
 						this.tableData = response.data;
 					})
@@ -191,7 +188,7 @@
 			},
 			DeleteMalaysiaBank : function(malaysiaBank_id){
 				this.DeleteAdddialogVisible = true;
-				client.delete('api/setting-malaysia-bank/' + malaysiaBank_id)
+				axios.delete('/api/setting-malaysia-bank/' + malaysiaBank_id)
 					.then((response) => {
 						this.UpdateTableData();
 					})
@@ -208,7 +205,7 @@
 			EditMalaysiaBank : function(){
 				this.EditDatadialogVisible = false;
 				this.DoneUpdateDatadialogVisible = true;
-				client.put('api/setting-malaysia-bank/' + this.currentEdit, this.malaysiaBankForm)
+				axios.put('/api/setting-malaysia-bank/' + this.currentEdit, this.malaysiaBankForm)
 					.then((response) => {
 						this.UpdateTableData();
 					})
diff --git a/resources/assets/js/pages/settings/admin-marking-setting.vue b/resources/assets/js/pages/settings/admin-marking-setting.vue
index bb3047a8..b7531562 100644
--- a/resources/assets/js/pages/settings/admin-marking-setting.vue
+++ b/resources/assets/js/pages/settings/admin-marking-setting.vue
@@ -18,10 +18,7 @@
 </template>
 
 <script>
-	var axios = require('axios');
-	var client = axios.create({
-		baseURL: 'http://localhost:8000'
-	});
+	import axios from 'axios'
 
 	export default {
 		data() {
@@ -35,7 +32,7 @@
 		},
 		methods: {
 			CreateMarking : function(){
-				client.post('api/setting-marking', this.markingForm)
+				axios.post('/api/setting-marking', this.markingForm)
 					.then((response) => {
 	                    this.loading_btn = false
 							this.$message({
diff --git a/resources/assets/js/pages/settings/admin-supplier.vue b/resources/assets/js/pages/settings/admin-supplier.vue
index 323df9dd..7ccf01e3 100644
--- a/resources/assets/js/pages/settings/admin-supplier.vue
+++ b/resources/assets/js/pages/settings/admin-supplier.vue
@@ -101,10 +101,7 @@
 </template>
 
 <script>
-var axios = require('axios');
-var client = axios.create({
-	baseURL: 'http://localhost:8000'
-});
+	import axios from 'axios'
 
 	export default {
 		data() {