diff --git a/app/Classes/Modules/Accounting/ControllersLogic/UpdateBankStatementDetailLogic.php b/app/Classes/Modules/Accounting/ControllersLogic/UpdateBankStatementDetailLogic.php
index 73221f53..e9a14323 100644
--- a/app/Classes/Modules/Accounting/ControllersLogic/UpdateBankStatementDetailLogic.php
+++ b/app/Classes/Modules/Accounting/ControllersLogic/UpdateBankStatementDetailLogic.php
@@ -7,14 +7,11 @@ use App\Classes\Exceptions\MalformedRequestException;
 use App\Classes\General\Abstracts\AbstractControllerLogic;
 use App\Classes\Modules\Accounting\Services\UpdatesBankStatementDetails;
 use App\Classes\Modules\Accounting\Services\FetchesBankStatementDetails;
-use App\Classes\Modules\Accounting\Standards\Rules\CanUpdateCompany;
-use App\Classes\Modules\Accounting\DataTransferObjects\BankStatementDetailObject;
-use App\Classes\Modules\Accounting\DataTransferObjects\BankStatementTransactionObject;
-use App\Http\Resources\BankStatementDetailResource;
 use App\Classes\Modules\Accounting\Services\CreatesBankStatementTransactionOwner;
 use App\Classes\Modules\Accounting\Services\FetchesBankStatementTransaction;
 use App\Classes\ValueObjects\Constants\StatementTransactionOwnerType;
 use App\Classes\ValueObjects\Constants\SystemType;
+use App\Classes\Modules\Accounting\Processors\ChecksBillNumber;
 use App\Models\Transaction;
 use Illuminate\Http\JsonResponse;
 use Illuminate\Http\Request;
@@ -49,19 +46,24 @@ class UpdateBankStatementDetailLogic extends AbstractControllerLogic
     /** @var CreatesBankStatementTransactionOwner */
     private $createsBankStatementTransactionOwner;
 
+    /** @var ChecksBillNumber */
+    private $checksBillNumber;
+
     /**
      * UpdateBankStatementDetailLogic constructor.
      * @param UpdatesBankStatementDetails $updatesBankStatementDetails
      * @param FetchesBankStatementDetails $fetchesBankStatementDetails
      * @param fetchesBankStatementTransaction $fetchesBankStatementTransaction
      * @param CreatesBankStatementTransactionOwner $createsBankStatementTransactionOwner
+     * @param ChecksBillNumber $checksBillNumber
      */
-    public function __construct(UpdatesBankStatementDetails $updatesBankStatementDetails, FetchesBankStatementDetails $fetchesBankStatementDetails, FetchesBankStatementTransaction $fetchesBankStatementTransaction, CreatesBankStatementTransactionOwner $createsBankStatementTransactionOwner)
+    public function __construct(UpdatesBankStatementDetails $updatesBankStatementDetails, FetchesBankStatementDetails $fetchesBankStatementDetails, FetchesBankStatementTransaction $fetchesBankStatementTransaction, CreatesBankStatementTransactionOwner $createsBankStatementTransactionOwner, ChecksBillNumber $checksBillNumber)
     {
         $this->updatesBankStatementDetails = $updatesBankStatementDetails;
         $this->fetchesBankStatementDetails = $fetchesBankStatementDetails;
         $this->fetchesBankStatementTransaction = $fetchesBankStatementTransaction;
         $this->createsBankStatementTransactionOwner = $createsBankStatementTransactionOwner;
+        $this->checksBillNumber = $checksBillNumber;
     }
 
 
