Column headers is just a label aligned above.
The way I did it a few years back it was not responsive. I now know it can be done in a better way that would be responsive but haven’t went back to update it.
The search is a pain and not perfect. It is due to the way I query just filtering by the number of days, so all the buttons and date ranges just return the number of days which is the main part that determines the results. There will be better ways to accomplish this I am sure.
(line breaks added to code for display purposes)
Column Header (Label Widget)
<block 10,0,5,0 #5ffffff left 70>Ticket #</block>
<block 10,0,5,0 #5ffffff left 60>Order #</block>
<block 10,0,5,0 #5ffffff left 130>Date / Time</block>
<block 10,0,5,0 #5ffffff left 280>Customer</block>
<block 10,0,5,0 #5ffffff left 110>Ticket Type</block>
<block 10,0,5,0 #5ffffff left 130>User Name</block>
<block 10,0,5,0 #5ffffff left 100>Payment Type</block>
<block 10,0,5,0 #5ffffff left 60>Total</block>
<block 10,0,0,0 #5ffffff right 45>Select</block>
Ticket Lister
<L>
<block 1,0,0,0 #5ffffff left 70>{TICKET NO}</block>
<block 1,0,0,0 #5ffffff left 60>{TICKET TAG:Order No}</block>
<block 1,0,0,0 #5ffffff left 130>{TICKET DATE} {TICKET TIME}</block>
<block 1,0,0,0 #5ffffff left 280>[='{ENTITY NAME:Customer}' == '' ? '' : '{ENTITY NAME:Customer}'][='{ENTITY DATA:Customer:First Name}{ENTITY DATA:Customer:Last Name}' == '' ? '' : ' - '][='{ENTITY DATA:Customer:First Name}' == '' ? '' : '{ENTITY DATA:Customer:First Name} ']{ENTITY DATA:Customer:Last Name}</block><block 1,0,0,0 #5ffffff left 110>{TICKET TYPE}</block>
<block 1,0,0,0 #5ffffff left 130>{USER NAME}</block>
<block 1,0,0,0 #5ffffff left 100>{PAYMENTS}</block>
<block 1,0,0,0 #5ffffff right 60>£{TICKET TOTAL}</block>
<block 5,0,5,0 #5ffffff right 31>[='{TICKET STATE:SStatus}' == 'Selected' ? '<size 16><color Red><sym></sym></color></size>' : '<size 16><sym></sym></size>']</block>
[PAYMENTS]
<L>{PAYMENT NAME}
The Ticket Lister uses an expression that takes the number of days from a local setting:


Script to calculate days from 2 dates:
var _MS_PER_DAY = 1000 * 60 * 60 * 24;
// a and b are javascript Date objects
function dateDiffInDays(a, b) {
// Discard the time and time-zone information.
var utc1 = new Date(a.substr(6,4), a.substr(3,2)-1, a.substr(0,2));
var utc2 = new Date(b.substr(6,4), b.substr(3,2)-1, b.substr(0,2));
return Math.floor((utc2 - utc1) / _MS_PER_DAY);
}
which is called by a rule triggered by an automation command when either of the date fields is changed:

Obviously amend to your needs, this is custom to my setup. Hope this gives you something to work with 