Define clientarea displayed blocks

[JelleG 10]

I want to define the position of the displayed blocks on the client area homepage.

I want to use two columns, where I want to define what blocks are displayed inside these columns.

 

By default to code is displayed using foreach, so I can not easily define the position of the blocks.

 

Is there a way that I can check the menuItemName of some items with foreach and only display them?

 

My currenty code is, which checks if the item is even or odd:

 

{foreach $panels as $item}
{if $item@iteration is odd}
{outputHomePanels}
{/if}
{/foreach}

 

I want to edit this, so that not the even or odd are displayed. But that I can define what item is displayed, based on the name of the item.

 

Entire code:

 

{function name=outputHomePanels}
               <div menuItemName="{$item->getName()}" class="panel panel-default panel-accent-{$item->getExtra('color')}{if $item->getClass()} {$item->getClass()}{/if} {$item->getName()}"{if $item->getAttribute('id')} id="{$item->getAttribute('id')}"{/if}>
                   <div class="panel-heading">
                       <h3 class="panel-title">
                           {if $item->getExtra('btn-link') && $item->getExtra('btn-text')}
                               <div class="pull-right">
                                   <a href="{$item->getExtra('btn-link')}" class="more-link">
                                       {$item->getExtra('btn-text')}
                                   </a>
                               </div>
                           {/if}
                           <div class="clientarea-icon {$item->getName()}">
                           {if $item->hasIcon()}<i class="{$item->getIcon()}"></i>{/if}
                           </div>
                           <div class="clientarea-title">
                           {$item->getLabel()}
                           </div>
                           {if $item->hasBadge()}<span class="badge">{$item->getBadge()}</span>{/if}
                       </h3>
                   </div>
                   {if $item->hasBodyHtml()}
                       <div class="panel-body">
                           {$item->getBodyHtml()}
                       </div>
                   {/if}
                   {if $item->hasChildren()}
                       <div class="list-group{if $item->getChildrenAttribute('class')} {$item->getChildrenAttribute('class')}{/if}">
                           {foreach $item->getChildren() as $childItem}
                               {if $childItem->getUri()}
                                   <a menuItemName="{$childItem->getName()}" href="{$childItem->getUri()}" class="list-group-item{if $childItem->getClass()} {$childItem->getClass()}{/if}{if $childItem->isCurrent()} active{/if}"{if $childItem->getAttribute('dataToggleTab')} data-toggle="tab"{/if}{if $childItem->getAttribute('target')} target="{$childItem->getAttribute('target')}"{/if} id="{$childItem->getId()}">
                                       <div class="clientarea-icon {$childItem->getLabel()|stristr:'<' : true}">
                                           <i class="icon-clientarea-product"></i>
                                       </div>
                                       <div class="clientarea-title">
                                           {assign var="splitItem" value=" - "|explode:$childItem->getLabel()}
{$splitItem[1]}
                                       </div>
                                       {if $childItem->hasBadge()} <span class="badge">{$childItem->getBadge()}</span>{/if}
                                   </a>
                               {else}
                                   <div menuItemName="{$childItem->getName()}" class="list-group-item{if $childItem->getClass()} {$childItem->getClass()}{/if}" id="{$childItem->getId()}">
                                       {if $childItem->hasIcon()}<i class="{$childItem->getIcon()}"></i> {/if}
                                       {$childItem->getLabel()}
                                       {if $childItem->hasBadge()} <span class="badge">{$childItem->getBadge()}</span>{/if}
                                   </div>
                               {/if}
                           {/foreach}
                       </div>
                   {/if}
               </div>
           {/function}

[brian! 1,725]

my first thought would to use action hooks to remove unwanted panels... actually, my second thought would be to use hooks too... it's so simple to remove a panel with a hook...

 

<?php
use WHMCS\View\Menu\Item;

add_hook('ClientAreaHomepagePanels', 1, function (Item $homePagePanels)
{
   $homePagePanels->removeChild('Recent Support Tickets');
});

or if you wanted to move a panel's position to be first...

 

<?php
use WHMCS\View\Menu\Item;

