diff --git a/app/Classes/General/Helper.php b/app/Classes/General/Helper.php
index 8b5061ec..074eb26e 100644
--- a/app/Classes/General/Helper.php
+++ b/app/Classes/General/Helper.php
@@ -84,7 +84,7 @@ class Helper
         $ringgitWords = $numberTransformer->toWords((int)$ringgit);
         $centsWords = $numberTransformer->toWords((int)$cents);
 
-        return strtoupper('ringgit ' . $ringgitWords . ' and ' . $centsWords . ' cents only');
+        return strtoupper('ringgit malaysia ' . $ringgitWords . ' and ' . $centsWords . ' cents only');
     }
 
     public static function getLHDNStateCodeByName($name)
diff --git a/app/Classes/Modules/Bookings/ControllersLogic/CreateBankingInvoiceTransactionLogic.php b/app/Classes/Modules/Bookings/ControllersLogic/CreateBankingInvoiceTransactionLogic.php
new file mode 100644
index 00000000..884614fe
--- /dev/null
+++ b/app/Classes/Modules/Bookings/ControllersLogic/CreateBankingInvoiceTransactionLogic.php
@@ -0,0 +1,71 @@
+<?php
+
+namespace App\Classes\Modules\Bookings\ControllersLogic;
+
+use App\Classes\General\Abstracts\AbstractControllerLogic;
+use App\Classes\Modules\Bookings\Services\FetchesBooking;
+use App\Classes\Modules\Bookings\Standards\Rules\CanFetchBooking;
+use App\Classes\Modules\Transactions\Processors\CreateBankingInvoiceTransactionProcessor;
+use App\Http\Resources\BookingResource;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+
+class CreateBankingInvoiceTransactionLogic extends AbstractControllerLogic
+{
+
+    /**
+     * @return array
+     */
+    protected function notification():array {
+        return [
+            'title' => 'Create Banking Invoice Transaction',
+            'message' => 'You have successfully create banking invoice transaction'
+        ];
+    }
+
+    /** @var CanFetchBooking */
+    private $canFetchBooking;
+
+    /** @var FetchesBooking */
+    private $fetchesBooking;
+
+    /** @var CreateBankingInvoiceTransactionProcessor */
+    private $createBankingInvoiceTransactionProcessor;
+
+    /**
+     * CreateBankingInvoiceTransactionLogic constructor.
+     * @param CanFetchBooking $canFetchBooking
+     * @param FetchesBooking $fetchesBooking
+     * @param CreateBankingInvoiceTransactionProcessor $createBankingInvoiceTransactionProcessor
+     */
+    public function __construct(
+        CanFetchBooking $canFetchBooking,
+        FetchesBooking $fetchesBooking,
+        CreateBankingInvoiceTransactionProcessor $createBankingInvoiceTransactionProcessor
+    )
+    {
+        $this->canFetchBooking = $canFetchBooking;
+        $this->fetchesBooking = $fetchesBooking;
+        $this->createBankingInvoiceTransactionProcessor = $createBankingInvoiceTransactionProcessor;
+    }
+
+
+    /**
+     * @param Request $request
+     * @return JsonResponse
+     * @throws \App\Classes\Exceptions\AccessForbiddenException
+     * @throws \App\Classes\Exceptions\MalformedRequestException
+     * @throws \App\Classes\Exceptions\RequestValidationException
+     */
+    public function logic(Request $request) : JsonResponse
+    {
+        // $this->canFetchBooking->passes();
+
+        $booking = $this->fetchesBooking->execute(['id' => $request->route('id')]);
+
+        $this->createBankingInvoiceTransactionProcessor->execute($booking);
+
+        return $this->resourceResponse(new BookingResource($booking));
+    }
+
+}
diff --git a/app/Classes/Modules/Transactions/Processors/CreateBankingInvoiceTransactionProcessor.php b/app/Classes/Modules/Transactions/Processors/CreateBankingInvoiceTransactionProcessor.php
new file mode 100644
index 00000000..eb3c3819
--- /dev/null
+++ b/app/Classes/Modules/Transactions/Processors/CreateBankingInvoiceTransactionProcessor.php
@@ -0,0 +1,233 @@
+<?php
+
+namespace App\Classes\Modules\Transactions\Processors;
+
+use App\Classes\Modules\Bookings\Services\CalculatesBookingOutstanding;
+use App\Classes\Modules\Bookings\Services\FetchesBookingQuotation;
+use App\Classes\Modules\Companies\Services\FetchesCompanyPaymentAttemptLimit;
+use App\Classes\Modules\Currencies\DataTransferObjects\CurrencyConversionObject;
+use App\Classes\Modules\Transactions\Services\CreatesTransaction;
+use App\Classes\Modules\Transactions\Services\GeneratesTransactionBillNumber;
+use App\Classes\Modules\Companies\Services\FetchesCompany;
+use App\Classes\Modules\Documents\Services\CreatesDocument;
+use App\Classes\Modules\Documents\Services\CreatesFiles;
+use App\Classes\Modules\Transactions\DataTransferObjects\TransactionObject;
+use App\Classes\Modules\Documents\DataTransferObjects\DocumentObject;
+use App\Classes\ValueObjects\Constants\ApprovalStatus;
+use App\Classes\ValueObjects\Constants\PaymentMethodType;
+use App\Classes\ValueObjects\Constants\TransactionType;
+use App\Classes\ValueObjects\Constants\DocumentType;
+use App\Models\Booking;
+use App\Models\Document;
+use Carbon\Carbon;
+use Illuminate\Support\Facades\Log;
+use Mccarlosen\LaravelMpdf\Facades\LaravelMpdf;
+
+class CreateBankingInvoiceTransactionProcessor
+{
+
+    /** @var CreatesTransaction */
+    private $createsTransaction;
+
+    /** @var GeneratesTransactionBillNumber */
+    private $generatesTransactionBillNumber;
+
+    /** @var FetchesCompany */
+    private $fetchesCompany;
+
+    /** @var CreatesDocument */
+    private $createsDocument;
+
+    /** @var CreatesFiles */
+    private $createsFile;
+
+    /** @var CalculatesBookingOutstanding */
+    private $calculatesBookingOutstanding;
+
+    /** @var FetchesBookingQuotation */
+    private $fetchesBookingQuotation;
+
+    /** @var FetchesCompanyPaymentAttemptLimit */
+    private $fetchesCompanyPaymentAttemptLimit;
+
+
+    /**
+     * CreateBankingInvoiceTransactionProcessor constructor.
+     * @param CreatesTransaction $createsTransaction
+     * @param GeneratesTransactionBillNumber $generatesTransactionBillNumber
+     * @param FetchesCompany $fetchesCompany
+     * @param CreatesDocument $createsDocument
+     * @param CreatesFiles $createsFile
+     * @param CalculatesBookingOutstanding $calculatesBookingOutstanding
+     * @param FetchesBookingQuotation $fetchesBookingQuotation
+     * @param FetchesCompanyPaymentAttemptLimit $fetchesCompanyPaymentAttemptLimit
+     */
+    public function __construct(CreatesTransaction $createsTransaction, GeneratesTransactionBillNumber $generatesTransactionBillNumber, FetchesCompany $fetchesCompany, CreatesDocument $createsDocument, CreatesFiles $createsFile, CalculatesBookingOutstanding $calculatesBookingOutstanding, FetchesBookingQuotation $fetchesBookingQuotation, FetchesCompanyPaymentAttemptLimit $fetchesCompanyPaymentAttemptLimit)
+    {
+        $this->createsTransaction = $createsTransaction;
+        $this->generatesTransactionBillNumber = $generatesTransactionBillNumber;
+        $this->fetchesCompany = $fetchesCompany;
+        $this->createsDocument = $createsDocument;
+        $this->createsFile = $createsFile;
+        $this->calculatesBookingOutstanding = $calculatesBookingOutstanding;
+        $this->fetchesBookingQuotation = $fetchesBookingQuotation;
+        $this->fetchesCompanyPaymentAttemptLimit = $fetchesCompanyPaymentAttemptLimit;
+    }
+
+
+    /**
+     * @param Booking $booking
+     * @return void
+     * @throws \App\Classes\Exceptions\MalformedRequestException
+     */
+    public function execute(Booking $booking)
+    {
+        $po_order_transaction = $booking->transactions()
+            ->where('type', TransactionType::PURCHASE_ORDER)
+            ->whereIn('status', [ApprovalStatus::PENDING_VERIFICATION, ApprovalStatus::APPROVED])
+            ->first();
+
+        $transaction = $booking->transactions()
+            ->where('type', TransactionType::PAYMENT)
+            ->whereNotIn('status', [ApprovalStatus::SUSPENDED])
+            ->first();
+
+        if (!$transaction) {
+            $outstanding = $this->calculatesBookingOutstanding->execute($booking);
+
+            $conversionObject = new CurrencyConversionObject(floatval(str_replace(',', '', $outstanding)), $booking->convertible_currency_id, $booking->service_id, $booking->fix_currency_id === 1 ? 0 : 1, PaymentMethodType::CASH);
+
+            $configurations = $this->fetchesBookingQuotation->execute($booking->company, $conversionObject); //cief todo: 76
+
+            $paymentAttemptLimit = $this->fetchesCompanyPaymentAttemptLimit->execute($booking->company);
+
+            $billNumber = $this->generatesTransactionBillNumber->execute('PYMT-');
+
+            $object = new TransactionObject(
+                $billNumber,
+                TransactionType::PAYMENT,
+                1,
+                $booking->company->id,
+                $configurations->getConfigurations()->getBankId(),
+                $configurations->getConversionObject()->getPaymentMethod(),
+                $configurations->getTotal(),
+                $configurations->getForeignTotal(),
+                1,
+                $configurations->getConversionObject()->getCurrencyId(),
+                $configurations->getConfigurations()->getRate(),
+                $configurations->getTax(),
+                $configurations->getServiceCharge(),
+                Carbon::now()->addMinutes($paymentAttemptLimit),
+                ApprovalStatus::PENDING_SUBMISSION,
+                [],
+                isset($billPlzBill) ? $billPlzBill->id : NULL
+            );
+
+            $this->createsTransaction->execute($booking, $object);
+        }
+
+        $billNumber = $this->generatesTransactionBillNumber->execute('BI-');
+
+        $payable_amount = $booking->transactions()->payments()->where(function ($query) {
+            return $query->where(function ($query) {
+                // return $query->where('status', ApprovalStatus::PENDING_SUBMISSION)->whereDate('expires_on', '>=', Carbon::now())->where('expires_on', '>', Carbon::now()->toTimeString());
+                return $query->where('status', ApprovalStatus::PENDING_SUBMISSION)->where('expires_on', '>=', Carbon::now());
+            })->orWhere(function ($query) {
+                return $query->whereIn('status', [ApprovalStatus::PENDING_VERIFICATION, ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED]);
+            });
+        })->sum('amount');
+        $booking_amount = $booking->fix_amount;
+
+        $transaction = $booking->transactions()
+            ->where('type', TransactionType::PAYMENT)
+            ->first();
+
+        $paymentAmount = $booking->transactions()->payments()->where(function ($query) {
+            return $query->where(function ($query) {
+                return $query->where('status', ApprovalStatus::PENDING_SUBMISSION)->where('expires_on', '>=', Carbon::now());
+            })->orWhere(function ($query) {
+                return $query->whereIn('status', [ApprovalStatus::PENDING_VERIFICATION, ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED]);
+            });
+        })->selectRaw('sum(amount - service_charge - tax) as sub_total')->get()->sum('sub_total');
+
+        $booking_currency_average_rate = $booking_amount / $paymentAmount;
+
+        $total_service_charge = $booking->transactions()
+            ->where('type', TransactionType::PAYMENT)
+            ->whereNotIn('status', [ApprovalStatus::REJECTED, ApprovalStatus::SUSPENDED])
+            ->sum('service_charge');
+
+        $total_tax = $booking->transactions()
+            ->where('type', TransactionType::PAYMENT)
+            ->whereIn('status', [ApprovalStatus::REJECTED, ApprovalStatus::SUSPENDED])
+            ->sum('tax');
+
+        // delete prev banking transactions
+        $booking->transactions()
+            ->where('type', TransactionType::BANKING)
+            ->delete();
+
+        $transaction_object = new TransactionObject(
+            $billNumber,
+            TransactionType::BANKING,
+            $transaction->issuer,
+            $transaction->receiver,
+            $transaction->recipient_bank_account_id,
+            $transaction->payment_method,
+            $payable_amount,
+            $booking_amount,
+            $transaction->currency_id,
+            $transaction->original_currency_id,
+            $booking_currency_average_rate,
+            $total_tax,
+            $total_service_charge,
+            null,
+            ApprovalStatus::APPROVED
+        );
+
+        $banking_transaction = $this->createsTransaction->execute($po_order_transaction->booking, $transaction_object);
+
+        $supplier = $this->fetchesCompany->execute(['id' => $transaction->receiver]);
+        $brn = $supplier->documents()->where('document_type', DocumentType::SSM_REGISTRATION)->latest()->first();
+
+        // PDF 1 - Banking Invoice
+        $purchase_order_pdf = LaravelMpdf::loadView('pages.pdfs.banking_invoice',
+        [
+            'transaction' => $banking_transaction,
+            'po_order_transaction' => $po_order_transaction,
+            'supplier' => $supplier,
+            'brn' => $brn,
+        ]);
+        $document_object = new DocumentObject(
+            DocumentType::BANKING_INVOICE,
+            [chunk_split('data:application/pdf;base64,' . base64_encode($purchase_order_pdf->output()))],
+            '',
+            ApprovalStatus::COMPLETED,
+            'banking_invoices'
+        );
+
+        /** @var Document $document */
+        $document = $this->createsDocument->execute($po_order_transaction->booking, $document_object);
+        $this->createsFile->execute($document, $document_object);
+
+        // PDF 2 - Banking Delivery Order
+        $purchase_order_pdf = LaravelMpdf::loadView('pages.pdfs.deliver_order_banking',
+        [
+            'transaction' => $banking_transaction,
+            'po_order_transaction' => $po_order_transaction,
+            'supplier' => $supplier,
+            'brn' => $brn,
+        ]);
+        $document_object = new DocumentObject(
+            DocumentType::DELIVER_ORDER_BANKING,
+            [chunk_split('data:application/pdf;base64,' . base64_encode($purchase_order_pdf->output()))],
+            '',
+            ApprovalStatus::COMPLETED,
+            'banking_invoices'
+        );
+
+        /** @var Document $document */
+        $document = $this->createsDocument->execute($po_order_transaction->booking, $document_object);
+        $this->createsFile->execute($document, $document_object);
+    }
+}
diff --git a/app/Classes/ValueObjects/Constants/DocumentType.php b/app/Classes/ValueObjects/Constants/DocumentType.php
index 91ff84bb..8da383d4 100644
--- a/app/Classes/ValueObjects/Constants/DocumentType.php
+++ b/app/Classes/ValueObjects/Constants/DocumentType.php
@@ -30,4 +30,7 @@ final class DocumentType {
 
     public const RECEIPT_VOUCHER = 'RECEIPT_VOUCHER';
     public const EINVOICE = 'E_INVOICE';
+
+    public const BANKING_INVOICE = 'BANKING_INVOICE';
+    public const DELIVER_ORDER_BANKING = 'DELIVER_ORDER_BANKING';
 }
