add config item
This commit is contained in:
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<section v-if="hardwareBoolean" :class="['hardware-information', darkMode ? 'section-darkmode' : 'section-lightmode']">
|
||||
<section v-if="hardwareBoolean && !addAssetBool"
|
||||
: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">
|
||||
@ -53,6 +54,52 @@
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section v-if="addAssetBool" :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">
|
||||
<div class="data-field" id="model">
|
||||
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">Model:</pre>
|
||||
<input v-model="newModel" @change="updateAsset()"
|
||||
: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>
|
||||
<input v-model="newCPU" @change="updateAsset()"
|
||||
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
|
||||
</div>
|
||||
</div>
|
||||
<div class="serial-number-RAM">
|
||||
<div class="data-field" id="serial-number">
|
||||
<pre :class="['label', darkMode ? 'div-darkmode' : 'div-lightmode']">Serial number:</pre>
|
||||
<input v-model="newSerialnumber" @change="updateAsset()"
|
||||
: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>
|
||||
<input v-model="newRAM" @change="updateAsset()"
|
||||
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="asset-data">
|
||||
<div class="additional">
|
||||
<div class="storage-configuration">
|
||||
<h3 :class="['area-title', darkMode ? 'h3-darkmode' : 'h3-lightmode']">Storage configuration:</h3>
|
||||
<input v-model="newStorageConfiguration" @change="updateAsset()"
|
||||
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']"
|
||||
id="storage-configuration">
|
||||
</div>
|
||||
</div>
|
||||
<div class="additional">
|
||||
<div class="miscellaneous">
|
||||
<h3 :class="['area-title', darkMode ? 'h3-darkmode' : 'h3-lightmode']">Miscellaneous:</h3>
|
||||
<input v-model="newMiscellaneous" @change="updateAsset()"
|
||||
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']" id="miscellaneous">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
|
||||
@ -66,6 +113,15 @@ import { computed } from 'vue';
|
||||
const store = useStore();
|
||||
const editable = computed(() => store.state.assetEditable);
|
||||
const chosenAssetId = computed(() => store.state.chosenAssetId);
|
||||
const addAssetBool = computed(() => store.state.newAsset);
|
||||
|
||||
const newHardwareBool = ref(true);
|
||||
const newModel = ref('');
|
||||
const newSerialnumber = ref('');
|
||||
const newCPU = ref('');
|
||||
const newRAM = ref('');
|
||||
const newStorageConfiguration = ref('');
|
||||
const newMiscellaneous = ref('');
|
||||
|
||||
const darkMode = ref(true)
|
||||
const item = ref({});
|
||||
@ -78,10 +134,6 @@ const getItemById = async () => {
|
||||
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getConfigItem/${chosenAssetId.value}`
|
||||
);
|
||||
item.value = response.data;
|
||||
if ((item.value.hardwareBool == 1) && (item.value.model === (null | "")) && (item.value.serialnumber.trim() === "") && (item.value.CPU.trim() === "") && (item.value.RAM.trim() === "") && (item.value.storageConfiguration.trim() === "") && (item.value.miscellaneous.trim() === "")) {
|
||||
item.value.hardwareBool = 0;
|
||||
hardwareBoolean.value = false;
|
||||
};
|
||||
if (item.value.hardwareBool == 1) {
|
||||
hardwareBoolean.value = true;
|
||||
};
|
||||
@ -90,8 +142,28 @@ const getItemById = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
// update hardware fields in the store
|
||||
const updateAsset = () => {
|
||||
if (newModel.value.length === 0 && newSerialnumber.value.length === 0 && newCPU.value.length === 0 && newRAM.value.length === 0 && newStorageConfiguration.value.length === 0 && newMiscellaneous.value.length === 0) {
|
||||
newHardwareBool.value = false
|
||||
}
|
||||
const asset = {
|
||||
hardwareBool: newHardwareBool.value,
|
||||
model: newModel.value,
|
||||
serialnumber: newSerialnumber.value,
|
||||
CPU: newCPU.value,
|
||||
RAM: newRAM.value,
|
||||
storageConfig: newStorageConfiguration.value,
|
||||
miscellaneous: newMiscellaneous.value,
|
||||
};
|
||||
store.commit('updateHardwareComponent', asset);
|
||||
}
|
||||
|
||||
//update data
|
||||
const updateConfigItem = async () => {
|
||||
if (item.value.model.length === 0 && item.value.serialnumber.length === 0 && item.value.CPU.length === 0 && item.value.RAM.length === 0 && item.value.storageConfiguration.length === 0 && item.value.miscellaneous.length === 0) {
|
||||
item.value.hardwareBool = 0;
|
||||
}
|
||||
try {
|
||||
await Axios.put(
|
||||
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/updateConfigItem`,
|
||||
@ -150,7 +222,6 @@ export default {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
padding: 1.25rem 1.875rem;
|
||||
border-radius: 0.625rem;
|
||||
box-shadow: 0.25rem 0.25rem 0.25rem 0rem rgba(0, 0, 0, 0.25);
|
||||
|
||||
Reference in New Issue
Block a user