add_hook('ClientAreaHomepagePanels', 1, function (Item $homePagePanels)
{
   $homePagePanels->getChild('Recent Support Tickets')
                   ->setOrder(1);
}); 

with a bit of planning, you should be able to get the panels in the order you want - but always remember that not all panels will be shown to all clients, e.g if they don't have any expiring domains, they won't see the "Domains Expiring Soon" panel; if they don't have overdue invoices, they won't see the "Overdue Invoices" panel etc... so their positions will adjust depending on what panels are applicable to the client.

 

I think the only way you could get around that issue would be to remove them all and then re-create the panels so that all your clients saw the same panels - but that's potentially an awful lot of work!

[JelleG 10]

 

or if you wanted to move a panel's position to be first...

 

<?php
use WHMCS\View\Menu\Item;

add_hook('ClientAreaHomepagePanels', 1, function (Item $homePagePanels)
{
   $homePagePanels->getChild('Recent Support Tickets')
                   ->setOrder(1);
}); 

 

Thanks for your reply!

 

I tried that code inside the clientareahome.tpl file, but that does not seem to work, because of the php code.

 

I want to replace the entire {foreach $panels as $item}

{if $item@iteration is odd}

{outputHomePanels}

{/if}

{/foreach} code

 

What am I missing?

[brian! 1,725]

I tried that code inside the clientareahome.tpl file, but that does not seem to work, because of the php code.

sorry, I should have explained... these are action hooks and you don't include them in your template code, you create a .php file in /includes/hooks, give it a filename, add your code to it and save.

then when you refresh the page, the panel should be gone/moved.

 

I want to replace the entire {foreach $panels as $item}

{if $item@iteration is odd}

{outputHomePanels}

{/if}

{/foreach} code

 

What am I missing?

are you sure that you want to do that though... ?

if you are wanting to hard-code a 2-column solution, what happens for those with smaller screens or mobile devices? as things currently stand, if the screen is too narrow for 2 columns, it shows the panels in 1 column.

Edited August 3, 2016 by brian!

[JelleG 10]

are you sure that you want to do that though... ?

if you are wanting to hard-code a 2-column solution, what happens for those with smaller screens or mobile devices? as things currently stand, if the screen is too narrow for 2 columns, it shows the panels in 1 column.

 

Well I currently have two columns in my client area, with both a width of 50%.

But for example I want to dispaly thee Active products block always on top of the right block.

 

But because of the even/odd method, I currently can not define that, also not with the hook, right?

 

How can I solve that?

[brian! 1,725]

Well I currently have two columns in my client area, with both a width of 50%.

that's right - but if you reduce the browser window or use a mobile, it only uses one.

 

But for example I want to display the Active products block always on top of the right block.

But because of the even/odd method, I currently can not define that, also not with the hook, right?

How can I solve that?

you can't define it's exact position, only it's order in the array.

 

if you wanted it first on the right - and bear in mind this would only be visible for those clients with active products - you could modify it's sort order to 1 with a hook, and then swap the references in the template of 'odd' and even'... for a two column display, that would show the first panel on the right... though you'd have an issue if the screen was smaller as it would then show the even panels first, then odd... so your panel wouldn't then be first.

 

if you had wanted it positioned top left, then you could leave the template alone, change it's order value to 1 in the hook and that would always work.

 

<?php
use WHMCS\View\Menu\Item;

add_hook('ClientAreaHomepagePanels', 1, function (Item $homePagePanels)
{
   $homePagePanels->getChild('Active Products/Services')
                   ->setOrder(1);
}); 

btw - if it helps, here are the default order values for the homepagepanels...

 

http://docs.whmcs.com/Working_With_Client_Area_Home_Page_Panels

Edited August 3, 2016 by brian!

[JelleG 10]

Thanks!! Works prefect, thanks a lot!

 

I currently also display the following block, that should display the last 5 invoices.

Currently it display the unpaid invoices.

 

How can I edit this block, so that it display the latest 5 invoices?

 