@@ -83,7 +85,8 @@ class UpdateBankStatementDetailLogic extends AbstractControllerLogic
         switch ($request->input('pay_for')) {
             case 'sales':
                 if (in_array($request->input('system_references'), ['exchange', 'izyim'])) {
-                    $transaction = $this->verifyBillNumber($request->input('transaction_reference'), $request->input('system_references'));
+                    // $transaction = $this->verifyBillNumber($request->input('transaction_reference'), $request->input('system_references'));
+                    $transaction = $this->checksBillNumber->execute($request->input('transaction_reference'), $request->input('system_references'));
 
                     // todo-new: update / test on izyim system
 
@@ -117,7 +120,8 @@ class UpdateBankStatementDetailLogic extends AbstractControllerLogic
 
             case 'top_up':
 
-                $transaction = $this->verifyBillNumber($request->input('transaction_reference'), $request->input('system_references'));
+                // $transaction = $this->verifyBillNumber($request->input('transaction_reference'), $request->input('system_references'));
+                $transaction = $this->checksBillNumber->execute($request->input('transaction_reference'), $request->input('system_references'));
 
                 $owner_type                      = Transaction::class;
                 $owner_id                        = $transaction->id;
@@ -174,38 +178,38 @@ class UpdateBankStatementDetailLogic extends AbstractControllerLogic
         // return $this->resourceResponse(new BankStatementDetailResource($query));
     }
 
-    public function verifyBillNumber($bill_no, $system_reference)
-    {
-        if ($system_reference == 'izyim') {
-            try {
-                $url = 'https://izyim.cief-malaysia.com/public/api/v1/transactions/query';
-                $client = new \GuzzleHttp\Client(['verify' => false]);
-                $response = $client->request('GET', $url . '?api-key=510acd13d8d24375cf038ad626c282565451461a9c2399357e0b65365300787e&filters={"bill_no":' . $bill_no . '}');
-                $body = $response->getBody();
-                $data = json_decode($body, true);
-                dd($data);
-                $payload = $data['payload'];
-                $transactions2 = $payload['data'];
-                dd($transactions2);
-                return $transactions2;
-            } catch (\Exception $exception) {
-                Log::error($exception);
-                dd($exception);
-                preg_match('/\{.*\}/s', $exception->getMessage(), $matches);
-                $jsonError = json_decode($matches[0]);
-                // Retrieved Transactions failed
-                throw new MalformedRequestException($jsonError->title);
-            }
-        }
+    // public function verifyBillNumber($bill_no, $system_reference)
+    // {
+    //     if ($system_reference == 'izyim') {
+    //         try {
+    //             $url = 'https://izyim.cief-malaysia.com/public/api/v1/transactions/query';
+    //             $client = new \GuzzleHttp\Client(['verify' => false]);
+    //             $response = $client->request('GET', $url . '?api-key=510acd13d8d24375cf038ad626c282565451461a9c2399357e0b65365300787e&filters={"bill_no":' . $bill_no . '}');
+    //             $body = $response->getBody();
+    //             $data = json_decode($body, true);
+    //             dd($data);
+    //             $payload = $data['payload'];
+    //             $transactions2 = $payload['data'];
+    //             dd($transactions2);
+    //             return $transactions2;
+    //         } catch (\Exception $exception) {
+    //             Log::error($exception);
+    //             dd($exception);
+    //             preg_match('/\{.*\}/s', $exception->getMessage(), $matches);
+    //             $jsonError = json_decode($matches[0]);
+    //             // Retrieved Transactions failed
+    //             throw new MalformedRequestException($jsonError->title);
+    //         }
+    //     }
 
-        if ($system_reference == 'exchange') {
-            $transaction = Transaction::where('bill_no', $bill_no)->first();
-            if ($transaction) {
-                return $transaction;
-            }
-        }
+    //     if ($system_reference == 'exchange') {
+    //         $transaction = Transaction::where('bill_no', $bill_no)->first();
+    //         if ($transaction) {
+    //             return $transaction;
+    //         }
+    //     }
 
-        // if not found 
-        throw new MalformedRequestException('Bill Number Not Found.');
-    }
+    //     // if not found 
+    //     throw new MalformedRequestException('Bill Number Not Found.');
+    // }
 }
