Count items by status and display in a grid.
Example Code#
<div class="grid grid-cols-4 gap-4">
{{$items := queryItems "type = 'task'"}}
{{$open := filter $items "status = 'open'"}}
{{$progress := filter $items "status = 'in-progress'"}}
{{$review := filter $items "status = 'review'"}}
{{$done := filter $items "status = 'done'"}}
<div class="bg-blue-100 p-4 rounded text-center">
<div class="text-2xl font-bold">{{len $open}}</div>
<div class="text-sm">Open</div>
</div>
<div class="bg-yellow-100 p-4 rounded text-center">
<div class="text-2xl font-bold">{{len $progress}}</div>
<div class="text-sm">In Progress</div>
</div>
<div class="bg-purple-100 p-4 rounded text-center">
<div class="text-2xl font-bold">{{len $review}}</div>
<div class="text-sm">Review</div>
</div>
<div class="bg-green-100 p-4 rounded text-center">
<div class="text-2xl font-bold">{{len $done}}</div>
<div class="text-sm">Done</div>
</div>
</div>
Customization#
Add more status columns:
{{$closed := filter $items "status = 'closed'"}}
<div class="bg-gray-100 p-4 rounded text-center">
<div class="text-2xl font-bold">{{len $closed}}</div>
<div class="text-sm">Closed</div>
</div>
See also: Scripted Widgets Guide