implemented mode change

This commit is contained in:
2024-03-25 23:23:37 +01:00
parent 45a4b58f26
commit 3f88f6b821
71 changed files with 3020 additions and 1006 deletions

View File

@ -42,16 +42,18 @@
<input type="text" v-model="todo.task" @change="updateMVTTodo(todo)"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']">
</td>
<td v-if="!editable" :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"> {{ todo.commets
}}</td>
<td v-if="editable" :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"> <input type="text"
v-model="todo.commets" @change="updateMVTTodo(todo)"
<td v-if="!editable" :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"> {{
todo.commets
}}</td>
<td v-if="editable" :class="['Comments', darkMode ? 'td-darkmode' : 'td-lightmode']"> <input
type="text" v-model="todo.commets" @change="updateMVTTodo(todo)"
:class="['data', 'input', darkMode ? 'data-darkmode' : 'data-lightmode']"> <button
:class="[darkMode ? 'deleteMvtTodos-darkmode' : 'deleteMvtTodos-lightmode']"
@click="deleteMVTTodo(todo.primaryID)">-</button>
</td>
</tr>
<tr v-if="editable && addRow" :class="['table-row', darkMode ? 'tr-darkmode' : 'tr-lightmode']" id="row-1">
<tr v-if="editable && addRow" :class="['table-row', darkMode ? 'tr-darkmode' : 'tr-lightmode']"
id="row-1">
<td
:class="['Step', darkMode ? 'td-darkmode' : 'td-lightmode', darkMode ? 'Step-darkmode' : 'Step-lightmode']">
{{ newStepTodo }}
@ -141,7 +143,7 @@
<button :class="[darkMode ? 'saveNewMVT-darkmode' : 'saveNewMVT-lightmode']" @click="addMVT()">Save</button>
</section>
</template>
<script setup>
import { ref, onMounted, watch } from 'vue';
@ -153,6 +155,8 @@ import { computed } from 'vue';
// Vue.use(VueInputAutowidth);
const store = useStore();
const modeChanged = computed(() => store.state.updateDarkMode);
const addBool = computed(() => store.state.new);
const editable = computed(() => store.state.editable);
@ -168,7 +172,7 @@ const chosenMVTId = computed(() => store.state.chosenMVTId);
const customerChanged = computed(() => store.state.customerChanged);
const changedCustomerId = computed(() => store.state.changedCustomerId);
const darkMode = ref(true)
const darkMode = ref('');
const addRow = ref(false);
const configItemList = ref([]);
const maintenanceVisitTemplates = ref([]);
@ -417,11 +421,30 @@ const deleteMVTTodo = async (id) => {
await getMvtTodosById();
}
watch(customerChanged, getMVTById);
const getSession = async () => {
const loggedInUserDarkModeBool = getItem('logged-in-user-darkMode');
if (loggedInUserDarkModeBool == 1) {
darkMode.value = true;
} else {
darkMode.value = false;
}
}
onMounted(() => {
getMvtTodosById();
getMVTById();
function getItem(item) {
if (process.client) {
return localStorage.getItem(item)
} else {
return undefined
}
}
watch(customerChanged, getMVTById);
watch(modeChanged, getSession)
onMounted(async () => {
getSession();
await getMvtTodosById();
await getMVTById();
triggerBackendCallsWithDelay(getMaintenanceVisitTemplates);
});
</script>
@ -430,9 +453,9 @@ onMounted(() => {
export default {
name: "TemplateChecklist",
};
</script>
</script>
<style scoped>
.data {
display: flex;