Compare commits

...

2 Commits

Author SHA1 Message Date
nightly 28aa27b290 Remove useless index.js, now that we use nextjs 2022-10-23 15:06:50 +02:00
nightly e399a23f4b Migrating to reactjs, successful test. 2022-10-22 19:58:36 +02:00
10 changed files with 4542 additions and 666 deletions

View File

@ -6,4 +6,4 @@ steps:
image: node
commands:
- npm install
- npm test
- npm run lint

3
.eslintrc.json Normal file
View File

@ -0,0 +1,3 @@
{
"extends": "next/core-web-vitals"
}

3
.gitignore vendored
View File

@ -1 +1,2 @@
node_modules/
node_modules/
.next/

View File

@ -1,109 +0,0 @@
// Forces NodeJS to disable "Silent errors"
'use strict';
// Import things
const express = require('express');
const app = express();
const server = require('http').createServer(app);
const port = process.env.PORT || 3430;
const test = require('../testdatabase.json');
const bodyParser = require("body-parser");
var mysql = require('mysql');
var site;
// TODO: Add stuff for MySQL
var connection = mysql.createConnection({
host : '127.0.0.1',
user : 'demo',
password : 'lqklvok',
database : 'mangoshelfdb'
});
connection.query('SELECT * FROM stock', function (error, results, fields) {
if (error) throw error;
// connected!
console.log('MySQL connected!');
});
// Set the templates folder for the thingy
app.set('views', __dirname + '/../Templates');
app.set('view engine', 'ejs');
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
// Makes it so that the Public folder mounts under /
app.use(express.static(__dirname + '/../Public'));
// Main page
app.get('/', function(req, res){
res.redirect('/stock')
// console.log(test.cars.Nissan[1].model)
});
app.get('/stock', function(req, res){
console.log('🌐 Client requested ' + req.url);
connection.query('SELECT * FROM stock', function (error, results, fields) {
if (error) throw error;
// connected!
//console.log(results);
res.render('index', { results, site: 2 });
console.log('✅ Client recieved ' + req.url);
});
// console.log(test.cars.Nissan[1].model)
});
app.get('/stock/new', function(req, res){
var results = null;
console.log('🌐 Client requested ' + req.url);
res.render('index', { results, site: 21 });
// console.log(test.cars.Nissan[1].model)
});
app.post('/api/live/inventory/add', function(req, res){
let name = req.body.name;
let desc = req.body.desc;
let status = req.body.status;
let category = req.body.category;
let amount = req.body.amount;
let location = req.body.location;
let orderid = req.body.orderid;
let notes = req.body.notes;
console.log('🌐 Client requested ' + req.url + ' with id ' + req.params.id);
console.log('✅ Client recieved ' + req.url);
var sql = "INSERT INTO stock (name, description, status, category, amount, location, orderid, notes) VALUES (?)";
var values = [name, desc, status, category, amount, location, orderid, notes];
connection.query(sql, [values], function (err, result) {
if (err) throw err;
console.log("Number of records inserted: " + result.affectedRows);
res.redirect('/stock');
});
if (name && desc && status && category && amount && location && orderid && notes) {
console.log('boop!');
}
// console.log(test.cars.Nissan[1].model)
});
app.get('/api/live/inventory/delete/:thinGid', function(req, res){
var idtodelete = req.params.thinGid;
console.log(idtodelete);
var sql = "DELETE FROM stock WHERE id = ?";
var values = [idtodelete];
connection.query(sql, [values], function (err, result) {
if (err) throw err;
console.log("Number of records inserted: " + result.affectedRows);
res.redirect('/stock');
});
});
// Simple way to expose a function
exports = module.exports = rws;
// rws = RunWebServer
function rws() {
server.listen(port, () => {
console.log('✅ Webserver is running ( %d )', port);
});
};

View File

