diff --git a/backend/controller/maintenanceVisits.js b/backend/controller/maintenanceVisits.js index d22243d..e8d9d27 100644 --- a/backend/controller/maintenanceVisits.js +++ b/backend/controller/maintenanceVisits.js @@ -10,6 +10,8 @@ import { getMaintenanceVisitByName, getMaintenanceVisitById, updateMaintenanceVisitStateById, + getSelectedMaintenanceVisitsByUser, + getSelectedMaintenanceVisitsByTemplate, } from "../models/maintenanceVisitsModel.js"; //get all maintenance visits @@ -34,6 +36,28 @@ export const showSelectedMaintenanceVisitsByChecklistname = (req, res) => { }); }; +//get all selected maintenance visits by user +export const showSelectedMaintenanceVisitsByUser = (req, res) => { + getSelectedMaintenanceVisitsByUser(req.params.id, (err, results) => { + if (err) { + res.send(err); + } else { + res.json(results); + } + }); +}; + +//get all selected maintenance visits by template +export const showSelectedMaintenanceVisitsByTemplate = (req, res) => { + getSelectedMaintenanceVisitsByTemplate(req.params.id, (err, results) => { + if (err) { + res.send(err); + } else { + res.json(results); + } + }); +}; + //get all selected maintenance visits by customer export const showSelectedMaintenanceVisitsByCustomer = (req, res) => { getSelectedMaintenanceVisitsByCustomer(req.params.id, (err, results) => { diff --git a/backend/controller/productionOrders.js b/backend/controller/productionOrders.js index d492904..91ee5d4 100644 --- a/backend/controller/productionOrders.js +++ b/backend/controller/productionOrders.js @@ -10,7 +10,9 @@ import { getProductionOrderByName, deleteProductionOrderById, getProductionOrderById, - updateProductionOrderStateById, + updateProductionOrderById, + getSelectedProductionOrdersByTemplate, + getSelectedProductionOrdersByUser, } from "../models/productionOrdersModel.js"; //get all production orders @@ -46,6 +48,28 @@ export const showSelectedProductionOrdersByCustomer = (req, res) => { }); }; +//get all selected production orders by user +export const showSelectedProductionOrdersByUser = (req, res) => { + getSelectedProductionOrdersByUser(req.params.id, (err, results) => { + if (err) { + res.send(err); + } else { + res.json(results); + } + }); +}; + +//get all selected production orders by template +export const showSelectedProductionOrdersByTemplate = (req, res) => { + getSelectedProductionOrdersByTemplate(req.params.id, (err, results) => { + if (err) { + res.send(err); + } else { + res.json(results); + } + }); +}; + //get all selected production orders by ticketnumber export const showSelectedProductionOrdersByTicketnumber = (req, res) => { getSelectedProductionOrdersByTicketnumber(req.params.id, (err, results) => { @@ -126,9 +150,9 @@ export const showProductionOrderById = (req, res) => { }; // Update production order -export const updateProductionOrderState = (req, res) => { +export const updateProductionOrder = (req, res) => { const data = req.body; - updateProductionOrderStateById(data, (err, results) => { + updateProductionOrderById(data, (err, results) => { if (err) { res.send(err); } else { diff --git a/backend/models/maintenanceVisitsModel.js b/backend/models/maintenanceVisitsModel.js index d699fc4..682e1cf 100644 --- a/backend/models/maintenanceVisitsModel.js +++ b/backend/models/maintenanceVisitsModel.js @@ -28,6 +28,34 @@ export const getSelectedMaintenanceVisitsByChecklistname = async (selected, resu } }; +//get all selected maintenance visits by template +export const getSelectedMaintenanceVisitsByTemplate = async (selected, result) => { + try { + let sql = `SELECT * FROM maintenancevisits WHERE templateID = ? ORDER BY name ASC`; + const results = await ownConn.execute(sql, [id]) + result(null, results); + } + catch (err) { + // Manage Errors + console.log("SQL error : ", err); + result(err, null); + } +}; + +//get all selected maintenance visits by user +export const getSelectedMaintenanceVisitsByUser = async (selected, result) => { + try { + let sql = `SELECT * FROM maintenancevisits WHERE LOWER(user) LIKE '%${selected.toLowerCase()}%' ORDER BY name ASC`; + const results = await ownConn.execute(sql) + result(null, results); + } + catch (err) { + // Manage Errors + console.log("SQL error : ", err); + result(err, null); + } +}; + //get all selected maintenance visits by customer export const getSelectedMaintenanceVisitsByCustomer = async (selected, result) => { try { diff --git a/backend/models/productionOrdersModel.js b/backend/models/productionOrdersModel.js index b727c8a..8daebfa 100644 --- a/backend/models/productionOrdersModel.js +++ b/backend/models/productionOrdersModel.js @@ -17,7 +17,7 @@ export const getProductionOrders = async (result) => { //get all selected production orders by ticketnumber export const getSelectedProductionOrdersByTicketnumber = async (selected, result) => { try { - let sql = `SELECT * FROM productionorders WHERE ticketNumber LIKE '%${selected}%' ORDER BY ticketNumber ASC`; + let sql = `SELECT * FROM productionorders WHERE ticketNumber = ? ORDER BY name ASC`; const results = await ownConn.execute(sql) result(null, results); } @@ -42,6 +42,34 @@ export const getSelectedProductionOrdersByCustomer = async (selected, result) => } }; +//get all selected production orders by user +export const getSelectedProductionOrdersByUser = async (selected, result) => { + try { + let sql = `SELECT * FROM productionorders WHERE LOWER(user) LIKE '%${selected.toLowerCase()}%' ORDER BY name ASC`; + const results = await ownConn.execute(sql) + result(null, results); + } + catch (err) { + // Manage Errors + console.log("SQL error : ", err); + result(err, null); + } +}; + +//get all selected production orders by template +export const getSelectedProductionOrdersByTemplate = async (selected, result) => { + try { + let sql = `SELECT * FROM productionorders WHERE templateID = ? ORDER BY name ASC`; + const results = await ownConn.execute(sql, [selected]) + result(null, results); + } + catch (err) { + // Manage Errors + console.log("SQL error : ", err); + result(err, null); + } +}; + //get all selected production orders by state export const getSelectedProductionOrdersByState = async (selected, result) => { try { @@ -141,11 +169,11 @@ export const getProductionOrderById = async (id, result) => { }; // Update production order state to Database -export const updateProductionOrderStateById = async (data, result) => { +export const updateProductionOrderById = async (data, result) => { const id = data.ticketNumber; try { - let sql = `UPDATE productionorders SET state = ? WHERE ticketNumber = ?`; - const results = await ownConn.query(sql, [data.state, id]) + let sql = `UPDATE productionorders SET name = ?, templateID = ?, customer = ?, customerID = ?, asset = ?, state = ?, creationDate = ?, completionDate = ?, user = ?, templateDescription = ?, templateNotes = ?, timeSpent = ?, notes = ? WHERE ticketNumber = ?`; + const results = await ownConn.query(sql, [data.name, data.templateID, data.customer, data.customerID, data.asset, data.state, data.creationDate, data.completionDate, data.user, data.templateDescription, data.templateNotes, data.timeSpent, data.notes, id]) results.insertId = results.insertId.toString(); result(null, results); } diff --git a/backend/routes/routes.js b/backend/routes/routes.js index 05fbf96..c6b2d77 100644 --- a/backend/routes/routes.js +++ b/backend/routes/routes.js @@ -19,6 +19,8 @@ import { showSelectedMaintenanceVisitsByCustomer, showSelectedMaintenanceVisitsByState, showSelectedMaintenanceVisitsByDate, + showSelectedMaintenanceVisitsByTemplate, + showSelectedMaintenanceVisitsByUser, deleteMaintenanceVisit, createMaintenanceVisit, showMaintenanceVisitByName, @@ -60,11 +62,13 @@ import { showSelectedProductionOrdersByTicketnumber, showSelectedProductionOrdersByDate, showSelectedProductionOrdersByState, + showSelectedProductionOrdersByTemplate, + showSelectedProductionOrdersByUser, deleteProductionOrder, createProductionOrder, showProductionOrderByName, showProductionOrderById, - updateProductionOrderState, + updateProductionOrder, } from "../controller/productionOrders.js"; import { @@ -409,6 +413,12 @@ router.get("/selectedProductionOrdersByCustomer/:id", showSelectedProductionOrde //get all production orders by selected state router.get("/selectedProductionOrdersByState/:id", showSelectedProductionOrdersByState) +//get all production orders by selected template +router.get("/selectedProductionOrdersByTemplate/:id", showSelectedProductionOrdersByTemplate) + +//get all production orders by selected user +router.get("/selectedProductionOrdersByUser/:id", showSelectedProductionOrdersByUser) + //get all production orders by selected date router.get("/selectedProductionOrdersByDate/:id", showSelectedProductionOrdersByDate) @@ -424,9 +434,8 @@ router.get("/productionOrderByName/:id", showProductionOrderByName); //get single production order by ticketNumber router.get("/productionOrder/:id", showProductionOrderById); -// Update production order state -router.put("/productionOrderState", updateProductionOrderState); - +// Update production order +router.put("/productionOrder", updateProductionOrder); // routes with production order todos: @@ -442,7 +451,7 @@ router.get("/productionOrderTodosByAsset/:id", showProductionOrderTodosByAsset); // Update production order todo router.put("/productionOrderTodos", updateProductionOrderTodo); -// Delete production order todos +// Delete production order todo router.delete("/productionOrderTodos/:id", deleteProductionOrderTodos); @@ -460,6 +469,12 @@ router.get("/selectedMaintenanceVisitsByDate/:id", showSelectedMaintenanceVisits //get all maintenance visits by selected customer router.get("/selectedMaintenanceVisitsByCustomer/:id", showSelectedMaintenanceVisitsByCustomer) +//get all maintenance visits by selected user +router.get("/selectedMaintenanceVisitsByUser/:id", showSelectedMaintenanceVisitsByUser) + +//get all maintenance visits by selected template +router.get("/selectedMaintenanceVisitsByTemplate/:id", showSelectedMaintenanceVisitsByTemplate) + //get all maintenance visits by selected state router.get("/selectedMaintenanceVisitsByState/:id", showSelectedMaintenanceVisitsByState) diff --git a/components/TemplateSearch.vue b/components/TemplateSearch.vue index 8daa560..96ada2e 100644 --- a/components/TemplateSearch.vue +++ b/components/TemplateSearch.vue @@ -1,7 +1,7 @@ @@ -10,10 +10,18 @@ import { ref, onMounted, watch } from 'vue'; import { useStore } from 'vuex'; import { computed } from 'vue'; +import Axios from '../axios.config.js'; +import clientsideConfig from '../../clientsideConfig.js'; +const route = useRoute() +const id = computed(() => route) const store = useStore(); const modeChanged = computed(() => store.state.updateDarkMode); +const template = ref({}); +const chosenMVTId = computed(() => store.state.chosenMVTId); +const chosenPOTId = computed(() => store.state.chosenPOTId); + const darkMode = ref(''); const getSession = async () => { @@ -25,6 +33,29 @@ const getSession = async () => { } } +// get maintenance visit template from id +const getMVTById = async () => { + if (id.value.fullPath == '/maintenanceVisits') { + try { + const response = await Axios.get( + `https://${clientsideConfig.url}:${clientsideConfig.port}/api/getMaintenanceVisitTemplate/${chosenMVTId.value}` + ); + template.value = response.data; + } catch (err) { + console.log(err.response.statusText); + } + } else if (id.value.fullPath == '/productionOrders') { + try { + const response = await Axios.get( + `https://${clientsideConfig.url}:${clientsideConfig.port}/api/getProductionOrderTemplate/${chosenPOTId.value}` + ); + template.value = response.data; + } catch (err) { + console.log(err.response.statusText); + } + } +} + function getItem(item) { if (process.client) { return localStorage.getItem(item) @@ -36,7 +67,8 @@ function getItem(item) { watch(modeChanged, getSession) onMounted(async () => { - await getSession(); + getSession(); + await getMVTById(); }); diff --git a/components/server/AssetSolutionList.vue b/components/server/AssetSolutionList.vue index ac783e2..4fc3118 100644 --- a/components/server/AssetSolutionList.vue +++ b/components/server/AssetSolutionList.vue @@ -159,7 +159,7 @@ watch(modeChanged, getSession) onMounted(async () => { await getSession(); - getItemById(); + await getItemById(); }); diff --git a/components/server/MaintenanceVisitsInstanceTable.vue b/components/server/MaintenanceVisitsInstanceTable.vue index b3dd61b..95fd64d 100644 --- a/components/server/MaintenanceVisitsInstanceTable.vue +++ b/components/server/MaintenanceVisitsInstanceTable.vue @@ -1,4 +1,14 @@ - @@ -162,6 +268,28 @@ td { color: #000; } +.data-darkmode { + background-color: #212121; + color: #fff; +} + +.data-lightmode { + background-color: #EBEBEB; + color: #000; +} + +.mvi-search { + display: flex; + align-items: center; + padding: 0.625em 1.875em; + gap: 1.25em; + width: 30.125em; + height: 3.125em; + box-shadow: 0.25em 0.25em 0.25em rgba(0, 0, 0, 0.25); + border-radius: 0.625em; + box-sizing: border-box; +} + th { font: 700 0.875rem/1.875rem Overpass, sans-serif; } @@ -249,4 +377,50 @@ th { .label-lightmode { color: #000; } + +.input { + border: none; +} + +#nuxt-link { + text-decoration: none; +} + +.nuxt-link-darkmode { + color: white; +} + +.nuxt-link-lightmode { + color: #000; +} + +.dataInput { + 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; +} + +.instanceLabel { + width: 5.5625em; + height: 1.875em; + font-family: "Overpass"; + font-style: normal; + font-weight: 400; + font-size: 0.875em; + line-height: 1.875; + letter-spacing: 0.05em; +} + +.section-darkmode { + background-color: #2c2c2c; +} + +.section-lightmode { + background-color: #fff; +} \ No newline at end of file diff --git a/components/server/ProductionOrdersInstance.vue b/components/server/ProductionOrdersInstance.vue index f877864..5eb2317 100644 --- a/components/server/ProductionOrdersInstance.vue +++ b/components/server/ProductionOrdersInstance.vue @@ -1,16 +1,26 @@ @@ -82,12 +213,253 @@ import { ref, onMounted, watch } from 'vue'; import { useStore } from 'vuex'; import { computed } from 'vue'; +import Axios from '../axios.config.js'; +import clientsideConfig from '../../clientsideConfig.js'; const store = useStore(); const modeChanged = computed(() => store.state.updateDarkMode); +const editable = computed(() => store.state.editable); +const chosenPOIId = computed(() => store.state.chosenPOIId); +const chosenPOTId = computed(() => store.state.chosenPOTId); +const deleteBool = computed(() => store.state.deleteBool); +const addBool = computed(() => store.state.new); + const darkMode = ref(''); +const poi = ref({}); +const customers = ref([]); +const customer = ref({}); +const productionOrderInstances = ref([]); +const assets = ref([]); + +const newName = ref(''); +const newCustomerID = ref(''); +const newCustomer = ref(''); +const newUser = ref(''); +const newState = ref(''); +const newNotes = ref(''); +const newTemplateDescription = ref(''); +const newTemplateNotes = ref(''); +const newAsset = ref(''); +const newCompletionDate = ref(''); +const newTimeSpent = ref(''); + +//get all customers +const getCustomers = async () => { + try { + const response = await Axios.get(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getAllCustomers` + ); + customers.value = response.data; + } catch (err) { + console.log(err.response.statusText); + } +} + +const confirmDeletePOI = async () => { + if (deleteBool.value === true) { + if (confirm("Do you really want to delete this production order instance? It cannot be undone!")) { + try { + await Axios.delete(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/deleteProductionOrderInstance/${chosenPOIId.value}`); + } catch (err) { + console.log(err.response.statusText); + } + try { + await Axios.delete(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/deleteTodosPOI/${chosenPOIId.value}`); + } catch (err) { + console.log(err.response.statusText); + } + store.commit('undoDelete'); + store.commit('resetStore'); + store.commit('changeToTemplatelist'); + } else { + store.commit('undoDelete'); + } + } +} + +//get all productionOrder instances +const getProductionOrderInstances = async () => { + try { + const response = await Axios.get(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getAllProductionOrderInstances`); + productionOrderInstances.value = response.data; + } catch (err) { + console.log(err.response.statusText); + } +} + +//update data +const updatePOI = async () => { + if (poi.value.name.trim() === "") { + alert("Please add a production order instance name!"); + return; + } else { + var counter = 0; + // check if production order instance name already exists + productionOrderInstances.value.forEach(p => { + if (p.name === poi.value.name) { + counter += 1; + } + }); + if (counter == 2) { + alert("This production order instance name already exists. Please choose an unique production order instance name or modify respectively delete the old one!"); + poi.value.name = ''; + return; + } + try { + await Axios.put( + `https://${clientsideConfig.url}:${clientsideConfig.port}/api/updateProductionOrderInstance`, + { + ticketNumber: poi.value.ticketNumber, + name: poi.value.name, + templateID: poi.value.templateID, + customerID: poi.value.customerID, + customer: poi.value.customer, + asset: poi.value.asset, + state: poi.value.state, + creationDate: poi.value.creationDate, + completionDate: poi.value.completionDate, + user: poi.value.user, + templateDescription: poi.value.templateDescription, + templateNotes: poi.value.templateNotes, + timeSpent: poi.value.timeSpent, + notes: poi.value.notes, + } + ) + await getPOIById(); + } catch (err) { + console.log(err.response.statusText); + } + } +} + +// add new production order instance +const addPOI = async () => { + // check if all input data is valid + if (newName.value.trim() === "") { + alert("Please add a production order instance name!"); + return; + } else { + var counter = 0; + if (!(productionOrderInstances.value.length == null)) { + // check if production order instance name already exists + productionOrderInstances.value.forEach(p => { + if (p.name === newName.value) { + counter += 1; + } + }); + if (counter == 1) { + alert("This production order instance name already exists. Please choose an unique production order instance name or modify respectively delete the old one!"); + return; + } + } + } + if (newCustomer.value.length === 0) { + alert("Please choose a customer!"); + return; + } + // get the time and date + const today = new Date(); + const date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate(); + const time = today.getHours() + ":" + today.getMinutes(); + const dateTime = date + ' ' + time; + // add todos + // let allFine = true; + // newTodos.forEach(todo => { + // if (todo.asset.length === 0) { + // alert(`Please choose a config item for all todos.`); + // allFine = false + // } + // }) + // if (!allFine) { + // return + // } + try { + const response = await Axios.post(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/addPOI`, + { + name: newName.value, + templateID: chosenPOTId.value, + customerID: newCustomerID.value, + customer: newCustomer.value, + asset: newAsset.value, + state: newState.value, + creationDate: dateTime, + completionDate: newCompletionDate.value, + user: newUser.value, + templateDescription: newTemplateDescription.value, + templateNotes: newTemplateNotes.value, + timeSpent: newTimeSpent.value, + notes: newNotes.value, + }); + store.commit('resetStore'); + store.commit('changeToTemplatelist'); + // newTodos.forEach(async todo => { + // try { + // const res = await Axios.post(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/addTodoPOT`, + // { + // templateID: response.data, + // rowID: todo.rowID, + // asset: todo.asset, + // task: todo.task, + // comment: todo.comments, + // }); + // } catch (err) { + // console.log(err.response.statusText); + // } + // }) + } catch (err) { + // console.log(err.response.statusText); + console.log(err); + } +} + +// update customerid if customer was changed +const updateCustomerID = async () => { + try { + const response = await Axios.get(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getCustomerByName/${poi.value.customer}`); + customer.value = response.data; + poi.value.customerID = customer.value.customerID; + store.commit('toggleCustomerChanged'); + store.commit('toggleCustomerId', poi.value.customerID); + } catch (err) { + console.log(err.response.statusText); + } + await updatePOI(); +} + +// get production order instance from id +const getPOIById = async () => { + if (!addBool.value) { + try { + const response = await Axios.get( + `https://${clientsideConfig.url}:${clientsideConfig.port}/api/getProductionOrderInstance/${chosenPOIId.value}` + ); + poi.value = response.data; + } catch (err) { + console.log(err.response.statusText); + } + } + await getConfigItemsFromCustomer(); +} + +// update customerid if customer was changed +const updateNewCustomerID = async () => { + try { + const response = await Axios.get(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getCustomerByName/${newCustomer.value}`); + newCustomerID.value = response.data.customerID; + } catch (err) { + console.log(err.response.statusText); + } + await getConfigItemsFromCustomer(); +} + +// include delay to avoid 503 error +const triggerBackendCallsWithDelay = async (fetchDataFunc) => { + setTimeout(() => { + fetchDataFunc(); + }, 1500); +} + const getSession = async () => { const loggedInUserDarkModeBool = getItem('logged-in-user-darkMode'); if (loggedInUserDarkModeBool == 1) { @@ -97,6 +469,27 @@ const getSession = async () => { } } +//get all config items from the selected customer +const getConfigItemsFromCustomer = async () => { + if (!addBool.value) { + try { + const response = await Axios.get(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getCIFromCustomer/${poi.value.customerID}`); + assets.value = response.data; + } catch (err) { + console.log(err.response.statusText); + } + } else { + if (newCustomerID.value.length != 0) { + try { + const response = await Axios.get(`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getCIFromCustomer/${newCustomerID.value}`); + assets.value = response.data; + } catch (err) { + console.log(err.response.statusText); + } + } + } +} + function getItem(item) { if (process.client) { return localStorage.getItem(item) @@ -105,10 +498,14 @@ function getItem(item) { } } -watch(modeChanged, getSession) +watch(modeChanged, getSession); +watch(deleteBool, confirmDeletePOI); onMounted(async () => { - await getSession(); + getSession(); + await getPOIById(); + await getProductionOrderInstances(); + triggerBackendCallsWithDelay(getCustomers); }); @@ -131,6 +528,17 @@ export default { box-shadow: 0.25rem 0.25rem 0.25rem 0rem rgba(0, 0, 0, 0.25); } +.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; +} + .section-darkmode { background-color: #2c2c2c; } @@ -139,7 +547,13 @@ export default { background-color: #fff; } +.h2-input-darkmode { + background-color: #212121; +} +.h2-input-lightmode { + background-color: #EBEBEB; +} .production-orders-instance-name { align-self: stretch; @@ -150,6 +564,42 @@ export default { sans-serif; } +.saveNewPOI-darkmode { + background: #2c2c2c; + color: #fff; + font: 400 0.875rem/1.875rem Overpass, sans-serif; + border: none; + padding: 1rem 1.875rem; + width: 8%; + border-radius: 0.625rem; + box-shadow: 0.25rem 0.25rem 0.25rem 0rem rgba(0, 0, 0, 0.25); +} + +.saveNewPOI-lightmode { + background: #EBEBEB; + color: #212121; + font: 400 0.875rem/1.875rem Overpass, sans-serif; + border: none; + padding: 1rem 1.875rem; + width: 8%; + border-radius: 0.625rem; + box-shadow: 0.25rem 0.25rem 0.25rem 0rem rgba(0, 0, 0, 0.25); +} + +.saveNewPOI-darkmode:hover { + background-color: #444444; + cursor: pointer; +} + +.saveNewPOI-lightmode:hover { + background-color: #ACACAC; + cursor: pointer; +} + +#saveNewPOI { + text-align: center; +} + .h2-darkmode { color: #fff; } @@ -158,6 +608,16 @@ export default { color: #000; } +.data-darkmode { + background-color: #212121; + color: #fff; +} + +.data-lightmode { + background-color: #EBEBEB; + color: #000; +} + .data-field { display: flex; flex-direction: row; @@ -216,17 +676,6 @@ export default { 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; -} - .data-darkmode { background-color: #212121; color: #fff; @@ -268,6 +717,28 @@ export default { border-radius: 0.3125rem; } +.h2-darkmode { + color: #fff; +} + +.h2-lightmode { + color: #000; +} + +.input { + border: none; +} + +.poi-name-input { + /* padding: 1rem 0; */ + margin: 1rem; + font-size: initial; + letter-spacing: 5%; + text-decoration-line: underline; + font: italic 400 1rem/187.5% Overpass, -apple-system, Roboto, Helvetica, + sans-serif; +} + .additional { display: flex; flex-direction: column; @@ -280,7 +751,7 @@ export default { } div#customer { - padding-left: 2.9em; + padding-left: 4.4em; } .area-title { @@ -314,4 +785,20 @@ div#customer { padding: 0.625rem 1.875rem 0.625rem 1.25rem; padding-top: 0rem; } + +.select-lightmode { + border: none; + color: black; + background: #EBEBEB; + padding: 0.4rem; + border-radius: 0.3125rem; +} + +.select-darkmode { + border: none; + color: white; + background: #212121; + padding: 0.4rem; + border-radius: 0.3125rem; +} \ No newline at end of file diff --git a/components/server/ProductionOrdersInstanceTable.vue b/components/server/ProductionOrdersInstanceTable.vue index f54c43a..f4e7558 100644 --- a/components/server/ProductionOrdersInstanceTable.vue +++ b/components/server/ProductionOrdersInstanceTable.vue @@ -1,12 +1,19 @@