diff --git a/app/Http/Controllers/SettingActiveBankController.php b/app/Http/Controllers/SettingActiveBankController.php
new file mode 100644
index 00000000..8fc9ae52
--- /dev/null
+++ b/app/Http/Controllers/SettingActiveBankController.php
@@ -0,0 +1,23 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use App\SettingActiveBank;
+
+class SettingActiveBankController extends Controller
+{
+    public function index()
+    {
+        $active_bank_setting = SettingActiveBank::latest()->first();
+        return response()->json($active_bank_setting, 201);
+    }
+
+    public function update(Request $request)
+    {
+        $active_bank_setting = SettingActiveBank::latest()->first();
+        $active_bank_setting->update($request->all());
+
+        return response()->json($active_bank_setting, 200);
+    }
+}
diff --git a/app/SettingActiveBank.php b/app/SettingActiveBank.php
new file mode 100644
index 00000000..35d45bdb
--- /dev/null
+++ b/app/SettingActiveBank.php
@@ -0,0 +1,10 @@
+<?php
+
+namespace App;
+
+use Illuminate\Database\Eloquent\Model;
+
+class SettingActiveBank extends Model
+{
+    protected $fillable = ['x1_bank_id','x2_bank_id','beneficiary_id'];
+}
diff --git a/database/factories/SettingActiveBankFactory.php b/database/factories/SettingActiveBankFactory.php
new file mode 100644
index 00000000..65e42214
--- /dev/null
+++ b/database/factories/SettingActiveBankFactory.php
@@ -0,0 +1,9 @@
+<?php
+
+use Faker\Generator as Faker;
+
+$factory->define(Model::class, function (Faker $faker) {
+    return [
+        //
+    ];
+});
diff --git a/database/migrations/2018_04_25_090057_create_setting_beneficiaries_table.php b/database/migrations/2018_04_25_090057_create_setting_beneficiaries_table.php
index 67a54c32..8ec40c3e 100644
--- a/database/migrations/2018_04_25_090057_create_setting_beneficiaries_table.php
+++ b/database/migrations/2018_04_25_090057_create_setting_beneficiaries_table.php
@@ -17,7 +17,7 @@ class CreateSettingBeneficiariesTable extends Migration
             $table->increments('id');
             $table->string('company_name');
             $table->string('bank_name');
-            $table->string('acc_no');
+            $table->string('acc_no')->unique();
             $table->string('bank_address');
             $table->string('swift');
             $table->string('cnap');
diff --git a/database/migrations/2018_07_05_102323_create_setting_malaysia_bank_table.php b/database/migrations/2018_07_05_102323_create_setting_malaysia_bank_table.php
index f493f548..d70fc691 100644
--- a/database/migrations/2018_07_05_102323_create_setting_malaysia_bank_table.php
+++ b/database/migrations/2018_07_05_102323_create_setting_malaysia_bank_table.php
@@ -17,7 +17,7 @@ class CreateSettingMalaysiaBankTable extends Migration
             $table->increments('id');
             $table->string('company_name');
             $table->string('bank_name');
-            $table->string('acc_no');
+            $table->string('acc_no')->unique();
             $table->string('bank_address');
             $table->string('swift');
             $table->string('cnap');
diff --git a/database/migrations/2018_07_06_075408_create_setting_active_bank_table.php b/database/migrations/2018_07_06_075408_create_setting_active_bank_table.php
new file mode 100644
index 00000000..10e0947a
--- /dev/null
+++ b/database/migrations/2018_07_06_075408_create_setting_active_bank_table.php
@@ -0,0 +1,43 @@
+<?php
+
+use Illuminate\Support\Facades\Schema;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Database\Migrations\Migration;
+
+class CreateSettingActiveBankTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::create('setting_active_banks', function (Blueprint $table) {
+            $table->increments('id');
+            $table->string('x1_bank_id')->unique();
+            $table->string('x2_bank_id')->unique();
+            $table->string('beneficiary_id')->unique();
+            $table->foreign('x1_bank_id')
+                ->references('acc_no')->on('setting_malaysia_banks')
+                ->onDelete('cascade');
+            $table->foreign('x2_bank_id')
+                ->references('acc_no')->on('setting_malaysia_banks')
+                ->onDelete('cascade');
+            $table->foreign('beneficiary_id')
+                ->references('acc_no')->on('setting_beneficiaries')
+                ->onDelete('cascade');
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::dropIfExists('setting_active_banks');
+    }
+}
diff --git a/database/seeds/DatabaseSeeder.php b/database/seeds/DatabaseSeeder.php
index 04182825..b2e3cd03 100644
--- a/database/seeds/DatabaseSeeder.php
+++ b/database/seeds/DatabaseSeeder.php
@@ -21,5 +21,7 @@ class DatabaseSeeder extends Seeder
         $this->call(SuppliersTableSeeder::class);  
         $this->call(MarkingSeeder::class);  
         $this->call(SettingMalaysiaBankSeeder::class);  
+        $this->call(SettingBeneficiaresSeeder::class);  
+        $this->call(SettingActiveBankSeeder::class);
     }
 }
