91 lines
2.3 KiB
Vue
91 lines
2.3 KiB
Vue
<template>
|
|
<div>
|
|
<div v-if="progress" class="progress">
|
|
<div v-bind:style="{ width: this.progress + '%' }"></div>
|
|
</div>
|
|
<listingBar v-if="currentView === 'listing'"></listingBar>
|
|
<editorBar v-else-if="currentView === 'editor'"></editorBar>
|
|
<editorBar v-else-if="currentView === 'share'"></editorBar>
|
|
<editorBar v-else-if="currentView === 'dashboard'"></editorBar>
|
|
<editorBar v-else-if="currentView === 'error'"></editorBar>
|
|
<defaultBar v-else></defaultBar>
|
|
<sidebar></sidebar>
|
|
<main>
|
|
<router-view></router-view>
|
|
</main>
|
|
<prompts></prompts>
|
|
<upload-files></upload-files>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import editorBar from "./files/EditorBar.vue"
|
|
import defaultBar from "./files/Default.vue"
|
|
import listingBar from "./files/ListingBar.vue"
|
|
import previewBar from "./files/Preview.vue"
|
|
import Prompts from "@/components/prompts/Prompts";
|
|
import Action from "@/components/header/Action";
|
|
import { mapState, mapGetters } from "vuex";
|
|
import Sidebar from "@/components/Sidebar.vue";
|
|
import UploadFiles from "../components/prompts/UploadFiles";
|
|
import { enableExec } from "@/utils/constants";
|
|
export default {
|
|
name: "layout",
|
|
components: {
|
|
defaultBar,
|
|
editorBar,
|
|
listingBar,
|
|
previewBar,
|
|
Action,
|
|
Sidebar,
|
|
Prompts,
|
|
UploadFiles,
|
|
},
|
|
data: function () {
|
|
return {
|
|
showContexts: true,
|
|
dragCounter: 0,
|
|
width: window.innerWidth,
|
|
itemWeight: 0,
|
|
};
|
|
},
|
|
computed: {
|
|
...mapGetters(["isLogged", "progress", "isListing"]),
|
|
...mapState(["req", "user", "state"]),
|
|
|
|
isExecEnabled: () => enableExec,
|
|
currentView() {
|
|
if (this.req.type == undefined) {
|
|
return null;
|
|
}
|
|
|
|
if (this.req.isDir) {
|
|
return "listing";
|
|
} else if (
|
|
this.req.type === "text" ||
|
|
this.req.type === "textImmutable"
|
|
) {
|
|
return "editor";
|
|
} else {
|
|
return "preview";
|
|
}
|
|
},
|
|
},
|
|
watch: {
|
|
$route: function () {
|
|
this.$store.commit("resetSelected");
|
|
this.$store.commit("multiple", false);
|
|
if (this.$store.state.show !== "success") this.$store.commit("closeHovers");
|
|
},
|
|
},
|
|
methods: {
|
|
getTitle() {
|
|
let title = "Title"
|
|
if (this.$route.path.startsWith('/settings/')) {
|
|
title = "Settings"
|
|
}
|
|
return title
|
|
},
|
|
},
|
|
};
|
|
</script> |