From 521260d69fd924ad665d4be9933ac3b6dc06127f Mon Sep 17 00:00:00 2001
From: Steve Ng <hengnam.ng@yycasia.com>
Date: Fri, 13 Oct 2023 08:14:24 +0800
Subject: [PATCH] code for mapped report

---
 ...sactionOwnerInvoiceOrReceiptRefNotNull.php | 24 +++++++
 .../StatementTransactionMappedComponent.vue   | 72 +++++++++++++++++++
 .../ReportTransactionsMappedComponent.vue     | 67 +++++++++++++++++
 .../bank-statements/index.blade.php           | 10 ++-
 4 files changed, 172 insertions(+), 1 deletion(-)
 create mode 100644 app/Classes/General/Eloquent/Filters/StatementTransactionOwnerInvoiceOrReceiptRefNotNull.php
 create mode 100644 resources/assets/vue/components/accounting/elements/StatementTransactionMappedComponent.vue
 create mode 100644 resources/assets/vue/components/accounting/sections/ReportTransactionsMappedComponent.vue

diff --git a/app/Classes/General/Eloquent/Filters/StatementTransactionOwnerInvoiceOrReceiptRefNotNull.php b/app/Classes/General/Eloquent/Filters/StatementTransactionOwnerInvoiceOrReceiptRefNotNull.php
new file mode 100644
index 00000000..f6a23389
--- /dev/null
+++ b/app/Classes/General/Eloquent/Filters/StatementTransactionOwnerInvoiceOrReceiptRefNotNull.php
@@ -0,0 +1,24 @@
+<?php
+
+namespace App\Classes\General\Eloquent\Filters;
+
+
+use Illuminate\Database\Eloquent\Builder;
+
+class StatementTransactionOwnerInvoiceOrReceiptRefNotNull implements Filter
+{
+
+    /**
+     * @param Builder $builder
+     * @param $value
+     * @return mixed
+     */
+    public static function apply(Builder $builder, $value)
+    {
+        return $builder->whereHas('owners', function ($query) {
+            return $query->where(function ($q) {
+                $q->orWhereNotNull('invoice_reference')->orWhereNotNull('receipt_reference');
+            });
+        });
+    }
+}
diff --git a/resources/assets/vue/components/accounting/elements/StatementTransactionMappedComponent.vue b/resources/assets/vue/components/accounting/elements/StatementTransactionMappedComponent.vue
new file mode 100644
index 00000000..e4186bb6
--- /dev/null
+++ b/resources/assets/vue/components/accounting/elements/StatementTransactionMappedComponent.vue
@@ -0,0 +1,72 @@
+<template>
+    <div class="row m-b-10 parentContainer">
+        <div class="col">
+            <div class="row p-b-10 b-b b-grey">
+                <div class="col-2">{{ item.posting_date }}</div>
+                <div class="col-2">{{ item.transaction_description_1 + ' - ' + item.transaction_description_2 }}</div>
+                <div class="col-7">
+                    <div class="row">
+                        <div class="col">{{item.owners.approved[0].system}}</div>
+                        <div class="col">{{ typeString(item.owners.approved[0].type) }}</div>
+                        <div class="col"><a :href="item.owners.approved[0].reference_link" target="_blank">{{item.owners.approved[0].reference}}</a></div>
+                        <div class="col">{{item.owners.approved[0].invoice_reference}}</div>
+                        <div class="col">{{item.owners.approved[0].receipt_reference}}</div>
+                    </div>
+                </div>
+
+                <div class="col-1">{{ item.amount }}</div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    import componentHandler from '../../../general/mixins/componentHandler';
+    export default {
+        props: {
+            stage: {
+                type: Number,
+                default: 0
+            },
+            section:{
+                type: String,
+                required: true
+            },
+        },
+        methods: {
+            typeString(type){
+                switch(type) {
+                    case 1:
+                        return 'Sales';
+                    case 2:
+                        return 'Wallet Top Up';
+                    case 3:
+                        return 'Wallet Withdrawal';
+                    case 4:
+                        return 'Payment Refund';
+                    case 5:
+                        return 'Supplier Payment';
+                    case 6:
+                        return 'Internal Bank Transfer Out';
+                    case 7:
+                        return 'Internal Bank Transfer In';
+                    case 8:
+                        return 'Salary Payment';
+                    case 9:
+                        return 'Statutory Payment';
+                    case 10:
+                        return 'FPX Charges';
+                    case 11:
+                        return 'FPX Charges Refund';
+                    case 12:
+                        return 'Bank Charges';
+                    case 13:
+                        return 'Credit Card Payment';
+                    case 14:
+                        return 'Non-Operational Payment';
+                }
+            },
+        },
+        mixins: [componentHandler]
+    }
+</script>
diff --git a/resources/assets/vue/components/accounting/sections/ReportTransactionsMappedComponent.vue b/resources/assets/vue/components/accounting/sections/ReportTransactionsMappedComponent.vue
new file mode 100644
index 00000000..e8f99f3a
--- /dev/null
+++ b/resources/assets/vue/components/accounting/sections/ReportTransactionsMappedComponent.vue
@@ -0,0 +1,67 @@
+<template>
+    <div class="row">
+        <div class="col">
+            <div class="row">
+                <div class="col">
+                    <div class="row justify-content-center align-items-center m-t-50 m-b-50" v-show="step === 0">
+                        <div class="col-5">
+                            <div class="row text-center">
+                                <div class="col b-a b-grey padding-20 m-r-15 pointer bg-complete text-white" @click="getReportFilter()">Mapped Report</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="row" v-if="step == 1">
+                <div class="col">
+                    <div class="row">
+                        <div class="col">
+                            <div class="row m-t-10 m-b-10">
+                                <div class="col">
+                                    <div class="row p-t-10 p-b-10 b-b b-grey text-master-light">
+                                        <div class="col-2">Date</div>
+                                        <div class="col-2">Description</div>
+                                        <div class="col-7">
+                                            <div class="row">
+                                                <div class="col">System</div>
+                                                <div class="col">Type</div>
+                                                <div class="col">Reference</div>
+                                                <div class="col">Invoice Reference</div>
+                                                <div class="col">Receipt Reference</div>
+                                            </div>
+                                        </div>
+                                        <div class="col-1">Amount</div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <list-component ref="TransactionsMappedList" section="TransactionsMappedSection" :endpoint="route('api.accounting.bank.transaction')" :options="filter">
+                                <template slot="list" slot-scope="{data}">
+                                    <statement-transaction-mapped-component :data="data" :section="section"></statement-transaction-mapped-component>
+                                </template>
+                            </list-component>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script>
+    export default {
+        data() {
+            return {
+                step: 0,
+                filter: {},
+            }
+        },
+        methods: {
+            getReportFilter() {
+                this.filter = {min_amount: 0, is_mapped: true, statement_transaction_owner_type_in: [1, 2], statement_transaction_owner_status_in: [2], statement_transaction_owner_invoice_or_receipt_ref_not_null: true, per_page: 100, order_by: {column: 'posting_date', DESC: true}};
+
+                this.step = 1
+            }
+        },
+    }
+
+</script>
\ No newline at end of file
diff --git a/resources/views/pages/accounting/bank-statements/index.blade.php b/resources/views/pages/accounting/bank-statements/index.blade.php
index cb38d912..c70d8f0a 100644
--- a/resources/views/pages/accounting/bank-statements/index.blade.php
+++ b/resources/views/pages/accounting/bank-statements/index.blade.php
@@ -125,7 +125,7 @@
                                     <div class="row justify-content-end">
                                         <div class="col">
                                             <div class="row fs-12 text-center">
-                                                <div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="complete">
+                                                <div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="ReportMapped">
                                                     <div class="row justify-content-center m-b-5">
                                                         <div class="col-auto">
                                                             <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
@@ -312,6 +312,14 @@
                                             </list-component>
                                         </div>
                                     </div>
+
+                                    {{-- tab for report & Analysis --}}
+                                    <div class="row tabsContainer tabContent" tab-name="ReportMapped">
+                                        <div class="col">
+                                            <report-transactions-mapped-component></report-transactions-mapped-component>
+                                        </div>
+                                    </div>
+
                                 </div>
                             </div>
                         </div>