diff --git a/app/Classes/ValueObjects/Constants/TransactionType.php b/app/Classes/ValueObjects/Constants/TransactionType.php
index efb11f5c..e02ec0ad 100644
--- a/app/Classes/ValueObjects/Constants/TransactionType.php
+++ b/app/Classes/ValueObjects/Constants/TransactionType.php
@@ -40,6 +40,8 @@ final class TransactionType {
 
     public const RECEIPT_VOUCHER = 17;
 
+    public const BANKING = 18;
+
     public const ID_TO_NAME = [
         self::PAYMENT_ATTEMPT => "PAYMENT_ATTEMPT",
         self::PAYMENT => "PAYMENT",
@@ -57,6 +59,7 @@ final class TransactionType {
         self::CASH_BACK => "CASH_BACK",
         self::SUPPLIER_PAYMENT => "SUPPLIER_PAYMENT",
         self::SUPPLIER_REFUND => "SUPPLIER_REFUND",
+        self::BANKING => "BANKING",
     ];
 
     }
diff --git a/app/Http/Controllers/Bookings/CreateBankingInvoiceTransactionController.php b/app/Http/Controllers/Bookings/CreateBankingInvoiceTransactionController.php
new file mode 100644
index 00000000..dc1636aa
--- /dev/null
+++ b/app/Http/Controllers/Bookings/CreateBankingInvoiceTransactionController.php
@@ -0,0 +1,20 @@
+<?php
+
+namespace App\Http\Controllers\Bookings;
+
+use App\Classes\Modules\Bookings\ControllersLogic\CreateBankingInvoiceTransactionLogic;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+
+class CreateBankingInvoiceTransactionController
+{
+    /**
+     * @param Request $request
+     * @param CreateBankingInvoiceTransactionLogic $logic
+     * @return JsonResponse
+     */
+    public function create(Request $request, CreateBankingInvoiceTransactionLogic $logic): JsonResponse {
+        return $logic->execute($request);
+    }
+
+}
diff --git a/app/Http/Resources/BookingResource.php b/app/Http/Resources/BookingResource.php
index 9c6edf96..fef78809 100644
--- a/app/Http/Resources/BookingResource.php
+++ b/app/Http/Resources/BookingResource.php
@@ -65,6 +65,8 @@ class BookingResource extends JsonResource
                 'supplier_delivery_order' => new DocumentResource($this->documents()->where('document_type', DocumentType::SUPPLIER_DELIVER_ORDER)->first()),
                 'proforma_invoice' => new DocumentResource($this->documents()->where('document_type', DocumentType::PROFORMA_INVOICE)->whereNotIn('status', [ApprovalStatus::REJECTED, ApprovalStatus::EXPIRED])->orderByDesc('id')->first()),
                 'ecommerce_purchase_order' => new DocumentResource($this->documents()->where('document_type', DocumentType::ECOMMERCE_PURCHASE_ORDER)->first()),
+                'banking_invoice' => new DocumentResource($this->documents()->where('document_type', DocumentType::BANKING_INVOICE)->whereNotIn('status', [ApprovalStatus::REJECTED, ApprovalStatus::EXPIRED])->orderByDesc('id')->first()),
+                'delivery_order_banking' => new DocumentResource($this->documents()->where('document_type', DocumentType::DELIVER_ORDER_BANKING)->orderByDesc('id')->first()),
             ],
             'order_reference_no' => $this->modelAttributes()->where('name', BookingAttributeNames::ORDER_REFERENCE_NO)->get()->map(function ($attr) {
                 return [
diff --git a/resources/assets/vue/components/bookings/forms/PurchaseOrderFormComponent.vue b/resources/assets/vue/components/bookings/forms/PurchaseOrderFormComponent.vue
index 8e6959e0..471a44d2 100644
--- a/resources/assets/vue/components/bookings/forms/PurchaseOrderFormComponent.vue
+++ b/resources/assets/vue/components/bookings/forms/PurchaseOrderFormComponent.vue
@@ -181,31 +181,18 @@
                     </div>
                 </div>
             </div>
-            <div class="row" v-if="submitted && data.status !== 3">
-                <div class="col-12 col-md-5 pr-md-0">
-                    <div class="row">
-                        <div class="col-12">
-                            <document-file-viewer-component :file="data.documents.proforma_invoice.files[0]" v-if="data.documents.proforma_invoice">
-                                <template slot="button">
-                                    <div class="text-center bg-master-lightest padding-20 pointer m-b-10">
-                                        <div class="m-b-10">
-                                            <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="45" height="45" viewBox="0 0 172 172" style=" fill:#000000;"><defs><linearGradient x1="118.25" y1="63.41425" x2="118.25" y2="88.92669" gradientUnits="userSpaceOnUse" id="color-1_Ya7GVcPz6Vqb_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="72.5625" y1="20.87113" x2="72.5625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-2_Ya7GVcPz6Vqb_gr2"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="56.4375" y1="20.87113" x2="56.4375" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-3_Ya7GVcPz6Vqb_gr3"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="20.87113" x2="45.6875" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-4_Ya7GVcPz6Vqb_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="69.875" y1="20.87113" x2="69.875" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-5_Ya7GVcPz6Vqb_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="80.625" y1="20.87113" x2="80.625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-6_Ya7GVcPz6Vqb_gr6"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="91.375" y1="20.87113" x2="91.375" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-7_Ya7GVcPz6Vqb_gr7"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="86" y1="20.87113" x2="86" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-8_Ya7GVcPz6Vqb_gr8"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="52.40625" y1="20.87113" x2="52.40625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-9_Ya7GVcPz6Vqb_gr9"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g id="Layer_1"><circle cx="44" cy="30" transform="scale(2.6875,2.6875)" r="4" fill="url(#color-1_Ya7GVcPz6Vqb_gr1)"></circle><rect x="12" y="14" transform="scale(2.6875,2.6875)" width="30" height="2" fill="url(#color-2_Ya7GVcPz6Vqb_gr2)"></rect><path d="M80.625,102.125v-43c0,-2.95625 -2.41875,-5.375 -5.375,-5.375h-37.625c-2.95625,0 -5.375,2.41875 -5.375,5.375v43c0,2.95625 2.41875,5.375 5.375,5.375h37.625c2.95625,0 5.375,-2.41875 5.375,-5.375zM53.75,102.125h-16.125v-10.75h16.125zM53.75,86h-16.125v-10.75h16.125zM53.75,69.875h-16.125v-10.75h16.125zM75.25,102.125h-16.125v-10.75h16.125zM75.25,86h-16.125v-10.75h16.125zM75.25,69.875h-16.125v-10.75h16.125z" fill="url(#color-3_Ya7GVcPz6Vqb_gr3)"></path><rect x="12" y="47" transform="scale(2.6875,2.6875)" width="10" height="2" fill="url(#color-4_Ya7GVcPz6Vqb_gr4)"></rect><rect x="25" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-5_Ya7GVcPz6Vqb_gr5)"></rect><rect x="29" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-6_Ya7GVcPz6Vqb_gr6)"></rect><rect x="33" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-7_Ya7GVcPz6Vqb_gr7)"></rect><path d="M141.3625,73.90625c-1.88125,-6.45 -6.45,-11.825 -12.3625,-14.78125v-34.9375c0,-4.56875 -3.49375,-8.0625 -8.0625,-8.0625h-96.75c-4.56875,0 -8.0625,3.49375 -8.0625,8.0625v110.1875v2.6875v10.75c0,4.56875 3.49375,8.0625 8.0625,8.0625h96.75c4.56875,0 8.0625,-3.49375 8.0625,-8.0625v-10.75v-22.30625c1.6125,0.5375 3.49375,0.80625 5.375,0.80625c11.825,0 21.5,-9.675 21.5,-21.5c0,-9.1375 -5.9125,-17.2 -14.5125,-20.15625zM137.0625,80.625c0,10.48125 -8.33125,18.8125 -18.8125,18.8125c-10.48125,0 -18.8125,-8.33125 -18.8125,-18.8125c0,-10.48125 8.33125,-18.8125 18.8125,-18.8125c10.48125,0 18.8125,8.33125 18.8125,18.8125zM123.625,147.8125c0,1.6125 -1.075,2.6875 -2.6875,2.6875h-96.75c-1.6125,0 -2.6875,-1.075 -2.6875,-2.6875v-3.225c0.80625,0.26875 1.6125,0.5375 2.6875,0.5375h96.75c1.075,0 1.88125,-0.26875 2.6875,-0.5375zM123.625,134.375v2.6875c0,1.6125 -1.075,2.6875 -2.6875,2.6875h-96.75c-1.6125,0 -2.6875,-1.075 -2.6875,-2.6875v-2.6875v-110.1875c0,-1.6125 1.075,-2.6875 2.6875,-2.6875h96.75c1.6125,0 2.6875,1.075 2.6875,2.6875v32.7875c-1.6125,-0.26875 -3.49375,-0.5375 -5.375,-0.5375c-13.4375,0 -24.1875,10.75 -24.1875,24.1875c0,12.3625 9.40625,22.84375 21.76875,24.1875c1.88125,3.49375 4.56875,6.18125 7.79375,8.0625zM134.375,110.1875c-4.8375,0 -9.1375,-2.15 -12.3625,-5.64375c11.55625,-1.88125 20.425,-11.825 20.425,-23.91875c0,-0.26875 0,-0.26875 0,-0.5375c4.8375,2.95625 8.0625,8.0625 8.0625,13.975c0,8.86875 -7.25625,16.125 -16.125,16.125z" fill="url(#color-8_Ya7GVcPz6Vqb_gr8)"></path><rect x="12" y="43" transform="scale(2.6875,2.6875)" width="15" height="2" fill="url(#color-9_Ya7GVcPz6Vqb_gr9)"></rect></g></g></svg>
-                                        </div>
-                                        <p class="no-margin fs-12">Proforma Invoice</p>
-                                    </div>
-                                </template>
-                            </document-file-viewer-component>
-                            <button class="btn btn-sm btn-danger b-rad-none btn-block" v-if="data.documents.proforma_invoice" @click="submit(route('api.booking.proforma.create', data.id), 'post', section, true, true)">Regenerate Proforma Invoice</button>
-                        </div>
-                    </div>
+
+            <!-- Approve and Edit Purchase Order -->
+            <div class="row" v-if="submitted">
+                <div class="col-12 col-md-5 pr-md-0" v-if="submitted && data.status !== 3">
                     <div class="row m-b-15" v-if="($store.getters.isAdmin && data.purchase_order.status === 1) || ($store.getters.isCustomer && data.purchase_order.status === 1 && $store.getters.getCompanyId === 199)" >
                         <div class="col">
                             <button class="btn btn-sm btn-block btn-success b-rad-none" @click="submit(route('api.booking.po.approval', data.id), 'post', section, true, true)">Approve Purchase Order</button>
                         </div>
                     </div>
                 </div>
-                <div class="col" v-if="submitted">
-                    <div class="alert alert-success padding-15" role="alert">
+                <div class="col">
+                    <div class="alert alert-success padding-15" role="alert" v-if="submitted && data.status !== 3">
                         <div class="font-heading fs-12 all-caps bold m-b-15">Your Purchase Order {{data.purchase_order.status === 1 ? 'is Being Processed for Verification' : 'has been Approved' }}</div>
                         <div class="row m-b-15" v-if="allowPOEditing">
                             <div class="col">
@@ -214,19 +201,91 @@
                         </div>
                         <button class="btn btn-xs all-caps b-rad-none btn-default bg-master-lightest w-100" @click="submitted = false" v-if="allowPOEditing">Edit Purchase Order</button>
                         <!-- <button class="btn btn-xs all-caps b-rad-none btn-default bg-master-lightest w-100" @click="submitted = false" >Edit Purchase Order</button> -->
-                        <button class="btn btn-xs all-caps b-rad-none btn-complete w-100 m-t-5" v-if="!data.documents.proforma_invoice && data.outstanding_amount != 0" @click="handleGenerateProformaInvoice">Generate Proforma Invoice</button>
-                        <modal-component
-                            id="modal-einvoice-info"
-                            class="animate__animated animate__fast animate__fadeIn"
-                            styleType="fill-in" type="requestEInvoiceB" size="large">
-                            <e-invoice-info-form-component
-                                :section="section"
-                                :company-id="data.company.id"
-                                :company-type="data.company.type"
-                                v-on:eInvoiceInfoUpdated="updatedEInvoiceInfo($event)"
-                                v-on:eInvoiceChangeOfMindRequest="changeOfMindEInvoiceRequest()">
-                            </e-invoice-info-form-component>
-                        </modal-component>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Generate Banking Invoice -->
+            <div class="row" v-if="data.service.id === 14 || data.service.id === 15">
+                <div class="col-12 col-md-5 pr-md-0" v-if="submitted">
+                    <div class="row">
+                        <div class="col-12">
+                            <button class="btn btn-xs all-caps b-rad-none btn-complete w-100 m-t-5" v-if="!data.documents.banking_invoice && data.outstanding_amount != 0" @click="handleGenerateBankingInvoice">Generate Banking Invoice</button>
+                            <button class="btn btn-sm btn-danger b-rad-none btn-block" v-if="data.documents.banking_invoice" @click="submit(route('api.booking.banking.create', data.id), 'post', section, true, true)">Regenerate Banking Invoice</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="col" v-if="submitted">
+                    <div class="alert alert-success padding-15" role="alert" v-if="submitted && (data.service.id === 14 || data.service.id === 15) && (data.documents.banking_invoice || data.documents.delivery_order_banking )">
+                        <document-file-viewer-component :file="data.documents.banking_invoice.files[0]" v-if="data.documents.banking_invoice">
+                            <template slot="button">
+                                <div class="text-center bg-master-lightest padding-20 pointer m-b-10">
+                                    <div class="m-b-10">
+                                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="45" height="45" viewBox="0 0 172 172" style=" fill:#000000;"><defs><linearGradient x1="118.25" y1="63.41425" x2="118.25" y2="88.92669" gradientUnits="userSpaceOnUse" id="color-1_Ya7GVcPz6Vqb_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="72.5625" y1="20.87113" x2="72.5625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-2_Ya7GVcPz6Vqb_gr2"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="56.4375" y1="20.87113" x2="56.4375" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-3_Ya7GVcPz6Vqb_gr3"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="20.87113" x2="45.6875" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-4_Ya7GVcPz6Vqb_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="69.875" y1="20.87113" x2="69.875" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-5_Ya7GVcPz6Vqb_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="80.625" y1="20.87113" x2="80.625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-6_Ya7GVcPz6Vqb_gr6"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="91.375" y1="20.87113" x2="91.375" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-7_Ya7GVcPz6Vqb_gr7"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="86" y1="20.87113" x2="86" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-8_Ya7GVcPz6Vqb_gr8"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="52.40625" y1="20.87113" x2="52.40625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-9_Ya7GVcPz6Vqb_gr9"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g id="Layer_1"><circle cx="44" cy="30" transform="scale(2.6875,2.6875)" r="4" fill="url(#color-1_Ya7GVcPz6Vqb_gr1)"></circle><rect x="12" y="14" transform="scale(2.6875,2.6875)" width="30" height="2" fill="url(#color-2_Ya7GVcPz6Vqb_gr2)"></rect><path d="M80.625,102.125v-43c0,-2.95625 -2.41875,-5.375 -5.375,-5.375h-37.625c-2.95625,0 -5.375,2.41875 -5.375,5.375v43c0,2.95625 2.41875,5.375 5.375,5.375h37.625c2.95625,0 5.375,-2.41875 5.375,-5.375zM53.75,102.125h-16.125v-10.75h16.125zM53.75,86h-16.125v-10.75h16.125zM53.75,69.875h-16.125v-10.75h16.125zM75.25,102.125h-16.125v-10.75h16.125zM75.25,86h-16.125v-10.75h16.125zM75.25,69.875h-16.125v-10.75h16.125z" fill="url(#color-3_Ya7GVcPz6Vqb_gr3)"></path><rect x="12" y="47" transform="scale(2.6875,2.6875)" width="10" height="2" fill="url(#color-4_Ya7GVcPz6Vqb_gr4)"></rect><rect x="25" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-5_Ya7GVcPz6Vqb_gr5)"></rect><rect x="29" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-6_Ya7GVcPz6Vqb_gr6)"></rect><rect x="33" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-7_Ya7GVcPz6Vqb_gr7)"></rect><path d="M141.3625,73.90625c-1.88125,-6.45 -6.45,-11.825 -12.3625,-14.78125v-34.9375c0,-4.56875 -3.49375,-8.0625 -8.0625,-8.0625h-96.75c-4.56875,0 -8.0625,3.49375 -8.0625,8.0625v110.1875v2.6875v10.75c0,4.56875 3.49375,8.0625 8.0625,8.0625h96.75c4.56875,0 8.0625,-3.49375 8.0625,-8.0625v-10.75v-22.30625c1.6125,0.5375 3.49375,0.80625 5.375,0.80625c11.825,0 21.5,-9.675 21.5,-21.5c0,-9.1375 -5.9125,-17.2 -14.5125,-20.15625zM137.0625,80.625c0,10.48125 -8.33125,18.8125 -18.8125,18.8125c-10.48125,0 -18.8125,-8.33125 -18.8125,-18.8125c0,-10.48125 8.33125,-18.8125 18.8125,-18.8125c10.48125,0 18.8125,8.33125 18.8125,18.8125zM123.625,147.8125c0,1.6125 -1.075,2.6875 -2.6875,2.6875h-96.75c-1.6125,0 -2.6875,-1.075 -2.6875,-2.6875v-3.225c0.80625,0.26875 1.6125,0.5375 2.6875,0.5375h96.75c1.075,0 1.88125,-0.26875 2.6875,-0.5375zM123.625,134.375v2.6875c0,1.6125 -1.075,2.6875 -2.6875,2.6875h-96.75c-1.6125,0 -2.6875,-1.075 -2.6875,-2.6875v-2.6875v-110.1875c0,-1.6125 1.075,-2.6875 2.6875,-2.6875h96.75c1.6125,0 2.6875,1.075 2.6875,2.6875v32.7875c-1.6125,-0.26875 -3.49375,-0.5375 -5.375,-0.5375c-13.4375,0 -24.1875,10.75 -24.1875,24.1875c0,12.3625 9.40625,22.84375 21.76875,24.1875c1.88125,3.49375 4.56875,6.18125 7.79375,8.0625zM134.375,110.1875c-4.8375,0 -9.1375,-2.15 -12.3625,-5.64375c11.55625,-1.88125 20.425,-11.825 20.425,-23.91875c0,-0.26875 0,-0.26875 0,-0.5375c4.8375,2.95625 8.0625,8.0625 8.0625,13.975c0,8.86875 -7.25625,16.125 -16.125,16.125z" fill="url(#color-8_Ya7GVcPz6Vqb_gr8)"></path><rect x="12" y="43" transform="scale(2.6875,2.6875)" width="15" height="2" fill="url(#color-9_Ya7GVcPz6Vqb_gr9)"></rect></g></g></svg>
+                                    </div>
+                                    <p class="no-margin fs-12">Banking Invoice</p>
+                                </div>
+                            </template>
+                        </document-file-viewer-component>
+                        <document-file-viewer-component :file="data.documents.delivery_order_banking.files[0]" v-if="data.documents.delivery_order_banking">
+                            <template slot="button">
+                                <div class="text-center bg-master-lightest padding-20 pointer m-b-10">
+                                    <div class="m-b-10">
+                                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="45" height="45" viewBox="0 0 172 172" style=" fill:#000000;"><defs><linearGradient x1="118.25" y1="63.41425" x2="118.25" y2="88.92669" gradientUnits="userSpaceOnUse" id="color-1_Ya7GVcPz6Vqb_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="72.5625" y1="20.87113" x2="72.5625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-2_Ya7GVcPz6Vqb_gr2"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="56.4375" y1="20.87113" x2="56.4375" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-3_Ya7GVcPz6Vqb_gr3"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="20.87113" x2="45.6875" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-4_Ya7GVcPz6Vqb_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="69.875" y1="20.87113" x2="69.875" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-5_Ya7GVcPz6Vqb_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="80.625" y1="20.87113" x2="80.625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-6_Ya7GVcPz6Vqb_gr6"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="91.375" y1="20.87113" x2="91.375" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-7_Ya7GVcPz6Vqb_gr7"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="86" y1="20.87113" x2="86" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-8_Ya7GVcPz6Vqb_gr8"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="52.40625" y1="20.87113" x2="52.40625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-9_Ya7GVcPz6Vqb_gr9"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g id="Layer_1"><circle cx="44" cy="30" transform="scale(2.6875,2.6875)" r="4" fill="url(#color-1_Ya7GVcPz6Vqb_gr1)"></circle><rect x="12" y="14" transform="scale(2.6875,2.6875)" width="30" height="2" fill="url(#color-2_Ya7GVcPz6Vqb_gr2)"></rect><path d="M80.625,102.125v-43c0,-2.95625 -2.41875,-5.375 -5.375,-5.375h-37.625c-2.95625,0 -5.375,2.41875 -5.375,5.375v43c0,2.95625 2.41875,5.375 5.375,5.375h37.625c2.95625,0 5.375,-2.41875 5.375,-5.375zM53.75,102.125h-16.125v-10.75h16.125zM53.75,86h-16.125v-10.75h16.125zM53.75,69.875h-16.125v-10.75h16.125zM75.25,102.125h-16.125v-10.75h16.125zM75.25,86h-16.125v-10.75h16.125zM75.25,69.875h-16.125v-10.75h16.125z" fill="url(#color-3_Ya7GVcPz6Vqb_gr3)"></path><rect x="12" y="47" transform="scale(2.6875,2.6875)" width="10" height="2" fill="url(#color-4_Ya7GVcPz6Vqb_gr4)"></rect><rect x="25" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-5_Ya7GVcPz6Vqb_gr5)"></rect><rect x="29" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-6_Ya7GVcPz6Vqb_gr6)"></rect><rect x="33" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-7_Ya7GVcPz6Vqb_gr7)"></rect><path d="M141.3625,73.90625c-1.88125,-6.45 -6.45,-11.825 -12.3625,-14.78125v-34.9375c0,-4.56875 -3.49375,-8.0625 -8.0625,-8.0625h-96.75c-4.56875,0 -8.0625,3.49375 -8.0625,8.0625v110.1875v2.6875v10.75c0,4.56875 3.49375,8.0625 8.0625,8.0625h96.75c4.56875,0 8.0625,-3.49375 8.0625,-8.0625v-10.75v-22.30625c1.6125,0.5375 3.49375,0.80625 5.375,0.80625c11.825,0 21.5,-9.675 21.5,-21.5c0,-9.1375 -5.9125,-17.2 -14.5125,-20.15625zM137.0625,80.625c0,10.48125 -8.33125,18.8125 -18.8125,18.8125c-10.48125,0 -18.8125,-8.33125 -18.8125,-18.8125c0,-10.48125 8.33125,-18.8125 18.8125,-18.8125c10.48125,0 18.8125,8.33125 18.8125,18.8125zM123.625,147.8125c0,1.6125 -1.075,2.6875 -2.6875,2.6875h-96.75c-1.6125,0 -2.6875,-1.075 -2.6875,-2.6875v-3.225c0.80625,0.26875 1.6125,0.5375 2.6875,0.5375h96.75c1.075,0 1.88125,-0.26875 2.6875,-0.5375zM123.625,134.375v2.6875c0,1.6125 -1.075,2.6875 -2.6875,2.6875h-96.75c-1.6125,0 -2.6875,-1.075 -2.6875,-2.6875v-2.6875v-110.1875c0,-1.6125 1.075,-2.6875 2.6875,-2.6875h96.75c1.6125,0 2.6875,1.075 2.6875,2.6875v32.7875c-1.6125,-0.26875 -3.49375,-0.5375 -5.375,-0.5375c-13.4375,0 -24.1875,10.75 -24.1875,24.1875c0,12.3625 9.40625,22.84375 21.76875,24.1875c1.88125,3.49375 4.56875,6.18125 7.79375,8.0625zM134.375,110.1875c-4.8375,0 -9.1375,-2.15 -12.3625,-5.64375c11.55625,-1.88125 20.425,-11.825 20.425,-23.91875c0,-0.26875 0,-0.26875 0,-0.5375c4.8375,2.95625 8.0625,8.0625 8.0625,13.975c0,8.86875 -7.25625,16.125 -16.125,16.125z" fill="url(#color-8_Ya7GVcPz6Vqb_gr8)"></path><rect x="12" y="43" transform="scale(2.6875,2.6875)" width="15" height="2" fill="url(#color-9_Ya7GVcPz6Vqb_gr9)"></rect></g></g></svg>
+                                    </div>
+                                    <p class="no-margin fs-12">Banking Delivery Order</p>
+                                </div>
+                            </template>
+                        </document-file-viewer-component>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Generate Proforma Invoice -->
+            <div class="row" v-else>
+                <div class="col-12 col-md-5 pr-md-0" v-if="submitted && data.status !== 3">
+                    <div class="row">
+                        <div class="col-12">
+                            <button class="btn btn-xs all-caps b-rad-none btn-complete w-100 m-t-5" v-if="!data.documents.proforma_invoice && data.outstanding_amount != 0" @click="handleGenerateProformaInvoice">Generate Proforma Invoice</button>
+                            <modal-component
+                                id="modal-einvoice-request"
+                                class="animate__animated animate__fast animate__fadeIn"
+                                styleType="fill-in" type="requestEInvoiceA" size="large">
+                                <e-invoice-request-form-component
+                                    class="text-center"
+                                    :section="section"
+                                    :company-id="data.company.id"
+                                    @choice-made="handleEInvoiceRequestRespond"
+                                />
+                            </modal-component>
+                            <modal-component
+                                id="modal-einvoice-info"
+                                class="animate__animated animate__fast animate__fadeIn"
+                                styleType="fill-in" type="requestEInvoiceB" size="large">
+                                <e-invoice-info-form-component
+                                    :section="section"
+                                    :company-id="data.company.id"
+                                    :company-type="data.company.type"
+                                    v-on:eInvoiceInfoUpdated="updatedEInvoiceInfo($event)"
+                                    v-on:eInvoiceChangeOfMindRequest="changeOfMindEInvoiceRequest()">
+                                </e-invoice-info-form-component>
+                            </modal-component>
+                            <button class="btn btn-sm btn-danger b-rad-none btn-block" v-if="data.documents.proforma_invoice" @click="submit(route('api.booking.proforma.create', data.id), 'post', section, true, true)">Regenerate Proforma Invoice</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="col" v-if="submitted && data.status !== 3">
+                    <div class="alert alert-success padding-15" role="alert" v-if="data.documents.proforma_invoice">
+                        <document-file-viewer-component :file="data.documents.proforma_invoice.files[0]" v-if="data.documents.proforma_invoice">
+                            <template slot="button">
+                                <div class="text-center bg-master-lightest padding-20 pointer m-b-10">
+                                    <div class="m-b-10">
+                                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="45" height="45" viewBox="0 0 172 172" style=" fill:#000000;"><defs><linearGradient x1="118.25" y1="63.41425" x2="118.25" y2="88.92669" gradientUnits="userSpaceOnUse" id="color-1_Ya7GVcPz6Vqb_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="72.5625" y1="20.87113" x2="72.5625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-2_Ya7GVcPz6Vqb_gr2"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="56.4375" y1="20.87113" x2="56.4375" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-3_Ya7GVcPz6Vqb_gr3"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="45.6875" y1="20.87113" x2="45.6875" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-4_Ya7GVcPz6Vqb_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="69.875" y1="20.87113" x2="69.875" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-5_Ya7GVcPz6Vqb_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="80.625" y1="20.87113" x2="80.625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-6_Ya7GVcPz6Vqb_gr6"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="91.375" y1="20.87113" x2="91.375" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-7_Ya7GVcPz6Vqb_gr7"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="86" y1="20.87113" x2="86" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-8_Ya7GVcPz6Vqb_gr8"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="52.40625" y1="20.87113" x2="52.40625" y2="158.79631" gradientUnits="userSpaceOnUse" id="color-9_Ya7GVcPz6Vqb_gr9"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g id="Layer_1"><circle cx="44" cy="30" transform="scale(2.6875,2.6875)" r="4" fill="url(#color-1_Ya7GVcPz6Vqb_gr1)"></circle><rect x="12" y="14" transform="scale(2.6875,2.6875)" width="30" height="2" fill="url(#color-2_Ya7GVcPz6Vqb_gr2)"></rect><path d="M80.625,102.125v-43c0,-2.95625 -2.41875,-5.375 -5.375,-5.375h-37.625c-2.95625,0 -5.375,2.41875 -5.375,5.375v43c0,2.95625 2.41875,5.375 5.375,5.375h37.625c2.95625,0 5.375,-2.41875 5.375,-5.375zM53.75,102.125h-16.125v-10.75h16.125zM53.75,86h-16.125v-10.75h16.125zM53.75,69.875h-16.125v-10.75h16.125zM75.25,102.125h-16.125v-10.75h16.125zM75.25,86h-16.125v-10.75h16.125zM75.25,69.875h-16.125v-10.75h16.125z" fill="url(#color-3_Ya7GVcPz6Vqb_gr3)"></path><rect x="12" y="47" transform="scale(2.6875,2.6875)" width="10" height="2" fill="url(#color-4_Ya7GVcPz6Vqb_gr4)"></rect><rect x="25" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-5_Ya7GVcPz6Vqb_gr5)"></rect><rect x="29" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-6_Ya7GVcPz6Vqb_gr6)"></rect><rect x="33" y="47" transform="scale(2.6875,2.6875)" width="2" height="2" fill="url(#color-7_Ya7GVcPz6Vqb_gr7)"></rect><path d="M141.3625,73.90625c-1.88125,-6.45 -6.45,-11.825 -12.3625,-14.78125v-34.9375c0,-4.56875 -3.49375,-8.0625 -8.0625,-8.0625h-96.75c-4.56875,0 -8.0625,3.49375 -8.0625,8.0625v110.1875v2.6875v10.75c0,4.56875 3.49375,8.0625 8.0625,8.0625h96.75c4.56875,0 8.0625,-3.49375 8.0625,-8.0625v-10.75v-22.30625c1.6125,0.5375 3.49375,0.80625 5.375,0.80625c11.825,0 21.5,-9.675 21.5,-21.5c0,-9.1375 -5.9125,-17.2 -14.5125,-20.15625zM137.0625,80.625c0,10.48125 -8.33125,18.8125 -18.8125,18.8125c-10.48125,0 -18.8125,-8.33125 -18.8125,-18.8125c0,-10.48125 8.33125,-18.8125 18.8125,-18.8125c10.48125,0 18.8125,8.33125 18.8125,18.8125zM123.625,147.8125c0,1.6125 -1.075,2.6875 -2.6875,2.6875h-96.75c-1.6125,0 -2.6875,-1.075 -2.6875,-2.6875v-3.225c0.80625,0.26875 1.6125,0.5375 2.6875,0.5375h96.75c1.075,0 1.88125,-0.26875 2.6875,-0.5375zM123.625,134.375v2.6875c0,1.6125 -1.075,2.6875 -2.6875,2.6875h-96.75c-1.6125,0 -2.6875,-1.075 -2.6875,-2.6875v-2.6875v-110.1875c0,-1.6125 1.075,-2.6875 2.6875,-2.6875h96.75c1.6125,0 2.6875,1.075 2.6875,2.6875v32.7875c-1.6125,-0.26875 -3.49375,-0.5375 -5.375,-0.5375c-13.4375,0 -24.1875,10.75 -24.1875,24.1875c0,12.3625 9.40625,22.84375 21.76875,24.1875c1.88125,3.49375 4.56875,6.18125 7.79375,8.0625zM134.375,110.1875c-4.8375,0 -9.1375,-2.15 -12.3625,-5.64375c11.55625,-1.88125 20.425,-11.825 20.425,-23.91875c0,-0.26875 0,-0.26875 0,-0.5375c4.8375,2.95625 8.0625,8.0625 8.0625,13.975c0,8.86875 -7.25625,16.125 -16.125,16.125z" fill="url(#color-8_Ya7GVcPz6Vqb_gr8)"></path><rect x="12" y="43" transform="scale(2.6875,2.6875)" width="15" height="2" fill="url(#color-9_Ya7GVcPz6Vqb_gr9)"></rect></g></g></svg>
+                                    </div>
+                                    <p class="no-margin fs-12">Proforma Invoice</p>
+                                </div>
+                            </template>
+                        </document-file-viewer-component>
                     </div>
                 </div>
             </div>