diff --git a/app/Classes/Modules/Accounting/Processors/ChecksBillNumber.php b/app/Classes/Modules/Accounting/Processors/ChecksBillNumber.php
new file mode 100644
index 00000000..ddaa55c3
--- /dev/null
+++ b/app/Classes/Modules/Accounting/Processors/ChecksBillNumber.php
@@ -0,0 +1,45 @@
+<?php
+
+namespace App\Classes\Modules\Accounting\Processors;
+
+use App\Classes\Exceptions\MalformedRequestException;
+use App\Models\Transaction;
+use Illuminate\Support\Facades\Log;
+
+class ChecksBillNumber
+{   
+    public function execute($bill_no, $system_reference)
+    {
+        if ($system_reference == 'izyim') {
+            try {
+                $url = 'https://izyim.cief-malaysia.com/public/api/v1/transactions/query';
+                $client = new \GuzzleHttp\Client(['verify' => false]);
+                $response = $client->request('GET', $url . '?api-key=510acd13d8d24375cf038ad626c282565451461a9c2399357e0b65365300787e&filters={"bill_no":' . $bill_no . '}');
+                $body = $response->getBody();
+                $data = json_decode($body, true);
+                dd($data);
+                $payload = $data['payload'];
+                $transactions2 = $payload['data'];
+                dd($transactions2);
+                return $transactions2;
+            } catch (\Exception $exception) {
+                Log::error($exception);
+                dd($exception);
+                preg_match('/\{.*\}/s', $exception->getMessage(), $matches);
+                $jsonError = json_decode($matches[0]);
+                // Retrieved Transactions failed
+                throw new MalformedRequestException($jsonError->title);
+            }
+        }
+
+        if ($system_reference == 'exchange') {
+            $transaction = Transaction::where('bill_no', $bill_no)->first();
+            if ($transaction) {
+                return $transaction;
+            }
+        }
+
+        // if not found 
+        throw new MalformedRequestException('Bill Number Not Found.');
+    }
+}
diff --git a/app/Http/Controllers/Imports/ImportStatementInvoiceController.php b/app/Http/Controllers/Imports/ImportStatementInvoiceController.php
new file mode 100644
index 00000000..a59f9463
--- /dev/null
+++ b/app/Http/Controllers/Imports/ImportStatementInvoiceController.php
@@ -0,0 +1,99 @@
+<?php
+
+namespace App\Http\Controllers\Imports;
+
+use App\Classes\Modules\Documents\DataTransferObjects\DocumentObject;
+use App\Classes\Modules\Imports\Services\GenericImport;
+use App\Classes\Modules\Segments\DataTransferObjects\SeasonalSegmentObject;
+use App\Classes\ValueObjects\Constants\ApprovalStatus;
+use App\Models\Segment;
+use App\Models\User;
+use Carbon\Carbon;
+use DateTime;
+use Illuminate\Http\Request;
+use Maatwebsite\Excel\Facades\Excel;
+use App\Classes\Modules\Segments\Services\CreatesSeasonalSegment;
+use App\Classes\Modules\Companies\Processors\AssignSegmentProcessor;
+use App\Models\Company;
+use App\Models\SeasonalSegment;
+use App\Models\Transaction;
+
+class ImportStatementInvoiceController
+{
+    /**
+     * @param Request $request
+     * @return array
+     * @throws \App\Classes\Exceptions\MalformedRequestException
+     */
+    public function import(Request $request)
+    {
+        ini_set('memory_limit', '-1'); 
+
+        $object = new DocumentObject('', $request->input('files'), '', ApprovalStatus::APPROVED, 'imports');
+        $file = json_decode($object->getFiles()[0])->file_info->original->file;
+
+        $import = new GenericImport();
+        Excel::import($import, $file);
+        $excelRows = $import->rows;
+        $excelRows = $excelRows->toArray();
+
+        foreach ($excelRows as $row) {
+            dd($row);
+            // $row['debtor_code']
+            
+            // attempt 1 - try map by amount and date 
+            // $transactionDate = $this->changeExcelDate($row['date']);
+            // $transaction = Transaction::where('original_amount', $row['total'])->whereDate('created_at', $transactionDate)->get();
+            // if ($transaction) {
+            //     // check company
+            //         // $company = Company::where('debtor', $row['debtor_code'])->first();
+            //         // dd($company);
+            //     // try to verify is it the correct transaction
+            // }
+
+            // Shipping Info
+            // TOPUP -> map with transaction.bill_no
+            if (str_starts_with($row['shipping_info'], 'TOPUP')) {
+                // find in exchange first, if cannont then find in izyim
+                // (App()->make(ChecksBillNumber::class))->execute($bill_no, 'exchange');
+            }
+            
+            // if 5 digits -> exchange booking reference 
+            // find transation
+            // find statement_transaction_owners, and fill up the details 
+
+            // if <5 digits, find the transaction id (order number in izyim), find the payment in izyim
+            // find transation
+            // find statement_transaction_owners, and fill up the details 
+
+            // dd([
+            //     'type'                 => $statementTransactionOwnerType,
+            //     'system'               => $system,
+            //     // 'owner_type'           => Transaction::class,
+            //     // todo-new: make sure owner_type is a class
+            //     'owner_type'           => $owner_type,
+            //     'owner_id'             => $owner_id,
+            //     'owner_reference'      => $owner_reference
+            // ]);
+            
+            // $bankStatementTransaction->owners()->firstOrCreate([
+            //     'type'                 => $statementTransactionOwnerType,
+            //     'system'               => $system,
+            //     // 'owner_type'           => Transaction::class,
+            //     // todo-new: make sure owner_type is a class
+            //     'owner_type'           => $owner_type,
+            //     'owner_id'             => $owner_id,
+            //     'owner_reference'      => $owner_reference
+            // ]);
+
+
+        }
+    }
+
+    public function changeExcelDate($date)
+    {
+        $unixTime = (($date - 25569) * 86400);
+        $date = new DateTime("@$unixTime");
+        return $date->format('Y-m-d'); // Change the format to 'Y-m-d'
+    }
+}
diff --git a/app/Http/Controllers/Imports/ImportStatementReceiptsController.php b/app/Http/Controllers/Imports/ImportStatementReceiptsController.php
new file mode 100644
index 00000000..22111881
--- /dev/null
+++ b/app/Http/Controllers/Imports/ImportStatementReceiptsController.php
@@ -0,0 +1,50 @@
+<?php
+
+namespace App\Http\Controllers\Imports;
+
+use App\Classes\Modules\Documents\DataTransferObjects\DocumentObject;
+use App\Classes\Modules\Imports\Services\GenericImport;
+use App\Classes\Modules\Segments\DataTransferObjects\SeasonalSegmentObject;
+use App\Classes\ValueObjects\Constants\ApprovalStatus;
+use App\Models\Segment;
+use App\Models\User;
+use Carbon\Carbon;
+use DateTime;
+use Illuminate\Http\Request;
+use Maatwebsite\Excel\Facades\Excel;
+use App\Classes\Modules\Segments\Services\CreatesSeasonalSegment;
+use App\Classes\Modules\Companies\Processors\AssignSegmentProcessor;
+use App\Models\Company;
+use App\Models\SeasonalSegment;
+use App\Models\Transaction;
+
+class ImportStatementReceiptsController
+{
+    /**
+     * @param Request $request
+     * @return array
+     * @throws \App\Classes\Exceptions\MalformedRequestException
+     */
+    public function import(Request $request)
+    {
+        $object = new DocumentObject('', $request->input('files'), '', ApprovalStatus::APPROVED, 'imports');
+        $file = json_decode($object->getFiles()[0])->file_info->original->file;
+
+        $import = new GenericImport();
+        Excel::import($import, $file);
+        $excelRows = $import->rows;
+        $excelRows = $excelRows->toArray();
+
+        foreach ($excelRows as $row) {
+            // if has date column
+            // $transactionDate = $this->changeExcelDate($row['date']);
+        }
+    }
+
+    public function changeExcelDate($date)
+    {
+        $unixTime = (($date - 25569) * 86400);
+        $date = new DateTime("@$unixTime");
+        return $date->format('Y-m-d'); // Change the format to 'Y-m-d'
+    }
+}
diff --git a/resources/assets/vue/components/accounting/sections/TransactionsMappingComponent.vue b/resources/assets/vue/components/accounting/sections/TransactionsMappingComponent.vue
index c35db4bd..a29a4066 100644
--- a/resources/assets/vue/components/accounting/sections/TransactionsMappingComponent.vue
+++ b/resources/assets/vue/components/accounting/sections/TransactionsMappingComponent.vue
@@ -55,16 +55,16 @@
                 <div class="col"></div>
                 <div class="col-auto pointer bold text-danger" @click="step=0">X</div>
             </div>
