332 lines
13 KiB
JavaScript
332 lines
13 KiB
JavaScript
const path = require('path');
|
|
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
|
const Database = require('better-sqlite3');
|
|
const { config } = require('dotenv');
|
|
const bcrypt = require('bcryptjs');
|
|
const jwt = require('jsonwebtoken');
|
|
|
|
// Load env vars
|
|
config();
|
|
|
|
// Database connection for Dev Server API
|
|
const dbPath = process.env.DB_PATH || path.resolve(__dirname, '../server/data/sensors.db');
|
|
const JWT_SECRET = process.env.JWT_SECRET || 'dev-secret-key-change-me';
|
|
let db;
|
|
|
|
try {
|
|
db = new Database(dbPath);
|
|
console.log(`[UI Server] Connected to database at ${dbPath}`);
|
|
} catch (err) {
|
|
console.error(`[UI Server] Failed to connect to database at ${dbPath}:`, err.message);
|
|
}
|
|
|
|
module.exports = {
|
|
entry: './src/index.js',
|
|
output: {
|
|
path: path.join(__dirname, 'dist'),
|
|
filename: 'bundle.js',
|
|
clean: true,
|
|
},
|
|
mode: 'development',
|
|
devtool: 'source-map',
|
|
module: {
|
|
rules: [
|
|
{
|
|
test: /\.(js|jsx)$/,
|
|
exclude: /node_modules/,
|
|
use: {
|
|
loader: 'babel-loader',
|
|
options: {
|
|
presets: ['@babel/preset-env', '@babel/preset-react'],
|
|
},
|
|
},
|
|
},
|
|
{
|
|
test: /\.css$/,
|
|
use: ['style-loader', 'css-loader'],
|
|
},
|
|
],
|
|
},
|
|
resolve: {
|
|
extensions: ['.js', '.jsx'],
|
|
},
|
|
plugins: [
|
|
new HtmlWebpackPlugin({
|
|
template: './public/index.html',
|
|
}),
|
|
],
|
|
devServer: {
|
|
port: 3905,
|
|
historyApiFallback: true,
|
|
hot: true,
|
|
allowedHosts: 'all',
|
|
setupMiddlewares: (middlewares, devServer) => {
|
|
if (!devServer) {
|
|
throw new Error('webpack-dev-server is not defined');
|
|
}
|
|
|
|
// API Endpoints
|
|
const app = devServer.app;
|
|
const bodyParser = require('body-parser');
|
|
app.use(bodyParser.json());
|
|
|
|
// --- Auth API ---
|
|
app.post('/api/login', (req, res) => {
|
|
const { username, password } = req.body;
|
|
try {
|
|
const stmt = db.prepare('SELECT * FROM users WHERE username = ?');
|
|
const user = stmt.get(username);
|
|
|
|
if (!user || !bcrypt.compareSync(password, user.password_hash)) {
|
|
return res.status(401).json({ error: 'Invalid credentials' });
|
|
}
|
|
|
|
const token = jwt.sign({
|
|
id: user.id,
|
|
username: user.username,
|
|
role: user.role
|
|
}, JWT_SECRET, { expiresIn: '24h' });
|
|
|
|
res.json({ token, role: user.role, username: user.username });
|
|
} catch (err) {
|
|
res.status(500).json({ error: err.message });
|
|
}
|
|
});
|
|
|
|
// Middleware to check auth (Optional for read, required for write)
|
|
const checkAuth = (req, res, next) => {
|
|
const authHeader = req.headers.authorization;
|
|
if (authHeader) {
|
|
const token = authHeader.split(' ')[1];
|
|
jwt.verify(token, JWT_SECRET, (err, user) => {
|
|
if (user) req.user = user;
|
|
next();
|
|
});
|
|
} else {
|
|
next();
|
|
}
|
|
};
|
|
|
|
const requireAdmin = (req, res, next) => {
|
|
if (!req.user || req.user.role !== 'admin') {
|
|
return res.status(403).json({ error: 'Admin access required' });
|
|
}
|
|
next();
|
|
};
|
|
|
|
app.use('/api/views', checkAuth);
|
|
|
|
// --- Views API ---
|
|
app.post('/api/views', requireAdmin, (req, res) => {
|
|
const { name, config } = req.body;
|
|
try {
|
|
const stmt = db.prepare('INSERT INTO views (name, config, created_by) VALUES (?, ?, ?)');
|
|
const info = stmt.run(name, JSON.stringify(config), req.user.id);
|
|
res.json({ id: info.lastInsertRowid, name, config });
|
|
} catch (err) {
|
|
res.status(500).json({ error: err.message });
|
|
}
|
|
});
|
|
|
|
// Publicly list views
|
|
app.get('/api/views', (req, res) => {
|
|
try {
|
|
const stmt = db.prepare('SELECT * FROM views ORDER BY position ASC, id ASC');
|
|
const rows = stmt.all();
|
|
const views = rows.map(row => {
|
|
try {
|
|
return { ...row, config: JSON.parse(row.config) };
|
|
} catch (e) {
|
|
return row;
|
|
}
|
|
});
|
|
res.json(views);
|
|
} catch (err) {
|
|
res.status(500).json({ error: err.message });
|
|
}
|
|
});
|
|
|
|
app.get('/api/views/:id', (req, res) => {
|
|
try {
|
|
const stmt = db.prepare('SELECT * FROM views WHERE id = ?');
|
|
const view = stmt.get(req.params.id);
|
|
if (view) {
|
|
view.config = JSON.parse(view.config);
|
|
res.json(view);
|
|
} else {
|
|
res.status(404).json({ error: 'View not found' });
|
|
}
|
|
} catch (err) {
|
|
res.status(500).json({ error: err.message });
|
|
}
|
|
});
|
|
|
|
// Delete View
|
|
app.delete('/api/views/:id', requireAdmin, (req, res) => {
|
|
try {
|
|
const stmt = db.prepare('DELETE FROM views WHERE id = ?');
|
|
const info = stmt.run(req.params.id);
|
|
if (info.changes > 0) {
|
|
res.json({ success: true });
|
|
} else {
|
|
res.status(404).json({ error: 'View not found' });
|
|
}
|
|
} catch (err) {
|
|
res.status(500).json({ error: err.message });
|
|
}
|
|
});
|
|
|
|
// Update View
|
|
app.put('/api/views/:id', requireAdmin, (req, res) => {
|
|
const { name, config } = req.body;
|
|
try {
|
|
const stmt = db.prepare('UPDATE views SET name = ?, config = ? WHERE id = ?');
|
|
const info = stmt.run(name, JSON.stringify(config), req.params.id);
|
|
if (info.changes > 0) {
|
|
res.json({ id: req.params.id, name, config });
|
|
} else {
|
|
res.status(404).json({ error: 'View not found' });
|
|
}
|
|
} catch (err) {
|
|
res.status(500).json({ error: err.message });
|
|
}
|
|
});
|
|
|
|
// Reorder Views
|
|
app.post('/api/views/reorder', requireAdmin, (req, res) => {
|
|
const { order } = req.body;
|
|
console.log('[API] Reorder request:', order);
|
|
if (!Array.isArray(order)) return res.status(400).json({ error: 'Invalid format' });
|
|
|
|
const updateStmt = db.prepare('UPDATE views SET position = ? WHERE id = ?');
|
|
const updateMany = db.transaction((items) => {
|
|
for (const item of items) {
|
|
console.log('[API] Updating view', item.id, 'to position', item.position);
|
|
updateStmt.run(item.position, item.id);
|
|
}
|
|
});
|
|
|
|
try {
|
|
updateMany(order);
|
|
console.log('[API] Reorder successful');
|
|
res.json({ success: true });
|
|
} catch (err) {
|
|
console.error('[API] Reorder error:', err);
|
|
res.status(500).json({ error: err.message });
|
|
}
|
|
});
|
|
|
|
// GET /api/devices
|
|
// Returns list of unique device/channel pairs
|
|
app.get('/api/devices', (req, res) => {
|
|
try {
|
|
if (!db) throw new Error('Database not connected');
|
|
// Filter to only numeric channels which can be charted
|
|
const stmt = db.prepare("SELECT DISTINCT device, channel FROM sensor_events WHERE data_type = 'number' ORDER BY device, channel");
|
|
const rows = stmt.all();
|
|
res.json(rows);
|
|
} catch (err) {
|
|
res.status(500).json({ error: err.message });
|
|
}
|
|
});
|
|
|
|
// GET /api/readings
|
|
// Query params: devices (comma sep), channels (comma sep), since (timestamp)
|
|
// Actually, user wants "Last 24h".
|
|
// We can accept `since` or valid ISO string.
|
|
// Expected params: `?device=x&channel=y` (single) or query for multiple?
|
|
// User asked for "chart that is refreshed once a minute... display the last 24 hours with the devices/channels previously selected"
|
|
// Efficient query: select * from sensor_events where timestamp > ? and (device,channel) IN (...)
|
|
// For simplicity, let's allow fetching by multiple devices/channels or just all for last 24h and filter client side?
|
|
// No, database filtering is better.
|
|
// Let's support ?since=ISO_DATE
|
|
|
|
app.get('/api/readings', (req, res) => {
|
|
try {
|
|
if (!db) throw new Error('Database not connected');
|
|
const { since, until } = req.query;
|
|
const startTime = since || new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString();
|
|
const endTime = until || new Date().toISOString();
|
|
|
|
// 1. Fetch main data window
|
|
let sql = 'SELECT * FROM sensor_events WHERE timestamp > ? AND timestamp <= ? ';
|
|
const params = [startTime, endTime];
|
|
|
|
const requestedChannels = []; // [{device, channel}]
|
|
|
|
if (req.query.selection) {
|
|
const selections = req.query.selection.split(',');
|
|
if (selections.length > 0) {
|
|
const placeholders = [];
|
|
selections.forEach(s => {
|
|
const lastColonIndex = s.lastIndexOf(':');
|
|
if (lastColonIndex !== -1) {
|
|
const d = s.substring(0, lastColonIndex);
|
|
const c = s.substring(lastColonIndex + 1);
|
|
placeholders.push('(device = ? AND channel = ?)');
|
|
params.push(d, c);
|
|
requestedChannels.push({ device: d, channel: c });
|
|
}
|
|
});
|
|
if (placeholders.length > 0) {
|
|
sql += `AND (${placeholders.join(' OR ')}) `;
|
|
}
|
|
}
|
|
}
|
|
|
|
sql += 'ORDER BY timestamp ASC';
|
|
|
|
const stmt = db.prepare(sql);
|
|
const rows = stmt.all(...params);
|
|
|
|
// 2. Backfill: Ensure we have a starting point for each channel
|
|
// For each requested channel, check if we have data at/near start.
|
|
// If the first point for a channel is > startTime, we should try to find the previous value.
|
|
// We check for the value that started before (or at) startTime AND ended after (or at) startTime (or hasn't ended).
|
|
|
|
const backfillRows = [];
|
|
// Find the record that started most recently before startTime BUT was still valid at startTime
|
|
const backfillStmt = db.prepare(`
|
|
SELECT * FROM sensor_events
|
|
WHERE device = ? AND channel = ?
|
|
AND timestamp <= ?
|
|
AND (until >= ? OR until IS NULL)
|
|
ORDER BY timestamp DESC LIMIT 1
|
|
`);
|
|
|
|
requestedChannels.forEach(ch => {
|
|
const prev = backfillStmt.get(ch.device, ch.channel, startTime, startTime);
|
|
if (prev) {
|
|
// We found a point that covers the startTime.
|
|
backfillRows.push(prev);
|
|
}
|
|
});
|
|
|
|
// Combine and sort
|
|
const allRows = [...backfillRows, ...rows];
|
|
|
|
// Transform to Compact Dictionary Format
|
|
// { "device:channel": [ [timestamp, value, until], ... ] }
|
|
const result = {};
|
|
|
|
allRows.forEach(row => {
|
|
const key = `${row.device}:${row.channel}`;
|
|
if (!result[key]) result[key] = [];
|
|
|
|
const pt = [row.timestamp, row.value];
|
|
if (row.until) pt.push(row.until);
|
|
result[key].push(pt);
|
|
});
|
|
|
|
res.json(result);
|
|
} catch (err) {
|
|
console.error(err);
|
|
res.status(500).json({ error: err.message });
|
|
}
|
|
});
|
|
|
|
return middlewares;
|
|
},
|
|
},
|
|
};
|