@jigx/mdk
Version:
Jigx Mobile Development Kit - SDK for building Jigx applications
62 lines • 8.23 kB
JavaScript
import { CTX } from '../../src';
/**
* Home dashboard screen displaying expense overview and recent transactions.
* Shows summary statistics and quick access to expense management features.
* @param app - Application builder instance
* @returns Configured home screen
*/
export function homeScreen(app) {
const screen = app.addScreen.default('home', 'Expense Tracker');
// Configure expense statistics datasource
const expenseStats = 'expense-stats';
screen.addDatasource.sqlite(expenseStats, 'dynamic')
.entity('default/expenses')
.query(/* sql */ `
SELECT
COUNT(1) AS total_expenses,
SUM(json_extract(data, '$.amount')) AS total_amount,
AVG(json_extract(data, '$.amount')) AS avg_amount,
MAX(json_extract(data, '$.amount')) AS max_amount
FROM [default/expenses]
`);
// Configure recent expenses datasource
const recentExpenses = 'recent-expenses';
screen.addDatasource.sqlite(recentExpenses, 'dynamic')
.entity('default/expenses')
.query(/* sql */ `
SELECT
id,
json_extract(data, '$.title') AS title,
json_extract(data, '$.amount') AS amount,
json_extract(data, '$.category') AS category,
json_extract(data, '$.date') AS date
FROM [default/expenses]
ORDER BY json_extract(data, '$.date') DESC
LIMIT 5
`);
// Overview statistics card
const card = screen.addControl.card({ instanceId: 'overview-card' });
card.addControl.textField('total-count')
.label('Total Expenses')
// Use `.expr` for `=@ctx...`
.value(CTX.datasources.expr(expenseStats, 'total_expenses'));
card.addControl.textField('total-amount')
.label('Total Amount')
// Use `.ref` for `@ctx...`
.value(`=$formatCurrency(${CTX.datasources.ref(expenseStats, 'total_amount')})`);
// Recent expenses list
const list = screen.addControl.list('recent-list')
.data(recentExpenses); // Bind to datasourceId
list.addControl.listItem({ instanceId: 'recent-expense-item' })
.title('=@ctx.current.item.title')
.subtitle('=@ctx.current.item.category & " • " & @ctx.current.item.date')
.onPress
.goto('edit-expense')
.parameter('expenseId', '=@ctx.current.item.id');
// Bottom panel actions
const buttons = screen.bottomPanel.buttons(2);
buttons.add.goto('Add Expense', 'add-expense');
buttons.add.goto('View All', 'expense-list');
return screen;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaG9tZS1zY3JlZW4uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90ZW1wbGF0ZS1hcHAtMS9zY3JlZW5zL2hvbWUtc2NyZWVuLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBNEMsR0FBRyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRXpFOzs7OztHQUtHO0FBQ0gsTUFBTSxVQUFVLFVBQVUsQ0FBQyxHQUF1QjtJQUNoRCxNQUFNLE1BQU0sR0FBRyxHQUFHLENBQUMsU0FBUyxDQUFDLE9BQU8sQ0FBQyxNQUFNLEVBQUUsaUJBQWlCLENBQUMsQ0FBQTtJQUUvRCwwQ0FBMEM7SUFDMUMsTUFBTSxZQUFZLEdBQUcsZUFBZSxDQUFBO0lBQ3BDLE1BQU0sQ0FBQyxhQUFhLENBQUMsTUFBTSxDQUFDLFlBQVksRUFBRSxTQUFTLENBQUM7U0FDakQsTUFBTSxDQUFDLGtCQUFrQixDQUFDO1NBQzFCLEtBQUssQ0FBQyxTQUFTLENBQUE7Ozs7Ozs7S0FPZixDQUFDLENBQUE7SUFFSix1Q0FBdUM7SUFDdkMsTUFBTSxjQUFjLEdBQUcsaUJBQWlCLENBQUE7SUFDeEMsTUFBTSxDQUFDLGFBQWEsQ0FBQyxNQUFNLENBQUMsY0FBYyxFQUFFLFNBQVMsQ0FBQztTQUNuRCxNQUFNLENBQUMsa0JBQWtCLENBQUM7U0FDMUIsS0FBSyxDQUFDLFNBQVMsQ0FBQTs7Ozs7Ozs7OztLQVVmLENBQUMsQ0FBQTtJQUVKLDJCQUEyQjtJQUMzQixNQUFNLElBQUksR0FBRyxNQUFNLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxFQUFFLFVBQVUsRUFBRSxlQUFlLEVBQUUsQ0FBQyxDQUFBO0lBRXBFLElBQUksQ0FBQyxVQUFVLENBQUMsU0FBUyxDQUFDLGFBQWEsQ0FBQztTQUNyQyxLQUFLLENBQUMsZ0JBQWdCLENBQUM7UUFDeEIsNkJBQTZCO1NBQzVCLEtBQUssQ0FBQyxHQUFHLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxZQUFZLEVBQUUsZ0JBQWdCLENBQUMsQ0FBQyxDQUFBO0lBRTlELElBQUksQ0FBQyxVQUFVLENBQUMsU0FBUyxDQUFDLGNBQWMsQ0FBQztTQUN0QyxLQUFLLENBQUMsY0FBYyxDQUFDO1FBQ3RCLDJCQUEyQjtTQUMxQixLQUFLLENBQUMsb0JBQW9CLEdBQUcsQ0FBQyxXQUFXLENBQUMsR0FBRyxDQUFDLFlBQVksRUFBRSxjQUFjLENBQUMsR0FBRyxDQUFDLENBQUE7SUFFbEYsdUJBQXVCO0lBQ3ZCLE1BQU0sSUFBSSxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLGFBQWEsQ0FBQztTQUMvQyxJQUFJLENBQUMsY0FBYyxDQUFDLENBQUEsQ0FBQyx1QkFBdUI7SUFFL0MsSUFBSSxDQUFDLFVBQVUsQ0FBQyxRQUFRLENBQUMsRUFBRSxVQUFVLEVBQUUscUJBQXFCLEVBQUUsQ0FBQztTQUM1RCxLQUFLLENBQUMsMEJBQTBCLENBQUM7U0FDakMsUUFBUSxDQUFDLDhEQUE4RCxDQUFDO1NBQ3hFLE9BQU87U0FDTCxJQUFJLENBQUMsY0FBYyxDQUFDO1NBQ3BCLFNBQVMsQ0FBQyxXQUFXLEVBQUUsdUJBQXVCLENBQUMsQ0FBQTtJQUVwRCx1QkFBdUI7SUFDdkIsTUFBTSxPQUFPLEdBQUcsTUFBTSxDQUFDLFdBQVcsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLENBQUE7SUFDN0MsT0FBTyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsYUFBYSxFQUFFLGFBQWEsQ0FBQyxDQUFBO0lBQzlDLE9BQU8sQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLFVBQVUsRUFBRSxjQUFjLENBQUMsQ0FBQTtJQUU1QyxPQUFPLE1BQU0sQ0FBQTtBQUNmLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEZWZhdWx0U2NyZWVuQnVpbGRlciwgQXBwbGljYXRpb25CdWlsZGVyLCBDVFggfSBmcm9tICcuLi8uLi9zcmMnXG5cbi8qKlxuICogSG9tZSBkYXNoYm9hcmQgc2NyZWVuIGRpc3BsYXlpbmcgZXhwZW5zZSBvdmVydmlldyBhbmQgcmVjZW50IHRyYW5zYWN0aW9ucy5cbiAqIFNob3dzIHN1bW1hcnkgc3RhdGlzdGljcyBhbmQgcXVpY2sgYWNjZXNzIHRvIGV4cGVuc2UgbWFuYWdlbWVudCBmZWF0dXJlcy5cbiAqIEBwYXJhbSBhcHAgLSBBcHBsaWNhdGlvbiBidWlsZGVyIGluc3RhbmNlXG4gKiBAcmV0dXJucyBDb25maWd1cmVkIGhvbWUgc2NyZWVuXG4gKi9cbmV4cG9ydCBmdW5jdGlvbiBob21lU2NyZWVuKGFwcDogQXBwbGljYXRpb25CdWlsZGVyKTogRGVmYXVsdFNjcmVlbkJ1aWxkZXIge1xuICBjb25zdCBzY3JlZW4gPSBhcHAuYWRkU2NyZWVuLmRlZmF1bHQoJ2hvbWUnLCAnRXhwZW5zZSBUcmFja2VyJylcblxuICAvLyBDb25maWd1cmUgZXhwZW5zZSBzdGF0aXN0aWNzIGRhdGFzb3VyY2VcbiAgY29uc3QgZXhwZW5zZVN0YXRzID0gJ2V4cGVuc2Utc3RhdHMnXG4gIHNjcmVlbi5hZGREYXRhc291cmNlLnNxbGl0ZShleHBlbnNlU3RhdHMsICdkeW5hbWljJylcbiAgICAuZW50aXR5KCdkZWZhdWx0L2V4cGVuc2VzJylcbiAgICAucXVlcnkoLyogc3FsICovYFxuICAgICAgU0VMRUNUIFxuICAgICAgICBDT1VOVCgxKSBBUyB0b3RhbF9leHBlbnNlcyxcbiAgICAgICAgU1VNKGpzb25fZXh0cmFjdChkYXRhLCAnJC5hbW91bnQnKSkgQVMgdG90YWxfYW1vdW50LFxuICAgICAgICBBVkcoanNvbl9leHRyYWN0KGRhdGEsICckLmFtb3VudCcpKSBBUyBhdmdfYW1vdW50LFxuICAgICAgICBNQVgoanNvbl9leHRyYWN0KGRhdGEsICckLmFtb3VudCcpKSBBUyBtYXhfYW1vdW50XG4gICAgICBGUk9NIFtkZWZhdWx0L2V4cGVuc2VzXVxuICAgIGApXG5cbiAgLy8gQ29uZmlndXJlIHJlY2VudCBleHBlbnNlcyBkYXRhc291cmNlXG4gIGNvbnN0IHJlY2VudEV4cGVuc2VzID0gJ3JlY2VudC1leHBlbnNlcydcbiAgc2NyZWVuLmFkZERhdGFzb3VyY2Uuc3FsaXRlKHJlY2VudEV4cGVuc2VzLCAnZHluYW1pYycpXG4gICAgLmVudGl0eSgnZGVmYXVsdC9leHBlbnNlcycpXG4gICAgLnF1ZXJ5KC8qIHNxbCAqL2BcbiAgICAgIFNFTEVDVCBcbiAgICAgICAgaWQsXG4gICAgICAgIGpzb25fZXh0cmFjdChkYXRhLCAnJC50aXRsZScpIEFTIHRpdGxlLFxuICAgICAgICBqc29uX2V4dHJhY3QoZGF0YSwgJyQuYW1vdW50JykgQVMgYW1vdW50LFxuICAgICAgICBqc29uX2V4dHJhY3QoZGF0YSwgJyQuY2F0ZWdvcnknKSBBUyBjYXRlZ29yeSxcbiAgICAgICAganNvbl9leHRyYWN0KGRhdGEsICckLmRhdGUnKSBBUyBkYXRlXG4gICAgICBGUk9NIFtkZWZhdWx0L2V4cGVuc2VzXVxuICAgICAgT1JERVIgQlkganNvbl9leHRyYWN0KGRhdGEsICckLmRhdGUnKSBERVNDXG4gICAgICBMSU1JVCA1XG4gICAgYClcblxuICAvLyBPdmVydmlldyBzdGF0aXN0aWNzIGNhcmRcbiAgY29uc3QgY2FyZCA9IHNjcmVlbi5hZGRDb250cm9sLmNhcmQoeyBpbnN0YW5jZUlkOiAnb3ZlcnZpZXctY2FyZCcgfSlcblxuICBjYXJkLmFkZENvbnRyb2wudGV4dEZpZWxkKCd0b3RhbC1jb3VudCcpXG4gICAgLmxhYmVsKCdUb3RhbCBFeHBlbnNlcycpXG4gICAgLy8gVXNlIGAuZXhwcmAgZm9yIGA9QGN0eC4uLmBcbiAgICAudmFsdWUoQ1RYLmRhdGFzb3VyY2VzLmV4cHIoZXhwZW5zZVN0YXRzLCAndG90YWxfZXhwZW5zZXMnKSlcblxuICBjYXJkLmFkZENvbnRyb2wudGV4dEZpZWxkKCd0b3RhbC1hbW91bnQnKVxuICAgIC5sYWJlbCgnVG90YWwgQW1vdW50JylcbiAgICAvLyBVc2UgYC5yZWZgIGZvciBgQGN0eC4uLmBcbiAgICAudmFsdWUoYD0kZm9ybWF0Q3VycmVuY3koJHtDVFguZGF0YXNvdXJjZXMucmVmKGV4cGVuc2VTdGF0cywgJ3RvdGFsX2Ftb3VudCcpfSlgKVxuXG4gIC8vIFJlY2VudCBleHBlbnNlcyBsaXN0XG4gIGNvbnN0IGxpc3QgPSBzY3JlZW4uYWRkQ29udHJvbC5saXN0KCdyZWNlbnQtbGlzdCcpXG4gICAgLmRhdGEocmVjZW50RXhwZW5zZXMpIC8vIEJpbmQgdG8gZGF0YXNvdXJjZUlkXG5cbiAgbGlzdC5hZGRDb250cm9sLmxpc3RJdGVtKHsgaW5zdGFuY2VJZDogJ3JlY2VudC1leHBlbnNlLWl0ZW0nIH0pXG4gICAgLnRpdGxlKCc9QGN0eC5jdXJyZW50Lml0ZW0udGl0bGUnKVxuICAgIC5zdWJ0aXRsZSgnPUBjdHguY3VycmVudC5pdGVtLmNhdGVnb3J5ICYgXCIg4oCiIFwiICYgQGN0eC5jdXJyZW50Lml0ZW0uZGF0ZScpXG4gICAgLm9uUHJlc3NcbiAgICAgIC5nb3RvKCdlZGl0LWV4cGVuc2UnKVxuICAgICAgLnBhcmFtZXRlcignZXhwZW5zZUlkJywgJz1AY3R4LmN1cnJlbnQuaXRlbS5pZCcpXG5cbiAgLy8gQm90dG9tIHBhbmVsIGFjdGlvbnNcbiAgY29uc3QgYnV0dG9ucyA9IHNjcmVlbi5ib3R0b21QYW5lbC5idXR0b25zKDIpXG4gIGJ1dHRvbnMuYWRkLmdvdG8oJ0FkZCBFeHBlbnNlJywgJ2FkZC1leHBlbnNlJylcbiAgYnV0dG9ucy5hZGQuZ290bygnVmlldyBBbGwnLCAnZXhwZW5zZS1saXN0JylcblxuICByZXR1cm4gc2NyZWVuXG59Il19