-            <div class="row parentContainer" v-show="step > 0 && stage !== 4">
+            <div class="row parentContainer" v-if="step > 0 && stage !== 4">
                 <div class="col">
                     <div class="row">
                         <div class="col">
                             <div v-if="stage === 1">
                                 <div class="btn btn-primary btn-sm m-t-10 requestModal" data-type="approveMappingTransaction">Approve all the Mapping Below</div>
                                 <modal-component class="animate__animated animate__fast animate__fadeIn" type="approveMappingTransaction">
-                                    <general-confirmation-form-component
-                                        contentText="Are you sure you want to approve all these Transaction?"
-                                        modalType="confirm"
+                                    <general-confirmation-form-component 
+                                        contentText="Are you sure you want to approve all these Transaction?" 
+                                        modalType="confirm" 
                                         class="text-center"
                                         :apiRoute="route('api.accounting.statement_transaction.owner.groupApprove')"
                                         apiMethod="post"
@@ -89,9 +89,9 @@
                                     </div>
                                 </div>
                             </div>
-                            <list-component ref="bankTransactionsList" section="bankTransactionSection" :endpoint="route('api.accounting.bank.transaction')" :options="this.filter" :key="componentKey">
+                            <list-component ref="bankTransactionsList" section="bankTransactionSection" :endpoint="route('api.accounting.bank.transaction')" :options="this.filter">
                                 <template slot="list" slot-scope="{data}">
