Show Paid Date (Clients Area)

[Bertie]

Hi all,

Has anyone made it possible (if it even is possible) to make it so when a client is logged in and looking at the invoice section that one of the columns is shows the "Date Paid"? As I believe at the moment you would have to click on each invoice and see the transaction at the bottom.

Thanks, 

[Kian]

Boring but doable. Beging by using this action hook:

<?php

use WHMCS\Database\Capsule;
use WHMCS\Config\Setting;

add_hook('ClientAreaPageInvoices', 1, function($vars)
{
    $output['invoices'] = $vars['invoices'];
    // Getting Client Date Format
    $ClientDateFormat = Setting::getValue('ClientDateFormat');
    // If Client Date Format has not been specified I use Default Date Format of WHMCS
    $ClientDateFormat = (!$ClientDateFormat ? Setting::getValue('DateFormat') : $ClientDateFormat);

    // Converting WHMCS Date Format to PHP equivalent - Probably there's a better way or an internal function but atm I can't remember
    switch ($ClientDateFormat)
    {
        case 'DD/MM/YYYY': $ClientDateFormat = "d/m/Y"; break;
        case 'DD.MM.YYYY': $ClientDateFormat = 'd.m.Y'; break;
        case 'DD-MM-YYYY': $ClientDateFormat = 'd-m-Y'; break;
        case 'MM/DD/YYYY': $ClientDateFormat = 'm/d/Y'; break;
        case 'YYYY/MM/DD': $ClientDateFormat = 'Y/m/d'; break;
        case 'YYYY-MM-DD': $ClientDateFormat = 'Y-m-d'; break;
    }

    // Creating an array that contains Invoice IDs of the current logged user
    foreach ($vars['invoices'] as $k => $v)
    {
        $IDs[$v['id']] = $k;
    }

    // Thanks to the above array I can retreive Date Paid values in a single query instead of multiple ones
    $Dates = Capsule::select(Capsule::raw('SELECT id, datepaid FROM tblinvoices WHERE id IN (\'' . implode('\',\'', array_flip($IDs)) . '\')'));

    // I push "datepaid"  to the end of {$invoices} Smarty array. Read post to learn how to use it
    foreach ($Dates as $v)
    {
        // I keep "raw" date so that I can use it in DataTable to sort by the newly added Date Paid column
        $output['invoices'][$IDs[$v->id]]['datepaid_raw'] = $v->datepaid;
        // Date formatting & set false when date is NULL
        $output['invoices'][$IDs[$v->id]]['datepaid'] = ($v->datepaid == '0000-00-00 00:00:00' ? false : date($ClientDateFormat, strtotime($v->datepaid)));
    }

    return $output;
});

Open templates/{YOUR_TEMPLATE}/clientareainvoices.tpl. Find:

<div class="table-container clearfix">
    <table id="tableInvoicesList" class="table table-list hidden">
        <thead>
            <tr>
                <th>{$LANG.invoicestitle}</th>
                <th>{$LANG.invoicesdatecreated}</th>
                <th>{$LANG.invoicesdatedue}</th>
                <th>{$LANG.invoicestotal}</th>
                <th>{$LANG.invoicesstatus}</th>
                <th class="responsive-edit-button" style="display: none;"></th>
            </tr>
        </thead>
        <tbody>
            {foreach key=num item=invoice from=$invoices}
                <tr onclick="clickableSafeRedirect(event, 'viewinvoice.php?id={$invoice.id}', false)">
                    <td>{$invoice.invoicenum}</td>
                    <td><span class="hidden">{$invoice.normalisedDateCreated}</span>{$invoice.datecreated}</td>
                    <td><span class="hidden">{$invoice.normalisedDateDue}</span>{$invoice.datedue}</td>
                    <td data-order="{$invoice.totalnum}">{$invoice.total}</td>
                    <td><span class="label status status-{$invoice.statusClass}">{$invoice.status}</span></td>
                    <td class="responsive-edit-button" style="display: none;">
                        <a href="viewinvoice.php?id={$invoice.id}" class="btn btn-block btn-info">
                            {$LANG.manageproduct}
                        </a>
                    </td>
                </tr>
            {/foreach}
        </tbody>
    </table>
    <div class="text-center" id="tableLoading">
        <p><i class="fas fa-spinner fa-spin"></i> {$LANG.loading}</p>
    </div>
</div>

Replace with:

