BEML

${companyName}

${division}

${address}

MATERIAL GATE PASS

Gate Pass No: ${gp.gatepass_no}

\n \n \n \n \n \n \n

Date of Issue	${new Date(gp.issue_date).toLocaleDateString(\"en-IN\")}	Status	${gp.status?.toUpperCase()}
Vendor Name	${gp.vendor_name}	Vehicle No	${gp.vehicle_no}
Vendor Address	${gp.vendor_address}
Driver Name	${gp.driver_name}	Generated By	${gp.generated_by}
Expected Return	${gp.expected_return_date ? new Date(gp.expected_return_date).toLocaleDateString(\"en-IN\") : \"N/A\"}	Actual Return	${gp.actual_return_date ? new Date(gp.actual_return_date).toLocaleDateString(\"en-IN\") : \"Pending\"}

\n \n \n \n ${materials.length > 0 ? materials.map((m: any, i: number) => \n ``\n ).join(\"\") : ''}\n \n

Sl	Material Name	Part Number	Qty	Condition
${i + 1}	${m.material_name \|\| \"\"}	${m.part_number \|\| \"\"}	${m.qty \|\| \"\"}	${m.condition \|\| \"Faulty\"}
No materials listed

Prepared By

Store In-Charge

Security Officer

\n \n

\n\n`;\n}\n\n// Generate Material Issue Slip HTML\nexport async function generateIssueSlipHTML(issue: Record, settings: Record): Promise {\n const companyName = settings.company_name || \"BEML LIMITED\";\n const division = settings.company_division || \"KMRCL\";\n const address = settings.company_address || \"Bengaluru, Karnataka, India\";\n\n return `\n\n\n\nMaterial Issue Slip - ${issue.issue_no}\n\n\n\n

BEML

${companyName}

${division}

${address}

MATERIAL ISSUE SLIP

Issue No: ${issue.issue_no}

\n \n \n \n \n \n \n \n \n \n

Date	${new Date(issue.issue_date).toLocaleDateString(\"en-IN\")}	Status	${issue.status?.toUpperCase()}
Officer	${issue.officer_name}	Issued By	${issue.issued_by}
Material	${issue.material_name}	Part Number	${issue.part_number}
Healthy Part	${issue.healthy_part \|\| \"N/A\"}	Faulty Part	${issue.faulty_part \|\| \"N/A\"}
Quantity	${issue.qty}	Trainset	${issue.trainset \|\| \"N/A\"}
Car Number	${issue.car \|\| \"N/A\"}	NCR No	${issue.ncr \|\| \"N/A\"}
Job Card	${issue.jobcard \|\| \"N/A\"}	Issued To	${issue.issued_to \|\| \"N/A\"}
Reason	${issue.reason \|\| \"N/A\"}

Issued By (Store)

Received By (Officer)

Authorized By

\n \n

\n\n`;\n}\n\n// Inventory CSV export\nexport function exportInventoryCSV(items: any[]): string {\n const headers = [\"Item ID\", \"OEM\", \"System\", \"Subsystem\", \"Material Name\", \"Part Number\", \"Description\", \"Qty\", \"Available\", \"Repair\", \"Issued\", \"Returned\", \"Location\", \"Rack\", \"Shelf\", \"Vendor\", \"Warranty\", \"DLP Expiry\", \"Status\", \"Updated Date\"];\n const rows = items.map((i: any) => [i.item_id, i.oem, i.system, i.subsystem, i.material_name, i.part_number, i.description, i.qty, i.available_qty, i.repair_qty, i.issued_qty, i.returned_qty, i.location, i.rack, i.shelf, i.vendor, i.warranty, i.dlp_expiry, i.status, i.updated_date]);\n return generateCSV(headers, rows);\n}\n\n// Requests CSV export\nexport function exportRequestsCSV(items: any[]): string {\n const headers = [\"Request No\", \"Officer\", \"Material\", \"Part Number\", \"Qty\", \"Trainset\", \"Car\", \"NCR\", \"Job Card\", \"Reason\", \"Priority\", \"Status\", \"Created At\", \"Approved By\"];\n const rows = items.map((i: any) => [i.request_no, i.officer_name, i.material_name, i.part_number, i.qty, i.trainset, i.car, i.ncr, i.jobcard, i.reason, i.priority, i.status, i.created_at, i.approved_by]);\n return generateCSV(headers, rows);\n}\n\n// Issues CSV export\nexport function exportIssuesCSV(items: any[]): string {\n const headers = [\"Issue No\", \"Officer\", \"Material\", \"Part Number\", \"Healthy Part\", \"Faulty Part\", \"Qty\", \"Trainset\", \"Car\", \"NCR\", \"Job Card\", \"Issued By\", \"Issue Date\", \"Status\"];\n const rows = items.map((i: any) => [i.issue_no, i.officer_name, i.material_name, i.part_number, i.healthy_part, i.faulty_part, i.qty, i.trainset, i.car, i.ncr, i.jobcard, i.issued_by, i.issue_date, i.status]);\n return generateCSV(headers, rows);\n}\n\n// Gate Passes CSV export\nexport function exportGatePassesCSV(items: any[]): string {\n const headers = [\"Gate Pass No\", \"Vendor\", \"Vehicle No\", \"Driver\", \"Issue Date\", \"Expected Return\", \"Actual Return\", \"Status\", \"Generated By\"];\n const rows = items.map((i: any) => [i.gatepass_no, i.vendor_name, i.vehicle_no, i.driver_name, i.issue_date, i.expected_return_date, i.actual_return_date, i.status, i.generated_by]);\n return generateCSV(headers, rows);\n}\n",[],[224,212],"15ebaed6-fb58-4956-b81b-0e6e3cc964b4",["D",1784087575601],"import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\nimport { createHash, randomBytes } from \"node:crypto\";\n\n// ─── Password Hashing ───\nconst SALT = \"beml_kmrcl_2024_salt\";\nexport function hashPassword(password: string): string {\n return createHash(\"sha256\").update(password + SALT).digest(\"hex\");\n}\nexport function generateToken(): string {\n return randomBytes(32).toString(\"hex\");\n}\n\n// ─── Schema Initialization ───\nexport async function initDB() {\n await sqlite.batch([\n { sql: `CREATE TABLE IF NOT EXISTS users (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL,\n email TEXT UNIQUE NOT NULL,\n password_hash TEXT NOT NULL,\n role TEXT NOT NULL DEFAULT 'officer',\n department TEXT DEFAULT '',\n mobile TEXT DEFAULT '',\n status TEXT DEFAULT 'active',\n created_at TEXT DEFAULT (datetime('now'))\n )` },\n { sql: `CREATE TABLE IF NOT EXISTS sessions (\n token TEXT PRIMARY KEY,\n user_id INTEGER NOT NULL,\n expires_at TEXT NOT NULL,\n created_at TEXT DEFAULT (datetime('now')),\n FOREIGN KEY (user_id) REFERENCES users(id)\n )` },\n { sql: `CREATE TABLE IF NOT EXISTS inventory (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n item_id TEXT,\n oem TEXT DEFAULT '',\n system TEXT DEFAULT '',\n subsystem TEXT DEFAULT '',\n material_name TEXT NOT NULL,\n part_number TEXT DEFAULT '',\n description TEXT DEFAULT '',\n qty INTEGER DEFAULT 0,\n available_qty INTEGER DEFAULT 0,\n repair_qty INTEGER DEFAULT 0,\n issued_qty INTEGER DEFAULT 0,\n returned_qty INTEGER DEFAULT 0,\n location TEXT DEFAULT '',\n rack TEXT DEFAULT '',\n shelf TEXT DEFAULT '',\n vendor TEXT DEFAULT '',\n warranty TEXT DEFAULT '',\n dlp_expiry TEXT DEFAULT '',\n status TEXT DEFAULT 'available',\n updated_date TEXT DEFAULT (datetime('now')),\n updated_by TEXT DEFAULT 'system',\n sheet_row_num INTEGER\n )` },\n { sql: `CREATE TABLE IF NOT EXISTS material_requests (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n request_no TEXT UNIQUE NOT NULL,\n officer_id INTEGER,\n officer_name TEXT NOT NULL,\n material_name TEXT NOT NULL,\n part_number TEXT DEFAULT '',\n qty INTEGER DEFAULT 1,\n trainset TEXT DEFAULT '',\n car TEXT DEFAULT '',\n ncr TEXT DEFAULT '',\n jobcard TEXT DEFAULT '',\n reason TEXT DEFAULT '',\n priority TEXT DEFAULT 'normal',\n maintenance_type TEXT DEFAULT '',\n location TEXT DEFAULT '',\n engineer_name TEXT DEFAULT '',\n status TEXT DEFAULT 'pending',\n approved_by TEXT DEFAULT '',\n approved_at TEXT,\n rejected_reason TEXT DEFAULT '',\n created_at TEXT DEFAULT (datetime('now')),\n updated_at TEXT DEFAULT (datetime('now'))\n )` },\n { sql: `CREATE TABLE IF NOT EXISTS material_issues (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n issue_no TEXT UNIQUE NOT NULL,\n request_id INTEGER,\n officer_name TEXT NOT NULL,\n material_name TEXT NOT NULL,\n part_number TEXT DEFAULT '',\n healthy_part TEXT DEFAULT '',\n faulty_part TEXT DEFAULT '',\n qty INTEGER DEFAULT 1,\n trainset TEXT DEFAULT '',\n car TEXT DEFAULT '',\n ncr TEXT DEFAULT '',\n jobcard TEXT DEFAULT '',\n reason TEXT DEFAULT '',\n issued_by TEXT NOT NULL,\n issued_to TEXT DEFAULT '',\n issue_date TEXT DEFAULT (datetime('now')),\n status TEXT DEFAULT 'issued',\n inventory_item_id INTEGER\n )` },\n { sql: `CREATE TABLE IF NOT EXISTS gate_passes (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n gatepass_no TEXT UNIQUE NOT NULL,\n issue_id INTEGER,\n vendor_name TEXT DEFAULT '',\n vendor_address TEXT DEFAULT '',\n vehicle_no TEXT DEFAULT '',\n driver_name TEXT DEFAULT '',\n material_details TEXT DEFAULT '',\n issue_date TEXT DEFAULT (datetime('now')),\n expected_return_date TEXT,\n actual_return_date TEXT,\n status TEXT DEFAULT 'open',\n generated_by TEXT NOT NULL,\n created_at TEXT DEFAULT (datetime('now'))\n )` },\n { sql: `CREATE TABLE IF NOT EXISTS repairs (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n gatepass_id INTEGER,\n issue_id INTEGER,\n part_number TEXT DEFAULT '',\n material_name TEXT DEFAULT '',\n vendor TEXT DEFAULT '',\n repair_status TEXT DEFAULT 'sent',\n expected_date TEXT,\n received_date TEXT,\n inspection_result TEXT DEFAULT '',\n remarks TEXT DEFAULT '',\n created_at TEXT DEFAULT (datetime('now')),\n updated_at TEXT DEFAULT (datetime('now'))\n )` },\n { sql: `CREATE TABLE IF NOT EXISTS settings (\n key TEXT PRIMARY KEY,\n value TEXT\n )` },\n { sql: `CREATE TABLE IF NOT EXISTS audit_log (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n user_name TEXT,\n action TEXT,\n module TEXT,\n old_value TEXT DEFAULT '',\n new_value TEXT DEFAULT '',\n date TEXT DEFAULT (datetime('now')),\n ip TEXT DEFAULT '',\n device TEXT DEFAULT ''\n )` },\n ]);\n\n // Seed default users if none exist\n const userCount = await sqlite.execute(\"SELECT COUNT(*) as cnt FROM users\");\n if (userCount.rows[0].cnt === 0) {\n await sqlite.batch([\n { sql: `INSERT INTO users (name, email, password_hash, role, department, mobile) VALUES (?, ?, ?, 'admin', 'IT', '9999999999')`,\n args: [\"System Admin\", \"admin@beml.in\", hashPassword(\"admin123\")] },\n { sql: `INSERT INTO users (name, email, password_hash, role, department, mobile) VALUES (?, ?, ?, 'store', 'Stores', '8888888888')`,\n args: [\"Store Manager\", \"store@beml.in\", hashPassword(\"store123\")] },\n { sql: `INSERT INTO users (name, email, password_hash, role, department, mobile) VALUES (?, ?, ?, 'officer', 'Maintenance', '7777777777')`,\n args: [\"Maintenance Officer\", \"officer@beml.in\", hashPassword(\"officer123\")] },\n ]);\n }\n\n // Seed default settings\n const settingsCount = await sqlite.execute(\"SELECT COUNT(*) as cnt FROM settings\");\n if (settingsCount.rows[0].cnt === 0) {\n await sqlite.batch([\n { sql: `INSERT INTO settings (key, value) VALUES ('company_name', 'BEML LIMITED')` },\n { sql: `INSERT INTO settings (key, value) VALUES ('company_division', 'KMRCL - Kolkata Metro Rail Corporation Limited')` },\n { sql: `INSERT INTO settings (key, value) VALUES ('company_address', 'BEML Limited, Bengaluru - 560013, Karnataka, India')` },\n { sql: `INSERT INTO settings (key, value) VALUES ('google_sheet_id', '')` },\n { sql: `INSERT INTO settings (key, value) VALUES ('google_drive_folder', '')` },\n { sql: `INSERT INTO settings (key, value) VALUES ('sync_interval', '5')` },\n { sql: `INSERT INTO settings (key, value) VALUES ('last_sync', '')` },\n ]);\n }\n}\n\n// ─── Auth Functions ───\nexport async function login(email: string, password: string): Promise<{ token: string; user: any } | null> {\n const hash = hashPassword(password);\n const result = await sqlite.execute({\n sql: \"SELECT * FROM users WHERE email = ? AND password_hash = ? AND status = 'active'\",\n args: [email, hash],\n });\n if (result.rows.length === 0) return null;\n const user = result.rows[0];\n const token = generateToken();\n const expires = new Date(Date.now() + 7 * 24 * 60 * 60 * 1000).toISOString();\n await sqlite.execute({\n sql: \"INSERT INTO sessions (token, user_id, expires_at) VALUES (?, ?, ?)\",\n args: [token, user.id, expires],\n });\n return { token, user: { id: user.id, name: user.name, email: user.email, role: user.role, department: user.department, mobile: user.mobile } };\n}\n\nexport async function validateToken(token: string): Promise {\n if (!token) return null;\n const result = await sqlite.execute({\n sql: `SELECT u.* FROM sessions s JOIN users u ON s.user_id = u.id \n WHERE s.token = ? AND s.expires_at > datetime('now') AND u.status = 'active'`,\n args: [token],\n });\n if (result.rows.length === 0) return null;\n const u = result.rows[0];\n return { id: u.id, name: u.name, email: u.email, role: u.role, department: u.department, mobile: u.mobile };\n}\n\nexport async function logout(token: string): Promise {\n await sqlite.execute({ sql: \"DELETE FROM sessions WHERE token = ?\", args: [token] });\n}\n\n// ─── User CRUD ───\nexport async function getUsers() {\n const r = await sqlite.execute(\"SELECT id, name, email, role, department, mobile, status, created_at FROM users ORDER BY id\");\n return r.rows;\n}\n\nexport async function createUser(name: string, email: string, password: string, role: string, department: string, mobile: string) {\n await sqlite.execute({\n sql: \"INSERT INTO users (name, email, password_hash, role, department, mobile) VALUES (?, ?, ?, ?, ?, ?)\",\n args: [name, email, hashPassword(password), role, department, mobile],\n });\n}\n\nexport async function updateUser(id: number, data: Record) {\n const fields: string[] = [];\n const values: any[] = [];\n for (const [k, v] of Object.entries(data)) {\n if (k === \"password\") {\n fields.push(\"password_hash = ?\");\n values.push(hashPassword(v));\n } else if ([\"name\", \"email\", \"role\", \"department\", \"mobile\", \"status\"].includes(k)) {\n fields.push(`${k} = ?`);\n values.push(v);\n }\n }\n if (fields.length === 0) return;\n values.push(id);\n await sqlite.execute({ sql: `UPDATE users SET ${fields.join(\", \")} WHERE id = ?`, args: values });\n}\n\nexport async function deleteUser(id: number) {\n await sqlite.execute({ sql: \"DELETE FROM users WHERE id = ?\", args: [id] });\n}\n\n// ─── Inventory CRUD ───\nexport async function getInventory(filters?: Record) {\n let sql = \"SELECT * FROM inventory WHERE 1=1\";\n const args: any[] = [];\n if (filters?.search) {\n sql += ` AND (material_name LIKE ? OR part_number LIKE ? OR oem LIKE ? OR system LIKE ? OR vendor LIKE ?)`;\n const s = `%${filters.search}%`;\n args.push(s, s, s, s, s);\n }\n if (filters?.oem) { sql += ` AND oem = ?`; args.push(filters.oem); }\n if (filters?.system) { sql += ` AND system = ?`; args.push(filters.system); }\n if (filters?.status) { sql += ` AND status = ?`; args.push(filters.status); }\n if (filters?.trainset) { sql += ` AND id IN (SELECT inventory_item_id FROM material_issues WHERE trainset = ?)`; args.push(filters.trainset); }\n sql += \" ORDER BY id DESC\";\n if (filters?.limit) { sql += ` LIMIT ${parseInt(filters.limit)}`; }\n const r = await sqlite.execute({ sql, args });\n return r.rows;\n}\n\nexport async function getInventoryItem(id: number) {\n const r = await sqlite.execute({ sql: \"SELECT * FROM inventory WHERE id = ?\", args: [id] });\n return r.rows[0] || null;\n}\n\nexport async function getInventoryStats() {\n const r = await sqlite.execute(`\n SELECT \n COUNT(*) as total,\n SUM(CASE WHEN status = 'available' THEN 1 ELSE 0 END) as available,\n SUM(CASE WHEN status = 'issued' THEN 1 ELSE 0 END) as issued,\n SUM(CASE WHEN status = 'repair' THEN 1 ELSE 0 END) as repair,\n SUM(CASE WHEN status = 'replacement' THEN 1 ELSE 0 END) as replacement,\n SUM(available_qty) as total_available_qty,\n SUM(repair_qty) as total_repair_qty,\n SUM(issued_qty) as total_issued_qty\n FROM inventory\n `);\n return r.rows[0];\n}\n\nexport async function syncInventoryFromSheet(items: Record[]) {\n await sqlite.execute(\"DELETE FROM inventory\");\n for (const item of items) {\n await sqlite.execute({\n sql: `INSERT INTO inventory (item_id, oem, system, subsystem, material_name, part_number, description, qty, available_qty, repair_qty, issued_qty, returned_qty, location, rack, shelf, vendor, warranty, dlp_expiry, status, updated_date, updated_by, sheet_row_num)\n VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`,\n args: [\n item.item_id || \"\", item.oem || \"\", item.system || \"\", item.subsystem || \"\",\n item.material_name || \"\", item.part_number || \"\", item.description || \"\",\n item.qty || 0, item.available_qty || 0, item.repair_qty || 0,\n item.issued_qty || 0, item.returned_qty || 0,\n item.location || \"\", item.rack || \"\", item.shelf || \"\",\n item.vendor || \"\", item.warranty || \"\", item.dlp_expiry || \"\",\n item.status || \"available\", new Date().toISOString(), \"system\", item.sheet_row_num || null,\n ],\n });\n }\n}\n\n// ─── Material Request CRUD ───\nfunction genRequestNo() {\n return `MR-${new Date().getFullYear()}-${String(Date.now()).slice(-6)}`;\n}\n\nexport async function getRequests(filters?: Record) {\n let sql = \"SELECT * FROM material_requests WHERE 1=1\";\n const args: any[] = [];\n if (filters?.status) { sql += ` AND status = ?`; args.push(filters.status); }\n if (filters?.officer) { sql += ` AND officer_name LIKE ?`; args.push(`%${filters.officer}%`); }\n if (filters?.trainset) { sql += ` AND trainset = ?`; args.push(filters.trainset); }\n if (filters?.search) {\n sql += ` AND (material_name LIKE ? OR part_number LIKE ? OR request_no LIKE ? OR ncr LIKE ? OR jobcard LIKE ?)`;\n const s = `%${filters.search}%`;\n args.push(s, s, s, s, s);\n }\n if (filters?.dateFrom) { sql += ` AND created_at >= ?`; args.push(filters.dateFrom); }\n if (filters?.dateTo) { sql += ` AND created_at <= ?`; args.push(filters.dateTo); }\n sql += \" ORDER BY id DESC\";\n const r = await sqlite.execute({ sql, args });\n return r.rows;\n}\n\nexport async function createRequest(data: Record) {\n const requestNo = genRequestNo();\n await sqlite.execute({\n sql: `INSERT INTO material_requests (request_no, officer_id, officer_name, material_name, part_number, qty, trainset, car, ncr, jobcard, reason, priority, maintenance_type, location, engineer_name, status)\n VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, 'pending')`,\n args: [requestNo, data.officer_id || null, data.officer_name, data.material_name,\n data.part_number || \"\", data.qty || 1, data.trainset || \"\", data.car || \"\",\n data.ncr || \"\", data.jobcard || \"\", data.reason || \"\", data.priority || \"normal\",\n data.maintenance_type || \"\", data.location || \"\", data.engineer_name || \"\"],\n });\n const r = await sqlite.execute({ sql: \"SELECT * FROM material_requests WHERE request_no = ?\", args: [requestNo] });\n return r.rows[0];\n}\n\nexport async function updateRequestStatus(id: number, status: string, approvedBy: string, reason?: string) {\n if (status === \"approved\") {\n await sqlite.execute({\n sql: `UPDATE material_requests SET status = 'approved', approved_by = ?, approved_at = datetime('now'), updated_at = datetime('now') WHERE id = ?`,\n args: [approvedBy, id],\n });\n } else if (status === \"rejected\") {\n await sqlite.execute({\n sql: `UPDATE material_requests SET status = 'rejected', rejected_reason = ?, updated_at = datetime('now') WHERE id = ?`,\n args: [reason || \"\", id],\n });\n } else {\n await sqlite.execute({\n sql: `UPDATE material_requests SET status = ?, updated_at = datetime('now') WHERE id = ?`,\n args: [status, id],\n });\n }\n}\n\n// ─── Material Issue CRUD ───\nfunction genIssueNo() {\n return `ISS-${new Date().getFullYear()}-${String(Date.now()).slice(-6)}`;\n}\n\nexport async function getIssues(filters?: Record) {\n let sql = \"SELECT * FROM material_issues WHERE 1=1\";\n const args: any[] = [];\n if (filters?.status) { sql += ` AND status = ?`; args.push(filters.status); }\n if (filters?.trainset) { sql += ` AND trainset = ?`; args.push(filters.trainset); }\n if (filters?.search) {\n sql += ` AND (material_name LIKE ? OR part_number LIKE ? OR issue_no LIKE ? OR ncr LIKE ? OR jobcard LIKE ?)`;\n const s = `%${filters.search}%`;\n args.push(s, s, s, s, s);\n }\n if (filters?.dateFrom) { sql += ` AND issue_date >= ?`; args.push(filters.dateFrom); }\n if (filters?.dateTo) { sql += ` AND issue_date <= ?`; args.push(filters.dateTo); }\n sql += \" ORDER BY id DESC\";\n const r = await sqlite.execute({ sql, args });\n return r.rows;\n}\n\nexport async function createIssue(data: Record) {\n const issueNo = genIssueNo();\n await sqlite.execute({\n sql: `INSERT INTO material_issues (issue_no, request_id, officer_name, material_name, part_number, healthy_part, faulty_part, qty, trainset, car, ncr, jobcard, reason, issued_by, issued_to, status, inventory_item_id)\n VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, 'issued', ?)`,\n args: [issueNo, data.request_id || null, data.officer_name, data.material_name,\n data.part_number || \"\", data.healthy_part || \"\", data.faulty_part || \"\",\n data.qty || 1, data.trainset || \"\", data.car || \"\", data.ncr || \"\",\n data.jobcard || \"\", data.reason || \"\", data.issued_by, data.issued_to || \"\",\n data.inventory_item_id || null],\n });\n // Reduce inventory available_qty\n if (data.inventory_item_id) {\n await sqlite.execute({\n sql: `UPDATE inventory SET available_qty = available_qty - ?, issued_qty = issued_qty + ?, status = CASE WHEN available_qty - ? <= 0 THEN 'issued' ELSE status END, updated_date = datetime('now') WHERE id = ?`,\n args: [data.qty || 1, data.qty || 1, data.qty || 1, data.inventory_item_id],\n });\n }\n // Update request status\n if (data.request_id) {\n await updateRequestStatus(data.request_id, \"issued\", data.issued_by);\n }\n const r = await sqlite.execute({ sql: \"SELECT * FROM material_issues WHERE issue_no = ?\", args: [issueNo] });\n return r.rows[0];\n}\n\n// ─── Gate Pass CRUD ───\nfunction genGatePassNo() {\n return `GP-${new Date().getFullYear()}-${String(Date.now()).slice(-6)}`;\n}\n\nexport async function getGatePasses(filters?: Record) {\n let sql = \"SELECT * FROM gate_passes WHERE 1=1\";\n const args: any[] = [];\n if (filters?.status) { sql += ` AND status = ?`; args.push(filters.status); }\n if (filters?.search) {\n sql += ` AND (gatepass_no LIKE ? OR vendor_name LIKE ? OR vehicle_no LIKE ?)`;\n const s = `%${filters.search}%`;\n args.push(s, s, s);\n }\n if (filters?.dateFrom) { sql += ` AND issue_date >= ?`; args.push(filters.dateFrom); }\n if (filters?.dateTo) { sql += ` AND issue_date <= ?`; args.push(filters.dateTo); }\n sql += \" ORDER BY id DESC\";\n const r = await sqlite.execute({ sql, args });\n return r.rows;\n}\n\nexport async function createGatePass(data: Record) {\n const gatepassNo = genGatePassNo();\n await sqlite.execute({\n sql: `INSERT INTO gate_passes (gatepass_no, issue_id, vendor_name, vendor_address, vehicle_no, driver_name, material_details, issue_date, expected_return_date, status, generated_by)\n VALUES (?, ?, ?, ?, ?, ?, ?, datetime('now'), ?, 'open', ?)`,\n args: [gatepassNo, data.issue_id || null, data.vendor_name || \"\", data.vendor_address || \"\",\n data.vehicle_no || \"\", data.driver_name || \"\", data.material_details || \"\",\n data.expected_return_date || \"\", data.generated_by],\n });\n const r = await sqlite.execute({ sql: \"SELECT * FROM gate_passes WHERE gatepass_no = ?\", args: [gatepassNo] });\n return r.rows[0];\n}\n\nexport async function updateGatePassStatus(id: number, status: string, returnDate?: string) {\n if (status === \"closed\" && returnDate) {\n await sqlite.execute({ sql: `UPDATE gate_passes SET status = 'closed', actual_return_date = ? WHERE id = ?`, args: [returnDate, id] });\n } else {\n await sqlite.execute({ sql: `UPDATE gate_passes SET status = ? WHERE id = ?`, args: [status, id] });\n }\n}\n\n// ─── Repair CRUD ───\nexport async function getRepairs(filters?: Record) {\n let sql = \"SELECT * FROM repairs WHERE 1=1\";\n const args: any[] = [];\n if (filters?.status) { sql += ` AND repair_status = ?`; args.push(filters.status); }\n if (filters?.search) {\n sql += ` AND (part_number LIKE ? OR material_name LIKE ? OR vendor LIKE ?)`;\n const s = `%${filters.search}%`;\n args.push(s, s, s);\n }\n sql += \" ORDER BY id DESC\";\n const r = await sqlite.execute({ sql, args });\n return r.rows;\n}\n\nexport async function createRepair(data: Record) {\n await sqlite.execute({\n sql: `INSERT INTO repairs (gatepass_id, issue_id, part_number, material_name, vendor, repair_status, expected_date, remarks)\n VALUES (?, ?, ?, ?, ?, 'sent', ?, ?)`,\n args: [data.gatepass_id || null, data.issue_id || null, data.part_number || \"\",\n data.material_name || \"\", data.vendor || \"\", data.expected_date || \"\", data.remarks || \"\"],\n });\n const r = await sqlite.execute(\"SELECT * FROM repairs ORDER BY id DESC LIMIT 1\");\n return r.rows[0];\n}\n\nexport async function updateRepair(id: number, data: Record) {\n const fields: string[] = [];\n const values: any[] = [];\n for (const [k, v] of Object.entries(data)) {\n if ([\"repair_status\", \"expected_date\", \"received_date\", \"inspection_result\", \"remarks\", \"vendor\"].includes(k)) {\n fields.push(`${k} = ?`);\n values.push(v);\n }\n }\n fields.push(\"updated_at = datetime('now')\");\n if (fields.length === 0) return;\n values.push(id);\n await sqlite.execute({ sql: `UPDATE repairs SET ${fields.join(\", \")} WHERE id = ?`, args: values });\n\n // If repair complete and received, update inventory\n if (data.repair_status === \"received\" && data.inspection_result === \"accepted\") {\n const repair = await sqlite.execute({ sql: \"SELECT * FROM repairs WHERE id = ?\", args: [id] });\n if (repair.rows[0]) {\n const r = repair.rows[0] as any;\n if (r.issue_id) {\n const issue = await sqlite.execute({ sql: \"SELECT * FROM material_issues WHERE id = ?\", args: [r.issue_id] });\n if (issue.rows[0]) {\n const iss = issue.rows[0] as any;\n if (iss.inventory_item_id) {\n await sqlite.execute({\n sql: `UPDATE inventory SET available_qty = available_qty + ?, repair_qty = repair_qty - ?, status = 'available', updated_date = datetime('now') WHERE id = ?`,\n args: [iss.qty || 1, iss.qty || 1, iss.inventory_item_id],\n });\n }\n }\n }\n }\n }\n}\n\n// ─── Settings ───\nexport async function getSetting(key: string): Promise {\n const r = await sqlite.execute({ sql: \"SELECT value FROM settings WHERE key = ?\", args: [key] });\n return r.rows[0]?.value as string || \"\";\n}\n\nexport async function setSetting(key: string, value: string) {\n await sqlite.execute({ sql: `INSERT INTO settings (key, value) VALUES (?, ?) ON CONFLICT(key) DO UPDATE SET value = ?`, args: [key, value, value] });\n}\n\nexport async function getAllSettings() {\n const r = await sqlite.execute(\"SELECT key, value FROM settings\");\n const settings: Record = {};\n for (const row of r.rows) {\n settings[row.key as string] = row.value as string;\n }\n return settings;\n}\n\n// ─── Audit Log ───\nexport async function logAudit(userName: string, action: string, module: string, oldValue: string, newValue: string, ip: string) {\n await sqlite.execute({\n sql: \"INSERT INTO audit_log (user_name, action, module, old_value, new_value, ip) VALUES (?, ?, ?, ?, ?, ?)\",\n args: [userName, action, module, oldValue, newValue, ip],\n });\n}\n\nexport async function getAuditLogs(filters?: Record) {\n let sql = \"SELECT * FROM audit_log WHERE 1=1\";\n const args: any[] = [];\n if (filters?.user) { sql += ` AND user_name LIKE ?`; args.push(`%${filters.user}%`); }\n if (filters?.module) { sql += ` AND module = ?`; args.push(filters.module); }\n if (filters?.dateFrom) { sql += ` AND date >= ?`; args.push(filters.dateFrom); }\n if (filters?.dateTo) { sql += ` AND date <= ?`; args.push(filters.dateTo); }\n sql += \" ORDER BY id DESC LIMIT 200\";\n const r = await sqlite.execute({ sql, args });\n return r.rows;\n}\n\n// ─── Dashboard Stats ───\nexport async function getDashboardStats() {\n const invStats = await getInventoryStats();\n const reqStats = await sqlite.execute(`\n SELECT \n SUM(CASE WHEN status = 'pending' THEN 1 ELSE 0 END) as open_requests,\n SUM(CASE WHEN status = 'approved' THEN 1 ELSE 0 END) as approved_requests,\n SUM(CASE WHEN status = 'rejected' THEN 1 ELSE 0 END) as rejected_requests,\n SUM(CASE WHEN status = 'issued' THEN 1 ELSE 0 END) as issued_requests,\n COUNT(*) as total_requests\n FROM material_requests\n `);\n const issueStats = await sqlite.execute(`\n SELECT \n COUNT(*) as total_issues,\n SUM(CASE WHEN date(issue_date) = date('now') THEN 1 ELSE 0 END) as today_issues\n FROM material_issues\n `);\n const gpStats = await sqlite.execute(`\n SELECT \n SUM(CASE WHEN status = 'open' THEN 1 ELSE 0 END) as open_gatepass,\n SUM(CASE WHEN status = 'closed' THEN 1 ELSE 0 END) as closed_gatepass\n FROM gate_passes\n `);\n const repairStats = await sqlite.execute(`\n SELECT \n SUM(CASE WHEN repair_status = 'sent' THEN 1 ELSE 0 END) as pending_repair,\n SUM(CASE WHEN repair_status = 'received' THEN 1 ELSE 0 END) as received_repair\n FROM repairs\n `);\n return {\n ...invStats,\n ...reqStats.rows[0],\n ...issueStats.rows[0],\n ...gpStats.rows[0],\n ...repairStats.rows[0],\n };\n}\n",[],[224,206],["D",1784087575601],[376,377,378],[224],"a9e054e2-ae8d-47da-a95a-78810443b247",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();",[],[200,194],"25f7afc9-d2f7-40bf-8911-e4b317edcb26",["D",1784087575601],"\n\n \n \n \n \n BEML DLP Inventory Management System\n \n \n \n \n

\n \n \n \n",[],[200,188],"430d0611-c3a0-463f-a358-a1b9f719c265",["D",1784087575601],"\n",[],[200,182],"6f5287e4-82fb-4c9a-8de7-df6eed705c67",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { ReactNode, useState, useEffect } from \"https://esm.sh/react@18.2.0\";\n\n// ─── Status Badge ───\nconst statusColors: Record = {\n available: \"bg-green-100 text-green-700 border-green-300\",\n issued: \"bg-red-100 text-red-700 border-red-300\",\n repair: \"bg-blue-100 text-blue-700 border-blue-300\",\n replacement: \"bg-purple-100 text-purple-700 border-purple-300\",\n pending: \"bg-yellow-100 text-yellow-700 border-yellow-300\",\n approved: \"bg-green-100 text-green-700 border-green-300\",\n rejected: \"bg-red-100 text-red-700 border-red-300\",\n open: \"bg-orange-100 text-orange-700 border-orange-300\",\n closed: \"bg-gray-100 text-gray-700 border-gray-300\",\n sent: \"bg-blue-100 text-blue-700 border-blue-300\",\n received: \"bg-green-100 text-green-700 border-green-300\",\n active: \"bg-green-100 text-green-700 border-green-300\",\n inactive: \"bg-red-100 text-red-700 border-red-300\",\n};\n\nexport function Badge({ status }: { status: string }) {\n const cls = statusColors[status?.toLowerCase()] || \"bg-gray-100 text-gray-700 border-gray-300\";\n return {status};\n}\n\n// ─── Card ───\nexport function Card({ children, className = \"\" }: { children: ReactNode; className?: string }) {\n return

{children}

;\n}\n\nexport function StatCard({ title, value, icon, color = \"blue\" }: { title: string; value: any; icon: string; color?: string }) {\n const colorMap: Record = {\n blue: \"bg-blue-50 text-blue-600\",\n green: \"bg-green-50 text-green-600\",\n red: \"bg-red-50 text-red-600\",\n yellow: \"bg-yellow-50 text-yellow-600\",\n purple: \"bg-purple-50 text-purple-600\",\n orange: \"bg-orange-50 text-orange-600\",\n gray: \"bg-gray-50 text-gray-600\",\n };\n return (\n \n

{title}

{value ?? 0}

{icon}

\n \n );\n}\n\n// ─── Button ───\nexport function Button({ children, onClick, variant = \"primary\", size = \"md\", disabled, type = \"button\", className = \"\" }: any) {\n const variants: Record = {\n primary: \"bg-blue-600 hover:bg-blue-700 text-white\",\n secondary: \"bg-slate-200 hover:bg-slate-300 text-slate-700\",\n danger: \"bg-red-600 hover:bg-red-700 text-white\",\n success: \"bg-green-600 hover:bg-green-700 text-white\",\n outline: \"border border-slate-300 hover:bg-slate-50 text-slate-700\",\n ghost: \"hover:bg-slate-100 text-slate-600\",\n };\n const sizes: Record = {\n sm: \"px-3 py-1.5 text-xs\",\n md: \"px-4 py-2 text-sm\",\n lg: \"px-6 py-3 text-base\",\n };\n return (\n \n );\n}\n\n// ─── Input ───\nexport function Input({ label, type = \"text\", value, onChange, placeholder, required, className = \"\" }: any) {\n return (\n

\n {label && {label}{required && *}}\n \n

\n );\n}\n\nexport function Select({ label, value, onChange, options, required, className = \"\" }: any) {\n return (\n

\n {label && {label}{required && *}}\n \n

\n );\n}\n\nexport function Textarea({ label, value, onChange, placeholder, required, rows = 3, className = \"\" }: any) {\n return (\n

\n {label && {label}{required && *}}\n

\n    </div>\n  );\n}\n\n// ─── Modal ───\nexport function Modal({ open, onClose, title, children, size = \"md\" }: any) {\n  if (!open) return null;\n  const sizes: Record<string, string> = { sm: \"max-w-md\", md: \"max-w-lg\", lg: \"max-w-2xl\", xl: \"max-w-4xl\" };\n  return (\n    <div class=\"fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/50\" onClick={onClose}>\n      <div class={`bg-white rounded-xl shadow-xl w-full ${sizes[size]} max-h-[90vh] overflow-y-auto`} onClick={e => e.stopPropagation()}>\n        <div class=\"flex items-center justify-between p-4 border-b border-slate-200 sticky top-0 bg-white z-10\">\n          <h3 class=\"text-lg font-semibold text-slate-800\">{title}</h3>\n          <button onClick={onClose} class=\"text-slate-400 hover:text-slate-600 text-2xl leading-none\">×</button>\n        </div>\n        <div class=\"p-4\">{children}</div>\n      </div>\n    </div>\n  );\n}\n\n// ─── Table ───\nexport function Table({ headers, children }: { headers: string[]; children: ReactNode }) {\n  return (\n    <div class=\"overflow-x-auto\">\n      <table class=\"w-full text-sm\">\n        <thead>\n          <tr class=\"border-b-2 border-slate-200\">\n            {headers.map(h => <th class=\"text-left py-2 px-3 font-semibold text-slate-600 whitespace-nowrap\">{h}</th>)}\n          </tr>\n        </thead>\n        <tbody>{children}</tbody>\n      </table>\n    </div>\n  );\n}\n\nexport function Tr({ children, onClick }: any) {\n  return <tr class=\"border-b border-slate-100 hover:bg-slate-50 cursor-default\" onClick={onClick}>{children}</tr>;\n}\n\nexport function Td({ children, className = \"\" }: any) {\n  return <td class={`py-2 px-3 text-slate-700 ${className}`}>{children}</td>;\n}\n\n// ─── Loading ───\nexport function Loading() {\n  return (\n    <div class=\"flex items-center justify-center py-12\">\n      <div class=\"w-8 h-8 border-3 border-blue-200 border-t-blue-600 rounded-full animate-spin\"></div>\n    </div>\n  );\n}\n\n// ─── Empty State ───\nexport function EmptyState({ message, icon = \"📋\" }: { message: string; icon?: string }) {\n  return (\n    <div class=\"text-center py-12 text-slate-400\">\n      <div class=\"text-4xl mb-3\">{icon}</div>\n      <p class=\"text-sm\">{message}</p>\n    </div>\n  );\n}\n\n// ─── Search Bar ───\nexport function SearchBar({ value, onChange, placeholder = \"Search...\" }: any) {\n  return (\n    <div class=\"relative\">\n      <input type=\"text\" value={value} onChange={onChange} placeholder={placeholder}\n        class=\"w-full pl-9 pr-3 py-2 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500\" />\n      <svg class=\"absolute left-3 top-2.5 w-4 h-4 text-slate-400\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M21 21l-4.35-4.35M17 11a6 6 0 11-12 0 6 6 0 0112 0z\" />\n      </svg>\n    </div>\n  );\n}\n\n// ─── Toast ───\nexport function useToast() {\n  const [toast, setToast] = useState<{ msg: string; type: string } | null>(null);\n  const showToast = (msg: string, type: string = \"info\") => {\n    setToast({ msg, type });\n    setTimeout(() => setToast(null), 3000);\n  };\n  const toastEl = toast && (\n    <div class=\"fixed bottom-4 right-4 z-50 px-4 py-3 rounded-lg shadow-lg text-sm font-medium text-white\"\n      style={{ background: toast.type === \"error\" ? \"#dc2626\" : toast.type === \"success\" ? \"#16a34a\" : \"#2563eb\" }}>\n      {toast.msg}\n    </div>\n  );\n  return { showToast, toastEl };\n}\n\n// ─── Date Input ───\nexport function DateInput({ label, value, onChange, className = \"\" }: any) {\n  return (\n    <div class={className}>\n      {label && <label class=\"block text-sm font-medium text-slate-600 mb-1\">{label}</label>}\n      <input type=\"date\" value={value} onChange={onChange}\n        class=\"w-full px-3 py-2 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500\" />\n    </div>\n  );\n}\n",[],[200,175,169],"20117ee1-db71-4418-b2a1-e8103c3b076a",["D",1784087575601],"// API Client - handles all HTTP requests with auth\nconst BASE = \"\";\n\nfunction getToken(): string | null {\n  return localStorage.getItem(\"beml_token\");\n}\n\nexport function setToken(token: string) {\n  localStorage.setItem(\"beml_token\", token);\n}\n\nexport function clearToken() {\n  localStorage.removeItem(\"beml_token\");\n}\n\nexport function getStoredUser(): any | null {\n  const u = localStorage.getItem(\"beml_user\");\n  return u ? JSON.parse(u) : null;\n}\n\nexport function setStoredUser(user: any) {\n  localStorage.setItem(\"beml_user\", JSON.stringify(user));\n}\n\nexport function clearStoredUser() {\n  localStorage.removeItem(\"beml_user\");\n}\n\nasync function apiFetch(path: string, options: RequestInit = {}): Promise<any> {\n  const token = getToken();\n  const headers: Record<string, string> = {\n    \"Content-Type\": \"application/json\",\n    ...(options.headers as Record<string, string> || {}),\n  };\n  if (token) headers[\"Authorization\"] = `Bearer ${token}`;\n  const res = await fetch(path, { ...options, headers });\n  if (res.status === 401) {\n    clearToken();\n    clearStoredUser();\n    window.location.hash = \"#/login\";\n    throw new Error(\"Session expired\");\n  }\n  const data = await res.json();\n  if (!res.ok) throw new Error(data.error || \"Request failed\");\n  return data;\n}\n\n// Auth API\nexport const auth = {\n  login: (email: string, password: string) =>\n    apiFetch(\"/api/auth/login\", { method: \"POST\", body: JSON.stringify({ email, password }) }),\n  logout: () => apiFetch(\"/api/auth/logout\", { method: \"POST\" }),\n  me: () => apiFetch(\"/api/auth/me\"),\n};\n\n// Dashboard API\nexport const dashboard = {\n  get: () => apiFetch(\"/api/dashboard\"),\n};\n\n// Inventory API\nexport const inventory = {\n  list: (filters: Record<string, string> = {}) => {\n    const q = new URLSearchParams(filters).toString();\n    return apiFetch(`/api/inventory?${q}`);\n  },\n  stats: () => apiFetch(\"/api/inventory/stats\"),\n  sync: () => apiFetch(\"/api/inventory/sync\", { method: \"POST\" }),\n  export: () => `${BASE}/api/inventory/export?token=${getToken()}`,\n  sheetTabs: () => apiFetch(\"/api/inventory/sheets/tabs\"),\n};\n\n// Requests API\nexport const requests = {\n  list: (filters: Record<string, string> = {}) => {\n    const q = new URLSearchParams(filters).toString();\n    return apiFetch(`/api/requests?${q}`);\n  },\n  create: (data: any) => apiFetch(\"/api/requests\", { method: \"POST\", body: JSON.stringify(data) }),\n  update: (id: number, data: any) => apiFetch(`/api/requests/${id}`, { method: \"PATCH\", body: JSON.stringify(data) }),\n  export: () => `/api/requests/export`,\n};\n\n// Issues API\nexport const issues = {\n  list: (filters: Record<string, string> = {}) => {\n    const q = new URLSearchParams(filters).toString();\n    return apiFetch(`/api/issues?${q}`);\n  },\n  create: (data: any) => apiFetch(\"/api/issues\", { method: \"POST\", body: JSON.stringify(data) }),\n  export: () => `/api/issues/export`,\n  print: (id: number) => `/api/issues/${id}/print`,\n};\n\n// Gate Pass API\nexport const gatepass = {\n  list: (filters: Record<string, string> = {}) => {\n    const q = new URLSearchParams(filters).toString();\n    return apiFetch(`/api/gatepass?${q}`);\n  },\n  create: (data: any) => apiFetch(\"/api/gatepass\", { method: \"POST\", body: JSON.stringify(data) }),\n  export: () => `/api/gatepass/export`,\n  print: (id: number) => `/api/gatepass/${id}/print`,\n};\n\n// Repairs API\nexport const repairs = {\n  list: (filters: Record<string, string> = {}) => {\n    const q = new URLSearchParams(filters).toString();\n    return apiFetch(`/api/repairs?${q}`);\n  },\n  create: (data: any) => apiFetch(\"/api/repairs\", { method: \"POST\", body: JSON.stringify(data) }),\n  update: (id: number, data: any) => apiFetch(`/api/repairs/${id}`, { method: \"PATCH\", body: JSON.stringify(data) }),\n};\n\n// Settings API\nexport const settings = {\n  get: () => apiFetch(\"/api/settings\"),\n  update: (data: any) => apiFetch(\"/api/settings\", { method: \"POST\", body: JSON.stringify(data) }),\n  testConnection: () => apiFetch(\"/api/settings/test-connection\", { method: \"POST\" }),\n};\n\n// Users API\nexport const users = {\n  list: () => apiFetch(\"/api/users\"),\n  create: (data: any) => apiFetch(\"/api/users\", { method: \"POST\", body: JSON.stringify(data) }),\n  update: (id: number, data: any) => apiFetch(`/api/users/${id}`, { method: \"PATCH\", body: JSON.stringify(data) }),\n  delete: (id: number) => apiFetch(`/api/users/${id}`, { method: \"DELETE\" }),\n};\n\n// Audit API\nexport const audit = {\n  list: (filters: Record<string, string> = {}) => {\n    const q = new URLSearchParams(filters).toString();\n    return apiFetch(`/api/audit?${q}`);\n  },\n};\n\n// Sheets Info API\nexport const sheetsInfo = {\n  get: () => apiFetch(\"/api/sheets/info\"),\n};\n\n// Download CSV export helper\nexport function downloadCSV(url: string, filename: string) {\n  const token = getToken();\n  fetch(url, { headers: { Authorization: `Bearer ${token}` } })\n    .then(r => r.text())\n    .then(text => {\n      const blob = new Blob([text], { type: \"text/csv\" });\n      const a = document.createElement(\"a\");\n      a.href = URL.createObjectURL(blob);\n      a.download = filename;\n      a.click();\n      URL.revokeObjectURL(a.href);\n    });\n}\n\n// Open print page helper\nexport function openPrintPage(url: string) {\n  const token = getToken();\n  fetch(url, { headers: { Authorization: `Bearer ${token}` } })\n    .then(r => r.text())\n    .then(html => {\n      const w = window.open(\"\", \"_blank\");\n      if (w) {\n        w.document.write(html);\n        w.document.close();\n      }\n    });\n}\n",[],[200,175,163],"6951d5ec-8b90-4585-a689-c147b276e5ce",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { users } from \"./api.ts\";\nimport { Card, Table, Tr, Td, Badge, Loading, EmptyState, Button, Modal, Input, Select, useToast } from \"./ui.tsx\";\n\nexport function UsersPage({ user }: { user: any }) {\n  const [items, setItems] = useState<any[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [showModal, setShowModal] = useState(false);\n  const [editUser, setEditUser] = useState<any>(null);\n  const [form, setForm] = useState({ name: \"\", email: \"\", password: \"\", role: \"officer\", department: \"\", mobile: \"\" });\n  const { showToast, toastEl } = useToast();\n\n  const load = () => {\n    setLoading(true);\n    users.list().then(data => setItems(data.users || [])).catch(e => showToast(e.message, \"error\")).finally(() => setLoading(false));\n  };\n\n  useEffect(() => { load(); }, []);\n\n  const handleCreate = () => {\n    if (!form.name || !form.email || !form.password) { showToast(\"Name, email and password required\", \"error\"); return; }\n    users.create(form).then(() => { setShowModal(false); showToast(\"User created successfully\", \"success\"); setForm({ name: \"\", email: \"\", password: \"\", role: \"officer\", department: \"\", mobile: \"\" }); load(); }).catch(e => showToast(e.message, \"error\"));\n  };\n\n  const handleUpdate = () => {\n    if (!editUser) return;\n    const data: any = { name: editUser.name, email: editUser.email, role: editUser.role, department: editUser.department, mobile: editUser.mobile, status: editUser.status };\n    if (editUser.password) data.password = editUser.password;\n    users.update(editUser.id, data).then(() => { setEditUser(null); showToast(\"User updated successfully\", \"success\"); load(); }).catch(e => showToast(e.message, \"error\"));\n  };\n\n  const handleDelete = (id: number, name: string) => {\n    if (confirm(`Are you sure you want to delete user \"${name}\"?`)) {\n      users.delete(id).then(() => { showToast(\"User deleted\", \"info\"); load(); }).catch(e => showToast(e.message, \"error\"));\n    }\n  };\n\n  return (\n    <div class=\"space-y-4\">\n      {toastEl}\n      <div class=\"flex items-center justify-between\">\n        <h3 class=\"text-lg font-semibold text-slate-800\">User Management</h3>\n        <Button size=\"sm\" onClick={() => { setForm({ name: \"\", email: \"\", password: \"\", role: \"officer\", department: \"\", mobile: \"\" }); setShowModal(true); }}>➕ Add User</Button>\n      </div>\n\n      <Card class=\"p-0\">\n        {loading ? <Loading /> : items.length === 0 ? <EmptyState message=\"No users found\" icon=\"👥\" /> : (\n          <Table headers={[\"Name\", \"Email\", \"Role\", \"Department\", \"Mobile\", \"Status\", \"Created\", \"Actions\"]}>\n            {items.map((u: any) => (\n              <Tr key={u.id}>\n                <Td class=\"font-medium\">{u.name}</Td>\n                <Td class=\"text-xs\">{u.email}</Td>\n                <Td><span class=\"capitalize\">{u.role}</span></Td>\n                <Td>{u.department || \"-\"}</Td>\n                <Td class=\"text-xs\">{u.mobile || \"-\"}</Td>\n                <Td><Badge status={u.status} /></Td>\n                <Td class=\"text-xs\">{new Date(u.created_at).toLocaleDateString(\"en-IN\")}</Td>\n                <Td>\n                  <div class=\"flex gap-2\">\n                    <button onClick={() => setEditUser({ ...u, password: \"\" })} class=\"text-blue-600 text-xs font-medium hover:text-blue-700\">Edit</button>\n                    {u.id !== user.id && <button onClick={() => handleDelete(u.id, u.name)} class=\"text-red-600 text-xs font-medium hover:text-red-700\">Delete</button>}\n                  </div>\n                </Td>\n              </Tr>\n            ))}\n          </Table>\n        )}\n      </Card>\n\n      {/* Create User Modal */}\n      <Modal open={showModal} onClose={() => setShowModal(false)} title=\"Add New User\" size=\"md\">\n        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n          <Input label=\"Full Name\" value={form.name} onChange={(e: any) => setForm({ ...form, name: e.target.value })} required />\n          <Input label=\"Email\" type=\"email\" value={form.email} onChange={(e: any) => setForm({ ...form, email: e.target.value })} required />\n          <Input label=\"Password\" type=\"password\" value={form.password} onChange={(e: any) => setForm({ ...form, password: e.target.value })} required />\n          <div>\n            <label class=\"block text-sm font-medium text-slate-600 mb-1\">Role</label>\n            <select value={form.role} onChange={(e: any) => setForm({ ...form, role: e.target.value })} class=\"w-full px-3 py-2 border border-slate-300 rounded-lg text-sm bg-white\">\n              <option value=\"admin\">Admin</option>\n              <option value=\"store\">Store Person</option>\n              <option value=\"officer\">Officer</option>\n              <option value=\"viewer\">Viewer</option>\n            </select>\n          </div>\n          <Input label=\"Department\" value={form.department} onChange={(e: any) => setForm({ ...form, department: e.target.value })} />\n          <Input label=\"Mobile\" value={form.mobile} onChange={(e: any) => setForm({ ...form, mobile: e.target.value })} />\n        </div>\n        <div class=\"flex justify-end gap-2 mt-4\">\n          <Button variant=\"secondary\" onClick={() => setShowModal(false)}>Cancel</Button>\n          <Button onClick={handleCreate}>Create User</Button>\n        </div>\n      </Modal>\n\n      {/* Edit User Modal */}\n      <Modal open={!!editUser} onClose={() => setEditUser(null)} title=\"Edit User\" size=\"md\">\n        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n          <Input label=\"Full Name\" value={editUser?.name || \"\"} onChange={(e: any) => setEditUser({ ...editUser, name: e.target.value })} />\n          <Input label=\"Email\" type=\"email\" value={editUser?.email || \"\"} onChange={(e: any) => setEditUser({ ...editUser, email: e.target.value })} />\n          <Input label=\"New Password (leave blank to keep)\" type=\"password\" value={editUser?.password || \"\"} onChange={(e: any) => setEditUser({ ...editUser, password: e.target.value })} />\n          <div>\n            <label class=\"block text-sm font-medium text-slate-600 mb-1\">Role</label>\n            <select value={editUser?.role || \"\"} onChange={(e: any) => setEditUser({ ...editUser, role: e.target.value })} class=\"w-full px-3 py-2 border border-slate-300 rounded-lg text-sm bg-white\">\n              <option value=\"admin\">Admin</option>\n              <option value=\"store\">Store Person</option>\n              <option value=\"officer\">Officer</option>\n              <option value=\"viewer\">Viewer</option>\n            </select>\n          </div>\n          <Input label=\"Department\" value={editUser?.department || \"\"} onChange={(e: any) => setEditUser({ ...editUser, department: e.target.value })} />\n          <Input label=\"Mobile\" value={editUser?.mobile || \"\"} onChange={(e: any) => setEditUser({ ...editUser, mobile: e.target.value })} />\n          <div>\n            <label class=\"block text-sm font-medium text-slate-600 mb-1\">Status</label>\n            <select value={editUser?.status || \"\"} onChange={(e: any) => setEditUser({ ...editUser, status: e.target.value })} class=\"w-full px-3 py-2 border border-slate-300 rounded-lg text-sm bg-white\">\n              <option value=\"active\">Active</option>\n              <option value=\"inactive\">Inactive</option>\n            </select>\n          </div>\n        </div>\n        <div class=\"flex justify-end gap-2 mt-4\">\n          <Button variant=\"secondary\" onClick={() => setEditUser(null)}>Cancel</Button>\n          <Button onClick={handleUpdate}>Update User</Button>\n        </div>\n      </Modal>\n    </div>\n  );\n}\n",[],[200,175,157],"25fcedb3-d271-410e-9469-696df8fc6016",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { settings, sheetsInfo, inventory } from \"./api.ts\";\nimport { Card, Button, Input, Loading, useToast } from \"./ui.tsx\";\n\nexport function SettingsPage({ user }: { user: any }) {\n  const [s, setS] = useState<any>(null);\n  const [sheetInfo, setSheetInfo] = useState<any>(null);\n  const [loading, setLoading] = useState(true);\n  const [testing, setTesting] = useState(false);\n  const [syncing, setSyncing] = useState(false);\n  const [testResult, setTestResult] = useState<any>(null);\n  const { showToast, toastEl } = useToast();\n\n  useEffect(() => {\n    settings.get().then(data => setS(data.settings)).catch(() => {});\n    sheetsInfo.get().then(data => setSheetInfo(data)).catch(() => {}).finally(() => setLoading(false));\n  }, []);\n\n  const handleSave = () => {\n    settings.update({\n      google_sheet_id: s.google_sheet_id,\n      google_drive_folder: s.google_drive_folder,\n      company_name: s.company_name,\n      company_division: s.company_division,\n      company_address: s.company_address,\n      sync_interval: s.sync_interval,\n    }).then(() => showToast(\"Settings saved successfully\", \"success\")).catch(e => showToast(e.message, \"error\"));\n  };\n\n  const handleTest = () => {\n    setTesting(true);\n    setTestResult(null);\n    settings.update({ google_sheet_id: s.google_sheet_id }).then(() => {\n      settings.testConnection().then(r => { setTestResult(r); showToast(r.message, r.success ? \"success\" : \"error\"); }).catch(e => { setTestResult({ success: false, message: e.message }); showToast(e.message, \"error\"); }).finally(() => setTesting(false));\n    }).catch(e => { showToast(e.message, \"error\"); setTesting(false); });\n  };\n\n  const handleSync = () => {\n    setSyncing(true);\n    inventory.sync().then(r => { showToast(r.message, r.success ? \"success\" : \"error\"); }).catch(e => showToast(e.message, \"error\")).finally(() => setSyncing(false));\n  };\n\n  if (loading) return <Loading />;\n\n  return (\n    <div class=\"space-y-4\">\n      {toastEl}\n\n      {/* Google Sheets Configuration */}\n      <Card class=\"p-5\">\n        <h3 class=\"font-semibold text-slate-800 mb-4\">📊 Google Sheets Configuration</h3>\n        <div class=\"space-y-3\">\n          <Input label=\"Google Spreadsheet ID\" value={s?.google_sheet_id || \"\"} onChange={(e: any) => setS({ ...s, google_sheet_id: e.target.value })} placeholder=\"Enter the spreadsheet ID from Google Sheets URL\" />\n          <Input label=\"Google Drive Folder ID (for document storage)\" value={s?.google_drive_folder || \"\"} onChange={(e: any) => setS({ ...s, google_drive_folder: e.target.value })} placeholder=\"Enter Google Drive folder ID\" />\n          <div class=\"flex flex-wrap gap-2\">\n            <Button size=\"sm\" variant=\"outline\" onClick={handleTest} disabled={testing}>{testing ? \"Testing...\" : \"🔌 Test Connection\"}</Button>\n            <Button size=\"sm\" onClick={handleSync} disabled={syncing || !s?.google_sheet_id}>{syncing ? \"Syncing...\" : \"🔄 Sync Now\"}</Button>\n          </div>\n          {testResult && (\n            <div class={`text-sm px-3 py-2 rounded-lg ${testResult.success ? \"bg-green-50 text-green-700 border border-green-200\" : \"bg-red-50 text-red-700 border border-red-200\"}`}>\n              {testResult.message}\n              {testResult.tabs && testResult.tabs.length > 0 && (\n                <div class=\"mt-2\"><span class=\"font-medium\">Found sheets:</span> {testResult.tabs.join(\", \")}</div>\n              )}\n            </div>\n          )}\n          <div class=\"bg-amber-50 border border-amber-200 text-amber-700 text-xs px-3 py-2 rounded-lg\">\n            ⚠️ You must set the <code class=\"bg-amber-100 px-1 rounded\">google_service_account</code> environment variable with your Google Cloud service account JSON key.\n          </div>\n        </div>\n      </Card>\n\n      {/* Expected Sheet Structure */}\n      {sheetInfo && (\n        <Card class=\"p-5\">\n          <h3 class=\"font-semibold text-slate-800 mb-4\">📋 Expected Google Sheet Structure</h3>\n          <p class=\"text-sm text-slate-500 mb-3\">Your spreadsheet should contain sheets with these exact names and columns:</p>\n          <div class=\"space-y-3\">\n            {Object.entries(sheetInfo.sheetNames || {}).map(([key, name]: any) => (\n              <div key={key} class=\"border border-slate-200 rounded-lg p-3\">\n                <p class=\"font-medium text-sm text-slate-700\">📄 Sheet: \"{name}\"</p>\n                {key === \"INVENTORY\" && (\n                  <div class=\"mt-2 flex flex-wrap gap-1\">\n                    {sheetInfo.inventoryColumns?.map((c: string) => <span class=\"text-xs bg-blue-50 text-blue-600 px-2 py-1 rounded\">{c}</span>)}\n                  </div>\n                )}\n                {key === \"VENDORS\" && (\n                  <div class=\"mt-2 flex flex-wrap gap-1\">\n                    {sheetInfo.vendorColumns?.map((c: string) => <span class=\"text-xs bg-purple-50 text-purple-600 px-2 py-1 rounded\">{c}</span>)}\n                  </div>\n                )}\n                {key === \"TRAINSETS\" && (\n                  <div class=\"mt-2 flex flex-wrap gap-1\">\n                    {sheetInfo.trainsetColumns?.map((c: string) => <span class=\"text-xs bg-green-50 text-green-600 px-2 py-1 rounded\">{c}</span>)}\n                  </div>\n                )}\n                {key === \"REQUESTS\" && <p class=\"text-xs text-slate-400 mt-1\">System-managed sheet for request records</p>}\n                {key === \"ISSUES\" && <p class=\"text-xs text-slate-400 mt-1\">System-managed sheet for issue records</p>}\n                {key === \"GATEPASSES\" && <p class=\"text-xs text-slate-400 mt-1\">System-managed sheet for gate pass records</p>}\n                {key === \"REPAIRS\" && <p class=\"text-xs text-slate-400 mt-1\">System-managed sheet for repair records</p>}\n              </div>\n            ))}\n          </div>\n        </Card>\n      )}\n\n      {/* Company Details */}\n      <Card class=\"p-5\">\n        <h3 class=\"font-semibold text-slate-800 mb-4\">🏢 Company Details (for BEML Letterhead)</h3>\n        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n          <Input label=\"Company Name\" value={s?.company_name || \"\"} onChange={(e: any) => setS({ ...s, company_name: e.target.value })} />\n          <Input label=\"Division\" value={s?.company_division || \"\"} onChange={(e: any) => setS({ ...s, company_division: e.target.value })} />\n          <Input label=\"Company Address\" value={s?.company_address || \"\"} onChange={(e: any) => setS({ ...s, company_address: e.target.value })} className=\"md:col-span-2\" />\n          <Input label=\"Sync Interval (minutes)\" type=\"number\" value={s?.sync_interval || \"5\"} onChange={(e: any) => setS({ ...s, sync_interval: e.target.value })} />\n        </div>\n      </Card>\n\n      <div class=\"flex justify-end\">\n        <Button onClick={handleSave}>💾 Save All Settings</Button>\n      </div>\n    </div>\n  );\n}\n",[],[200,175,151],"27fb5d71-355a-4931-ac11-5196098f6890",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { requests, downloadCSV } from \"./api.ts\";\nimport { Card, Table, Tr, Td, Badge, Loading, EmptyState, SearchBar, Select, Button, Modal, Input, Textarea, DateInput, useToast } from \"./ui.tsx\";\n\nexport function RequestsPage({ user }: { user: any }) {\n  const [items, setItems] = useState<any[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [search, setSearch] = useState(\"\");\n  const [statusFilter, setStatusFilter] = useState(\"\");\n  const [trainsetFilter, setTrainsetFilter] = useState(\"\");\n  const [dateFrom, setDateFrom] = useState(\"\");\n  const [dateTo, setDateTo] = useState(\"\");\n  const [showModal, setShowModal] = useState(false);\n  const [rejectModal, setRejectModal] = useState<any>(null);\n  const [form, setForm] = useState({ material_name: \"\", part_number: \"\", qty: 1, trainset: \"\", car: \"\", ncr: \"\", jobcard: \"\", reason: \"\", priority: \"normal\", maintenance_type: \"\", location: \"\", engineer_name: \"\" });\n  const { showToast, toastEl } = useToast();\n  const canApprove = user.role === \"admin\" || user.role === \"store\";\n\n  const load = () => {\n    setLoading(true);\n    const filters: Record<string, string> = {};\n    if (search) filters.search = search;\n    if (statusFilter) filters.status = statusFilter;\n    if (trainsetFilter) filters.trainset = trainsetFilter;\n    if (dateFrom) filters.dateFrom = dateFrom;\n    if (dateTo) filters.dateTo = dateTo;\n    requests.list(filters).then(data => setItems(data.items || [])).catch(() => {}).finally(() => setLoading(false));\n  };\n\n  useEffect(() => { const t = setTimeout(load, 300); return () => clearTimeout(t); }, [search, statusFilter, trainsetFilter, dateFrom, dateTo]);\n\n  const handleSubmit = () => {\n    if (!form.material_name) { showToast(\"Material name is required\", \"error\"); return; }\n    requests.create(form).then(() => { setShowModal(false); showToast(\"Request created successfully\", \"success\"); setForm({ material_name: \"\", part_number: \"\", qty: 1, trainset: \"\", car: \"\", ncr: \"\", jobcard: \"\", reason: \"\", priority: \"normal\", maintenance_type: \"\", location: \"\", engineer_name: \"\" }); load(); }).catch(e => showToast(e.message, \"error\"));\n  };\n\n  const handleApprove = (id: number) => { requests.update(id, { status: \"approved\" }).then(() => { showToast(\"Request approved\", \"success\"); load(); }).catch(e => showToast(e.message, \"error\")); };\n  const handleReject = () => { if (rejectModal) { requests.update(rejectModal.id, { status: \"rejected\", rejected_reason: rejectModal.reason || \"\" }).then(() => { showToast(\"Request rejected\", \"info\"); setRejectModal(null); load(); }).catch(e => showToast(e.message, \"error\")); } };\n\n  return (\n    <div class=\"space-y-4\">\n      {toastEl}\n      <div class=\"flex flex-wrap items-center justify-between gap-3\">\n        <h3 class=\"text-lg font-semibold text-slate-800\">Material Requests</h3>\n        <div class=\"flex gap-2\">\n          <Button size=\"sm\" variant=\"outline\" onClick={() => downloadCSV(\"/api/requests/export\", \"requests_export.csv\")}>📥 Export</Button>\n          <Button size=\"sm\" onClick={() => setShowModal(true)}>➕ New Request</Button>\n        </div>\n      </div>\n\n      <Card class=\"p-4\">\n        <div class=\"grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-3\">\n          <SearchBar value={search} onChange={(e: any) => setSearch(e.target.value)} placeholder=\"Search request no, material...\" />\n          <Select label=\"\" value={statusFilter} onChange={(e: any) => setStatusFilter(e.target.value)} options={[\"pending\", \"approved\", \"rejected\", \"issued\"]} />\n          <input type=\"text\" value={trainsetFilter} onChange={(e: any) => setTrainsetFilter(e.target.value)} placeholder=\"Trainset No\" class=\"px-3 py-2 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500\" />\n          <DateInput label=\"\" value={dateFrom} onChange={(e: any) => setDateFrom(e.target.value)} />\n          <DateInput label=\"\" value={dateTo} onChange={(e: any) => setDateTo(e.target.value)} />\n        </div>\n      </Card>\n\n      <Card class=\"p-0\">\n        {loading ? <Loading /> : items.length === 0 ? <EmptyState message=\"No material requests found\" icon=\"📝\" /> : (\n          <Table headers={[\"Request No\", \"Officer\", \"Material\", \"Part No\", \"Qty\", \"Trainset\", \"Car\", \"NCR\", \"Job Card\", \"Status\", \"Date\", \"Actions\"]}>\n            {items.map((r: any) => (\n              <Tr key={r.id}>\n                <Td class=\"font-mono text-xs\">{r.request_no}</Td>\n                <Td>{r.officer_name}</Td>\n                <Td class=\"font-medium\">{r.material_name}</Td>\n                <Td class=\"font-mono text-xs\">{r.part_number}</Td>\n                <Td>{r.qty}</Td>\n                <Td>{r.trainset || \"-\"}</Td>\n                <Td>{r.car || \"-\"}</Td>\n                <Td class=\"text-xs\">{r.ncr || \"-\"}</Td>\n                <Td class=\"text-xs\">{r.jobcard || \"-\"}</Td>\n                <Td><Badge status={r.status} /></Td>\n                <Td class=\"text-xs\">{new Date(r.created_at).toLocaleDateString(\"en-IN\")}</Td>\n                <Td>\n                  {canApprove && r.status === \"pending\" && (\n                    <div class=\"flex gap-1\">\n                      <button onClick={() => handleApprove(r.id)} class=\"text-green-600 hover:text-green-700 text-xs font-medium\">Approve</button>\n                      <span class=\"text-slate-300\">|</span>\n                      <button onClick={() => setRejectModal({ id: r.id, reason: \"\" })} class=\"text-red-600 hover:text-red-700 text-xs font-medium\">Reject</button>\n                    </div>\n                  )}\n                  {r.status === \"rejected\" && r.rejected_reason && <span class=\"text-xs text-red-500\" title={r.rejected_reason}>Rejected</span>}\n                </Td>\n              </Tr>\n            ))}\n          </Table>\n        )}\n      </Card>\n\n      {/* New Request Modal */}\n      <Modal open={showModal} onClose={() => setShowModal(false)} title=\"New Material Request\" size=\"lg\">\n        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n          <Input label=\"Material Name\" value={form.material_name} onChange={(e: any) => setForm({ ...form, material_name: e.target.value })} required />\n          <Input label=\"Part Number\" value={form.part_number} onChange={(e: any) => setForm({ ...form, part_number: e.target.value })} />\n          <Input label=\"Quantity\" type=\"number\" value={form.qty} onChange={(e: any) => setForm({ ...form, qty: parseInt(e.target.value) || 1 })} />\n          <Input label=\"Trainset Number\" value={form.trainset} onChange={(e: any) => setForm({ ...form, trainset: e.target.value })} />\n          <Input label=\"Car Number\" value={form.car} onChange={(e: any) => setForm({ ...form, car: e.target.value })} />\n          <Input label=\"NCR Number\" value={form.ncr} onChange={(e: any) => setForm({ ...form, ncr: e.target.value })} />\n          <Input label=\"Job Card Number\" value={form.jobcard} onChange={(e: any) => setForm({ ...form, jobcard: e.target.value })} />\n          <Input label=\"Priority\" value={form.priority} onChange={(e: any) => setForm({ ...form, priority: e.target.value })} />\n          <Input label=\"Maintenance Type\" value={form.maintenance_type} onChange={(e: any) => setForm({ ...form, maintenance_type: e.target.value })} />\n          <Input label=\"Engineer Name\" value={form.engineer_name} onChange={(e: any) => setForm({ ...form, engineer_name: e.target.value })} />\n          <Input label=\"Location\" value={form.location} onChange={(e: any) => setForm({ ...form, location: e.target.value })} className=\"md:col-span-2\" />\n          <Textarea label=\"Reason\" value={form.reason} onChange={(e: any) => setForm({ ...form, reason: e.target.value })} className=\"md:col-span-2\" />\n        </div>\n        <div class=\"flex justify-end gap-2 mt-4\">\n          <Button variant=\"secondary\" onClick={() => setShowModal(false)}>Cancel</Button>\n          <Button onClick={handleSubmit}>Submit Request</Button>\n        </div>\n      </Modal>\n\n      {/* Reject Modal */}\n      <Modal open={!!rejectModal} onClose={() => setRejectModal(null)} title=\"Reject Request\" size=\"sm\">\n        <Textarea label=\"Reason for rejection\" value={rejectModal?.reason || \"\"} onChange={(e: any) => setRejectModal({ ...rejectModal, reason: e.target.value })} rows={3} />\n        <div class=\"flex justify-end gap-2 mt-4\">\n          <Button variant=\"secondary\" onClick={() => setRejectModal(null)}>Cancel</Button>\n          <Button variant=\"danger\" onClick={handleReject}>Reject</Button>\n        </div>\n      </Modal>\n    </div>\n  );\n}\n",[],[200,175,145],"aee9f896-905a-423f-984b-ac300e0683ae",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { audit, downloadCSV } from \"./api.ts\";\nimport { Card, Table, Tr, Td, Badge, Loading, EmptyState, SearchBar, Select, Button, DateInput } from \"./ui.tsx\";\n\nexport function ReportsPage({ user }: { user: any }) {\n  const [tab, setTab] = useState(\"exports\");\n  const [logs, setLogs] = useState<any[]>([]);\n  const [loading, setLoading] = useState(false);\n  const [logSearch, setLogSearch] = useState(\"\");\n  const [logModule, setLogModule] = useState(\"\");\n  const isAdmin = user.role === \"admin\";\n\n  const loadLogs = () => {\n    setLoading(true);\n    const filters: Record<string, string> = {};\n    if (logSearch) filters.user = logSearch;\n    if (logModule) filters.module = logModule;\n    audit.list(filters).then(data => setLogs(data.logs || [])).catch(() => {}).finally(() => setLoading(false));\n  };\n\n  useEffect(() => { if (tab === \"audit\" && isAdmin) loadLogs(); }, [tab, logSearch, logModule]);\n\n  return (\n    <div class=\"space-y-4\">\n      {/* Tabs */}\n      <div class=\"flex gap-2 border-b border-slate-200\">\n        <button onClick={() => setTab(\"exports\")} class={`px-4 py-2 text-sm font-medium ${tab === \"exports\" ? \"text-blue-600 border-b-2 border-blue-600\" : \"text-slate-500\"}`}>Export Reports</button>\n        {isAdmin && <button onClick={() => setTab(\"audit\")} class={`px-4 py-2 text-sm font-medium ${tab === \"audit\" ? \"text-blue-600 border-b-2 border-blue-600\" : \"text-slate-500\"}`}>Audit Log</button>}\n      </div>\n\n      {tab === \"exports\" && (\n        <div class=\"space-y-4\">\n          <p class=\"text-sm text-slate-500\">Export data from any module in CSV format (opens in Excel).</p>\n          <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4\">\n            <Card class=\"p-5 text-center\">\n              <div class=\"text-3xl mb-2\">📦</div>\n              <h4 class=\"font-semibold text-slate-700\">Inventory Report</h4>\n              <p class=\"text-xs text-slate-500 mt-1\">Complete DLP inventory with quantities and status</p>\n              <Button size=\"sm\" variant=\"outline\" className=\"mt-3 w-full\" onClick={() => downloadCSV(\"/api/inventory/export\", \"inventory_export.csv\")}>📥 Export CSV</Button>\n            </Card>\n            <Card class=\"p-5 text-center\">\n              <div class=\"text-3xl mb-2\">📝</div>\n              <h4 class=\"font-semibold text-slate-700\">Material Requests</h4>\n              <p class=\"text-xs text-slate-500 mt-1\">All material requests with status and details</p>\n              <Button size=\"sm\" variant=\"outline\" className=\"mt-3 w-full\" onClick={() => downloadCSV(\"/api/requests/export\", \"requests_export.csv\")}>📥 Export CSV</Button>\n            </Card>\n            <Card class=\"p-5 text-center\">\n              <div class=\"text-3xl mb-2\">📤</div>\n              <h4 class=\"font-semibold text-slate-700\">Material Issues</h4>\n              <p class=\"text-xs text-slate-500 mt-1\">Issued materials with trainset and NCR details</p>\n              <Button size=\"sm\" variant=\"outline\" className=\"mt-3 w-full\" onClick={() => downloadCSV(\"/api/issues/export\", \"issues_export.csv\")}>📥 Export CSV</Button>\n            </Card>\n            <Card class=\"p-5 text-center\">\n              <div class=\"text-3xl mb-2\">🚪</div>\n              <h4 class=\"font-semibold text-slate-700\">Gate Pass Report</h4>\n              <p class=\"text-xs text-slate-500 mt-1\">All gate passes with vendor and return status</p>\n              <Button size=\"sm\" variant=\"outline\" className=\"mt-3 w-full\" onClick={() => downloadCSV(\"/api/gatepass/export\", \"gatepass_export.csv\")}>📥 Export CSV</Button>\n            </Card>\n          </div>\n        </div>\n      )}\n\n      {tab === \"audit\" && isAdmin && (\n        <div class=\"space-y-4\">\n          <Card class=\"p-4\">\n            <div class=\"grid grid-cols-1 md:grid-cols-3 gap-3\">\n              <SearchBar value={logSearch} onChange={(e: any) => setLogSearch(e.target.value)} placeholder=\"Search by user...\" />\n              <Select label=\"\" value={logModule} onChange={(e: any) => setLogModule(e.target.value)} options={[\"auth\", \"inventory\", \"requests\", \"issues\", \"gatepass\", \"repairs\", \"settings\", \"users\"]} />\n            </div>\n          </Card>\n          <Card class=\"p-0\">\n            {loading ? <Loading /> : logs.length === 0 ? <EmptyState message=\"No audit logs found\" icon=\"📜\" /> : (\n              <Table headers={[\"User\", \"Action\", \"Module\", \"New Value\", \"Date\", \"IP\"]}>\n                {logs.map((l: any) => (\n                  <Tr key={l.id}>\n                    <Td class=\"font-medium\">{l.user_name}</Td>\n                    <Td><span class=\"font-mono text-xs bg-slate-100 px-2 py-0.5 rounded\">{l.action}</span></Td>\n                    <Td>{l.module}</Td>\n                    <Td class=\"text-xs max-w-xs truncate\">{l.new_value || \"-\"}</Td>\n                    <Td class=\"text-xs\">{new Date(l.date).toLocaleString(\"en-IN\")}</Td>\n                    <Td class=\"text-xs\">{l.ip || \"-\"}</Td>\n                  </Tr>\n                ))}\n              </Table>\n            )}\n          </Card>\n        </div>\n      )}\n    </div>\n  );\n}\n",[],[200,175,139],"c27eae41-dc96-4f16-a902-ea472d0568c6",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { repairs } from \"./api.ts\";\nimport { Card, Table, Tr, Td, Badge, Loading, EmptyState, SearchBar, Select, Button, Modal, Input, Textarea, DateInput, useToast } from \"./ui.tsx\";\n\nexport function RepairsPage({ user }: { user: any }) {\n  const [items, setItems] = useState<any[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [search, setSearch] = useState(\"\");\n  const [statusFilter, setStatusFilter] = useState(\"\");\n  const [showModal, setShowModal] = useState(false);\n  const [editModal, setEditModal] = useState<any>(null);\n  const [form, setForm] = useState({ part_number: \"\", material_name: \"\", vendor: \"\", expected_date: \"\", remarks: \"\" });\n  const { showToast, toastEl } = useToast();\n  const canEdit = user.role === \"admin\" || user.role === \"store\";\n\n  const load = () => {\n    setLoading(true);\n    const filters: Record<string, string> = {};\n    if (search) filters.search = search;\n    if (statusFilter) filters.status = statusFilter;\n    repairs.list(filters).then(data => setItems(data.items || [])).catch(() => {}).finally(() => setLoading(false));\n  };\n\n  useEffect(() => { const t = setTimeout(load, 300); return () => clearTimeout(t); }, [search, statusFilter]);\n\n  const handleCreate = () => {\n    if (!form.part_number && !form.material_name) { showToast(\"Part number or material name required\", \"error\"); return; }\n    repairs.create(form).then(() => { setShowModal(false); showToast(\"Repair record created\", \"success\"); setForm({ part_number: \"\", material_name: \"\", vendor: \"\", expected_date: \"\", remarks: \"\" }); load(); }).catch(e => showToast(e.message, \"error\"));\n  };\n\n  const handleUpdate = () => {\n    if (!editModal) return;\n    repairs.update(editModal.id, { repair_status: editModal.repair_status, received_date: editModal.received_date, inspection_result: editModal.inspection_result, remarks: editModal.remarks }).then(() => { setEditModal(null); showToast(\"Repair updated successfully! Inventory adjusted if received & accepted.\", \"success\"); load(); }).catch(e => showToast(e.message, \"error\"));\n  };\n\n  return (\n    <div class=\"space-y-4\">\n      {toastEl}\n      <div class=\"flex flex-wrap items-center justify-between gap-3\">\n        <h3 class=\"text-lg font-semibold text-slate-800\">Repair Tracking</h3>\n        {canEdit && <Button size=\"sm\" onClick={() => setShowModal(true)}>➕ New Repair Record</Button>}\n      </div>\n\n      <Card class=\"p-4\">\n        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n          <SearchBar value={search} onChange={(e: any) => setSearch(e.target.value)} placeholder=\"Search part no, material, vendor...\" />\n          <Select label=\"\" value={statusFilter} onChange={(e: any) => setStatusFilter(e.target.value)} options={[\"sent\", \"received\"]} />\n        </div>\n      </Card>\n\n      <Card class=\"p-0\">\n        {loading ? <Loading /> : items.length === 0 ? <EmptyState message=\"No repair records found\" icon=\"🔧\" /> : (\n          <Table headers={[\"Part No\", \"Material\", \"Vendor\", \"Status\", \"Expected Date\", \"Received Date\", \"Inspection\", \"Remarks\", \"Actions\"]}>\n            {items.map((r: any) => (\n              <Tr key={r.id}>\n                <Td class=\"font-mono text-xs\">{r.part_number}</Td>\n                <Td>{r.material_name}</Td>\n                <Td>{r.vendor}</Td>\n                <Td><Badge status={r.repair_status} /></Td>\n                <Td class=\"text-xs\">{r.expected_date ? new Date(r.expected_date).toLocaleDateString(\"en-IN\") : \"-\"}</Td>\n                <Td class=\"text-xs\">{r.received_date ? new Date(r.received_date).toLocaleDateString(\"en-IN\") : \"-\"}</Td>\n                <Td>{r.inspection_result ? <Badge status={r.inspection_result === \"accepted\" ? \"approved\" : \"rejected\"} /> : \"-\"}</Td>\n                <Td class=\"text-xs max-w-xs truncate\">{r.remarks || \"-\"}</Td>\n                <Td>{canEdit && <button onClick={() => setEditModal({ id: r.id, repair_status: r.repair_status, received_date: r.received_date || \"\", inspection_result: r.inspection_result || \"\", remarks: r.remarks || \"\" })} class=\"text-blue-600 text-xs font-medium hover:text-blue-700\">Update</button>}</Td>\n              </Tr>\n            ))}\n          </Table>\n        )}\n      </Card>\n\n      {/* Create Modal */}\n      <Modal open={showModal} onClose={() => setShowModal(false)} title=\"New Repair Record\" size=\"md\">\n        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n          <Input label=\"Part Number\" value={form.part_number} onChange={(e: any) => setForm({ ...form, part_number: e.target.value })} />\n          <Input label=\"Material Name\" value={form.material_name} onChange={(e: any) => setForm({ ...form, material_name: e.target.value })} />\n          <Input label=\"Vendor\" value={form.vendor} onChange={(e: any) => setForm({ ...form, vendor: e.target.value })} />\n          <DateInput label=\"Expected Return Date\" value={form.expected_date} onChange={(e: any) => setForm({ ...form, expected_date: e.target.value })} />\n          <Textarea label=\"Remarks\" value={form.remarks} onChange={(e: any) => setForm({ ...form, remarks: e.target.value })} className=\"md:col-span-2\" />\n        </div>\n        <div class=\"flex justify-end gap-2 mt-4\">\n          <Button variant=\"secondary\" onClick={() => setShowModal(false)}>Cancel</Button>\n          <Button onClick={handleCreate}>Create</Button>\n        </div>\n      </Modal>\n\n      {/* Edit Modal */}\n      <Modal open={!!editModal} onClose={() => setEditModal(null)} title=\"Update Repair Status\" size=\"md\">\n        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n          <div>\n            <label class=\"block text-sm font-medium text-slate-600 mb-1\">Repair Status</label>\n            <select value={editModal?.repair_status} onChange={(e: any) => setEditModal({ ...editModal, repair_status: e.target.value })} class=\"w-full px-3 py-2 border border-slate-300 rounded-lg text-sm bg-white\">\n              <option value=\"sent\">Sent for Repair</option>\n              <option value=\"received\">Received from Repair</option>\n            </select>\n          </div>\n          <div>\n            <label class=\"block text-sm font-medium text-slate-600 mb-1\">Inspection Result</label>\n            <select value={editModal?.inspection_result} onChange={(e: any) => setEditModal({ ...editModal, inspection_result: e.target.value })} class=\"w-full px-3 py-2 border border-slate-300 rounded-lg text-sm bg-white\">\n              <option value=\"\">Pending Inspection</option>\n              <option value=\"accepted\">Accepted (Return to Inventory)</option>\n              <option value=\"rejected\">Rejected (Send for Replacement)</option>\n            </select>\n          </div>\n          <DateInput label=\"Received Date\" value={editModal?.received_date} onChange={(e: any) => setEditModal({ ...editModal, received_date: e.target.value })} className=\"md:col-span-2\" />\n          <Textarea label=\"Remarks\" value={editModal?.remarks} onChange={(e: any) => setEditModal({ ...editModal, remarks: e.target.value })} className=\"md:col-span-2\" />\n        </div>\n        <div class=\"bg-blue-50 border border-blue-200 text-blue-700 text-xs px-3 py-2 rounded-lg mt-3\">\n          ℹ️ When status is \"Received\" and inspection is \"Accepted\", the item will be automatically added back to inventory.\n        </div>\n        <div class=\"flex justify-end gap-2 mt-4\">\n          <Button variant=\"secondary\" onClick={() => setEditModal(null)}>Cancel</Button>\n          <Button onClick={handleUpdate}>Update</Button>\n        </div>\n      </Modal>\n    </div>\n  );\n}\n",[],[200,175,133],"2a8dacfb-969a-4675-82e4-3979d21ce7dc",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport { auth, setToken, setStoredUser } from \"./api.ts\";\nimport { Button, Input } from \"./ui.tsx\";\n\nexport function Login({ onLogin }: { onLogin: () => void }) {\n  const [email, setEmail] = useState(\"\");\n  const [password, setPassword] = useState(\"\");\n  const [error, setError] = useState(\"\");\n  const [loading, setLoading] = useState(false);\n  const [showPwd, setShowPwd] = useState(false);\n\n  const handleSubmit = async (e: any) => {\n    e.preventDefault();\n    setError(\"\");\n    setLoading(true);\n    try {\n      const result = await auth.login(email, password);\n      setToken(result.token);\n      setStoredUser(result.user);\n      onLogin();\n    } catch (err: any) {\n      setError(err.message || \"Login failed\");\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  return (\n    <div class=\"min-h-screen flex items-center justify-center bg-gradient-to-br from-slate-900 via-blue-900 to-slate-800 p-4\">\n      <div class=\"absolute inset-0 overflow-hidden\">\n        <div class=\"absolute -top-40 -right-40 w-96 h-96 bg-blue-500/10 rounded-full blur-3xl\"></div>\n        <div class=\"absolute -bottom-40 -left-40 w-96 h-96 bg-indigo-500/10 rounded-full blur-3xl\"></div>\n      </div>\n\n      <div class=\"relative w-full max-w-md\">\n        <div class=\"bg-white rounded-2xl shadow-2xl overflow-hidden\">\n          {/* Header with BEML branding */}\n          <div class=\"bg-gradient-to-r from-blue-700 to-blue-900 p-8 text-center\">\n            <div class=\"inline-flex items-center justify-center w-16 h-16 bg-white/10 rounded-xl backdrop-blur-sm mb-4\">\n              <span class=\"text-white font-bold text-2xl\">BEML</span>\n            </div>\n            <h1 class=\"text-white text-xl font-bold\">BEML LIMITED</h1>\n            <p class=\"text-blue-200 text-sm mt-1\">KMRCL - Kolkata Metro Rail Corporation</p>\n            <div class=\"mt-4 pt-4 border-t border-white/20\">\n              <h2 class=\"text-white text-lg font-semibold\">DLP Store Inventory</h2>\n              <p class=\"text-blue-200 text-xs\">Management System</p>\n            </div>\n          </div>\n\n          {/* Login Form */}\n          <form onSubmit={handleSubmit} class=\"p-8 space-y-5\">\n            <div>\n              <label class=\"block text-sm font-medium text-slate-600 mb-1\">Email Address <span class=\"text-red-500\">*</span></label>\n              <input type=\"email\" value={email} onChange={e => setEmail(e.target.value)} required\n                placeholder=\"Enter your email\" autofocus\n                class=\"w-full px-4 py-3 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\" />\n            </div>\n\n            <div>\n              <label class=\"block text-sm font-medium text-slate-600 mb-1\">Password <span class=\"text-red-500\">*</span></label>\n              <div class=\"relative\">\n                <input type={showPwd ? \"text\" : \"password\"} value={password} onChange={e => setPassword(e.target.value)} required\n                  placeholder=\"Enter your password\"\n                  class=\"w-full px-4 py-3 pr-10 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\" />\n                <button type=\"button\" onClick={() => setShowPwd(!showPwd)}\n                  class=\"absolute right-3 top-3 text-slate-400 hover:text-slate-600\">\n                  {showPwd ? \"👁️\" : \"👁️‍🗨️\"}\n                </button>\n              </div>\n            </div>\n\n            {error && (\n              <div class=\"bg-red-50 border border-red-200 text-red-600 text-sm px-4 py-3 rounded-lg\">\n                {error}\n              </div>\n            )}\n\n            <Button type=\"submit\" disabled={loading} size=\"lg\" className=\"w-full\">\n              {loading ? \"Signing in...\" : \"Sign In\"}\n            </Button>\n\n            {/* Demo credentials */}\n            <div class=\"bg-slate-50 rounded-lg p-4 border border-slate-200\">\n              <p class=\"text-xs font-semibold text-slate-500 mb-2\">Demo Login Credentials:</p>\n              <div class=\"space-y-1 text-xs text-slate-500\">\n                <p>👤 Admin: <span class=\"font-mono text-blue-600\">admin@beml.in / admin123</span></p>\n                <p>🏪 Store: <span class=\"font-mono text-blue-600\">store@beml.in / store123</span></p>\n                <p>🔧 Officer: <span class=\"font-mono text-blue-600\">officer@beml.in / officer123</span></p>\n              </div>\n            </div>\n          </form>\n        </div>\n\n        <p class=\"text-center text-blue-200 text-xs mt-6\">\n          © {new Date().getFullYear()} BEML Limited. All rights reserved.\n        </p>\n      </div>\n    </div>\n  );\n}\n",[],[200,175,127],"3f89a5a7-e5fd-4d53-a643-853f2fc8c407",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { issues, requests, inventory, downloadCSV, openPrintPage } from \"./api.ts\";\nimport { Card, Table, Tr, Td, Badge, Loading, EmptyState, SearchBar, Select, Button, Modal, Input, Textarea, DateInput, useToast } from \"./ui.tsx\";\n\nexport function IssuesPage({ user }: { user: any }) {\n  const [items, setItems] = useState<any[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [search, setSearch] = useState(\"\");\n  const [statusFilter, setStatusFilter] = useState(\"\");\n  const [trainsetFilter, setTrainsetFilter] = useState(\"\");\n  const [dateFrom, setDateFrom] = useState(\"\");\n  const [dateTo, setDateTo] = useState(\"\");\n  const [showModal, setShowModal] = useState(false);\n  const [approvedReqs, setApprovedReqs] = useState<any[]>([]);\n  const [invItems, setInvItems] = useState<any[]>([]);\n  const [form, setForm] = useState({ request_id: \"\", officer_name: \"\", material_name: \"\", part_number: \"\", healthy_part: \"\", faulty_part: \"\", qty: 1, trainset: \"\", car: \"\", ncr: \"\", jobcard: \"\", reason: \"\", inventory_item_id: \"\", issued_to: \"\" });\n  const { showToast, toastEl } = useToast();\n  const canIssue = user.role === \"admin\" || user.role === \"store\";\n\n  const load = () => {\n    setLoading(true);\n    const filters: Record<string, string> = {};\n    if (search) filters.search = search;\n    if (statusFilter) filters.status = statusFilter;\n    if (trainsetFilter) filters.trainset = trainsetFilter;\n    if (dateFrom) filters.dateFrom = dateFrom;\n    if (dateTo) filters.dateTo = dateTo;\n    issues.list(filters).then(data => setItems(data.items || [])).catch(() => {}).finally(() => setLoading(false));\n  };\n\n  useEffect(() => { const t = setTimeout(load, 300); return () => clearTimeout(t); }, [search, statusFilter, trainsetFilter, dateFrom, dateTo]);\n\n  const openIssueModal = () => {\n    requests.list({ status: \"approved\" }).then(data => { setApprovedReqs(data.items || []); return inventory.list(); }).then(data => setInvItems(data.items || []));\n    setForm({ request_id: \"\", officer_name: \"\", material_name: \"\", part_number: \"\", healthy_part: \"\", faulty_part: \"\", qty: 1, trainset: \"\", car: \"\", ncr: \"\", jobcard: \"\", reason: \"\", inventory_item_id: \"\", issued_to: \"\" });\n    setShowModal(true);\n  };\n\n  const selectRequest = (reqId: string) => {\n    const req = approvedReqs.find(r => r.id == reqId);\n    if (req) setForm({ ...form, request_id: reqId, officer_name: req.officer_name, material_name: req.material_name, part_number: req.part_number, qty: req.qty, trainset: req.trainset, car: req.car, ncr: req.ncr, jobcard: req.jobcard, reason: req.reason });\n  };\n\n  const selectInventory = (invId: string) => {\n    const inv = invItems.find(i => i.id == invId);\n    if (inv) setForm({ ...form, inventory_item_id: invId, material_name: inv.material_name, part_number: inv.part_number });\n  };\n\n  const handleSubmit = () => {\n    if (!form.material_name) { showToast(\"Material name required\", \"error\"); return; }\n    issues.create(form).then(() => { setShowModal(false); showToast(\"Material issued successfully! Inventory updated.\", \"success\"); load(); }).catch(e => showToast(e.message, \"error\"));\n  };\n\n  return (\n    <div class=\"space-y-4\">\n      {toastEl}\n      <div class=\"flex flex-wrap items-center justify-between gap-3\">\n        <h3 class=\"text-lg font-semibold text-slate-800\">Material Issues</h3>\n        <div class=\"flex gap-2\">\n          <Button size=\"sm\" variant=\"outline\" onClick={() => downloadCSV(\"/api/issues/export\", \"issues_export.csv\")}>📥 Export</Button>\n          {canIssue && <Button size=\"sm\" onClick={openIssueModal}>➕ Issue Material</Button>}\n        </div>\n      </div>\n\n      <Card class=\"p-4\">\n        <div class=\"grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-3\">\n          <SearchBar value={search} onChange={(e: any) => setSearch(e.target.value)} placeholder=\"Search issue no, material...\" />\n          <Select label=\"\" value={statusFilter} onChange={(e: any) => setStatusFilter(e.target.value)} options={[\"issued\", \"returned\", \"closed\"]} />\n          <input type=\"text\" value={trainsetFilter} onChange={(e: any) => setTrainsetFilter(e.target.value)} placeholder=\"Trainset No\" class=\"px-3 py-2 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500\" />\n          <DateInput label=\"\" value={dateFrom} onChange={(e: any) => setDateFrom(e.target.value)} />\n          <DateInput label=\"\" value={dateTo} onChange={(e: any) => setDateTo(e.target.value)} />\n        </div>\n      </Card>\n\n      <Card class=\"p-0\">\n        {loading ? <Loading /> : items.length === 0 ? <EmptyState message=\"No material issues found\" icon=\"📤\" /> : (\n          <Table headers={[\"Issue No\", \"Officer\", \"Material\", \"Part No\", \"Healthy\", \"Faulty\", \"Qty\", \"Trainset\", \"NCR\", \"Issued By\", \"Date\", \"Print\"]}>\n            {items.map((i: any) => (\n              <Tr key={i.id}>\n                <Td class=\"font-mono text-xs\">{i.issue_no}</Td>\n                <Td>{i.officer_name}</Td>\n                <Td class=\"font-medium\">{i.material_name}</Td>\n                <Td class=\"font-mono text-xs\">{i.part_number}</Td>\n                <Td class=\"text-xs\">{i.healthy_part || \"-\"}</Td>\n                <Td class=\"text-xs\">{i.faulty_part || \"-\"}</Td>\n                <Td>{i.qty}</Td>\n                <Td>{i.trainset || \"-\"}</Td>\n                <Td class=\"text-xs\">{i.ncr || \"-\"}</Td>\n                <Td class=\"text-xs\">{i.issued_by}</Td>\n                <Td class=\"text-xs\">{new Date(i.issue_date).toLocaleDateString(\"en-IN\")}</Td>\n                <Td><button onClick={() => openPrintPage(`/api/issues/${i.id}/print`)} class=\"text-blue-600 hover:text-blue-700 text-xs font-medium\">📄 Print</button></Td>\n              </Tr>\n            ))}\n          </Table>\n        )}\n      </Card>\n\n      <Modal open={showModal} onClose={() => setShowModal(false)} title=\"Issue Material\" size=\"lg\">\n        <div class=\"space-y-3\">\n          {approvedReqs.length > 0 && (\n            <div>\n              <label class=\"block text-sm font-medium text-slate-600 mb-1\">Select Approved Request (optional)</label>\n              <select value={form.request_id} onChange={(e: any) => selectRequest(e.target.value)} class=\"w-full px-3 py-2 border border-slate-300 rounded-lg text-sm bg-white\">\n                <option value=\"\">-- Select Request --</option>\n                {approvedReqs.map((r: any) => <option value={r.id}>{r.request_no} - {r.material_name} ({r.officer_name})</option>)}\n              </select>\n            </div>\n          )}\n          {invItems.length > 0 && (\n            <div>\n              <label class=\"block text-sm font-medium text-slate-600 mb-1\">Select from Inventory (optional)</label>\n              <select value={form.inventory_item_id} onChange={(e: any) => selectInventory(e.target.value)} class=\"w-full px-3 py-2 border border-slate-300 rounded-lg text-sm bg-white\">\n                <option value=\"\">-- Select Inventory Item --</option>\n                {invItems.filter((i: any) => i.available_qty > 0).map((i: any) => <option value={i.id}>{i.material_name} - {i.part_number} (Avail: {i.available_qty})</option>)}\n              </select>\n            </div>\n          )}\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n            <Input label=\"Officer Name\" value={form.officer_name} onChange={(e: any) => setForm({ ...form, officer_name: e.target.value })} required />\n            <Input label=\"Material Name\" value={form.material_name} onChange={(e: any) => setForm({ ...form, material_name: e.target.value })} required />\n            <Input label=\"Part Number\" value={form.part_number} onChange={(e: any) => setForm({ ...form, part_number: e.target.value })} />\n            <Input label=\"Quantity\" type=\"number\" value={form.qty} onChange={(e: any) => setForm({ ...form, qty: parseInt(e.target.value) || 1 })} />\n            <Input label=\"Healthy Part Number\" value={form.healthy_part} onChange={(e: any) => setForm({ ...form, healthy_part: e.target.value })} />\n            <Input label=\"Faulty Part Number\" value={form.faulty_part} onChange={(e: any) => setForm({ ...form, faulty_part: e.target.value })} />\n            <Input label=\"Trainset Number\" value={form.trainset} onChange={(e: any) => setForm({ ...form, trainset: e.target.value })} />\n            <Input label=\"Car Number\" value={form.car} onChange={(e: any) => setForm({ ...form, car: e.target.value })} />\n            <Input label=\"NCR Number\" value={form.ncr} onChange={(e: any) => setForm({ ...form, ncr: e.target.value })} />\n            <Input label=\"Job Card Number\" value={form.jobcard} onChange={(e: any) => setForm({ ...form, jobcard: e.target.value })} />\n            <Input label=\"Issued To\" value={form.issued_to} onChange={(e: any) => setForm({ ...form, issued_to: e.target.value })} />\n            <Textarea label=\"Reason\" value={form.reason} onChange={(e: any) => setForm({ ...form, reason: e.target.value })} className=\"md:col-span-2\" />\n          </div>\n        </div>\n        <div class=\"flex justify-end gap-2 mt-4\">\n          <Button variant=\"secondary\" onClick={() => setShowModal(false)}>Cancel</Button>\n          <Button variant=\"success\" onClick={handleSubmit}>Issue Material</Button>\n        </div>\n      </Modal>\n    </div>\n  );\n}\n",[],[200,175,121],"dd4d8ad4-6b52-41d0-bfce-5c627e592ca2",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { inventory, downloadCSV } from \"./api.ts\";\nimport { Card, Table, Tr, Td, Badge, Loading, EmptyState, SearchBar, Select, Button, useToast } from \"./ui.tsx\";\n\nexport function InventoryPage({ user }: { user: any }) {\n  const [items, setItems] = useState<any[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [search, setSearch] = useState(\"\");\n  const [statusFilter, setStatusFilter] = useState(\"\");\n  const [oemFilter, setOemFilter] = useState(\"\");\n  const [trainsetFilter, setTrainsetFilter] = useState(\"\");\n  const [syncing, setSyncing] = useState(false);\n  const { showToast, toastEl } = useToast();\n  const canSync = user.role === \"admin\" || user.role === \"store\";\n\n  const loadItems = () => {\n    setLoading(true);\n    const filters: Record<string, string> = {};\n    if (search) filters.search = search;\n    if (statusFilter) filters.status = statusFilter;\n    if (oemFilter) filters.oem = oemFilter;\n    if (trainsetFilter) filters.trainset = trainsetFilter;\n    inventory.list(filters).then(data => setItems(data.items || [])).catch(() => showToast(\"Failed to load inventory\", \"error\")).finally(() => setLoading(false));\n  };\n\n  useEffect(() => { const t = setTimeout(loadItems, 300); return () => clearTimeout(t); }, [search, statusFilter, oemFilter, trainsetFilter]);\n\n  const handleSync = () => {\n    setSyncing(true);\n    inventory.sync().then(r => { showToast(r.message, r.success ? \"success\" : \"error\"); if (r.success) loadItems(); }).catch(e => showToast(e.message, \"error\")).finally(() => setSyncing(false));\n  };\n\n  const oems = [...new Set(items.map(i => i.oem).filter(Boolean))];\n\n  return (\n    <div class=\"space-y-4\">\n      {toastEl}\n      <div class=\"flex flex-wrap items-center justify-between gap-3\">\n        <h3 class=\"text-lg font-semibold text-slate-800\">DLP Store Inventory</h3>\n        <div class=\"flex gap-2\">\n          <Button size=\"sm\" variant=\"outline\" onClick={() => downloadCSV(\"/api/inventory/export\", \"inventory_export.csv\")}>📥 Export CSV</Button>\n          {canSync && <Button size=\"sm\" onClick={handleSync} disabled={syncing}>{syncing ? \"Syncing...\" : \"🔄 Sync from Sheets\"}</Button>}\n        </div>\n      </div>\n\n      <Card class=\"p-4\">\n        <div class=\"grid grid-cols-1 md:grid-cols-4 gap-3\">\n          <SearchBar value={search} onChange={(e: any) => setSearch(e.target.value)} placeholder=\"Search material, part no, OEM...\" />\n          <Select label=\"\" value={statusFilter} onChange={(e: any) => setStatusFilter(e.target.value)} options={[\"available\", \"issued\", \"repair\", \"replacement\"]} />\n          <Select label=\"\" value={oemFilter} onChange={(e: any) => setOemFilter(e.target.value)} options={oems.map(o => ({ value: o, label: o }))} />\n          <input type=\"text\" value={trainsetFilter} onChange={(e: any) => setTrainsetFilter(e.target.value)} placeholder=\"Filter by Trainset\" class=\"px-3 py-2 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500\" />\n        </div>\n      </Card>\n\n      <Card class=\"p-0\">\n        {loading ? <Loading /> : items.length === 0 ? <EmptyState message=\"No inventory items found. Sync from Google Sheets to load data.\" icon=\"📦\" /> : (\n          <Table headers={[\"Item ID\", \"OEM\", \"System\", \"Material\", \"Part No\", \"Qty\", \"Avail\", \"Repair\", \"Status\", \"Vendor\"]}>\n            {items.map((item: any) => (\n              <Tr key={item.id}>\n                <Td class=\"font-mono text-xs\">{item.item_id}</Td>\n                <Td>{item.oem}</Td>\n                <Td>{item.system}</Td>\n                <Td class=\"font-medium\">{item.material_name}</Td>\n                <Td class=\"font-mono text-xs\">{item.part_number}</Td>\n                <Td>{item.qty}</Td>\n                <Td><span class={item.available_qty > 0 ? \"text-green-600 font-medium\" : \"text-red-600\"}>{item.available_qty}</span></Td>\n                <Td>{item.repair_qty || 0}</Td>\n                <Td><Badge status={item.status} /></Td>\n                <Td class=\"text-xs\">{item.vendor}</Td>\n              </Tr>\n            ))}\n          </Table>\n        )}\n      </Card>\n      {items.length > 0 && <p class=\"text-sm text-slate-500 text-center\">Showing {items.length} items</p>}\n    </div>\n  );\n}\n",[],[200,175,115],"6d1e2da4-815e-4e82-8b23-ac6eb5f0a6aa",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { gatepass, issues, downloadCSV, openPrintPage } from \"./api.ts\";\nimport { Card, Table, Tr, Td, Badge, Loading, EmptyState, SearchBar, Select, Button, Modal, Input, Textarea, DateInput, useToast } from \"./ui.tsx\";\n\nexport function GatePassPage({ user }: { user: any }) {\n  const [items, setItems] = useState<any[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [search, setSearch] = useState(\"\");\n  const [statusFilter, setStatusFilter] = useState(\"\");\n  const [dateFrom, setDateFrom] = useState(\"\");\n  const [dateTo, setDateTo] = useState(\"\");\n  const [showModal, setShowModal] = useState(false);\n  const [issuedItems, setIssuedItems] = useState<any[]>([]);\n  const [form, setForm] = useState({ issue_id: \"\", vendor_name: \"\", vendor_address: \"\", vehicle_no: \"\", driver_name: \"\", material_details: \"\", expected_return_date: \"\" });\n  const { showToast, toastEl } = useToast();\n  const canGenerate = user.role === \"admin\" || user.role === \"store\";\n\n  const load = () => {\n    setLoading(true);\n    const filters: Record<string, string> = {};\n    if (search) filters.search = search;\n    if (statusFilter) filters.status = statusFilter;\n    if (dateFrom) filters.dateFrom = dateFrom;\n    if (dateTo) filters.dateTo = dateTo;\n    gatepass.list(filters).then(data => setItems(data.items || [])).catch(() => {}).finally(() => setLoading(false));\n  };\n\n  useEffect(() => { const t = setTimeout(load, 300); return () => clearTimeout(t); }, [search, statusFilter, dateFrom, dateTo]);\n\n  const openModal = () => {\n    issues.list().then(data => setIssuedItems(data.items || []));\n    setForm({ issue_id: \"\", vendor_name: \"\", vendor_address: \"\", vehicle_no: \"\", driver_name: \"\", material_details: \"\", expected_return_date: \"\" });\n    setShowModal(true);\n  };\n\n  const selectIssue = (issueId: string) => {\n    const iss = issuedItems.find(i => i.id == issueId);\n    if (iss) {\n      const details = JSON.stringify([{ material_name: iss.material_name, part_number: iss.part_number, qty: iss.qty, condition: \"Faulty\" }]);\n      setForm({ ...form, issue_id: issueId, material_details: details });\n    }\n  };\n\n  const handleSubmit = () => {\n    if (!form.vendor_name) { showToast(\"Vendor name required\", \"error\"); return; }\n    gatepass.create(form).then(() => { setShowModal(false); showToast(\"Gate Pass generated successfully!\", \"success\"); load(); }).catch(e => showToast(e.message, \"error\"));\n  };\n\n  return (\n    <div class=\"space-y-4\">\n      {toastEl}\n      <div class=\"flex flex-wrap items-center justify-between gap-3\">\n        <h3 class=\"text-lg font-semibold text-slate-800\">Gate Pass</h3>\n        <div class=\"flex gap-2\">\n          <Button size=\"sm\" variant=\"outline\" onClick={() => downloadCSV(\"/api/gatepass/export\", \"gatepass_export.csv\")}>📥 Export</Button>\n          {canGenerate && <Button size=\"sm\" onClick={openModal}>➕ Generate Gate Pass</Button>}\n        </div>\n      </div>\n\n      {!canGenerate && <div class=\"bg-blue-50 border border-blue-200 text-blue-700 text-sm px-4 py-3 rounded-lg\">ℹ️ Only Store Person and Admin can generate Gate Pass.</div>}\n\n      <Card class=\"p-4\">\n        <div class=\"grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-3\">\n          <SearchBar value={search} onChange={(e: any) => setSearch(e.target.value)} placeholder=\"Search gate pass no, vendor...\" />\n          <Select label=\"\" value={statusFilter} onChange={(e: any) => setStatusFilter(e.target.value)} options={[\"open\", \"closed\"]} />\n          <DateInput label=\"\" value={dateFrom} onChange={(e: any) => setDateFrom(e.target.value)} />\n          <DateInput label=\"\" value={dateTo} onChange={(e: any) => setDateTo(e.target.value)} />\n        </div>\n      </Card>\n\n      <Card class=\"p-0\">\n        {loading ? <Loading /> : items.length === 0 ? <EmptyState message=\"No gate passes found\" icon=\"🚪\" /> : (\n          <Table headers={[\"Gate Pass No\", \"Vendor\", \"Vehicle\", \"Driver\", \"Issue Date\", \"Expected Return\", \"Status\", \"Generated By\", \"Print\"]}>\n            {items.map((g: any) => (\n              <Tr key={g.id}>\n                <Td class=\"font-mono text-xs\">{g.gatepass_no}</Td>\n                <Td>{g.vendor_name}</Td>\n                <Td>{g.vehicle_no || \"-\"}</Td>\n                <Td>{g.driver_name || \"-\"}</Td>\n                <Td class=\"text-xs\">{new Date(g.issue_date).toLocaleDateString(\"en-IN\")}</Td>\n                <Td class=\"text-xs\">{g.expected_return_date ? new Date(g.expected_return_date).toLocaleDateString(\"en-IN\") : \"-\"}</Td>\n                <Td><Badge status={g.status} /></Td>\n                <Td class=\"text-xs\">{g.generated_by}</Td>\n                <Td><button onClick={() => openPrintPage(`/api/gatepass/${g.id}/print`)} class=\"text-blue-600 hover:text-blue-700 text-xs font-medium\">📄 Print</button></Td>\n              </Tr>\n            ))}\n          </Table>\n        )}\n      </Card>\n\n      <Modal open={showModal} onClose={() => setShowModal(false)} title=\"Generate Gate Pass\" size=\"lg\">\n        <div class=\"space-y-3\">\n          {issuedItems.length > 0 && (\n            <div>\n              <label class=\"block text-sm font-medium text-slate-600 mb-1\">Select Issue (optional)</label>\n              <select value={form.issue_id} onChange={(e: any) => selectIssue(e.target.value)} class=\"w-full px-3 py-2 border border-slate-300 rounded-lg text-sm bg-white\">\n                <option value=\"\">-- Select Issue --</option>\n                {issuedItems.map((i: any) => <option value={i.id}>{i.issue_no} - {i.material_name} ({i.officer_name})</option>)}\n              </select>\n            </div>\n          )}\n          <div class=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n            <Input label=\"Vendor Name\" value={form.vendor_name} onChange={(e: any) => setForm({ ...form, vendor_name: e.target.value })} required />\n            <Input label=\"Vehicle Number\" value={form.vehicle_no} onChange={(e: any) => setForm({ ...form, vehicle_no: e.target.value })} />\n            <Input label=\"Driver Name\" value={form.driver_name} onChange={(e: any) => setForm({ ...form, driver_name: e.target.value })} />\n            <DateInput label=\"Expected Return Date\" value={form.expected_return_date} onChange={(e: any) => setForm({ ...form, expected_return_date: e.target.value })} />\n            <Textarea label=\"Vendor Address\" value={form.vendor_address} onChange={(e: any) => setForm({ ...form, vendor_address: e.target.value })} className=\"md:col-span-2\" />\n            <Textarea label=\"Material Details (JSON format)\" value={form.material_details} onChange={(e: any) => setForm({ ...form, material_details: e.target.value })} className=\"md:col-span-2\" rows={3} />\n          </div>\n        </div>\n        <div class=\"flex justify-end gap-2 mt-4\">\n          <Button variant=\"secondary\" onClick={() => setShowModal(false)}>Cancel</Button>\n          <Button onClick={handleSubmit}>Generate Gate Pass</Button>\n        </div>\n      </Modal>\n    </div>\n  );\n}\n",[],[200,175,109],"9c39684d-a218-48c6-a41d-b10546bd818b",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect, ReactNode } from \"https://esm.sh/react@18.2.0\";\nimport { dashboard as dashboardApi } from \"./api.ts\";\nimport { Card, StatCard, Loading, Badge, Button } from \"./ui.tsx\";\nimport { InventoryPage } from \"./InventoryPage.tsx\";\nimport { RequestsPage } from \"./RequestsPage.tsx\";\nimport { IssuesPage } from \"./IssuesPage.tsx\";\nimport { GatePassPage } from \"./GatePassPage.tsx\";\nimport { RepairsPage } from \"./RepairsPage.tsx\";\nimport { ReportsPage } from \"./ReportsPage.tsx\";\nimport { UsersPage } from \"./UsersPage.tsx\";\nimport { SettingsPage } from \"./SettingsPage.tsx\";\n\nconst navItems = [\n  { hash: \"#/dashboard\", label: \"Dashboard\", icon: \"📊\", roles: [\"admin\", \"store\", \"officer\", \"viewer\"] },\n  { hash: \"#/inventory\", label: \"Inventory\", icon: \"📦\", roles: [\"admin\", \"store\", \"officer\", \"viewer\"] },\n  { hash: \"#/requests\", label: \"Material Requests\", icon: \"📝\", roles: [\"admin\", \"store\", \"officer\", \"viewer\"] },\n  { hash: \"#/issues\", label: \"Material Issues\", icon: \"📤\", roles: [\"admin\", \"store\", \"officer\", \"viewer\"] },\n  { hash: \"#/gatepass\", label: \"Gate Pass\", icon: \"🚪\", roles: [\"admin\", \"store\", \"officer\", \"viewer\"] },\n  { hash: \"#/repairs\", label: \"Repair Tracking\", icon: \"🔧\", roles: [\"admin\", \"store\", \"officer\", \"viewer\"] },\n  { hash: \"#/reports\", label: \"Reports & Export\", icon: \"📈\", roles: [\"admin\", \"store\", \"officer\", \"viewer\"] },\n  { hash: \"#/users\", label: \"User Management\", icon: \"👥\", roles: [\"admin\"] },\n  { hash: \"#/settings\", label: \"Settings\", icon: \"⚙️\", roles: [\"admin\"] },\n];\n\nfunction getRoute(): string {\n  return window.location.hash || \"#/dashboard\";\n}\n\nexport function Dashboard({ user, onLogout }: { user: any; onLogout: () => void }) {\n  const [route, setRoute] = useState(getRoute());\n  const [sidebarOpen, setSidebarOpen] = useState(false);\n\n  useEffect(() => {\n    const onHash = () => { setRoute(getRoute()); setSidebarOpen(false); };\n    window.addEventListener(\"hashchange\", onHash);\n    if (!window.location.hash) window.location.hash = \"#/dashboard\";\n    return () => window.removeEventListener(\"hashchange\", onHash);\n  }, []);\n\n  const visibleNav = navItems.filter(n => n.roles.includes(user.role));\n  const currentNav = visibleNav.find(n => n.hash === route) || visibleNav[0];\n\n  const renderPage = (): ReactNode => {\n    switch (route) {\n      case \"#/inventory\": return <InventoryPage user={user} />;\n      case \"#/requests\": return <RequestsPage user={user} />;\n      case \"#/issues\": return <IssuesPage user={user} />;\n      case \"#/gatepass\": return <GatePassPage user={user} />;\n      case \"#/repairs\": return <RepairsPage user={user} />;\n      case \"#/reports\": return <ReportsPage user={user} />;\n      case \"#/users\": return <UsersPage user={user} />;\n      case \"#/settings\": return <SettingsPage user={user} />;\n      default: return <DashboardHome user={user} />;\n    }\n  };\n\n  return (\n    <div class=\"min-h-screen bg-slate-50 flex\">\n      {sidebarOpen && <div class=\"fixed inset-0 bg-black/50 z-30 lg:hidden\" onClick={() => setSidebarOpen(false)} />}\n      <aside class={`fixed lg:sticky top-0 left-0 h-screen w-64 bg-slate-900 text-white z-40 transform transition-transform duration-200 ${sidebarOpen ? \"translate-x-0\" : \"-translate-x-full lg:translate-x-0\"} flex flex-col`}>\n        <div class=\"p-5 border-b border-slate-700 flex items-center gap-3\">\n          <div class=\"w-10 h-10 bg-blue-600 rounded-lg flex items-center justify-center font-bold text-sm\">BEML</div>\n          <div><h1 class=\"font-bold text-sm\">BEML LIMITED</h1><p class=\"text-xs text-slate-400\">KMRCL DLP System</p></div>\n        </div>\n        <nav class=\"flex-1 overflow-y-auto py-4 px-3 space-y-1\">\n          {visibleNav.map(item => (\n            <a key={item.hash} href={item.hash}\n              class={`flex items-center gap-3 px-3 py-2.5 rounded-lg text-sm font-medium transition-colors ${route === item.hash ? \"bg-blue-600 text-white\" : \"text-slate-300 hover:bg-slate-800 hover:text-white\"}`}>\n              <span class=\"text-lg\">{item.icon}</span><span>{item.label}</span>\n            </a>\n          ))}\n        </nav>\n        <div class=\"p-3 border-t border-slate-700\">\n          <div class=\"flex items-center gap-3 px-3 py-2\">\n            <div class=\"w-8 h-8 bg-slate-700 rounded-full flex items-center justify-center text-xs font-bold\">{user.name?.charAt(0)?.toUpperCase()}</div>\n            <div class=\"flex-1 min-w-0\"><p class=\"text-sm font-medium truncate\">{user.name}</p><p class=\"text-xs text-slate-400 capitalize\">{user.role}</p></div>\n          </div>\n          <button onClick={onLogout} class=\"w-full mt-2 px-3 py-2 rounded-lg text-sm text-slate-300 hover:bg-red-600 hover:text-white transition-colors text-left flex items-center gap-2\"><span>🚪</span> Logout</button>\n        </div>\n      </aside>\n      <div class=\"flex-1 flex flex-col min-w-0\">\n        <header class=\"bg-white border-b border-slate-200 sticky top-0 z-20\">\n          <div class=\"flex items-center justify-between px-4 lg:px-6 py-3\">\n            <div class=\"flex items-center gap-3\">\n              <button onClick={() => setSidebarOpen(true)} class=\"lg:hidden text-slate-600 text-xl\">☰</button>\n              <h2 class=\"text-lg font-semibold text-slate-800\">{currentNav?.label || \"Dashboard\"}</h2>\n            </div>\n            <div class=\"flex items-center gap-3\">\n              <a href=\"/source\" class=\"text-xs text-slate-400 hover:text-slate-600 hidden sm:inline\">View Source</a>\n              <span class=\"text-sm font-medium text-slate-700 hidden sm:inline\">{user.name}</span>\n              <div class=\"w-8 h-8 bg-blue-600 rounded-full flex items-center justify-center text-white text-xs font-bold\">{user.name?.charAt(0)?.toUpperCase()}</div>\n            </div>\n          </div>\n        </header>\n        <main class=\"flex-1 p-4 lg:p-6 overflow-x-hidden\">{renderPage()}</main>\n      </div>\n    </div>\n  );\n}\n\nfunction DashboardHome({ user }: { user: any }) {\n  const [stats, setStats] = useState<any>(null);\n  const [settings, setSettings] = useState<any>(null);\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => {\n    dashboardApi.get().then(data => { setStats(data.stats); setSettings(data.settings); }).catch(() => {}).finally(() => setLoading(false));\n  }, []);\n\n  if (loading) return <Loading />;\n  const s: any = stats || {};\n  const role = user.role;\n\n  return (\n    <div class=\"space-y-6\">\n      <div class=\"bg-gradient-to-r from-blue-600 to-blue-800 rounded-xl p-6 text-white\">\n        <h1 class=\"text-xl font-bold\">Welcome, {user.name}!</h1>\n        <p class=\"text-blue-200 text-sm mt-1\">BEML-KMRCL DLP Store Inventory Management System</p>\n        <p class=\"text-blue-200 text-xs mt-2\">{settings?.company_division || \"KMRCL\"}</p>\n      </div>\n      <div class=\"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4\">\n        <StatCard title=\"Total Items\" value={s.total} icon=\"📦\" color=\"blue\" />\n        <StatCard title=\"Available\" value={s.available} icon=\"✅\" color=\"green\" />\n        <StatCard title=\"Issued\" value={s.issued} icon=\"📤\" color=\"red\" />\n        <StatCard title=\"In Repair\" value={s.repair} icon=\"🔧\" color=\"yellow\" />\n        <StatCard title=\"Open Requests\" value={s.open_requests} icon=\"📝\" color=\"orange\" />\n        <StatCard title=\"Pending Repairs\" value={s.pending_repair} icon=\"⚙️\" color=\"purple\" />\n        <StatCard title=\"Open Gate Pass\" value={s.open_gatepass} icon=\"🚪\" color=\"orange\" />\n        <StatCard title=\"Today's Issues\" value={s.today_issues} icon=\"📅\" color=\"blue\" />\n      </div>\n      <div class=\"grid grid-cols-2 md:grid-cols-4 gap-3\">\n        <a href=\"#/inventory\" class=\"bg-white rounded-xl p-4 border border-slate-200 hover:shadow-md transition-shadow text-center\"><div class=\"text-2xl mb-2\">📦</div><p class=\"text-sm font-medium text-slate-700\">View Inventory</p></a>\n        <a href=\"#/requests\" class=\"bg-white rounded-xl p-4 border border-slate-200 hover:shadow-md transition-shadow text-center\"><div class=\"text-2xl mb-2\">📝</div><p class=\"text-sm font-medium text-slate-700\">Material Request</p></a>\n        {(role === \"admin\" || role === \"store\") && <a href=\"#/issues\" class=\"bg-white rounded-xl p-4 border border-slate-200 hover:shadow-md transition-shadow text-center\"><div class=\"text-2xl mb-2\">📤</div><p class=\"text-sm font-medium text-slate-700\">Issue Material</p></a>}\n        {(role === \"admin\" || role === \"store\") && <a href=\"#/gatepass\" class=\"bg-white rounded-xl p-4 border border-slate-200 hover:shadow-md transition-shadow text-center\"><div class=\"text-2xl mb-2\">🚪</div><p class=\"text-sm font-medium text-slate-700\">Gate Pass</p></a>}\n        <a href=\"#/reports\" class=\"bg-white rounded-xl p-4 border border-slate-200 hover:shadow-md transition-shadow text-center\"><div class=\"text-2xl mb-2\">📈</div><p class=\"text-sm font-medium text-slate-700\">Reports</p></a>\n      </div>\n      {settings && (\n        <Card class=\"p-4\">\n          <div class=\"flex items-center justify-between flex-wrap gap-3\">\n            <div>\n              <p class=\"text-sm font-medium text-slate-700\">Google Sheets Sync Status</p>\n              <p class=\"text-xs text-slate-500 mt-1\">{settings.google_sheet_id ? <>Last Sync: {settings.last_sync ? new Date(settings.last_sync).toLocaleString(\"en-IN\") : \"Never synced\"}</> : \"Not configured - Admin needs to set Google Sheet ID in Settings\"}</p>\n            </div>\n            {(role === \"admin\" || role === \"store\") && settings.google_sheet_id && (\n              <Button size=\"sm\" variant=\"outline\" onClick={() => { import(\"./api.ts\").then(m => { m.inventory.sync().then((r: any) => { alert(r.message); window.location.reload(); }).catch((e: any) => alert(e.message)); }); }}>🔄 Sync Now</Button>\n            )}\n          </div>\n        </Card>\n      )}\n      <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n        <Card class=\"p-4\">\n          <h3 class=\"font-semibold text-slate-700 mb-3\">Request Summary</h3>\n          <div class=\"space-y-2\">\n            <div class=\"flex justify-between text-sm\"><span class=\"text-slate-500\">Pending</span><span class=\"font-medium text-yellow-600\">{s.open_requests || 0}</span></div>\n            <div class=\"flex justify-between text-sm\"><span class=\"text-slate-500\">Approved</span><span class=\"font-medium text-green-600\">{s.approved_requests || 0}</span></div>\n            <div class=\"flex justify-between text-sm\"><span class=\"text-slate-500\">Rejected</span><span class=\"font-medium text-red-600\">{s.rejected_requests || 0}</span></div>\n            <div class=\"flex justify-between text-sm\"><span class=\"text-slate-500\">Issued</span><span class=\"font-medium text-blue-600\">{s.issued_requests || 0}</span></div>\n            <div class=\"flex justify-between text-sm border-t pt-2\"><span class=\"font-medium\">Total</span><span class=\"font-bold\">{s.total_requests || 0}</span></div>\n          </div>\n        </Card>\n        <Card class=\"p-4\">\n          <h3 class=\"font-semibold text-slate-700 mb-3\">Inventory Summary</h3>\n          <div class=\"space-y-2\">\n            <div class=\"flex justify-between text-sm\"><span class=\"text-slate-500\">Available Qty</span><span class=\"font-medium text-green-600\">{s.total_available_qty || 0}</span></div>\n            <div class=\"flex justify-between text-sm\"><span class=\"text-slate-500\">Issued Qty</span><span class=\"font-medium text-red-600\">{s.total_issued_qty || 0}</span></div>\n            <div class=\"flex justify-between text-sm\"><span class=\"text-slate-500\">Repair Qty</span><span class=\"font-medium text-blue-600\">{s.total_repair_qty || 0}</span></div>\n            <div class=\"flex justify-between text-sm border-t pt-2\"><span class=\"font-medium\">Replacement</span><span class=\"font-bold text-purple-600\">{s.replacement || 0}</span></div>\n          </div>\n        </Card>\n      </div>\n    </div>\n  );\n}\n",[],[200,175,103],"2b0d963b-a414-434c-9828-3ebdc6ce4618",["D",1784087575601],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { Login } from \"./Login.tsx\";\nimport { Dashboard } from \"./Dashboard.tsx\";\nimport { getStoredUser, clearToken, clearStoredUser, auth } from \"./api.ts\";\n\nexport function App() {\n  const [user, setUser] = useState<any>(getStoredUser());\n  const [checking, setChecking] = useState(true);\n\n  useEffect(() => {\n    // Validate stored token on mount\n    const token = localStorage.getItem(\"beml_token\");\n    if (token && user) {\n      auth.me()\n        .then(res => {\n          if (res.user) {\n            setUser(res.user);\n            localStorage.setItem(\"beml_user\", JSON.stringify(res.user));\n          } else {\n            handleLogout();\n          }\n        })\n        .catch(() => handleLogout())\n        .finally(() => setChecking(false));\n    } else {\n      setChecking(false);\n    }\n  }, []);\n\n  const handleLogin = () => {\n    setUser(getStoredUser());\n    window.location.hash = \"#/dashboard\";\n  };\n\n  const handleLogout = async () => {\n    try { await auth.logout(); } catch { /* ignore */ }\n    clearToken();\n    clearStoredUser();\n    setUser(null);\n    window.location.hash = \"#/login\";\n  };\n\n  if (checking) {\n    return (\n      <div class=\"min-h-screen flex items-center justify-center bg-slate-50\">\n        <div class=\"w-10 h-10 border-4 border-blue-200 border-t-blue-600 rounded-full animate-spin\"></div>\n      </div>\n    );\n  }\n\n  if (!user) {\n    return <Login onLogin={handleLogin} />;\n  }\n\n  return <Dashboard user={user} onLogout={handleLogout} />;\n}\n",[],[200,175,91],"d8bad962-65df-4808-9e46-025bee1c232b",["D",1784087575601],[359,360,361,362,363,364,365,366,367,368,369,370,371],[200,175],["D",1784087575601],[358,372,373,374],[200],["D",1784087575601],["D",1789525843977],{"_11":12,"_289":97},{"_11":12,"_284":285,"_96":97,"_25":95,"_286":287,"_288":24},{"_33":34,"_13":16,"_27":30,"_275":237,"_276":86,"_277":87,"_278":241,"_279":280,"_281":36,"_282":14,"_283":12},"ctx",{"_46":-5,"_311":531,"_532":533,"_534":535,"_536":24,"_537":24,"_538":24,"_539":249,"_540":-5,"_541":-7,"_542":-7,"_543":20,"_544":24,"_545":24,"_546":-5,"_547":24,"_548":24,"_549":24,"_550":-5},"ENV",{"_502":503,"_504":505,"_506":16,"_507":508,"_509":510,"_511":512,"_513":514,"_515":516,"_517":518,"_519":520,"_521":522,"_523":524,"_525":526,"_527":528,"_529":530},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]
</article></body></html>

History