added update config items functionality
This commit is contained in:
@ -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>
|
||||
Reference in New Issue
Block a user