diff --git a/database/seeds/SettingActiveBankSeeder.php b/database/seeds/SettingActiveBankSeeder.php
new file mode 100644
index 00000000..e808aca2
--- /dev/null
+++ b/database/seeds/SettingActiveBankSeeder.php
@@ -0,0 +1,20 @@
+<?php
+
+use Illuminate\Database\Seeder;
+
+class SettingActiveBankSeeder extends Seeder
+{
+    /**
+     * Run the database seeds.
+     *
+     * @return void
+     */
+    public function run()
+    {
+        DB::table('setting_active_banks')->insert([
+        	'x1_bank_id' => 'malaysiaacc01',
+        	'x2_bank_id' => 'malaysiaacc02',
+        	'beneficiary_id' => '123456789'
+        ]);
+    }
+}
diff --git a/database/seeds/SettingBeneficiaresSeeder.php b/database/seeds/SettingBeneficiaresSeeder.php
new file mode 100644
index 00000000..dd4c3963
--- /dev/null
+++ b/database/seeds/SettingBeneficiaresSeeder.php
@@ -0,0 +1,34 @@
+<?php
+
+use Illuminate\Database\Seeder;
+
+class SettingBeneficiaresSeeder extends Seeder
+{
+    /**
+     * Run the database seeds.
+     *
+     * @return void
+     */
+    public function run()
+    {
+        DB::table('setting_beneficiaries')->insert([
+        	'company_name' => 'CIEF2',
+        	'bank_name' => 'Mayban222k',
+        	'acc_no' => '5555555',
+        	'bank_address' => 'Jalan putrajaya',
+        	'swift' => 'ABC122223',
+        	'cnap' => 'CED232224',
+        	'bank_branch' => 'Putra'
+        ]);
+        DB::table('setting_beneficiaries')->insert([
+        	'company_name' => 'Bota',
+        	'bank_name' => 'CIMB',
+        	'acc_no' => '123456789',
+        	'bank_address' => 'Jalan cyberjaya',
+        	'swift' => 'AB3333',
+        	'cnap' => 'CADSeed',
+        	'bank_branch' => 'cyberjaa
+            '
+        ]);
+    }
+}
diff --git a/database/seeds/SettingMalaysiaBankSeeder.php b/database/seeds/SettingMalaysiaBankSeeder.php
index 5fe33b9c..fefd588f 100644
--- a/database/seeds/SettingMalaysiaBankSeeder.php
+++ b/database/seeds/SettingMalaysiaBankSeeder.php
@@ -14,11 +14,20 @@ class SettingMalaysiaBankSeeder extends Seeder
         DB::table('setting_malaysia_banks')->insert([
         	'company_name' => 'CIEF',
         	'bank_name' => 'Maybank',
-        	'acc_no' => '131313131313',
+        	'acc_no' => 'malaysiaacc01',
         	'bank_address' => 'Jalan putrajaya',
         	'swift' => 'ABC123',
         	'cnap' => 'CED234',
         	'bank_branch' => 'Putra'
         ]);
+        DB::table('setting_malaysia_banks')->insert([
+            'company_name' => 'CIEF',
+            'bank_name' => 'Maybank',
+            'acc_no' => 'malaysiaacc02',
+            'bank_address' => 'Jalan putrajaya',
+            'swift' => 'ABC123',
+            'cnap' => 'CED234',
+            'bank_branch' => 'Putra'
+        ]);
     }
 }
diff --git a/resources/assets/js/pages/settings/admin-bank-setting.vue b/resources/assets/js/pages/settings/admin-bank-setting.vue
index 7e1468d6..e8e597d5 100644
--- a/resources/assets/js/pages/settings/admin-bank-setting.vue
+++ b/resources/assets/js/pages/settings/admin-bank-setting.vue
@@ -3,30 +3,157 @@
     <span align="center"><h4>Bank Setting</h4></span><br>
     <el-form :inline="true">
         <el-form-item>
-        Active CIEF bank account for today : 
-            X1 : <el-select size="mini">
-                    <el-option>Maybank</el-option>
-                    <el-option>Affinbank</el-option>
-                    <el-option>Bank Islam</el-option>
-                </el-select>
-            X2 : <el-select size="mini">
-                <el-option>Maybank</el-option>
-                <el-option>Affinbank</el-option>
-                <el-option>Bank Islam</el-option>
+            Active CIEF bank account for today : 
+            X1 : 
+            <el-select v-model="active_bank_setting.x1_bank_id" size="mini">
+                <el-option
+                  v-for="item in options_CIEF"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
             </el-select>
-            <el-button type="primary" size="mini">Update</el-button>
         </el-form-item>
-    </el-form>
-    <el-form :inline="true">
         <el-form-item>
-        Active CIEF China Beneficiary Account for Today : 
-            <el-select size="mini">
-                    <el-option>Bank of China</el-option>
-                    <el-option>China Bank</el-option>
-                    <el-option>Bank</el-option>
+            X2 : 
+            <el-select v-model="active_bank_setting.x2_bank_id" size="mini">
+                <el-option
+                  v-for="item in options_CIEF"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
             </el-select>
