Building Pages & Dashboards

Create visual reporting pages and dashboards with widgets in Timill Platform.

Creating Pages#

1. Navigate to Group Settings → Pages
2. Click Create Page
3. Configure:
   • Name
   • Layout (grid columns)
   • Permissions
4. Add widgets
5. Save

Page Layouts#

Available Layouts#

Widget Sizing#

Widgets can be sized using the grid system:

• Width: 1-12 columns
• Height: Small, Medium, Large, Full

Widget Types#

Built-in Widgets#

Scripted Widgets#

Create custom widgets with Go templates:

<div class="bg-white rounded-lg shadow">
  {{$items := queryItems (printf "type='%s'" .itemType)}}
  <h3>{{.title}} ({{len $items}})</h3>
  {{range $items}}
    <div>{{.Title.Get}}</div>
  {{end}}
</div>

See: Scripted Widgets Guide

Scripted Charts#

Create custom charts with JavaScript:

function generateChart(api, params, context) {
    const items = api.queryItems("type = 'task'");
    return echarts.createPieChart(items, {
        title: 'Status Distribution'
    });
}

See: Scripted Charts Guide

Dashboard Templates#

Common Dashboard Types#

Project Status Dashboard#

Widgets:

1. Item count by status (Stats)
2. Burndown chart (Burndown Chart)
3. Recent items (Item List)
4. User workload (Scripted Chart)

Team Performance Dashboard#

Widgets:

1. Items completed this week (Stats)
2. Team burndown (Burndown Chart)
3. Overdue items (Item List)
4. Priority distribution (Pie Chart)

Using Templates#

1. Navigate to Group Settings → Pages
2. Click Import Template
3. Select template type
4. Customize as needed

Permissions#

Page-Level Permissions#

Set who can view each page:

Widget Permissions#

Widgets inherit page permissions. Additional restrictions:

• Data Access: Based on user’s item permissions
• Script Access: Based on script execution rights

Embedding Pages#

Public Pages#

Enable public access for external sharing:

1. Go to Group Settings → Pages
2. Select page
3. Enable Public Access
4. Copy public link

Embedding in External Sites#

Use iframe to embed pages:

<iframe 
    src="https://your-domain.com/group/pages/public/page-id" 
    width="100%" 
    height="600">
</iframe>

Best Practices#

Organization#

• Use descriptive page names
• Group related widgets together
• Use consistent layouts across pages
• Document page purposes

Performance#

• Limit widget queries to necessary data
• Use specific filters instead of broad queries
• Cache frequently accessed data
• Monitor widget load times

User Experience#

• Keep dashboards uncluttered
• Use meaningful charts (avoid pie charts with too many slices)
• Provide context for metrics
• Make pages mobile-responsive

See also:

• Scripted Widgets
• Scripted Charts
• Item List Widget Configuration