-                                    <statement-transaction-component :data="data" section="bankTransactionSection" :stage="stage"></statement-transaction-component>
+                                    <statement-transaction-component :data="data" :section="section" :stage="stage"></statement-transaction-component>
                                 </template>
                             </list-component>
                         </div>
@@ -105,10 +105,18 @@
                             <div class="btn btn-lg btn-primary" @click="exportStage++">Export Invoices To AutoCount</div>
                         </div>
                     </div>
-                    <div class="row text-center m-t-50 m-b-50 p-t-50 p-b-50" v-show="exportStage === 1">
+                    <div class="row text-center m-t-50 m-b-50 p-t-50 p-b-50" v-if="exportStage === 1">
                         <div class="col">
-                            <file-upload-component></file-upload-component>
-                            <div class="btn btn-lg btn-primary m-t-20" @click="exportStage++">Import Invoices</div>
+                            <div class="row">
+                                <div class="col">
+                                    <file-input-component :validator="$v.files" v-model="files">
+                                        <template slot="label">
+                                        </template>
+                                    </file-input-component>
+                                </div>
+                            </div>
+                            <div class="btn btn-lg btn-primary m-t-20" @click="importInvoice">Import Invoices</div>
+                            <!-- todo-new: delete later --><br><div class="btn btn-lg btn-primary m-t-20" @click="exportStage++">Nest Step</div>
                         </div>
                     </div>
                     <div class="row text-center m-t-50 m-b-50 p-t-50 p-b-50" v-show="exportStage === 2">
@@ -116,10 +124,18 @@
                             <div class="btn btn-lg btn-primary" @click="exportStage++">Export Receipts To AutoCount</div>
                         </div>
                     </div>
-                    <div class="row text-center m-t-50 m-b-50 p-t-50 p-b-50" v-show="exportStage === 3">
+                    <div class="row text-center m-t-50 m-b-50 p-t-50 p-b-50" v-if="exportStage === 3">
                         <div class="col">
