📋 Staff Time Tracker

\n {currentTime.toLocaleString()}\n

\n setName(e.target.value)}\n style={styles.nameInput}\n />\n

\n Current Status: {status}\n {lastClockIn &&

Last Clock In: {new Date(lastClockIn).toLocaleString()}

}\n

\n \n \n

Recent Clock Records

\n \n \n \n \n \n \n \n \n \n {recentRecords.map((record, index) => (\n \n \n \n \n \n ))}\n \n

Name	Action	Timestamp
{record.name}	{record.action}	{new Date(record.timestamp).toLocaleString()}

\n \n View Source\n \n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const KEY = \"timeTrackerApp\";\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_timeclock_v3 (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL,\n action TEXT NOT NULL,\n timestamp DATETIME DEFAULT CURRENT_TIMESTAMP\n )\n `);\n\n // Handle clock-in/out action\n if (request.method === 'POST' && new URL(request.url).pathname === '/clock-action') {\n const { name } = await request.json();\n \n const lastRecord = await sqlite.execute(`\n SELECT action, timestamp \n FROM ${KEY}_timeclock_v3 \n WHERE name = ? \n ORDER BY id DESC \n LIMIT 1\n `, [name]);\n\n const currentAction = lastRecord.rows[0]?.action === 'Clock In' ? 'Clock Out' : 'Clock In';\n \n await sqlite.execute(`\n INSERT INTO ${KEY}_timeclock_v3 (name, action) \n VALUES (?, ?)\n `, [name, currentAction]);\n\n return new Response(JSON.stringify({\n status: currentAction,\n timestamp: new Date().toISOString()\n }), {\n headers: { 'Content-Type': 'application/json' }\n });\n }\n\n // Fetch recent records\n if (request.method === 'GET' && new URL(request.url).pathname === '/recent-records') {\n const recentRecords = await sqlite.execute(`\n SELECT name, action, timestamp \n FROM ${KEY}_timeclock_v3 \n ORDER BY timestamp DESC \n LIMIT 10\n `);\n\n return new Response(JSON.stringify(recentRecords.rows), {\n headers: { 'Content-Type': 'application/json' }\n });\n }\n\n // Export to Excel\n if (request.method === 'GET' && new URL(request.url).pathname === '/export-excel') {\n const records = await sqlite.execute(`\n SELECT name, action, timestamp \n FROM ${KEY}_timeclock_v3 \n ORDER BY timestamp DESC\n `);\n\n // Convert records to CSV for simplicity\n const csvContent = [\n \"Name,Action,Timestamp\",\n ...records.rows.map(row => \n `${row.name},${row.action},${new Date(row.timestamp).toISOString()}`\n )\n ].join(\"\\n\");\n\n return new Response(csvContent, {\n headers: {\n 'Content-Type': 'text/csv',\n 'Content-Disposition': `attachment; filename=time_records_${Date.now()}.csv`\n }\n });\n }\n\n return new Response(`\n \n \n Staff Time Tracker\n \n \n \n \n

\n \n \n \n `, {\n headers: { 'Content-Type': 'text/html' }\n });\n}\n\nconst styles = {\n container: {\n fontFamily: 'Arial, sans-serif',\n maxWidth: '600px',\n margin: '0 auto',\n padding: '20px',\n textAlign: 'center',\n },\n nameInput: {\n width: '100%',\n padding: '10px',\n marginBottom: '15px',\n fontSize: '16px',\n },\n clock: {\n fontSize: '24px',\n marginBottom: '20px',\n fontWeight: 'bold',\n },\n status: {\n marginBottom: '20px',\n color: '#666',\n },\n clockInButton: {\n backgroundColor: '#4CAF50',\n color: 'white',\n border: 'none',\n padding: '10px 20px',\n fontSize: '16px',\n borderRadius: '5px',\n cursor: 'pointer',\n marginRight: '10px',\n },\n clockOutButton: {\n backgroundColor: '#f44336',\n color: 'white',\n border: 'none',\n padding: '10px 20px',\n fontSize: '16px',\n borderRadius: '5px',\n cursor: 'pointer',\n marginRight: '10px',\n },\n exportButton: {\n backgroundColor: '#2196F3',\n color: 'white',\n border: 'none',\n padding: '10px 20px',\n fontSize: '16px',\n borderRadius: '5px',\n cursor: 'pointer',\n },\n recentRecords: {\n marginTop: '20px',\n textAlign: 'left',\n },\n recordsTable: {\n width: '100%',\n borderCollapse: 'collapse',\n },\n sourceLink: {\n display: 'block',\n marginTop: '20px',\n color: '#888',\n textDecoration: 'none',\n }\n};","deleted","label",[98],"permalink","https://www.val.town/x/Judith_123/timeTrackerApp/code/main.tsx","extension","actionData","errors"]