nicoeri/filebrowser
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Converted views/Layout.vue

Browse Source
This commit is contained in:
Joep 2023-09-09 13:26:11 +02:00
parent 1602d38df5
commit cdcf05545a
1 changed files with 18 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
frontend/src/views/Layout.vue
View File

@ -1,19 +1,19 @@
<template> <template>
<div> <div>
<div v-if="progress" class="progress"> <div v-if="false" class="layoutStore.progress">
<div v-bind:style="{ width: this.progress + '%' }"></div> <!-- <div v-bind:style="{ width: this.layoutStore.progress + '%' }"></div> -->
</div> </div>
<sidebar></sidebar> <sidebar></sidebar>
<main> <main>
<router-view></router-view> <router-view></router-view>
<shell v-if="isExecEnabled && isLoggedIn && user.perm.execute" /> <shell v-if="enableExec && authStore.isLoggedIn && authStore.user?.perm.execute" />
</main> </main>
<prompts></prompts> <prompts></prompts>
<upload-files></upload-files> <upload-files></upload-files>
</div> </div>
</template> </template>
<script> <script setup lang="ts">
import { mapActions, mapState, mapWritableState } from "pinia"; import { mapActions, mapState, mapWritableState } from "pinia";
import { useAuthStore } from "@/stores/auth"; import { useAuthStore } from "@/stores/auth";
import { useLayoutStore } from "@/stores/layout"; import { useLayoutStore } from "@/stores/layout";
@ -23,32 +23,20 @@ import Prompts from "@/components/prompts/Prompts.vue";
import Shell from "@/components/Shell.vue"; import Shell from "@/components/Shell.vue";
import UploadFiles from "@/components/prompts/UploadFiles.vue"; import UploadFiles from "@/components/prompts/UploadFiles.vue";
import { enableExec } from "@/utils/constants"; import { enableExec } from "@/utils/constants";
import { computed, watch } from "vue";
import { useRoute } from "vue-router";
export default { const layoutStore = useLayoutStore();
name: "layout", const authStore = useAuthStore();
components: { const fileStore = useFileStore();
Sidebar, const route = useRoute();
Prompts,
Shell, watch(route, (newval, oldval) => {
UploadFiles, fileStore.selected = [];
}, fileStore.multiple = false;
computed: { if (layoutStore.show !== "success") {
...mapState(useAuthStore, ["isLoggedIn", "user"]), layoutStore.closeHovers();
...mapState(useLayoutStore, ["progress", "show"]),
...mapWritableState(useFileStore, ["selected", "multiple"]),
isExecEnabled: () => enableExec,
},
methods: {
...mapActions(useLayoutStore, ["closeHovers"]),
},
watch: {
$route: function () {
this.selected = [];
this.multiple = false;
if (this.show !== "success") {
this.closeHovers();
} }
}, })
},
};
</script> </script>