-                            <file-upload-component></file-upload-component>
-                            <div class="btn btn-lg btn-primary m-t-20" @click="exportStage++">Import Receipts</div>
+                            <div class="row">
+                                <div class="col">
+                                    <file-input-component :validator="$v.files" v-model="files">
+                                        <template slot="label">
+                                        </template>
+                                    </file-input-component>
+                                </div>
+                            </div>
+                            <div class="btn btn-lg btn-primary m-t-20" @click="importReceipts">Import Receipts</div>
+                            <!-- todo-new: delete later --><br><div class="btn btn-lg btn-primary m-t-20" @click="exportStage++">Nest Step</div>
                         </div>
                     </div>
                     <div class="row text-center m-t-50 m-b-50 p-t-50 p-b-50" v-show="exportStage === 4">
@@ -133,7 +149,12 @@
     </div>
 </template>
 <script>
+import { required } from "vuelidate/lib/validators";
+
 export default {
+    components: {},
+
+
     data(){
         return {
             type: null,
@@ -141,18 +162,44 @@ export default {
             exportStage: 0,
             step: 0,
             filter: {},
+            files: [],
+            parameters: {},
             section: 'bankTransactionSection',
-            componentKey: 1,
+        }
+    },
+    validations: {
+        files: {
+            // required // todo-new: set required if is pdf section
         }
     },
     methods: {
+        importInvoice(){
+            this.parameters = {
+                files: this.files
+            };
+            this.submit(this.route('api.import_invoices.upload'), 'post', this.section, true, false);
+        },
+        importReceipts(){
+            this.parameters = {
+                files: this.files
+            };
+            this.submit(this.route('api.import_receipts.upload'), 'post', this.section, true, false);
+        },
+        successHandler(){
+            this.step += 1;
+
+            // reset parameters
+            this.files = [];
+            this.parameters = {};
+        },
         startMapping(stage){
+
             this.stage = stage;
             this.exportStage = 0;
             if(this.type === 1){
                 switch(this.stage){
                     case 1:
-                        this.filter = {min_amount: 0, is_mapped: true, is_mapped_with_multiple: false, statement_transaction_owner_type_in: [1, 2], statement_transaction_owner_status_in: [1], per_page: 10000, order_by: {column: 'posting_date', DESC: true}}
+                        this.filter = {min_amount: 0, is_mapped: true, is_mapped_with_multiple: false, statement_transaction_owner_type_in: [1, 2], statement_transaction_owner_status_in: [1], per_page: 100, order_by: {column: 'posting_date', DESC: true}}
                         break;
                     case 2:
                         this.filter = {min_amount: 0, is_mapped: true, is_mapped_with_multiple: true, statement_transaction_owner_type_in: [1, 2], statement_transaction_owner_status_in: [1], per_page: 100, order_by: {column: 'posting_date', DESC: true}}
@@ -184,9 +231,11 @@ export default {
             }
 
             this.step = 1;
-            this.componentKey += 1;
-            // this.$refs.bankTransactionsList.$forceUpdate();
-            // this.$refs.bankTransactionsList.updateFilters(this.filter);
+
+            if(this.$refs.bankTransactionsList){
+                this.$refs.bankTransactionsList.updateFilters(this.filter);
+            }
+
 
         }
     }
diff --git a/routes/api.php b/routes/api.php
index f4118802..f22a6c7b 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -30,6 +30,8 @@ Route::group(['middleware' => 'api', 'prefix' => 'v1', 'as' => 'api.'], function
         Route::get('/storage/{fileName}/fetch', 'Documents\RenderDocumentController@fileStorageServe')->where(['fileName' => '.*'])->name('storage.document.file');
         Route::post('/import/update-debtor/f614e339d7058904a831aad742e24d55', 'Imports\ImportUpdateDebtorController@import')->name('debtor.import');
         Route::post('/import/upload-honey-trap', 'Imports\ImportHoneyTrapController@import')->name('honey_trap.upload');
+        Route::post('/import/upload-import-invoices', 'Imports\ImportStatementInvoiceController@import')->name('import_invoices.upload');
+        Route::post('/import/upload-import-receipt', 'Imports\ImportStatementReceiptsController@import')->name('import_receipts.upload');
 
         require __DIR__ . '/company.php';