dynamically show malaysia bank acc for booking step

app/Http/Controllers/SettingBeneficiaryController.php

@@ -2,36 +2,36 @@
 
 namespace App\Http\Controllers;
 
-use App\SettingBeneficiary;
+use App\SettingBeneficiaries;
 use Illuminate\Http\Request;
 
 class SettingBeneficiaryController extends Controller
 {
     public function index()
     {
-        return SettingBeneficiary::all();
+        return SettingBeneficiaries::all();
     }
 
-    public function show(SettingBeneficiary $beneficiary)
+    public function show(SettingBeneficiaries $beneficiary)
     {
         return $beneficiary;
     }
 
     public function store(Request $request)
     {
-        $beneficiary = SettingBeneficiary::create($request->all());
+        $beneficiary = SettingBeneficiaries::create($request->all());
 
         return response()->json($beneficiary, 201);
     }
 
-    public function update(Request $request, SettingBeneficiary $beneficiary)
+    public function update(Request $request, SettingBeneficiaries $beneficiary)
     {
         $beneficiary->update($request->all());
 
         return response()->json($beneficiary, 200);
     }
 
-    public function delete(SettingBeneficiary $beneficiary)
+    public function delete(SettingBeneficiaries $beneficiary)
     {
         $beneficiary->delete();
 

app/SettingBeneficiaries.php

@@ -0,0 +1,10 @@
+<?php
+
+namespace App;
+
+use Illuminate\Database\Eloquent\Model;
+
+class SettingBeneficiaries extends Model
+{
+    protected $fillable = ['id','company_name','bank_name','acc_no','bank_address','swift','cnap','bank_branch'];
+}

app/SettingBeneficiary.php

@@ -1,10 +0,0 @@
-<?php
-
-namespace App;
-
-use Illuminate\Database\Eloquent\Model;
-
-class SettingBeneficiary extends Model
-{
-    protected $fillable = ['company_name','bank_name','acc_no','bank_address','swift','cnap','bank_branch'];
-}

app/SettingMalaysiaBank.php

@@ -6,5 +6,5 @@ use Illuminate\Database\Eloquent\Model;
 
 class SettingMalaysiaBank extends Model
 {
-  	protected $fillable = ['company_name','bank_name','acc_no','bank_address','swift','cnap','bank_branch'];
+  	protected $fillable = ['id','company_name','bank_name','acc_no','bank_address','swift','cnap','bank_branch'];
 }

database/factories/SettingBeneficiaryFactory.php

@@ -2,7 +2,7 @@
 
 use Faker\Generator as Faker;
 
-$factory->define(App\SettingBeneficiary::class, function (Faker $faker) {
+$factory->define(App\SettingBeneficiaries::class, function (Faker $faker) {
     return [
         //
     ];

database/migrations/2018_07_11_150423_update_accno_to_id_setting_active_table.php

@@ -0,0 +1,51 @@
+<?php
+
+use Illuminate\Support\Facades\Schema;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Database\Migrations\Migration;
+
+class UpdateAccnoToIdSettingActiveTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('setting_active_banks', function(Blueprint $table)
+        {
+            $table->dropForeign('setting_active_banks_x1_bank_id_foreign');
+            $table->dropForeign('setting_active_banks_x2_bank_id_foreign');
+            $table->dropForeign('setting_active_banks_beneficiary_id_foreign');
+            $table->dropColumn('x1_bank_id');
+            $table->dropColumn('x2_bank_id');
+            $table->dropColumn('beneficiary_id');
+        });
+
+        Schema::table('setting_active_banks', function(Blueprint $table)
+        {
+            $table->unsignedInteger('x1_bank_id')->unique();
+            $table->foreign('x1_bank_id')
+                ->references('id')->on('setting_malaysia_banks');
+
+            $table->unsignedInteger('x2_bank_id')->unique();
+            $table->foreign('x2_bank_id')
+                ->references('id')->on('setting_malaysia_banks');
+
+            $table->unsignedInteger('beneficiary_id')->unique();
+            $table->foreign('beneficiary_id')
+                ->references('id')->on('setting_beneficiaries');
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        //
+    }
+}

database/seeds/SettingActiveBankSeeder.php

@@ -1,6 +1,8 @@
 <?php
 
 use Illuminate\Database\Seeder;
+use App\SettingMalaysiaBank;
+use App\SettingBeneficiaries;
 
 class SettingActiveBankSeeder extends Seeder
 {
@@ -11,11 +13,15 @@ class SettingActiveBankSeeder extends Seeder
      */
     public function run()
     {
+        $bankx1 = SettingMalaysiaBank::where('acc_no', "=" ,'malaysiaacc01')->first();
+        $bankx2 = SettingMalaysiaBank::where('acc_no', "=",'malaysiaacc02')->first();
+        $chinabank = SettingBeneficiaries::where('acc_no', "=" ,'123456789')->first();
+
         DB::table('setting_active_banks')->truncate();
         DB::table('setting_active_banks')->insert([
-        	'x1_bank_id' => 'malaysiaacc01',
-        	'x2_bank_id' => 'malaysiaacc02',
-        	'beneficiary_id' => '123456789'
+        	'x1_bank_id' => $bankx1->id,
+        	'x2_bank_id' => $bankx2->id,
+        	'beneficiary_id' => $chinabank->id
         ]);
     }
 }

resources/assets/js/pages/booking/uploadUserBankSlip.vue

@@ -1,103 +1,103 @@
 <template>
-  <el-main>
-    <progress-track v-model="status"/>
+	<el-main>
+	<progress-track v-model="status"/>
 
-    <div align="center" v-if="booking.user_bankslip_path">
-      <h4 style="margin-top:5%" >
-        Your Bankslip Has Been Rejected, Please Reupload Your Bankslip <br>
-        Reason : {{ booking.reject_reason }}
-      </h4>
-      <br>
-      <br>
-    </div>
+	<div align="center" v-if="booking.user_bankslip_path">
+		<h4 style="margin-top:5%" >
+		Your Bankslip Has Been Rejected, Please Reupload Your Bankslip <br>
+		Reason : {{ booking.reject_reason }}
+		</h4>
+		<br>
+		<br>
+	</div>
 
-     <div v-else align="center">
-      <h4 style="margin-top:5%;">Waiting For Payment</h4>
-    </div>
+	 <div v-else align="center">
+		<h4 style="margin-top:5%;">Waiting For Payment</h4>
+	</div>
 
-    <el-row justify="center" align="center">
-      <table class="table-responsive el-table" style="display:table; width:50%; margin: 0 auto;">
-        <tbody>
-          <tr>
-            <td class="el-table_2_column_9 is-right ">Amount : </td>
-            <td class="el-table_2_column_9 is-left ">&nbsp;&nbsp;
-              <b> RMB {{ booking.amount }} </b>
-            </td>
-          </tr>
-          <tr>
-            <td width="200" class="el-table_2_column_9 is-right ">Bankin Amount : </td>
-            <td width="200" class="el-table_2_column_9 is-left ">&nbsp;&nbsp;
-              <b> MYR {{ booking.bankin_amount }} </b>
-            </td>
-          </tr>
-        </tbody>
-      </table>
-      <table class="table-responsive el-table" style="display:table; width:50%; margin: 0 auto;"  align="center">
-      <tr>
-        <td align="center">TC Global Trade (M) Sdn Bhd (1190583-A) <br> GST : 001408413696 <br> HLB : 2200 0010 531 <br> MBB : 5148 4233 6341</td>
-        
-      </tr>
-            <!-- <tr><td align="center">GST : 001408413696</td></tr>
-            <tr><td align="center">HLB : 2200 0010 531</td></tr>
-            <tr><td align="center">MBB : 5148 4233 6341</td></tr>   -->
-            </table>
-    </el-row>
-    <br>
+	<el-row justify="center" align="center">
+		<table class="table-responsive el-table" style="display:table; width:50%; margin: 0 auto;">
+		<tbody>
+			<tr>
+			<td class="el-table_2_column_9 is-right ">Amount : </td>
+			<td class="el-table_2_column_9 is-left ">&nbsp;&nbsp;
+				<b> RMB {{ booking.amount }} </b>
+			</td>
+			</tr>
+			<tr>
+			<td width="200" class="el-table_2_column_9 is-right ">Bankin Amount : </td>
+			<td width="200" class="el-table_2_column_9 is-left ">&nbsp;&nbsp;
+				<b> MYR {{ booking.bankin_amount }} </b>
+			</td>
+			</tr>
+		</tbody>
+		</table>
+		<table class="table-responsive el-table" style="display:table; width:50%; margin: 0 auto;"  align="center">
+		<tr>
+			<td align="center">
+				{{bankDetail.company_name}}<br/>
+				{{bankDetail.bank_name}} : {{bankDetail.acc_no}}
+			</td>
+			
+		</tr>
+		</table>
+	</el-row>
+	<br>
 
-    <!-- action="https://jsonplaceholder.typicode.com/posts/" -->
+	<!-- action="https://jsonplaceholder.typicode.com/posts/" -->
 
-    <div align="center">
+	<div align="center">
 
-      <vue-countdown :countdownend="handleCoutdownend" :time="booking.timeout">
-        <template slot-scope="props">Time Remaining：<br>{{ props.days }} days, {{ props.hours }} hours, {{ props.minutes }} minutes, {{ props.seconds }} seconds.</template>
-      </vue-countdown>
-      <!-- <button v-on:click="startTimer">Start timer</button> -->
-    </div>
-    <br>
+		<vue-countdown :countdownend="handleCoutdownend" :time="booking.timeout">
+		<template slot-scope="props">Time Remaining：<br>{{ props.days }} days, {{ props.hours }} hours, {{ props.minutes }} minutes, {{ props.seconds }} seconds.</template>
+		</vue-countdown>
+		<!-- <button v-on:click="startTimer">Start timer</button> -->
+	</div>
+	<br>
 
-    <!-- upload image -->
-    <el-upload :action="'/api/booking/' + booking_id + '/upload-user-bankslip'" :on-preview="handlePictureCardPreview" :on-remove="handleRemove"
-               list-type="picture-card" align="center">
-      <i class="el-icon-plus" />
-    </el-upload>
-    <el-dialog :visible.sync="dialogVisible">
-      <img :src="dialogImageUrl" width="100%" alt="">
-    </el-dialog>
-    <br>
-    <!-- upload image end -->
+	<!-- upload image -->
+	<el-upload :action="'/api/booking/' + booking_id + '/upload-user-bankslip'" :on-preview="handlePictureCardPreview" :on-remove="handleRemove"
+				 list-type="picture-card" align="center">
+		<i class="el-icon-plus" />
+	</el-upload>
+	<el-dialog :visible.sync="dialogVisible">
+		<img :src="dialogImageUrl" width="100%" alt="">
+	</el-dialog>
+	<br>
+	<!-- upload image end -->
 
-    <!-- <el-form label-width="300px">
-        <el-form-item label="Amount (RM) :"> -->
-    <div align="center">
-      Bankin Amount (RM) :
-      <el-form ref="user_slip_form" :model="user_slip_form" :rules="rules">
-        <div align="center">
-          <el-form-item prop="transfer_amount">
-            <el-input v-model="user_slip_form.transfer_amount" type="text" placeholder="Transfer Amount" style="width: 20%"
-            />
-          </el-form-item>
-          <el-form-item>
-            <div align="center">
-              <el-button :loading="loading" type="primary" @click="submitUserSlip('user_slip_form')">Submit</el-button>
-              <router-link :to="{ name: 'home' }" class="small ml-auto my-auto">
-                Upload Later
-              </router-link>
-            </div>
-          </el-form-item>
-        </div>
-      </el-form>
-      <br>
-      <br>
-    </div>
-    <!-- </el-form-item>
-    </el-form> -->
+	<!-- <el-form label-width="300px">
+	<el-form-item label="Amount (RM) :"> -->
+	<div align="center">
+		Bankin Amount (RM) :
+		<el-form ref="user_slip_form" :model="user_slip_form" :rules="rules">
+		<div align="center">
+			<el-form-item prop="transfer_amount">
+			<el-input v-model="user_slip_form.transfer_amount" type="text" placeholder="Transfer Amount" style="width: 20%"
+			/>
+			</el-form-item>
+			<el-form-item>
+			<div align="center">
+				<el-button :loading="loading" type="primary" @click="submitUserSlip('user_slip_form')">Submit</el-button>
+				<router-link :to="{ name: 'home' }" class="small ml-auto my-auto">
+				Upload Later
+				</router-link>
+			</div>
+			</el-form-item>
+		</div>
+		</el-form>
+		<br>
+		<br>
+	</div>
+	<!-- </el-form-item>
+	</el-form> -->
 
-  </el-main>
+	</el-main>
 </template>
 <style>
-  .booking-details {
-    font-weight: bold;
-  }
+	.booking-details {
+	font-weight: bold;
+	}
 </style>
 <script>
 import VueCountdown from '@xkeshi/vue-countdown'
@@ -105,148 +105,197 @@ import ProgressTrack from '~/components/ProgressTrack'
 import axios from 'axios'
 
 export default {
-  middleware: ['auth'],
-  name: 'MyComponent',
-  components: {
-    'vue-countdown': VueCountdown,
-    'progress-track': ProgressTrack
-  },
-  data () {
-    return {
-      status: 2,
-      start: false,
-      loading: false,
-      dialogImageUrl: '',
-      dialogVisible: false,
-      booking_id: this.$route.params.id,
-      user_slip_form: {
-        transfer_amount: ''
-      },
-      booking: {
-        amount: '',
-        bankin_amount: '',
-        timeout: 1,
-        user_bankslip_path: null,
-        reject_reason: null,
-      },
-      rules: {
-        transfer_amount: [{
-          required: true,
-          message: 'Please input amount',
-          trigger: 'change'
-        } ]}
-    }
-  },
-  beforeCreate () {
-    const loading = this.$loading({
-      lock: true,
-      text: 'Please wait..',
-      spinner: 'el-icon-loading',
-      background: 'rgba(0, 0, 0, 0.7)'
-    })
+	middleware: ['auth'],
+	name: 'MyComponent',
+	components: {
+	'vue-countdown': VueCountdown,
+	'progress-track': ProgressTrack
+	},
+	data () {
+		return {
+			status: 2,
+			start: false,
+			loading: false,
+			dialogImageUrl: '',
+			dialogVisible: false,
+			booking_id: this.$route.params.id,
+			user_slip_form: {
+			transfer_amount: ''
+			},
+			booking: {
+			amount: '',
+			bankin_amount: '',
+			timeout: 1,
+			term : '123',
+			user_bankslip_path: null,
+			reject_reason: null,
+			},
+			rules: {
+			transfer_amount: [{
+				required: true,
+				message: 'Please input amount',
+				trigger: 'change'
+			}]
+			},
+			active_bank_setting: {
+				x1_bank_id: null,
+				x2_bank_id: null,
+				beneficiary_id: null
+			},
+			bankDetail : {},
 
-    axios
-      .get('/api/booking/' + this.$route.params.id)
-      .then((response) => {
-        console.log(response)
-        this.booking.amount = response.data.amount
-        this.booking.bankin_amount = response.data.bia
-        this.booking.timeout = response.data.timeout * 1000
+		}
+	},
+	beforeCreate () {
+		const loading = this.$loading({
+		lock: true,
+		text: 'Please wait..',
+		spinner: 'el-icon-loading',
+		background: 'rgba(0, 0, 0, 0.7)'
+		})
 
-        if (response.data.user_bankslip_path)
-        {
-          this.booking.user_bankslip_path = response.data.user_bankslip_path
-          this.booking.reject_reason = response.data.reject_reason
-        }
+		axios.get('/api/booking/' + this.$route.params.id)
+		.then((response) => {
+		this.booking.amount = response.data.amount;
+		this.booking.bankin_amount = response.data.bia;
+		this.booking.timeout = response.data.timeout * 1000;
+		this.booking.term = response.data.term;
 
-        this.start = true
-        loading.close()
+		if (response.data.user_bankslip_path)
+		{
+			this.booking.user_bankslip_path = response.data.user_bankslip_path
+			this.booking.reject_reason = response.data.reject_reason
+		}
 
-        if (this.booking.timeout < 0) {
-          this.$message({
-            showClose: true,
-            message: 'Booking timeout, please make another booking.',
-            type: 'error',
-            duration: 30000
-          })
-          this.$router.push({
-            name: 'home'
-          })
-        }
-      }).catch((error) => {
-        console.log(error)
-        loading.close()
-        this.$router.push({
-          name: 'notfound'
-        })
-      })
-  },
-  methods: {
-    handleCoutdownend () {
-      this.$message({
-        showClose: true,
-        message: 'Booking timeout, please make another booking.',
-        type: 'error',
-        duration: 30000
-      })
-      this.$router.push({
-        name: 'home'
-      })
-    },
-    handleRemove (file, fileList) {
-      console.log(file, fileList)
-    },
-    handlePictureCardPreview (file) {
-      this.dialogImageUrl = file.url
-      this.dialogVisible = true
-    },
-    submitUserSlip (formName) {
-      this.loading = true
-      this.$refs[formName].validate((valid) => {
-        if (valid) {
-          let newConfirmation = {
-            amount: this.booking.amount,
-            term: this.term
-          }
-        } else {
-          this.loading = false
-        }
-      })
-      let newUserSlip = {
-        transfer_amount: this.user_slip_form.transfer_amount
-      }
-      axios.patch('/api/booking/' + this.booking_id + '/bankslip-amount', newUserSlip)
-        .then((response) => {
-          this.$message({
-            showClose: true,
-            message: 'Your bankinslip has been submitted, please wait admin to approve.',
-            type: 'success',
-            duration: 5000
-          })
+		this.start = true
+		loading.close()
 
-          console.log(response)
-          this.$router.push({
-            name: 'home'
-          })
-        })
-        .catch((error) => {
-          this.loading = false
-          this.$message({
-            showClose: true,
-            message: 'Please upload your bankin slip first.',
-            type: 'warning',
-            duration: 10000
-          })
-          console.log(error)
-        })
-    },
-    handleTimeExpire () {
-      alert('Booking expired')
-    },
-    startTimer () {
-      this.start = true
-    }
+		if (this.booking.timeout < 0){
+			this.$message({
+			showClose: true,
+			message: 'Booking timeout, please make another booking.',
+			type: 'error',
+			duration: 30000
+			})
+			this.$router.push({
+			name: 'home'
+			})
+		}
+		}).catch((error) => {
+		console.log(error)
+		loading.close()
+		this.$router.push({
+			name: 'notfound'
+		})
+		})
+	},
+	beforeMount(){
+		this.updateBankDetail();
+	},
+	methods: {
+		handleCoutdownend () {
+			this.$message({
+			showClose: true,
+			message: 'Booking timeout, please make another booking.',
+			type: 'error',
+			duration: 30000
+			})
+			this.$router.push({
+			name: 'home'
+			})
+		},
+		handleRemove (file, fileList) {
+			// console.log(file, fileList)
+		},
+		handlePictureCardPreview (file) {
+			this.dialogImageUrl = file.url
+			this.dialogVisible = true
+		},
+		submitUserSlip (formName) {
+			this.loading = true
+			this.$refs[formName].validate((valid) => {
+			if (valid) {
+				let newConfirmation = {
+				amount: this.booking.amount,
+				term: this.term
+				}
+			} else {
+				this.loading = false
+			}
+			})
+			let newUserSlip = {
+			transfer_amount: this.user_slip_form.transfer_amount
+			}
+			axios.patch('/api/booking/' + this.booking_id + '/bankslip-amount', newUserSlip)
+			.then((response) => {
+				this.$message({
+				showClose: true,
+				message: 'Your bankinslip has been submitted, please wait admin to approve.',
+				type: 'success',
+				duration: 5000
+				})
 
-  }
+				this.$router.push({
+				name: 'home'
+				})
+			})
+			.catch((error) => {
+				this.loading = false
+				this.$message({
+				showClose: true,
+				message: 'Please upload your bankin slip first.',
+				type: 'warning',
+				duration: 10000
+				})
+				console.log(error)
+			})
+		},
+		handleTimeExpire () {
+			alert('Booking expired')
+		},
+		startTimer () {
+			this.start = true;
+		},
+		updateBankDetail(){
+			axios.get('/api/setting-active-bank')
+			.then((response) => {
+				this.active_bank_setting = response.data;
+				console.log(this.active_bank_setting.x1_bank_id);
+				this.getBankDetailWithTerm();
+			})
+			.catch((error) => {
+				console.log(error);
+				this.$message({
+					showClose: true,
+					message: 'Fetch data fail',
+					type: 'error',
+					duration: 10000
+				});
+			});
+		},
+		getBankDetailWithTerm(){
+			var url = '';
+			if(this.booking.term === 'x1_cash' || this.booking.term === 'x1_cheque' ||this.booking.term === 'x1_ba'){
+				url = '/api/setting-malaysia-bank/' + this.active_bank_setting.x1_bank_id;
+			}
+			else if(this.booking.term === 'x2_cash' || this.booking.term === 'x2_cheque' ||this.booking.term === 'x2_ba'){
+				url = '/api/setting-malaysia-bank/' + this.active_bank_setting.x2_bank_id;
+			}
+
+			axios.get(url)
+				.then((response) => {
+					this.bankDetail = response.data;
+				})
+				.catch((error) => {
+					console.log(error);
+					this.$message({
+						showClose: true,
+						message: 'Fetch data fail',
+						type: 'error',
+						duration: 10000
+					});
+				});
+		}
+	}
 }
 </script>

routes/api.php

@@ -46,6 +46,10 @@ Route::group(['middleware' => 'auth:api'], function () {
 	Route::get('user', 'UserController@show');
 	Route::patch('settings/profile', 'Settings\ProfileController@update');
 	Route::patch('settings/password', 'Settings\PasswordController@update');
+
+	// for both user and admin
+	Route::get('setting-active-bank', 'SettingActiveBankController@index');	
+	Route::get('setting-malaysia-bank/{malaysiaBank}', 'SettingMalaysiaBankController@show');
 });
 
 
@@ -70,7 +74,6 @@ Route::group(['middleware' => ['role:admin']], function() {
 	Route::get('setting-credit', 'SettingCreditController@index');
 	Route::put('setting-credit', 'SettingCreditController@update');
 
-	Route::get('setting-active-bank', 'SettingActiveBankController@index');
 	Route::put('setting-active-bank', 'SettingActiveBankController@update');
 
 	Route::get('setting-supplier', 'SettingSupplierController@index');
@@ -86,7 +89,6 @@ Route::group(['middleware' => ['role:admin']], function() {
 	Route::delete('setting-beneficiary/{beneficiary}', 'SettingBeneficiaryController@delete');
 
 	Route::get('setting-malaysia-bank', 'SettingMalaysiaBankController@index');
-	Route::get('setting-malaysia-bank/{malaysiaBank}', 'SettingMalaysiaBankController@show');
 	Route::post('setting-malaysia-bank', 'SettingMalaysiaBankController@store');
 	Route::put('setting-malaysia-bank/{malaysiaBank}', 'SettingMalaysiaBankController@update');
 	Route::delete('setting-malaysia-bank/{malaysiaBank}', 'SettingMalaysiaBankController@delete');
@@ -108,5 +110,9 @@ Route::group(['middleware' => ['role:admin']], function() {
 	Route::get('booking/{id}/po', 'BookingController@showPurchaseOrder');
 	Route::post('booking/{id}/upload-invoice', 'BookingController@uploadInvoice');
 	Route::post('booking/{id}/confirm-invoice', 'BookingController@confirmInvoice');	
+
+	// for both user and admin
+	// Route::get('setting-active-bank', 'SettingActiveBankController@index');	
+	// Route::get('setting-malaysia-bank/{malaysiaBank}', 'SettingMalaysiaBankController@show');	
 	
 });