adm_tueit/TueIT_App
2
0
Fork 0
Code Issues 3 Pull Requests 3 Packages Projects Releases Wiki Activity

added update config items functionality

Browse Source
This commit is contained in:
selina.mail
2024-02-18 12:04:14 +01:00
parent 5242d4a3af
commit 2e1d3f7026
7 changed files with 363 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
backend/models/configItemsModel.js
View File

@ -60,8 +60,9 @@ export const getConfigItemByCustomerId = async (customerId, result) => {
export const updateConfigItemById = async (data, result) => {
const id = data.primaryID;
try {
let sql = `UPDATE changedb SET assetName = ?, customerID = ?, customer = ?, location = ?, remoteLocation = ?, type = ?, description = ?, notes = ?, state = ?, lastView = ?, user = ?, hardwareBool = ?, model = ?, serialnumber = ?, CPU = ?, RAM = ?, storageConfiguration = ?, miscellaneous = ?, softwareBool = ?, software = ?, version = ?, networkBool = ?, IPv4 = ?, IPv6 = ?, MAC = ?, subnetmask = ? WHERE primaryID = ?`;
let sql = `UPDATE changedb SET assetName = ?, customerID = ?, customer = ?, location = ?, remoteLocation = ?, type = ?, description = ?, notes = ?, state = ?, lastView = ?, user = ?, hardwareBool = ?, model = ?, serialnumber = ?, CPU = ?, RAM = ?, storageConfiguration = ?, miscellaneous = ?, softwareBool = ?, software = ?, version = ?, license = ?, networkBool = ?, IPv4 = ?, IPv6 = ?, MAC = ?, subnetmask = ? WHERE primaryID = ?`;
const results = await ownConn.query(sql, [data.assetName, data.customerID, data.customer, data.location, data.remoteLocation, data.type, data.description, data.notes, data.state, data.lastView, data.user, data.hardwareBool, data.model, data.serialnumber, data.CPU, data.RAM, data.storageConfiguration, data.miscellaneous, data.softwareBool, data.software, data.version, data.license, data.networkBool, data.IPv4, data.IPv6, data.MAC, data.subnetmask, id]);
results.insertId = results.insertId.toString();
result(null, results);
}
catch (err) {

102
components/server/Asset.vue
View File

@ -1,7 +1,7 @@
<template>
<section :class="['information', darkMode ? 'section-darkmode' : 'section-lightmode']">
<h2 v-if="!editable" :class="['asset-name', darkMode ? 'h2-darkmode' : 'h2-lightmode']">{{ item.assetName }}</h2>
<input v-if="editable" v-model="item.assetName"
<input v-if="editable" v-model="item.assetName" @change="updateConfigItem()"
:class="['data', 'asset-name-input', darkMode ? 'h2-darkmode' : 'h2-lightmode', darkMode ? 'h2-input-darkmode' : 'h2-input-lightmode', 'input']">
<div class="asset-data">
<div class="client-location">
@ -9,14 +9,14 @@
<pre :class="['label', darkMode ? 'pre-darkmode' : 'pre-lightmode']">Client:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']"> {{ item.customer }}</pre>
<input v-if="editable" v-model="item.customer"
<input v-if="editable" v-model="item.customer" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
<div class="data-field" id="location">
<pre :class="['label', darkMode ? 'pre-darkmode' : 'pre-lightmode']">Location:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']"> {{ item.location }}</pre>
<input v-if="editable" v-model="item.location"
<input v-if="editable" v-model="item.location" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
</div>
@ -24,25 +24,31 @@
<div class="id-type">
<div class="data-field" id="id">
<pre :class="['label', darkMode ? 'pre-darkmode' : 'pre-lightmode']">ID:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.primaryID }}</pre>
<input v-if="editable" v-model="item.primaryID"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
<pre :class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.primaryID }}</pre>
</div>
<div class="data-field" id="type">
<pre :class="['label', darkMode ? 'pre-darkmode' : 'pre-lightmode']">Type:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']"> {{ item.type }}</pre>
<input v-if="editable" v-model="item.type"
<input v-if="editable" v-model="item.type" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
</div>
<div class="data-field" id="remote-location">
<pre :class="['label', darkMode ? 'pre-darkmode' : 'pre-lightmode']">Remote location:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.remoteLocation }}</pre>
<input v-if="editable" v-model="item.remoteLocation"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
<div class="remoteLocation-state">
<div class="data-field" id="remote-location">
<pre :class="['label', darkMode ? 'pre-darkmode' : 'pre-lightmode']">Remote location:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.remoteLocation }}</pre>
<input v-if="editable" v-model="item.remoteLocation" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
<div class="data-field" id="state">
<pre :class="['label', darkMode ? 'pre-darkmode' : 'pre-lightmode']">State:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.state }}</pre>
<input v-if="editable" v-model="item.state" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
</div>
</div>
<div class="rectangle-container">
@ -53,14 +59,14 @@
<div class="additional">
<div class="description">
<h3 :class="['area-title', darkMode ? 'h3-darkmode' : 'h3-lightmode']">Description:</h3>
<input v-model="item.description" :readonly="!editable"
<input v-model="item.description" :readonly="!editable" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']" id="description">
</div>
</div>
<div class="additional">
<div class="notes">
<h3 :class="['area-title', darkMode ? 'h3-darkmode' : 'h3-lightmode']">Notes:</h3>
<input v-model="item.notes" :readonly="!editable"
<input v-model="item.notes" :readonly="!editable" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']" id="notes">
</div>
</div>
@ -98,7 +104,7 @@ const getItemById = async () => {
//update data
const updateConfigItem = async () => {
if (item.assetName.trim() === "") {
if (item.value.assetName.trim() === "") {
alert("Please add a config item name!");
return;
} else {
@ -115,38 +121,39 @@ const updateConfigItem = async () => {
}
try {
await Axios.put(
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/updateConfigItem/${itemIndex}`,
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/updateConfigItem`,
{
primaryID: item.primaryID,
assetName: item.assetName,
customerID: item.customerID,
customer: item.customer,
location: item.location,
remoteLocation: item.remoteLocation,
type: item.type,
description: item.description,
notes: item.notes,
state: item.state,
lastView: item.lastView,
user: item.user,
hardwareBool: item.hardwareBool,
model: item.model,
serialnumber: item.serialnumber,
CPU: item.CPU,
RAM: item.RAM,
storageConfiguration: item.storageConfiguration,
miscellaneous: item.miscellaneous,
softwareBool: item.softwareBool,
software: item.software,
version: item.version,
licence: item.licence,
networkBool: item.networkBool,
IPv4: item.IPv4,
IPv6: item.IPv6,
MAC: item.MAC,
subnetmask: item.subnetmask,
primaryID: item.value.primaryID,
assetName: item.value.assetName,
customerID: item.value.customerID,
customer: item.value.customer,
location: item.value.location,
remoteLocation: item.value.remoteLocation,
type: item.value.type,
description: item.value.description,
notes: item.value.notes,
state: item.value.state,
lastView: item.value.lastView,
user: item.value.user,
hardwareBool: item.value.hardwareBool,
model: item.value.model,
serialnumber: item.value.serialnumber,
CPU: item.value.CPU,
RAM: item.value.RAM,
storageConfiguration: item.value.storageConfiguration,
miscellaneous: item.value.miscellaneous,
softwareBool: item.value.softwareBool,
software: item.value.software,
version: item.value.version,
license: item.value.license,
networkBool: item.value.networkBool,
IPv4: item.value.IPv4,
IPv6: item.value.IPv6,
MAC: item.value.MAC,
subnetmask: item.value.subnetmask,
}
);
await getItemById();
} catch (err) {
console.log(err);
}
@ -331,7 +338,8 @@ export default {
color: #000;
}
.id-type {
.id-type,
.remoteLocation-state {
display: flex;
flex-direction: row;
align-items: center;

56
components/server/HardwareSpecifications.vue
View File

@ -1,5 +1,5 @@
<template>
<section :class="['hardware-information', darkMode ? 'section-darkmode' : 'section-lightmode']">
<section v-if="hardwareBoolean" :class="['hardware-information', darkMode ? 'section-darkmode' : 'section-lightmode']">
<div :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']" id="hardware">Hardware specifications:</div>
<div class="asset-data">
<div class="model-CPU">
@ -7,14 +7,14 @@
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">Model:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.model }}</pre>
<input v-if="editable" v-model="item.model"
<input v-if="editable" v-model="item.model" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
<div class="data-field" id="CPU">
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">CPU:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.CPU }}</pre>
<input v-if="editable" v-model="item.CPU"
<input v-if="editable" v-model="item.CPU" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
</div>
@ -23,14 +23,14 @@
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">Serial number:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.serialnumber }}</pre>
<input v-if="editable" v-model="item.serialnumber"
<input v-if="editable" v-model="item.serialnumber" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
<div class="data-field" id="RAM">
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">RAM:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.RAM }}</pre>
<input v-if="editable" v-model="item.RAM"
<input v-if="editable" v-model="item.RAM" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
</div>
@ -39,7 +39,7 @@
<div class="additional">
<div class="storage-configuration">
<h3 :class="['area-title', darkMode ? 'h3-darkmode' : 'h3-lightmode']">Storage configuration:</h3>
<input v-model="item.storageConfiguration" :readonly="!editable"
<input v-model="item.storageConfiguration" :readonly="!editable" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']"
id="storage-configuration">
</div>
@ -47,7 +47,7 @@
<div class="additional">
<div class="miscellaneous">
<h3 :class="['area-title', darkMode ? 'h3-darkmode' : 'h3-lightmode']">Miscellaneous:</h3>
<input v-model="item.miscellaneous" :readonly="!editable"
<input v-model="item.miscellaneous" :readonly="!editable" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']" id="miscellaneous">
</div>
</div>
@ -90,6 +90,48 @@ const getItemById = async () => {
}
}
//update data
const updateConfigItem = async () => {
try {
await Axios.put(
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/updateConfigItem`,
{
primaryID: item.value.primaryID,
assetName: item.value.assetName,
customerID: item.value.customerID,
customer: item.value.customer,
location: item.value.location,
remoteLocation: item.value.remoteLocation,
type: item.value.type,
description: item.value.description,
notes: item.value.notes,
state: item.value.state,
lastView: item.value.lastView,
user: item.value.user,
hardwareBool: item.value.hardwareBool,
model: item.value.model,
serialnumber: item.value.serialnumber,
CPU: item.value.CPU,
RAM: item.value.RAM,
storageConfiguration: item.value.storageConfiguration,
miscellaneous: item.value.miscellaneous,
softwareBool: item.value.softwareBool,
software: item.value.software,
version: item.value.version,
license: item.value.license,
networkBool: item.value.networkBool,
IPv4: item.value.IPv4,
IPv6: item.value.IPv6,
MAC: item.value.MAC,
subnetmask: item.value.subnetmask,
}
);
await getItemById();
} catch (err) {
console.log(err);
}
}
onMounted(() => {
getItemById();
});

129
components/server/NetworkSpecifications.vue
View File

@ -1,5 +1,5 @@
<template>
<section :class="['network-information', darkMode ? 'section-darkmode' : 'section-lightmode']">
<section v-if="networkBoolean" :class="['network-information', darkMode ? 'section-darkmode' : 'section-lightmode']">
<div :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']" id="network">Network specifications:</div>
<div class="asset-data">
<div class="IPv4-MAC">
@ -7,14 +7,14 @@
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">IPv4:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ inputIPv4 }}</pre>
<input v-if="editable" v-model="inputIPv4"
<input v-if="editable" v-model="inputIPv4" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
<div class="data-field" id="MAC">
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">MAC:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.MAC }}</pre>
<input v-if="editable" v-model="item.MAC"
<input v-if="editable" v-model="item.MAC" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
</div>
@ -23,14 +23,14 @@
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">IPv6:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ inputIPv6 }}</pre>
<input v-if="editable" v-model="inputIPv6"
<input v-if="editable" v-model="inputIPv6" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
<div class="data-field" id="subnetmask">
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">Subnetmask:</pre>
<pre v-if="!editable"
:class="['data', darkMode ? 'data-darkmode' : 'data-lightmode']">{{ item.subnetmask }}</pre>
<input v-if="editable" v-model="item.subnetmask"
<input v-if="editable" v-model="item.subnetmask" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</div>
</div>
@ -86,6 +86,125 @@ const getItemById = async () => {
}
}
// helper function to validate an IPv4 address
const validateIPv4address = (ipaddress) => {
const ipv4format = /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
if (ipv4format.test(ipaddress) || ipaddress === "") {
return true;
} else {
return false;
}
}
// helper function to validate an IPv4 address
const validateIPv6address = (ipaddress) => {
const ipv6format = /(([0-9a-fA-F]{1,4}:){7,7}[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,7}:|([0-9a-fA-F]{1,4}:){1,6}:[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,5}(:[0-9a-fA-F]{1,4}){1,2}|([0-9a-fA-F]{1,4}:){1,4}(:[0-9a-fA-F]{1,4}){1,3}|([0-9a-fA-F]{1,4}:){1,3}(:[0-9a-fA-F]{1,4}){1,4}|([0-9a-fA-F]{1,4}:){1,2}(:[0-9a-fA-F]{1,4}){1,5}|[0-9a-fA-F]{1,4}:((:[0-9a-fA-F]{1,4}){1,6})|:((:[0-9a-fA-F]{1,4}){1,7}|:)|fe80:(:[0-9a-fA-F]{0,4}){0,4}%[0-9a-zA-Z]{1,}|::(ffff(:0{1,4}){0,1}:){0,1}((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])|([0-9a-fA-F]{1,4}:){1,4}:((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9]))/gi;
if (ipv6format.test(ipaddress) || ipaddress === "") {
return true;
} else {
return false;
}
}
//update data
const updateConfigItem = async () => {
if (validateIPv4address(inputIPv4.value)) {
console.log("not ere")
item.value.IPv4 = inputIPv4.value;
try {
await Axios.put(
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/updateConfigItem`,
{
primaryID: item.value.primaryID,
assetName: item.value.assetName,
customerID: item.value.customerID,
customer: item.value.customer,
location: item.value.location,
remoteLocation: item.value.remoteLocation,
type: item.value.type,
description: item.value.description,
notes: item.value.notes,
state: item.value.state,
lastView: item.value.lastView,
user: item.value.user,
hardwareBool: item.value.hardwareBool,
model: item.value.model,
serialnumber: item.value.serialnumber,
CPU: item.value.CPU,
RAM: item.value.RAM,
storageConfiguration: item.value.storageConfiguration,
miscellaneous: item.value.miscellaneous,
softwareBool: item.value.softwareBool,
software: item.value.software,
version: item.value.version,
license: item.value.license,
networkBool: item.value.networkBool,
IPv4: item.value.IPv4,
IPv6: item.value.IPv6,
MAC: item.value.MAC,
subnetmask: item.value.subnetmask,
}
);
} catch (err) {
console.log(err);
}
} else {
if (item.value.IPv4 == null) {
inputIPv4.value = "";
} else {
inputIPv4.value = item.value.IPv4;
}
alert("You have entered an invalid IPv4 address, please choose a valid one!");
}
if (validateIPv6address(inputIPv6.value)) {
item.value.IPv6 = inputIPv6.value;
try {
await Axios.put(
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/updateConfigItem`,
{
primaryID: item.value.primaryID,
assetName: item.value.assetName,
customerID: item.value.customerID,
customer: item.value.customer,
location: item.value.location,
remoteLocation: item.value.remoteLocation,
type: item.value.type,
description: item.value.description,
notes: item.value.notes,
state: item.value.state,
lastView: item.value.lastView,
user: item.value.user,
hardwareBool: item.value.hardwareBool,
model: item.value.model,
serialnumber: item.value.serialnumber,
CPU: item.value.CPU,
RAM: item.value.RAM,
storageConfiguration: item.value.storageConfiguration,
miscellaneous: item.value.miscellaneous,
softwareBool: item.value.softwareBool,
software: item.value.software,
version: item.value.version,
license: item.value.license,
networkBool: item.value.networkBool,
IPv4: item.value.IPv4,
IPv6: item.value.IPv6,
MAC: item.value.MAC,
subnetmask: item.value.subnetmask,
}
);
} catch (err) {
console.log(err);
}
} else {
if (item.value.IPv6 == null) {
inputIPv6.value = "";
} else {
inputIPv6.value = item.value.IPv6;
}
alert("You have entered an invalid IPv6 address, please choose a valid one!");
}
}
onMounted(() => {
getItemById();
});

85
components/server/SoftwareSpecifications.vue
View File

@ -13,7 +13,23 @@
Version</th>
<th :class="['License', darkMode ? 'th-darkmode' : 'th-lightmode']">License</th>
</tr>
<tr :class="['table-row', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
<tr v-if="editable" :class="['table-row', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
<td
:class="['Software', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Software-darkmode' : 'Software-lightmode']">
<input type="text" v-model="item.software" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</td>
<td
:class="['Version', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Version-darkmode' : 'Version-lightmode']">
<input type="text" v-model="item.version" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</td>
<td :class="['License', darkMode ? 'td-darkmode' : 'td-lightmode']">
<input type="text" v-model="item.license" @change="updateConfigItem()"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</td>
</tr>
<tr v-if="!editable" :class="['table-row', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
<td
:class="['Software', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Software-darkmode' : 'Software-lightmode']">
{{ item.software }}</td>
@ -63,6 +79,48 @@ const getItemById = async () => {
}
}
//update data
const updateConfigItem = async () => {
try {
await Axios.put(
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/updateConfigItem`,
{
primaryID: item.value.primaryID,
assetName: item.value.assetName,
customerID: item.value.customerID,
customer: item.value.customer,
location: item.value.location,
remoteLocation: item.value.remoteLocation,
type: item.value.type,
description: item.value.description,
notes: item.value.notes,
state: item.value.state,
lastView: item.value.lastView,
user: item.value.user,
hardwareBool: item.value.hardwareBool,
model: item.value.model,
serialnumber: item.value.serialnumber,
CPU: item.value.CPU,
RAM: item.value.RAM,
storageConfiguration: item.value.storageConfiguration,
miscellaneous: item.value.miscellaneous,
softwareBool: item.value.softwareBool,
software: item.value.software,
version: item.value.version,
license: item.value.license,
networkBool: item.value.networkBool,
IPv4: item.value.IPv4,
IPv6: item.value.IPv6,
MAC: item.value.MAC,
subnetmask: item.value.subnetmask,
}
);
await getItemById();
} catch (err) {
console.log(err);
}
}
onMounted(() => {
getItemById();
});
@ -208,4 +266,29 @@ th {
.License {
width: 25%;
}
.input {
border: none;
}
.data-darkmode {
background-color: #212121;
color: #fff;
}
.data-lightmode {
background-color: #EBEBEB;
color: #000;
}
.data {
display: flex;
flex-direction: row;
align-items: flex-start;
padding: 0 0.625rem;
border-radius: 0.3125rem;
box-shadow: 0.0625rem 0.0625rem 0.25rem 0rem rgba(0, 0, 0, 0.25) inset;
letter-spacing: 5%;
font: 400 0.75rem/250% Overpass, sans-serif;
}
</style>

21
server/api/updateConfigItem.ts Normal file
View File

@ -0,0 +1,21 @@
import { errorMsg } from "../middleware/configItems";
import { OutgoingMessage } from 'http';
export default defineEventHandler(async (event) => {
const headers: Record<string, Parameters<OutgoingMessage['setHeader']>[1]> = {
'Access-Control-Allow-Origin': 'https://tueitapp.tueit.de',
'Access-Control-Allow-Headers': 'authorization, content-type',
'Access-Control-Allow-Methods': 'GET,HEAD,PUT,PATCH,POST,DELETE',
};
setResponseHeaders(event, headers)
if (!(errorMsg === '')) {
throw createError({
statusCode: 400,
statusMessage: errorMsg,
})
}
setResponseStatus(event, 200)
})

28
server/middleware/configItems.ts
View File

@ -79,6 +79,34 @@ export default defineEventHandler(async (event) => {
}
}
}
if (event.path.startsWith("/api/updateConfigItem")) {
const body = await readBody(event)
// update the config item in the backend
try {
let res = await axiosInstance.put(`https://${serversideConfig.url}:${serversideConfig.port}/configItem`, body);
} catch (err) {
if (axios.isAxiosError(err)) {
const axiosError = err as AxiosError;
if (axiosError.response) {
// Axios error
console.error(axiosError.response.data.message);
errorMsg = axiosError.response.data.message;
} else if (axiosError.request) {
console.log(err)
// If error was caused by the request
console.error(axiosError.request);
} else {
// Other errors
console.error('Error', axiosError.message);
}
} else {
// No AxiosError
console.error('Error', err);
}
}
}
})
export { configItems, configItem, errorMsg };