Initial commit - ResMan project
This commit is contained in:
@@ -0,0 +1,12 @@
|
||||
FROM node:20-alpine
|
||||
|
||||
WORKDIR /app
|
||||
|
||||
COPY package*.json ./
|
||||
RUN npm install
|
||||
|
||||
COPY . .
|
||||
|
||||
EXPOSE 3000
|
||||
|
||||
CMD ["node", "server.js"]
|
||||
@@ -0,0 +1,12 @@
|
||||
const mysql = require("mysql2/promise");
|
||||
|
||||
const pool = mysql.createPool({
|
||||
host: process.env.DB_HOST,
|
||||
user: process.env.DB_USER,
|
||||
password: process.env.DB_PASSWORD,
|
||||
database: process.env.DB_NAME,
|
||||
waitForConnections: true,
|
||||
connectionLimit: 10
|
||||
});
|
||||
|
||||
module.exports = pool;
|
||||
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"name": "resman",
|
||||
"version": "1.0.0",
|
||||
"main": "server.js",
|
||||
"dependencies": {
|
||||
"express": "^4.18.2",
|
||||
"mysql2": "^3.6.0",
|
||||
"cors": "^2.8.5"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,275 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>ResMan</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="bg-light">
|
||||
|
||||
<div class="container mt-4">
|
||||
<h2 class="mb-4">Resource Manager</h2>
|
||||
|
||||
<button class="btn btn-primary mb-3" onclick="openModal()">Neue Ressource</button>
|
||||
|
||||
<table class="table table-bordered table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Produkt</th>
|
||||
<th>Provider</th>
|
||||
<th>CPU</th>
|
||||
<th>RAM</th>
|
||||
<th>Disk</th>
|
||||
<th>Status</th>
|
||||
<th>Aktionen</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="resourceTable"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="resourceModal" tabindex="-1">
|
||||
<div class="modal-dialog modal-xl">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">Ressource</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<input type="hidden" id="resourceId">
|
||||
|
||||
<div class="row g-3">
|
||||
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Name</label>
|
||||
<input type="text" class="form-control" id="name">
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Produkt</label>
|
||||
<input type="text" class="form-control" id="produkt">
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<label class="form-label">Provider</label>
|
||||
<input type="text" class="form-control" id="provider">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Art</label>
|
||||
<input type="text" class="form-control" id="art">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">CPU</label>
|
||||
<input type="text" class="form-control" id="cpu">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">RAM</label>
|
||||
<input type="text" class="form-control" id="ram">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Disk</label>
|
||||
<input type="text" class="form-control" id="disk">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">OS</label>
|
||||
<input type="text" class="form-control" id="os">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">IPv4</label>
|
||||
<input type="text" class="form-control" id="ipv4_adresse">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">VLAN IP 1</label>
|
||||
<input type="text" class="form-control" id="vlan_ip1">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">VLAN IP 2</label>
|
||||
<input type="text" class="form-control" id="vlan_ip2">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">IPv6 Netz</label>
|
||||
<input type="text" class="form-control" id="ipv6_net">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">IPv6 Adresse</label>
|
||||
<input type="text" class="form-control" id="ipv6_adresse">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Provider Name</label>
|
||||
<input type="text" class="form-control" id="providername">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Kosten / Monat</label>
|
||||
<input type="number" step="0.01" class="form-control" id="kosten_monat">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Kosten / Jahr</label>
|
||||
<input type="number" step="0.01" class="form-control" id="kosten_jahr">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Laufzeit (Monate)</label>
|
||||
<input type="number" class="form-control" id="laufzeit_monate">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Bestelldatum</label>
|
||||
<input type="date" class="form-control" id="bestelldatum">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Kündbar ab</label>
|
||||
<input type="date" class="form-control" id="kuendbar_ab">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Kündigungsdatum</label>
|
||||
<input type="date" class="form-control" id="kuendigungsdatum">
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label">Status</label>
|
||||
<select class="form-select" id="status">
|
||||
<option value="aktiv">Aktiv</option>
|
||||
<option value="gekündigt">Gekündigt</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<label class="form-label">Bemerkung</label>
|
||||
<textarea class="form-control" id="bemerkung"></textarea>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn btn-success" type="button" onclick="saveResource()">Speichern</button>
|
||||
<button class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const API = "/resman/api/resources";
|
||||
|
||||
const fields = [
|
||||
"name","produkt","provider","art",
|
||||
"kosten_monat","kosten_jahr","laufzeit_monate",
|
||||
"cpu","ram","disk","os",
|
||||
"ipv4_adresse","vlan_ip1","vlan_ip2",
|
||||
"ipv6_net","ipv6_adresse",
|
||||
"providername","bestelldatum","kuendbar_ab",
|
||||
"kuendigungsdatum","status","bemerkung"
|
||||
];
|
||||
|
||||
function getStatusBadge(r) {
|
||||
if (r.status === "gekündigt") {
|
||||
return '<span class="badge bg-dark">Gekündigt</span>';
|
||||
}
|
||||
return '<span class="badge bg-success">Aktiv</span>';
|
||||
}
|
||||
|
||||
async function loadResources() {
|
||||
const res = await fetch(API);
|
||||
const data = await res.json();
|
||||
|
||||
const table = document.getElementById("resourceTable");
|
||||
table.innerHTML = "";
|
||||
|
||||
data.forEach(r => {
|
||||
table.innerHTML += `
|
||||
<tr>
|
||||
<td>${r.name || ""}</td>
|
||||
<td>${r.produkt || ""}</td>
|
||||
<td>${r.provider || ""}</td>
|
||||
<td>${r.cpu || ""}</td>
|
||||
<td>${r.ram || ""}</td>
|
||||
<td>${r.disk || ""}</td>
|
||||
<td>${getStatusBadge(r)}</td>
|
||||
<td>
|
||||
<button class="btn btn-sm btn-warning" onclick='editResource(${JSON.stringify(r)})'>Edit</button>
|
||||
<button class="btn btn-sm btn-info" onclick='copyResource(${JSON.stringify(r)})'>Copy</button>
|
||||
<button class="btn btn-sm btn-danger" onclick="deleteResource(${r.id})">Delete</button>
|
||||
</td>
|
||||
</tr>
|
||||
`;
|
||||
});
|
||||
}
|
||||
|
||||
function openModal() {
|
||||
document.getElementById("resourceId").value = "";
|
||||
fields.forEach(f => {
|
||||
const el = document.getElementById(f);
|
||||
if (el) el.value = "";
|
||||
});
|
||||
new bootstrap.Modal(document.getElementById("resourceModal")).show();
|
||||
}
|
||||
|
||||
function editResource(r) {
|
||||
document.getElementById("resourceId").value = r.id;
|
||||
fields.forEach(f => {
|
||||
const el = document.getElementById(f);
|
||||
if (el) el.value = r[f] || "";
|
||||
});
|
||||
new bootstrap.Modal(document.getElementById("resourceModal")).show();
|
||||
}
|
||||
|
||||
function copyResource(r) {
|
||||
r.id = null;
|
||||
editResource(r);
|
||||
}
|
||||
|
||||
async function saveResource() {
|
||||
const id = document.getElementById("resourceId").value;
|
||||
let payload = {};
|
||||
fields.forEach(f => {
|
||||
const el = document.getElementById(f);
|
||||
if (el) payload[f] = el.value || null;
|
||||
});
|
||||
|
||||
if (id) {
|
||||
await fetch(API + "/" + id, {
|
||||
method: "PUT",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(payload)
|
||||
});
|
||||
} else {
|
||||
await fetch(API, {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(payload)
|
||||
});
|
||||
}
|
||||
|
||||
loadResources();
|
||||
bootstrap.Modal.getInstance(document.getElementById("resourceModal")).hide();
|
||||
}
|
||||
|
||||
async function deleteResource(id) {
|
||||
if (!confirm("Wirklich löschen?")) return;
|
||||
await fetch(API + "/" + id, { method: "DELETE" });
|
||||
loadResources();
|
||||
}
|
||||
|
||||
loadResources();
|
||||
</script>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,70 @@
|
||||
const express = require("express");
|
||||
const pool = require("./db");
|
||||
const cors = require("cors");
|
||||
|
||||
const app = express();
|
||||
app.use(express.json());
|
||||
app.use(cors());
|
||||
|
||||
const BASE_PATH = "/resman/api";
|
||||
const path = require("path");
|
||||
|
||||
/* Static Files */
|
||||
app.use("/resman", express.static(path.join(__dirname, "public")));
|
||||
|
||||
/* LIST */
|
||||
app.get(`${BASE_PATH}/resources`, async (req, res) => {
|
||||
const [rows] = await pool.query("SELECT * FROM resources");
|
||||
res.json(rows);
|
||||
});
|
||||
|
||||
/* INSERT */
|
||||
app.post(`${BASE_PATH}/resources`, async (req, res) => {
|
||||
const data = req.body;
|
||||
await pool.query("INSERT INTO resources SET ?", data);
|
||||
res.json({ message: "Inserted" });
|
||||
});
|
||||
|
||||
/* UPDATE */
|
||||
app.put(`${BASE_PATH}/resources/:id`, async (req, res) => {
|
||||
await pool.query("UPDATE resources SET ? WHERE id = ?", [
|
||||
req.body,
|
||||
req.params.id
|
||||
]);
|
||||
res.json({ message: "Updated" });
|
||||
});
|
||||
|
||||
/* DELETE */
|
||||
app.delete(`${BASE_PATH}/resources/:id`, async (req, res) => {
|
||||
await pool.query("DELETE FROM resources WHERE id = ?", [
|
||||
req.params.id
|
||||
]);
|
||||
res.json({ message: "Deleted" });
|
||||
});
|
||||
|
||||
/* COPY */
|
||||
app.post(`${BASE_PATH}/resources/:id/copy`, async (req, res) => {
|
||||
await pool.query(`
|
||||
INSERT INTO resources (
|
||||
name, produkt, provider, art,
|
||||
kosten_monat, kosten_jahr, laufzeit_monate,
|
||||
bemerkung, cpu, ram, disk, os,
|
||||
ipv4_adresse, vlan_ip1, vlan_ip2,
|
||||
ipv6_net, ipv6_adresse,
|
||||
providername, bestelldatum, kuendbar_ab
|
||||
)
|
||||
SELECT
|
||||
CONCAT(name, ' (Copy)'),
|
||||
produkt, provider, art,
|
||||
kosten_monat, kosten_jahr, laufzeit_monate,
|
||||
bemerkung, cpu, ram, disk, os,
|
||||
ipv4_adresse, vlan_ip1, vlan_ip2,
|
||||
ipv6_net, ipv6_adresse,
|
||||
providername, bestelldatum, kuendbar_ab
|
||||
FROM resources WHERE id = ?
|
||||
`, [req.params.id]);
|
||||
|
||||
res.json({ message: "Copied" });
|
||||
});
|
||||
|
||||
app.listen(3000, () => console.log("ResMan running on port 3000"));
|
||||
@@ -0,0 +1,31 @@
|
||||
version: "3.9"
|
||||
|
||||
services:
|
||||
db:
|
||||
image: mariadb:11
|
||||
container_name: resman-db
|
||||
restart: always
|
||||
environment:
|
||||
MYSQL_ROOT_PASSWORD: rootpass
|
||||
MYSQL_DATABASE: resource_manager
|
||||
MYSQL_USER: resman
|
||||
MYSQL_PASSWORD: resmanpass
|
||||
volumes:
|
||||
- db_data:/var/lib/mysql
|
||||
|
||||
backend:
|
||||
build: ./backend
|
||||
container_name: resman-backend
|
||||
restart: always
|
||||
environment:
|
||||
DB_HOST: db
|
||||
DB_USER: resman
|
||||
DB_PASSWORD: resmanpass
|
||||
DB_NAME: resource_manager
|
||||
depends_on:
|
||||
- db
|
||||
ports:
|
||||
- "127.0.0.1:3000:3000"
|
||||
|
||||
volumes:
|
||||
db_data:
|
||||
Reference in New Issue
Block a user