@@ -370,7 +429,12 @@
                 }
                 else if(section === this.section + 'CheckEInvoiceRule'){
                     if(response.payload.data.isPassed){
-                        this.submit(route('api.booking.proforma.create', this.data.id), 'post', this.section, true, true);
+                        if(this.data.service.id === 14 || this.data.service.id === 15){
+                            this.submit(route('api.booking.banking.create', this.data.id), 'post', this.section, true, true);
+                        }
+                        else{
+                            this.submit(route('api.booking.proforma.create', this.data.id), 'post', this.section, true, true);
+                        }
                     }
                 }
                 else{
@@ -414,7 +478,26 @@
                 this.products.splice(index, 1);
             },
             handleGenerateProformaInvoice(){
-                this.checkTransferRule();
+                if(this.data.company.e_invoice === null){
+                    $('#modal-einvoice-request').modal('show');
+                }
+                else{
+                    this.checkTransferRule();
+                }
+            },
+            handleGenerateBankingInvoice(){
+                if(this.data.company.e_invoice === null){
+                    $('#modal-einvoice-request').modal('show');
+                }
+                else{
+                    this.checkTransferRule();
+                }
+            },
+            handleEInvoiceRequestRespond({ choice }) {
+                // this.showModalEInvoiceRequest = false;
+                // if(!choice){
+                //     this.showModalEInvoiceRequest = true;
+                // }
             },
             checkTransferRule(){
                 this.error = '';
diff --git a/resources/views/pages/customer_support.blade.php b/resources/views/pages/customer_support.blade.php
index dbb0885b..26681572 100644
--- a/resources/views/pages/customer_support.blade.php
+++ b/resources/views/pages/customer_support.blade.php
@@ -16,6 +16,12 @@
                             <div class="col">
                                 <input class="form-control" type="text" name="booking_reference" placeholder="Booking Reference" value="{{$bookingReference}}">
                             </div>
+                            <div class="col">
+                                <input class="form-control" type="text" name="bill_no" placeholder="Bill No" value="">
+                            </div>
+                            <div class="col">
+                                <input class="form-control" type="text" name="autocount_docno_invoice" placeholder="Autocount Invoice Number" value="">
+                            </div>
                             <div class="col-auto">
                                 <button class="btn btn-complete" type="submit">Search</button>
                             </div>
diff --git a/resources/views/pages/pdfs/banking_invoice.blade.php b/resources/views/pages/pdfs/banking_invoice.blade.php
new file mode 100644
index 00000000..2e371273
--- /dev/null
+++ b/resources/views/pages/pdfs/banking_invoice.blade.php
@@ -0,0 +1,97 @@
+@extends('layouts.base_pdf')
+
+@section('inner_content')
+
+    <br>
+    <htmlpageheader name="page-header">
+        <br><br>
+        <div class="separator"><strong><i>{{ $transaction->bill_no }}</i></strong></div>
+    </htmlpageheader>
+
+    <table>
+        <!-- Header Section -->
+        <tr>
+            <td class="header-logo">
+                <img src="{{ asset('images/ri_1.png') }}" alt="logo" id="logo" class="logo">
+            </td>
+            <td class="header-cief-address">
+                <span class="company-name"><strong>CIEF WORLDWIDE SDN BHD</strong></span>
+                <span class="company-reg">(1134596-M)</span><br>
+                No. 72-3, Jalan Jalil 1,<br>
+                The Earth Bukit Jalil,<br>
+                57000 Kuala Lumpur<br>
+                Tel: 03-8082 1252<br>
+                TIN: C23880226040, MSIC: 46909<br>
+                SST: W10-2403-32000643
+            </td>
+            <td class="header-details">
+                <div class="title"><strong>Invoice</strong></div>
+                <div class="number">EBI#: {{ $transaction->bill_no }}</div>
+                <div class="ref">Ref# {{ $transaction->booking->marking }}</div>
+                <div class="date">Date: {{ $po_order_transaction->booking->created_at }}</div>
+                <div class="ref">Terms: C.O.D</div>
+                <div>&nbsp;</div>
+            </td>
+        </tr>
+        <tr>
+            <td colspan="3" class="bill-to">
+                <span class="sub-title">Bill To</span>
+            </td>
+        </tr>
+        <tr>
+            <td colspan="3" class="address">
+                <div class="label">
+                    {{ $supplier->name }}
+                    @if ($brn)
+                        (ROC: {{ $brn->reference }})
+                    @endif
+                </div>
+                <div class="address">
+                    @php
+                        $billingAddress = $supplier->addresses()->where('billing', '=', true)->first();
+                    @endphp
+                    {{ $billingAddress->street_one }}
+                    {{ $billingAddress->street_two }},
+                    {{ $billingAddress->district()->first()->name }},
+                    {{ $billingAddress->postcode }}
+                    {{ $billingAddress->state()->first()->name }},
+                    {{ $billingAddress->country()->first()->name }}
+                </div>
+                <div>Phone: {{ $supplier->contacts()->first()->phone }}</div>
+            </td>
+        </tr>
+    </table>
+
+    <br>
+    <br>
+
+    <?php
+        $voucher_redemption = $voucher_redemption ?? null;
+    ?>
+
+    <!-- Invoice Table -->
+    @include('pages.pdfs.purchase_order_table_v2')
+
+    <br>
+    <br>
+    <br>
+    <div class="note">
+        <p><strong><span>{{ \App\Classes\General\Helper::convert(round($transaction->amount, 2)) }}</span></strong></p>
+        <strong>Notes:</strong><br>
+        1. All cheques should be crossed and made payable to CIEF WORLDWIDE SDN. BHD. (MAYBANK) MBB-568603010762<br>
+        2. Goods sold are neither returnable nor refundable. Otherwise a cancellation fee of 20% on purchase price will be imposed.<br>
+        3. Interest rate 2% per month will be charged on all overdue bills.<br>
+        4. Price offered on invoice is based on present as at the current invoice date.<br><br>
+        No any price amendment will be allowed after invoice being chop & sign.<br>
+        CIEF WORLDWIDE SDN. BHD.<br>
+    </div>
+    <br><br>
+    <htmlpagefooter name="page-footer">
+        <table width="100%">
+            <tr>
+                <td style="text-align: right; ">This is generated by computer. No signature required.</td>
+                <td style="text-align: right; ">Page {PAGENO} of {nbpg}</td>
+            </tr>
+        </table>
+    </htmlpagefooter>
+@endsection
diff --git a/resources/views/pages/pdfs/deliver_order_banking.blade.php b/resources/views/pages/pdfs/deliver_order_banking.blade.php
new file mode 100644
index 00000000..c788a655
--- /dev/null
+++ b/resources/views/pages/pdfs/deliver_order_banking.blade.php
@@ -0,0 +1,113 @@
+@extends('layouts.base_pdf')
+@section('inner_content')
+    <br>
+    <htmlpageheader name="page-header">
+        <br><br>
+        <div class="separator"><strong><i>{{ str_replace(['BI-'], 'BDO-', $transaction->bill_no) }}</i></strong></div>
+    </htmlpageheader>
+
+    <table>
+        <tr>
+            <td class="header-logo">
+                <img src="{{ asset('images/ri_1.png') }}" alt="logo" id="logo" class="logo">
+            </td>
+            <td class="header-cief-address">
+                <span class="company-name"><strong>CIEF WORLDWIDE SDN BHD</strong></span>
+                <span class="company-reg">(1134596-M)</span><br>
+                No. 72-3, Jalan Jalil 1,<br>
+                The Earth Bukit Jalil,<br>
+                57000 Kuala Lumpur<br>
+                Tel: 03-8082 1252<br>
+                TIN: C23880226040, MSIC: 46909<br>
+                SST: W10-2403-32000643
+            </td>
+            <td class="header-details">
+                <div class="title">
+                    <strong>
+                        Delivery Order
+                    </strong>
+                </div>
+
+                <div class="number">EBDO#: {{ str_replace(['BI-'], 'BDO-', $transaction->bill_no) }}</div>
+                <div class="ref">Ref#: {{ $transaction->booking->marking }}</div>
+                <div class="date">Date: {{
+                    $supplier->segments->whereIn('id', [23])->first() ? \Carbon\Carbon::now() : $po_order_transaction->created_at }}</div>
+                <div>&nbsp;</div>
+            </td>
+        <tr>
+            <td colspan="3" class="bill-to">
+            <span class="sub-title">
+                Bill To
+            </span>
+            </td>
+        </tr>
+        <tr>
+            <td colspan="3" class="address">
+                <div class="label">
+                    {{ $supplier->name }}
+                    @if ($brn)
+                        (ROC: {{ $brn->reference }})
+                    @endif
+                </div>
+                <div class="address">
+                    @php
+                        $billingAddress = $supplier->addresses()->where('billing', '=', true)->first();
+                    @endphp
+                    {{ $billingAddress->street_one }}
+                    {{ $billingAddress->street_two }} ,
+                    {{ $billingAddress->district()->first()->name }},
+                    {{ $billingAddress->postcode }}
+                    {{ $billingAddress->state()->first()->name }},
+                    {{ $billingAddress->country()->first()->name }}
+                </div>
+                <div>
+                    Phone: {{ $supplier->contacts()->first()->phone }}
+                </div>
+            </td>
+        </tr>
+    </table>
+
+    <br>
+    <br>
+
+    <?php
+        $voucher_redemption = $voucher_redemption ?? null;
+    ?>
+
+    @include('pages.pdfs.purchase_order_table_v2')
+
+    <table style="width: 100%; border-spacing: 0;">
+        <tbody>
+            <tr style="border-spacing: 2em;">
+                <td width="60%">
+
+                </td>
+                <td width="40%" valign="top">
+                    E & O.E<br>
+                    Receive  In Good Order & Condition<br>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+    <table style="width: 100%; border-spacing: 0;">
+        <tbody>
+            <tr style="border-spacing: 2em;">
+                <td width="60%">
+                    CIEF WORLDWIDE SDN BHD<br>
+                </td>
+                <td width="40%" valign="top">
+
+                </td>
+            </tr>
+        </tbody>
+    </table>
+
+    <htmlpagefooter name="page-footer">
+        <table width="100%">
+            <tr>
+                <td style="text-align: right; ">This is generated by computer. No signature required.</td>
+                <td style="text-align: right; ">Page {PAGENO} of {nbpg}</td>
+            </tr>
+        </table>
+    </htmlpagefooter>
+@endsection
diff --git a/routes/booking.php b/routes/booking.php
index 50e9911a..e0e467ce 100644
--- a/routes/booking.php
+++ b/routes/booking.php
@@ -3,6 +3,7 @@
 use App\Http\Controllers\Bookings\RegenerateBookingPaymentRVController;
 use App\Http\Controllers\Bookings\RegenerateBookingEInvoiceController;
 use App\Http\Controllers\Bookings\UpdateBookingAmountController;
+use App\Http\Controllers\Bookings\CreateBankingInvoiceTransactionController;
 use Illuminate\Support\Facades\Route;
 
 Route::group(['prefix' => 'booking', 'as' => 'booking.', 'namespace' => 'Bookings'], function () {
@@ -43,6 +44,8 @@ Route::group(['prefix' => 'booking', 'as' => 'booking.', 'namespace' => 'Booking
     Route::post('/merge', 'MergeBookingController@merge')->name('merge');
 
     Route::post('{id}/proforma/create', 'CreateProformaInvoiceTransaction@create')->name('proforma.create');
+    Route::post('{id}/banking/create', [CreateBankingInvoiceTransactionController::class, 'create'])->name('banking.create');
+
 
     Route::group(['prefix' => '{id}/receipt', 'as' => 'receipt.'], function () {
         Route::post('/', [RegenerateBookingPaymentRVController::class, 'regenerate'])->name('regenerate');
diff --git a/routes/web.php b/routes/web.php
index 0f707244..5c98f87a 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -36,7 +36,9 @@ use App\Classes\Modules\Transactions\Processors\CreateInvoiceTransactionV2Proces
 use Illuminate\Support\Facades\DB;
 use Illuminate\Support\Facades\Log;
 use App\Classes\General\AWSS3Helper;
+use App\Classes\ValueObjects\Constants\KVPKey;
 use App\Http\Controllers\Reports\UnfinishedPaymentOrders;
+use App\Models\KeyValuePair;
 use Illuminate\Support\Facades\File;
 
 
@@ -215,6 +217,8 @@ Route::post('/support', function (Request $request) {
     $marking = $request->input('marking');
     $email = $request->input('customer_email');
     $bookingReference = $request->input('booking_reference');
+    $billNo = $request->input('bill_no');
+    $autocountDocNoInvoice = $request->input('autocount_docno_invoice');
 
     $company = null;
     $booking = null;
@@ -234,6 +238,17 @@ Route::post('/support', function (Request $request) {
         $company = $booking->company;
     }
 
+    if($billNo) {
+        $transaction = Transaction::where('bill_no', $billNo)->first();
+        $booking = $transaction->booking;
+    }
+
+    if($autocountDocNoInvoice) {
+        $kvp = KeyValuePair::where('key', KVPKey::AUTOCOUNT_DOCNO_INVOICE)->where('value', $autocountDocNoInvoice)->first();
+        $transaction = $kvp->owner()->withTrashed()->first();
+        $booking =  $transaction ? $transaction->booking : null;
+    }
+
     return view('pages.customer_support', [
         'marking' => $marking,
         'email' => $email,