CODE:

 

		{if in_array('invoices',$contactpermissions)}

       <div class="panel panel-default panel-accent-midnight-blue">
	<div class="panel-heading">
       	<h3 class="panel-title">
        	<div class="pull-right">
               	<a href="clientarea.php?action=services" class="more-link">Bekijk alle facturen</a>
               </div>
               <div class="clientarea-icon invoices">
              	 	<i class="icon-File"></i>
               </div>
               <div class="clientarea-title">Facturatie</div>
		</h3>
       </div>
			<form method="post" action="clientarea.php?action=masspay">
				<table class="table table-data table-hover">
					<thead>
						<tr>
							<th class="text-center hidden-sm hidden-xs">Nummer</th>
							<th class="text-center hidden-sm hidden-xs" class="invoicecreatedate">{$LANG.invoicesdatecreated}</th>
							<th class="text-center hidden-sm hidden-xs">{$LANG.invoicesdatedue}</th>
							<th class="text-center hidden-sm hidden-xs">{$LANG.invoicesstatus}</th>
							<th class="text-right hidden-sm hidden-xs">{$LANG.invoicestotal}</th>
							<th class="cell-view"></th>
						</tr>
					</thead>
					<tbody>{foreach from=$invoices item=invoice} 
						<tr>
							<td><a href="viewinvoice.php?id={$invoice.id}" target="_blank" class="item-title">{$invoice.invoicenum}</a>
								<ul
								class="cell-inner-list visible-sm visible-xs">
								<li><span class="label label-{$invoice.rawstatus} label-danger">{$invoice.statustext}</span>
								</li>
								<li><span class="item-title">{$LANG.invoicestotal} : </span>{$invoice.total}</li>
								<li><span class="item-title">{$LANG.invoicesdatecreated} : </span>{$invoice.datecreated}</li>
								<li><span class="item-title">{$LANG.invoicesdatedue} : </span>{$invoice.datedue}</li>
							</ul>
						</td>
						<td class="text-center hidden-sm hidden-xs">{$invoice.datecreated}</td>
						<td class="text-center hidden-sm hidden-xs">{$invoice.datedue}</td>
						<td class="text-center hidden-sm hidden-xs"><span class="label label-{$invoice.rawstatus} label-danger">{$invoice.statustext}</span>
						</td>
						<td class="text-right hidden-sm hidden-xs">{$invoice.total}</td>
						<td class="cell-view"><a href="viewinvoice.php?id={$invoice.id}" target="_blank"><span class="glyphicon glyphicon-chevron-right pull-right flip"></span></a>
						</td>
					</tr>{foreachelse}
					<tr>
						<td colspan="{if $masspay}7{else}6{/if}" class="norecords">{$LANG.norecordsfound}</td>
					</tr>{/foreach}</tbody>
				</table>
			</form>
			{/if}
		</div>

[brian! 1,725]

the quick way should be to change...

 

<tbody>{foreach from=$invoices item=invoice}

to...

 

<tbody>{foreach from=$invoices|@array_slice:0:5 item=invoice}

[JelleG 10]

the quick way should be to change...

 

<tbody>{foreach from=$invoices item=invoice}

to...

 

<tbody>{foreach from=$invoices|@array_slice:0:5 item=invoice}

 

 

Thanks, I tried that, but that does not seem to work.

That still does only display the unpaid invoices.

 

I want to display the 5 latest invoices, also the ones that are already paid.

 

Is that possible?

[brian! 1,725]

Thanks, I tried that, but that does not seem to work.

it worked locally when I tested it - changing the '5' to different values, changed the number of invoices shown.

 

That still does only display the unpaid invoices.

I want to display the 5 latest invoices, also the ones that are already paid.

Is that possible?

from the existing array, no.

 

the only reason you can do what your attempting to do with this panel is because the $invoices array is already being generated for the clientarea homepage - however, I assume that it is being created solely for use with the "Overdue Invoices" panel because the array only contains unpaid invoices, not all invoices (as you want).

 

what you would need to do is write an action hook that either queries the database, creates a new invoices array and passes it back to Smarty for you to use in the clientareahome.tpl template... or you query the database, create the panel and output the results in the same hook... of the two, if the panel is going to be normal width/size, then the second option is the best solution.