fixed small bugs and made comment fields bigger
This commit is contained in:
@ -14,12 +14,12 @@
|
||||
:class="['Task', darkMode ? 'th-darkmode' : 'th-lightmode', darkMode ? 'Task-darkmode' : 'Task-lightmode']">
|
||||
Task</th>
|
||||
<th
|
||||
:class="['Comments', darkMode ? 'th-darkmode' : 'th-lightmode', darkMode ? 'Comments-darkmode' : 'Comments-lightmode']">
|
||||
:class="['Comments', darkMode ? 'th-darkmode' : 'th-lightmode', darkMode && !addBool ? 'Comments-darkmode' : '', !darkMode && !addBool ? 'Comments-lightmode' : '']">
|
||||
Comments</th>
|
||||
<th v-if="!addBool" :class="['Done', darkMode ? 'th-darkmode' : 'th-lightmode']">Done</th>
|
||||
</tr>
|
||||
<tr v-for="todo in mviTodos" :key="todo.primaryID"
|
||||
:class="['table-row', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
|
||||
:class="['table-row-data', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
|
||||
<td
|
||||
:class="['Step', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Step-darkmode' : 'Step-lightmode']">
|
||||
{{ todo.rowID }}</td>
|
||||
@ -29,12 +29,11 @@
|
||||
<td
|
||||
:class="['Task', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Task-darkmode' : 'Task-lightmode']">
|
||||
{{ todo.task }}</td>
|
||||
<td v-if="!editable"
|
||||
:class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Comments-darkmode' : 'Comments-lightmode']">
|
||||
{{ todo.comments }}</td>
|
||||
<td v-if="editable" :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"> <input
|
||||
type="text" v-model="todo.comments" @change="updateMVITodo(todo)"
|
||||
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
|
||||
<td
|
||||
:class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode && !addBool ? 'Comments-darkmode' : '', !darkMode && !addBool ? 'Comments-lightmode' : '']">
|
||||
<textarea type="text" v-model="todo.comments" :readonly="!editable"
|
||||
@change="updateMVITodo(todo)"
|
||||
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']"> </textarea>
|
||||
</td>
|
||||
<td v-if="!addBool" :class="['Done', darkMode ? 'td-darkmode' : 'td-lightmode']"><input
|
||||
@change="toggleTodo(todo)" type="checkbox" v-model="todo.done"
|
||||
@ -74,7 +73,7 @@ const newCustomerMVI = computed(() => store.state.newCustomerMVI);
|
||||
const newTemplateNotesMVI = computed(() => store.state.newTemplateNotesMVI);
|
||||
const newTypeMVI = computed(() => store.state.newTypeMVI);
|
||||
const newTimeSpentMVI = computed(() => store.state.newTimeSpentMVI);
|
||||
const newNotesMVI = computed(() => store.state.newNotes);
|
||||
const newNotesMVI = computed(() => store.state.newNotesMVI);
|
||||
const editable = computed(() => store.state.editable);
|
||||
|
||||
const darkMode = ref('');
|
||||
@ -97,7 +96,12 @@ const getMVITodosById = async () => {
|
||||
const response = await Axios.get(
|
||||
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getTodosMaintenanceVisitTemplate/${chosenMVTId.value}`
|
||||
);
|
||||
mviTodos.value = response.data;
|
||||
const mviTodosComment = response.data;
|
||||
// change the commets to comments
|
||||
mviTodos.value = mviTodosComment.map(obj => {
|
||||
const { commets: comments, ...rest } = obj;
|
||||
return { ...rest, comments };
|
||||
});
|
||||
store.commit('updateMaintenanceVisitInstanceTemplateID', chosenMVTId.value)
|
||||
} catch (err) {
|
||||
console.log(err.response.statusText);
|
||||
@ -107,7 +111,12 @@ const getMVITodosById = async () => {
|
||||
const response = await Axios.get(
|
||||
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getTodosMaintenanceVisitTemplate/${newTemplateIDMVI.value}`
|
||||
);
|
||||
mviTodos.value = response.data;
|
||||
const mviTodosComment = response.data;
|
||||
// change the commets to comments
|
||||
mviTodos.value = mviTodosComment.map(obj => {
|
||||
const { commets: comments, ...rest } = obj;
|
||||
return { ...rest, comments };
|
||||
});
|
||||
} catch (err) {
|
||||
console.log(err.response.statusText);
|
||||
}
|
||||
@ -117,7 +126,7 @@ const getMVITodosById = async () => {
|
||||
`https://${clientsideConfig.url}:${clientsideConfig.port}/api/getTodosMaintenanceVisitInstance/${chosenMVIId.value}`
|
||||
);
|
||||
const mviTodosComment = response.data;
|
||||
// change the comment und step field name to comments and rowID
|
||||
// change the comment and step field name to comments and rowID
|
||||
mviTodos.value = mviTodosComment.map(obj => {
|
||||
const { step: rowID, comment: comments, ...rest } = obj;
|
||||
return { ...rest, rowID, comments };
|
||||
@ -231,6 +240,7 @@ const addMVI = async () => {
|
||||
notes: newNotesMVI.value,
|
||||
});
|
||||
store.commit('resetStore');
|
||||
store.commit('deactivateSearch');
|
||||
store.commit('changeToInstancelist');
|
||||
store.commit('seeAllIcon');
|
||||
mviTodos.value.forEach(async todo => {
|
||||
@ -328,6 +338,14 @@ export default {
|
||||
gap: 0.625rem;
|
||||
}
|
||||
|
||||
.table-row-data {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 0.625rem;
|
||||
gap: 0.625rem;
|
||||
}
|
||||
|
||||
.saveNewMVI-darkmode {
|
||||
background: #2c2c2c;
|
||||
color: #fff;
|
||||
@ -391,6 +409,10 @@ td {
|
||||
font: 400 0.875rem/1.875rem Overpass, sans-serif;
|
||||
}
|
||||
|
||||
td {
|
||||
height: 5rem;
|
||||
}
|
||||
|
||||
th {
|
||||
font: 700 0.875rem/1.875rem Overpass, sans-serif;
|
||||
}
|
||||
@ -501,4 +523,10 @@ th {
|
||||
.label-lightmode {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
textarea {
|
||||
resize: none;
|
||||
width: 20rem;
|
||||
height: 5rem;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user