mirror of
https://github.com/45Drives/cockpit-navigator.git
synced 2025-07-28 16:14:25 +02:00
fix loading settings from fresh install
This commit is contained in:
joshuaboud
parent
e54b028e34
commit
11182d0cf2
@ -11,132 +11,134 @@
|
|||||||
@apply="showMenu = false"
|
@apply="showMenu = false"
|
||||||
>
|
>
|
||||||
<div class="flex flex-col gap-content items-start">
|
<div class="flex flex-col gap-content items-start">
|
||||||
<div class="inline-flex flex-col gap-content">
|
<template v-if="settings.directoryView">
|
||||||
<LabelledSwitch v-model="darkMode">Dark mode</LabelledSwitch>
|
<div class="inline-flex flex-col gap-content">
|
||||||
<LabelledSwitch v-model="settings.directoryView.showHidden">Show hidden files</LabelledSwitch>
|
<LabelledSwitch v-model="darkMode">Dark mode</LabelledSwitch>
|
||||||
<LabelledSwitch
|
<LabelledSwitch v-model="settings.directoryView.showHidden">Show hidden files</LabelledSwitch>
|
||||||
v-model="booleanAnalogs.directoryView.view.bool"
|
<LabelledSwitch v-model="booleanAnalogs.directoryView.view.bool">List view</LabelledSwitch>
|
||||||
>List view</LabelledSwitch>
|
<LabelledSwitch
|
||||||
<LabelledSwitch v-model="settings.directoryView.separateDirs">Separate directories while sorting</LabelledSwitch>
|
v-model="settings.directoryView.separateDirs"
|
||||||
</div>
|
>Separate directories while sorting</LabelledSwitch>
|
||||||
<div v-if="booleanAnalogs.directoryView.view.bool" class="self-stretch">
|
</div>
|
||||||
<div>List view columns</div>
|
<div v-if="booleanAnalogs.directoryView.view.bool" class="self-stretch">
|
||||||
<div
|
<div>List view columns</div>
|
||||||
class="flex justify-start text-sm rounded-lg divide-x divide-default border border-default shadow"
|
<div
|
||||||
>
|
class="flex justify-start text-sm rounded-lg divide-x divide-default border border-default shadow"
|
||||||
<div class="flex flex-col grow items-stretch">
|
>
|
||||||
<div class="font-semibold px-2">Visible</div>
|
<div class="flex flex-col grow items-stretch">
|
||||||
<div
|
<div class="font-semibold px-2">Visible</div>
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
<div
|
||||||
v-if="settings.directoryView.cols.mode"
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
||||||
@click="settings.directoryView.cols.mode = !settings.directoryView.cols.mode"
|
v-if="settings.directoryView.cols.mode"
|
||||||
>
|
@click="settings.directoryView.cols.mode = !settings.directoryView.cols.mode"
|
||||||
Mode
|
>
|
||||||
<ChevronRightIcon class="size-icon-sm icon-default" />
|
Mode
|
||||||
|
<ChevronRightIcon class="size-icon-sm icon-default" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
||||||
|
v-if="settings.directoryView.cols.owner"
|
||||||
|
@click="settings.directoryView.cols.owner = !settings.directoryView.cols.owner"
|
||||||
|
>
|
||||||
|
Owner
|
||||||
|
<ChevronRightIcon class="size-icon-sm icon-default" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
||||||
|
v-if="settings.directoryView.cols.group"
|
||||||
|
@click="settings.directoryView.cols.group = !settings.directoryView.cols.group"
|
||||||
|
>
|
||||||
|
Group
|
||||||
|
<ChevronRightIcon class="size-icon-sm icon-default" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
||||||
|
v-if="settings.directoryView.cols.size"
|
||||||
|
@click="settings.directoryView.cols.size = !settings.directoryView.cols.size"
|
||||||
|
>
|
||||||
|
Size
|
||||||
|
<ChevronRightIcon class="size-icon-sm icon-default" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
||||||
|
v-if="settings.directoryView.cols.ctime"
|
||||||
|
@click="settings.directoryView.cols.ctime = !settings.directoryView.cols.ctime"
|
||||||
|
>
|
||||||
|
Created
|
||||||
|
<ChevronRightIcon class="size-icon-sm icon-default" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
||||||
|
v-if="settings.directoryView.cols.mtime"
|
||||||
|
@click="settings.directoryView.cols.mtime = !settings.directoryView.cols.mtime"
|
||||||
|
>
|
||||||
|
Modified
|
||||||
|
<ChevronRightIcon class="size-icon-sm icon-default" />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
||||||
|
v-if="settings.directoryView.cols.atime"
|
||||||
|
@click="settings.directoryView.cols.atime = !settings.directoryView.cols.atime"
|
||||||
|
>
|
||||||
|
Accessed
|
||||||
|
<ChevronRightIcon class="size-icon-sm icon-default" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div class="flex flex-col grow text-right items-stretch">
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
<div class="font-semibold px-2">Hidden</div>
|
||||||
v-if="settings.directoryView.cols.owner"
|
<div
|
||||||
@click="settings.directoryView.cols.owner = !settings.directoryView.cols.owner"
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
||||||
>
|
v-if="!settings.directoryView.cols.mode"
|
||||||
Owner
|
@click="settings.directoryView.cols.mode = !settings.directoryView.cols.mode"
|
||||||
<ChevronRightIcon class="size-icon-sm icon-default" />
|
>
|
||||||
</div>
|
<ChevronLeftIcon class="size-icon-sm icon-default" />Mode
|
||||||
<div
|
</div>
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
<div
|
||||||
v-if="settings.directoryView.cols.group"
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
||||||
@click="settings.directoryView.cols.group = !settings.directoryView.cols.group"
|
v-if="!settings.directoryView.cols.owner"
|
||||||
>
|
@click="settings.directoryView.cols.owner = !settings.directoryView.cols.owner"
|
||||||
Group
|
>
|
||||||
<ChevronRightIcon class="size-icon-sm icon-default" />
|
<ChevronLeftIcon class="size-icon-sm icon-default" />Owner
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
||||||
v-if="settings.directoryView.cols.size"
|
v-if="!settings.directoryView.cols.group"
|
||||||
@click="settings.directoryView.cols.size = !settings.directoryView.cols.size"
|
@click="settings.directoryView.cols.group = !settings.directoryView.cols.group"
|
||||||
>
|
>
|
||||||
Size
|
<ChevronLeftIcon class="size-icon-sm icon-default" />Group
|
||||||
<ChevronRightIcon class="size-icon-sm icon-default" />
|
</div>
|
||||||
</div>
|
<div
|
||||||
<div
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
v-if="!settings.directoryView.cols.size"
|
||||||
v-if="settings.directoryView.cols.ctime"
|
@click="settings.directoryView.cols.size = !settings.directoryView.cols.size"
|
||||||
@click="settings.directoryView.cols.ctime = !settings.directoryView.cols.ctime"
|
>
|
||||||
>
|
<ChevronLeftIcon class="size-icon-sm icon-default" />Size
|
||||||
Created
|
</div>
|
||||||
<ChevronRightIcon class="size-icon-sm icon-default" />
|
<div
|
||||||
</div>
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
||||||
<div
|
v-if="!settings.directoryView.cols.ctime"
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
@click="settings.directoryView.cols.ctime = !settings.directoryView.cols.ctime"
|
||||||
v-if="settings.directoryView.cols.mtime"
|
>
|
||||||
@click="settings.directoryView.cols.mtime = !settings.directoryView.cols.mtime"
|
<ChevronLeftIcon class="size-icon-sm icon-default" />Created
|
||||||
>
|
</div>
|
||||||
Modified
|
<div
|
||||||
<ChevronRightIcon class="size-icon-sm icon-default" />
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
||||||
</div>
|
v-if="!settings.directoryView.cols.mtime"
|
||||||
<div
|
@click="settings.directoryView.cols.mtime = !settings.directoryView.cols.mtime"
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2"
|
>
|
||||||
v-if="settings.directoryView.cols.atime"
|
<ChevronLeftIcon class="size-icon-sm icon-default" />Modified
|
||||||
@click="settings.directoryView.cols.atime = !settings.directoryView.cols.atime"
|
</div>
|
||||||
>
|
<div
|
||||||
Accessed
|
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
||||||
<ChevronRightIcon class="size-icon-sm icon-default" />
|
v-if="!settings.directoryView.cols.atime"
|
||||||
</div>
|
@click="settings.directoryView.cols.atime = !settings.directoryView.cols.atime"
|
||||||
</div>
|
>
|
||||||
<div class="flex flex-col grow text-right items-stretch">
|
<ChevronLeftIcon class="size-icon-sm icon-default" />Accessed
|
||||||
<div class="font-semibold px-2">Hidden</div>
|
</div>
|
||||||
<div
|
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
|
||||||
v-if="!settings.directoryView.cols.mode"
|
|
||||||
@click="settings.directoryView.cols.mode = !settings.directoryView.cols.mode"
|
|
||||||
>
|
|
||||||
<ChevronLeftIcon class="size-icon-sm icon-default" />Mode
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
|
||||||
v-if="!settings.directoryView.cols.owner"
|
|
||||||
@click="settings.directoryView.cols.owner = !settings.directoryView.cols.owner"
|
|
||||||
>
|
|
||||||
<ChevronLeftIcon class="size-icon-sm icon-default" />Owner
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
|
||||||
v-if="!settings.directoryView.cols.group"
|
|
||||||
@click="settings.directoryView.cols.group = !settings.directoryView.cols.group"
|
|
||||||
>
|
|
||||||
<ChevronLeftIcon class="size-icon-sm icon-default" />Group
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
|
||||||
v-if="!settings.directoryView.cols.size"
|
|
||||||
@click="settings.directoryView.cols.size = !settings.directoryView.cols.size"
|
|
||||||
>
|
|
||||||
<ChevronLeftIcon class="size-icon-sm icon-default" />Size
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
|
||||||
v-if="!settings.directoryView.cols.ctime"
|
|
||||||
@click="settings.directoryView.cols.ctime = !settings.directoryView.cols.ctime"
|
|
||||||
>
|
|
||||||
<ChevronLeftIcon class="size-icon-sm icon-default" />Created
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
|
||||||
v-if="!settings.directoryView.cols.mtime"
|
|
||||||
@click="settings.directoryView.cols.mtime = !settings.directoryView.cols.mtime"
|
|
||||||
>
|
|
||||||
<ChevronLeftIcon class="size-icon-sm icon-default" />Modified
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="rounded-lg hover:bg-accent cursor-pointer flex flex-row gap-1 items-center px-2 justify-end"
|
|
||||||
v-if="!settings.directoryView.cols.atime"
|
|
||||||
@click="settings.directoryView.cols.atime = !settings.directoryView.cols.atime"
|
|
||||||
>
|
|
||||||
<ChevronLeftIcon class="size-icon-sm icon-default" />Accessed
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</ModalPopup>
|
</ModalPopup>
|
||||||
</template>
|
</template>
|
||||||
@ -191,17 +193,17 @@ export default {
|
|||||||
...storedSettings,
|
...storedSettings,
|
||||||
directoryView: {
|
directoryView: {
|
||||||
...defaultSettings.directoryView,
|
...defaultSettings.directoryView,
|
||||||
...storedSettings.directoryView,
|
...(storedSettings.directoryView ?? {}),
|
||||||
cols: {
|
cols: {
|
||||||
...defaultSettings.directoryView.cols,
|
...defaultSettings.directoryView.cols,
|
||||||
...storedSettings.directoryView.cols,
|
...(storedSettings.directoryView?.cols ?? {}),
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(settings, () => {
|
watch(settings, () => {
|
||||||
localStorage.setItem(settingsStorageKey, JSON.stringify(settings));
|
localStorage.setItem(settingsStorageKey, JSON.stringify(settings));
|
||||||
booleanAnalogs.directoryView.view.bool = settings.directoryView.view === booleanAnalogs.directoryView.view.trueValue;
|
booleanAnalogs.directoryView.view.bool = settings.directoryView?.view === booleanAnalogs.directoryView.view.trueValue;
|
||||||
}, { immediate: true });
|
}, { immediate: true });
|
||||||
|
|
||||||
watch(booleanAnalogs, () => {
|
watch(booleanAnalogs, () => {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user