<div class="table-container clearfix">
    <table id="tableInvoicesList" class="table table-list hidden">
        <thead>
            <tr>
                <th>{$LANG.invoicestitle}</th>
                <th>{$LANG.invoicesdatecreated}</th>
                <th>{$LANG.invoicesdatedue}</th>
                <th>{$LANG.invoicespaid}</th>
                <th>{$LANG.invoicestotal}</th>
                <th>{$LANG.invoicesstatus}</th>
                <th class="responsive-edit-button" style="display: none;"></th>
            </tr>
        </thead>
        <tbody>{debug}
            {foreach key=num item=invoice from=$invoices}
                <tr onclick="clickableSafeRedirect(event, 'viewinvoice.php?id={$invoice.id}', false)">
                    <td>{$invoice.invoicenum}</td>
                    <td><span class="hidden">{$invoice.normalisedDateCreated}</span>{$invoice.datecreated}</td>
                    <td><span class="hidden">{$invoice.normalisedDateDue}</span>{$invoice.datedue}</td>
                    <td><span class="hidden">{$invoice.datepaid_raw}</span>{$invoice.datepaid}</td>
                    <td data-order="{$invoice.totalnum}">{$invoice.total}</td>
                    <td><span class="label status status-{$invoice.statusClass}">{$invoice.status}</span></td>
                    <td class="responsive-edit-button" style="display: none;">
                        <a href="viewinvoice.php?id={$invoice.id}" class="btn btn-block btn-info">
                            {$LANG.manageproduct}
                        </a>
                    </td>
                </tr>
            {/foreach}
        </tbody>
    </table>
    <div class="text-center" id="tableLoading">
        <p><i class="fas fa-spinner fa-spin"></i> {$LANG.loading}</p>
    </div>
</div>

Preview:

Edit: I wasted my time 😄 At least I only had to add comments

Edited May 28, 2019 by Kian

[brian!]

56 minutes ago, Bertie said:

Has anyone made it possible (if it even is possible) to make it so when a client is logged in and looking at the invoice section that one of the columns is shows the "Date Paid"? As I believe at the moment you would have to click on each invoice and see the transaction at the bottom.

it's possible - but you'd be looking at a combination of a hook to get the Date Paid value for each invoice, format it to the clients format and add the value to the current array; and a template edit to add a new column to the table.

i've attached a working hook (slightly simpler than Kian's), so it should just be a case of editing the template and either replacing an existing column with a new heading and value, or adding a new column... to output the new variable, you would use..

<td><span class="hidden">{$invoice.normalisedPaidDate}</span>{$invoice.datepaid}</td>

invoices_datepaid.php

[brian!]

11 minutes ago, Kian said:

Edit: I wasted my time 😄 At least I only had to add comments

had the same thought... it's the sentq problem all over again, where we each can't see when the other is online and what they're viewing. 😎

[Bertie]

Thanks both of you - That has done the trick. Sorry it was a boring question 😛

Edit: I don't think it's needed but {debug} was left in the .tpl file and seems like it was causing a popup to be prompted when you were on the invoice section

Edited May 29, 2019 by Bertie

[Bertie]

I have found a bit of a bug with this when you use the changes above. It stops the "Status" section from working.

 

So if a client clicked on "Unpaid" it would show 0 invoices even though there are 5 unpaid invoices. I reverted the changes back in the template file and it started to work again. Any suggestions? 

[brian!]

8 minutes ago, Bertie said:

I have found a bit of a bug with this when you use the changes above. It stops the "Status" section from working.

my hook wouldn't cause that...

8 minutes ago, Bertie said:

So if a client clicked on "Unpaid" it would show 0 invoices even though there are 5 unpaid invoices. I reverted the changes back in the template file and it started to work again. Any suggestions? 

I might need to know how you changed the template to accommodate this new additional or replacement field, but an educated guess would be the value in the first line of the clientareainvoices.tpl template...

{include file="$template/includes/tablelist.tpl" tableName="InvoicesList" filterColumn="4"}

that final value makes the fifth column filterable by the sidebar, which by default is the 'Status' column... so if for example, you have added a date paid column somewhere before that Status column and there are now 6 columns in the table, you'll need to change the above "4" value to "5".

Edited June 7, 2019 by brian!

[Bertie]

3 minutes ago, brian! said:

my hook wouldn't cause that...

I might need to know how you changed the template to accommodate this new additional or replacement field, but an educated guess would be the value in the first line of the clientareainvoices.tpl template...

{include file="$template/includes/tablelist.tpl" tableName="InvoicesList" filterColumn="4"}

that final value makes the fifth column filterable by the sidebar, which by default is the 'Status' column... so if for example, you have added a date paid column somewhere before that Status column and there are now 6 columns in the table, you'll need to change the above "4" value to "5".

Hi Brian,

 

Sorry I should have been more clear that I removed the template edit mentioned by Kian that got the status filter working again. I've added it back in and adjusted the filterColumn from 4 to 5 like you have suggested and it now works again. 

 

Thanks again for the help.