X-Cart forums

[pipercub]

I created a mod to the orders.tpl file to change the color of the cells with the order info in them. The cells will change color according to the status of the order. This makes it very easy to glance at your screen to get the status.

Here is a screen capture of what I'm talking about. I'll post the code shortly. it's a very simple (yet effective) mod.

http://66.113.244.89/order_colors.gif

Piper

[shasan]

hey, that's pretty cool. Would you be able to change the colours easily?

[adpboss]

Awesome MOD!

Can't wait to incorporate your code into my cart.

[pipercub]

Originally Posted by shasan

hey, that's pretty cool. Would you be able to change the colours easily?

Yup! The colors are controlled by a seperate .tpl file. you can edit them to whatever you like. It would really be cool to somehow incorporate the color settings into the "General Settings" page, but for now you just need to edit the color values in the tpl. Simple enough.

Piper

P.S. I've been realy busy lately, but I'll try to post the code tomorrow.

[shasan]

Nicely done.

Can't wait for the code.

[pipercub]

Here's the code...

First, create a new template called 'order_colors.tpl' (or whatever you prefer). This file should live in the 'Main' directory. Paste the following into this new file:

{* $Id: orders_colors.tpl,v 1.0 2003/10/26 13:07:50 pipercub Exp $ *}
{if $orders[cat_num].status eq "C"} bgcolor="#00CC00"} {/if}
{if $orders[cat_num].status eq "P"} bgcolor="#FFFF99"} {/if}
{if $orders[cat_num].status eq "F"} bgcolor="#FF33333"} {/if}

Obviously, you can add all of the status indicators that you need, but I only use these three. This is also where you change the colors.

Next, open 'main/orders.tpl'. Find the part of the code where the 'section' loop begins. Replace everything between {section name=cat_num loop=$orders} and {/section} with the following code:

*This is the easy method. Scroll down for the custom method.

{section name=cat_num loop=$orders}
{math equation="x + ordertotal" x=$total ordertotal=$orders[cat_num].total assign="total"}
{if $orders[cat_num].status eq "P" or $orders[cat_num].status eq "C"}
{math equation="x + ordertotal" x=$total_paid ordertotal=$orders[cat_num].total assign="total_paid"}
{/if}
{ if %cat_num.first% }
<table border=0 width=100% cellspacing="1" cellpadding="0">
{/if}
<tr>
<td align="center" {include file="main/orders_colors.tpl"}>
#{$orders[cat_num].orderid}
</td>

<td align="center" {include file="main/orders_colors.tpl"}>
<input type=radio name=orderid value="{ $orders[cat_num].orderid }" { if %cat_num.first% }checked{/if}>
</td>

<td align="center" nowrap class=Text {include file="main/orders_colors.tpl"}>
{$orders[cat_num].status}
</td>

<td nowrap align="center" {include file="main/orders_colors.tpl"}>
<font class=Text>{$orders[cat_num].date|date_format:"%b-%d-%Y"}</font>
</td>
<td nowrap align="center" {include file="main/orders_colors.tpl"} class=Text>
{if $usertype eq "A"}<a href="order.php?orderid={$orders[cat_num].orderid}">
{ $orders[cat_num].firstname } { $orders[cat_num].lastname }</a>
{/if}

</td>
<td nowrap align="center" {include file="main/orders_colors.tpl"} class=Text>

{if $usertype eq "A"}
{ $orders[cat_num].provider }
{else}<a href="order.php?orderid={$orders[cat_num].orderid}">
{ $orders[cat_num].firstname } { $orders[cat_num].lastname }</a>
{/if}
</td>
			<td nowrap align=right class=Text {include file="main/orders_colors.tpl"}>
{include file="currency.tpl" value=$orders[cat_num].total}
</td>
		</tr>
{ if %cat_num.last% }
<tr><td colspan=7 align=right height=20>{$lng.lbl_gross_total}: {include file="currency.tpl" value=$total}</td></tr>
<tr><td colspan=7 align=right height=20>{$lng.lbl_total_paid}: {include file="currency.tpl" value=$total_paid}</td></tr>
</table>
{/if}
{/section}

For theose who don't want to replace their file (due to other mods), you can simply paste:

{include file="main/orders_colors.tpl"}

between all of the <td> tags for the cells that you want to affect.

Example:
<td align="center" {include file="main/orders_colors.tpl"}>

Enjoy,
Piper

[adpboss]

Awesome. Absolutely awesome.

Implemented and I'm tweaking colours right now.

ADDED

Ok here is my colour scheme.

Blue for Complete
Grey for Incomplete
Red for Failed
Green for Processed
Yellow for Queued

{* $Id: orders_colors.tpl,v 1.0 2003/10/26 13:07:50 pipercub Exp $ *} 
{if $orders[cat_num].status eq "C"} bgcolor="#00CCFF"} {/if} 
{if $orders[cat_num].status eq "P"} bgcolor="#00FF66"} {/if} 
{if $orders[cat_num].status eq "Q"} bgcolor="#FFFF99"} {/if} 
{if $orders[cat_num].status eq "F"} bgcolor="#FF3333"} {/if} 
{if $orders[cat_num].status eq "I"} bgcolor="#CCCCCC"} {/if} 

Hope you like it although it is very easy to change.

[adpboss]

This is so great that my mind is racing with the possibilities.

It would be great to be able to implement this in the modify product listings. Show out of stock products or low stock products highlighted with colour.

[pipercub]

adpboss,

Did you paste the entire chunk of code, or just the 'include'?

The reason I ask is because I modified the number of cells that xcart displays on the orders page. I didn't like to have to check a radio button and then hit 'Details', so I added the customers name and made it a hot link. I also modified the date format. All of this is in the big chunk of code.

Piper

[adpboss]

Piper,

I just went back and checked. Yes, I have the names and the dates. Great job!

I am just finishing modifying the product listings, and will post my code as I complete.

Thanks, this is really excellent.