-            <el-button type="primary" size="mini">Update</el-button>
+        </el-form-item>
+        <el-form-item>
+            Active CIEF China Beneficiary Account for Today : 
+            <el-select v-model="active_bank_setting.beneficiary_id" size="mini">
+                <el-option
+                  v-for="item in options_china_bank"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+            </el-select>
+        </el-form-item>
+        <el-form-item>
+            <el-button type="primary" size="mini" :loading="loading_btn" @click="EditActiveBankSetting">Update</el-button>
         </el-form-item>
     </el-form>
 </div>
-</template>
\ No newline at end of file
+</template>
+
+<script type="text/javascript">
+var axios = require('axios');
+var client = axios.create({
+    baseURL: 'http://localhost:8000'
+});
+
+export default {
+    // TODO : update credit limit and timeout 
+    data() {
+        return {
+            options_CIEF: [],
+            options_china_bank: [],
+            active_bank_setting : {
+                x1_bank_id: null,
+                x2_bank_id: null,
+                beneficiary_id: null
+            },
+            loading_btn: false
+        };
+    },
+    beforeMount(){
+        this.UpdateMalaysiaBankOption();
+        this.UpdateChinaBankOption();
+        this.UpdateActiveBankSetting();
+    },
+    methods :{
+        UpdateMalaysiaBankOption : function(){
+            var malaysiaBankData;
+            client.get('api/setting-malaysia-bank')
+                .then((response) => {
+                    malaysiaBankData = response.data;
+                    this.options_CIEF = malaysiaBankData.map(function(item){
+                        return {
+                            value : item.acc_no,
+                            label : item.acc_no,
+                        };
+                    });
+                })
+                .catch((error) => {
+                    console.log(error);
+                    this.$message({
+                        showClose: true,
+                        message: 'Fetch data fail',
+                        type: 'error',
+                        duration: 10000
+                    });
+                });
+        },
+        UpdateChinaBankOption : function(){
+            var chinaBankData;
+            client.get('api/setting-beneficiary')
+                .then((response) => {
+                    chinaBankData = response.data;
+                    this.options_china_bank = chinaBankData.map(function(item){
+                        return {
+                            value : item.acc_no,
+                            label : item.acc_no,
+                        };
+                    });
+                })
+                .catch((error) => {
+                    console.log(error);
+                    this.$message({
+                        showClose: true,
+                        message: 'Fetch data fail',
+                        type: 'error',
+                        duration: 10000
+                    });
+                });
+        },
+        UpdateActiveBankSetting : function(){
+            client.get('api/setting-active-bank')
+                .then((response) => {
+                    this.active_bank_setting = response.data;
+                })
+                .catch((error) => {
+                    console.log(error);
+                    this.$message({
+                        showClose: true,
+                        message: 'Fetch data fail',
+                        type: 'error',
+                        duration: 10000
+                    });
+                });
+        },
+        EditActiveBankSetting : function(){
+            this.loading_btn = true;
+            client.put('/api/setting-active-bank', this.active_bank_setting)
+            .then((response) => {
+                this.loading_btn = false;
+                this.$message({
+                    showClose: true,
+                    message: 'Success',
+                    type: 'success',
+                    duration: 5000
+                });
+            })
+            .catch((error) => {
+                this.loading_btn = false;
+                console.log(error);
+                this.$message({
+                    showClose: true,
+                    message: 'Update failed, please contact support',
+                    type: 'error',
+                    duration: 10000
+                });
+            })
+        },
+    }
+
+}
+
+
+</script>
\ No newline at end of file
diff --git a/resources/assets/js/pages/settings/admin-credit-setting.vue b/resources/assets/js/pages/settings/admin-credit-setting.vue
index 57307154..4d2c793e 100644
--- a/resources/assets/js/pages/settings/admin-credit-setting.vue
+++ b/resources/assets/js/pages/settings/admin-credit-setting.vue
@@ -17,7 +17,6 @@
             <el-form-item align="center">
                 <el-button type="primary" align="center" :loading="loading_btn" size="primary" @click="updateCreditSetting">Update</el-button>
             </el-form-item>
-            
         </el-form>
     </div>
 </template>
@@ -38,7 +37,7 @@
             };
         },
         mounted() {
-            this.getCreditSetting()
+            this.getCreditSetting();
         },
         methods: {
             getCreditSetting() {
diff --git a/routes/api.php b/routes/api.php
index 90e7be8b..36cc5155 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -70,6 +70,9 @@ 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::get('setting-supplier', 'SettingSupplierController@index');
 	Route::get('setting-supplier/{supplier}', 'SettingSupplierController@show');
 	Route::post('setting-supplier', 'SettingSupplierController@store');
@@ -106,4 +109,6 @@ Route::group(['middleware' => ['role:admin']], function() {
 	Route::post('booking/{id}/upload-invoice', 'BookingController@uploadInvoice');
 	Route::post('booking/{id}/confirm-invoice', 'BookingController@confirmInvoice');	
 	
-});
\ No newline at end of file
+});
+
+Route::put('setting-active-bank', 'SettingActiveBankController@update');
\ No newline at end of file