@ -1,140 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hello world!</title>
<!-- Links -->
<link href="style.css" rel="stylesheet" type="text/css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
</head>
<body>
<nav class="navbar navbar-expand-lg bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="#">MangoShelf early demo</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link disabled" aria-current="page" href="/dashboard">Dashboard</a>
<a class="nav-link active" href="/stock">Stock</a>
<a class="nav-link disabled" href="/parts">Parts</a>
<a class="nav-link disabled" href="/assets">Assets</a>
<a class="nav-link disabled" href="/orders">Ordes</a>
<a class="nav-link disabled" href="/admin">Admin</a>
<a class="nav-link disabled"> Logged in as: Demo</a>
</div>
</div>
</div>
</nav>
<div class="container-fluid">
<% if(site == 21) { %>
<h1>New item in stock</h1>
<br>
<form action="/api/live/inventory/add" method="post">
<div class="mb-3">
<label for="name" class="form-label">Name</label>
<input type="text" class="form-control" id="name" name="name">
<div id="nameHelp" class="form-text">Name for the item.</div>
</div>
<div class="mb-3">
<label for="desc" class="form-label">Description</label>
<input type="text" class="form-control" id="desc" name="desc">
<div id="descHelp" class="form-text">Description for the item.</div>
</div>
<div class="mb-3">
<label for="status" class="form-label">Status</label>
<select id="status" class="form-select" name="status">
<option value="0">No more left (0)</option>
<option value="1">Waiting for order (1)</option>
<option value="2">Damaged (2)</option>
<option value="3">OK (3)</option>
</select>
</div>
<div class="mb-3">
<label for="category" class="form-label">Category</label>
<select id="category" class="form-select" name="category">
<option value="0">No category (0)</option>
<option value="1">Furniture (1)</option>
<option value="2">Digital only (2)</option>
<option value="3">Electronics (3)</option>
<option value="4">Gaming equipment (4)</option>
<option value="5">Audio equipment (5)</option>
<option value="6">???? (6)</option>
</select>
</div>
<div class="mb-3">
<label for="amount" class="form-label">Amount</label>
<input type="text" class="form-control" id="amount" name="amount">
<div id="amountHelp" class="form-text">Amount of this item.</div>
</div>
<div class="mb-3">
<label for="location" class="form-label">Location</label>
<select id="location" class="form-select" name="location">
<option value="0">Home (0)</option>
<option value="1">Office in the middle of nowhere (1)</option>
</select>
</div>
<div class="mb-3">
<label for="orderid" class="form-label">Order ID</label>
<input type="text" class="form-control" id="orderid" name="orderid">
<div id="orderidHelp" class="form-text">Amount of this item.</div>
</div>
<div class="mb-3">
<label for="notes" class="form-label">Notes</label>
<input type="text" class="form-control" id="notes" name="notes">
<div id="noteHelp" class="form-text">Write a note for the item.</div>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
<% } %>
<% if(site == 2) { %>
<h1>Inventory</h1>
<br>
<button type="button" class="btn btn-primary" onclick='location.href="/stock/new"'>New Item</button>
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Name</th>
<th scope="col">Description</th>
<th scope="col">Status</th>
<th scope="col">Category</th>
<th scope="col">Amount</th>
<th scope="col">Location</th>
<th scope="col">Expiry date</th>
<th scope="col">Last updated</th>
<th scope="col">Order id</th>
<th scope="col">Notes</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<% for (let i = 0; i < results.length; i++) { %>
<tr>
<th scope="row"><%= i + 1 %></th>
<td><%= results[i].name %></td>
<td><%= results[i].description %></td>
<td><%= results[i].status %></td>
<td><%= results[i].category %></td>
<td><%= results[i].amount %></td>
<td><%= results[i].location %></td>
<td><%= results[i].expiry %></td>
<td><%= results[i].lastupdate %></td>
<td><%= results[i].orderid %></td>
<td><%= results[i].notes %></td>
<td> <button type="button" class="btn btn-danger" onclick='location.href="/api/live/inventory/delete/<%= results[i].id %>"'>Delete</button></td>
</tr>
<% } %>
</tbody>
</table>
<% } %>
</div>
<script src="script.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
</body>
</html>

View File

@ -1,2 +0,0 @@
var rws = require("./Server/webserver.js");
rws();

4906
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,9 +1,19 @@
{
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"body-parser": "^1.20.0",
"ejs": "^3.1.8",
"ejs-lint": "^1.2.2",
"express": "^4.18.1",
"mysql": "^2.18.1"
"mysql": "^2.18.1",
"next": "^12.3.1",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"eslint": "8.26.0",
"eslint-config-next": "12.3.1"
}
}

25
pages/index.js Normal file
View File

@ -0,0 +1,25 @@
export default function Home() {
return (
<>
<nav class="navbar navbar-expand-lg bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="#">MangoShelf early demo</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link disabled" aria-current="page" href="/dashboard">Dashboard</a>
<a class="nav-link active" href="/stock">Stock</a>
<a class="nav-link disabled" href="/parts">Parts</a>
<a class="nav-link disabled" href="/assets">Assets</a>
<a class="nav-link disabled" href="/orders">Ordes</a>
<a class="nav-link disabled" href="/admin">Admin</a>
<a class="nav-link disabled"> Logged in as: Demo</a>
</div>
</div>
</div>
</nav>
</>
)
};