mirror of
https://github.com/tabler/tabler.git
synced 2026-08-29 13:21:29 +04:00
Paweł KunaandStarDev
8962710163
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
46 lines
1.3 KiB
Plaintext
46 lines
1.3 KiB
Plaintext
---
|
|
import CardActions from '@ui/CardActions.astro'
|
|
import Icon from '@ui/Icon.astro'
|
|
import ListGroup from '@ui/ListGroup.astro'
|
|
import ListGroupItem from '@ui/ListGroupItem.astro'
|
|
import crmDashboard from '@data/crm-dashboard.json'
|
|
|
|
const tasks = crmDashboard.tasks_due
|
|
---
|
|
|
|
<div class="card h-100">
|
|
<div class="card-header">
|
|
<div class="d-flex align-items-center gap-2">
|
|
<h3 class="card-title mb-0">{tasks.title}</h3>
|
|
<span class="badge bg-red text-white">{tasks.badge}</span>
|
|
</div>
|
|
<CardActions>
|
|
<button type="button" class="btn btn-primary btn-sm">
|
|
<Icon name="plus" class="me-1" />
|
|
{tasks.button_text}
|
|
</button>
|
|
</CardActions>
|
|
</div>
|
|
|
|
<ListGroup flush hoverable>
|
|
{
|
|
tasks.items.map((item) => (
|
|
<ListGroupItem as="label">
|
|
<div class="row align-items-center g-2">
|
|
<div class="col-auto">
|
|
<input type="checkbox" class="form-check-input m-0" />
|
|
</div>
|
|
<div class="col">
|
|
<div>{item.text}</div>
|
|
</div>
|
|
<div class="col-auto d-flex align-items-center gap-2">
|
|
<span class={`legend bg-${item.color}`} />
|
|
<span class="small text-secondary">{item.due}</span>
|
|
</div>
|
|
</div>
|
|
</ListGroupItem>
|
|
))
|
|
}
|
|
</ListGroup>
|
|
</div>
|