Format all the files
This commit is contained in:
Dane Everitt
parent
5bff8d99cc
commit
b6773b56c1
22 changed files with 158 additions and 159 deletions
|
|
@ -103,7 +103,7 @@
|
|||
|
||||
if (response.data.send_to_login) {
|
||||
this.$flash.success('Your password has been reset, please login to continue.');
|
||||
return this.$router.push({ name: 'login' });
|
||||
return this.$router.push({name: 'login'});
|
||||
}
|
||||
|
||||
return window.location = response.data.redirect_to;
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import { replace } from 'feather-icons';
|
||||
import {replace} from 'feather-icons';
|
||||
|
||||
export default Vue.extend({
|
||||
name: 'Icon',
|
||||
|
|
|
|||
|
|
@ -24,9 +24,9 @@
|
|||
components: {Icon},
|
||||
|
||||
props: {
|
||||
modalName: { type: String, default: 'modal' },
|
||||
show: { type: Boolean, default: false },
|
||||
closeOnEsc: { type: Boolean, default: true },
|
||||
modalName: {type: String, default: 'modal'},
|
||||
show: {type: Boolean, default: false},
|
||||
closeOnEsc: {type: Boolean, default: true},
|
||||
},
|
||||
|
||||
mounted: function () {
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@
|
|||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import { isObject } from 'lodash';
|
||||
import {isObject} from 'lodash';
|
||||
import {AxiosError} from "axios";
|
||||
|
||||
export default Vue.extend({
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<input type="hidden" name="_token" v-bind:value="X_CSRF_TOKEN" />
|
||||
<input type="hidden" name="_token" v-bind:value="X_CSRF_TOKEN"/>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
|
|
|
|||
|
|
@ -5,7 +5,8 @@
|
|||
<button class="btn btn-green uppercase text-xs px-4 py-2"
|
||||
v-if="status === statuses.STATUS_OFF"
|
||||
v-on:click.prevent="sendPowerAction('start')"
|
||||
>Start</button>
|
||||
>Start
|
||||
</button>
|
||||
<div v-else>
|
||||
<button class="btn btn-red uppercase text-xs px-4 py-2" v-on:click.prevent="sendPowerAction('stop')">Stop</button>
|
||||
<button class="btn btn-secondary uppercase text-xs px-4 py-2" v-on:click.prevent="sendPowerAction('restart')">Restart</button>
|
||||
|
|
|
|||
|
|
@ -57,6 +57,6 @@
|
|||
|
||||
export default Vue.extend({
|
||||
name: 'FileContextMenu',
|
||||
components: { Icon },
|
||||
components: {Icon},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -16,12 +16,12 @@
|
|||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import { formatDate } from "@/helpers";
|
||||
import {formatDate} from "@/helpers";
|
||||
import Icon from "@/components/core/Icon.vue";
|
||||
|
||||
export default Vue.extend({
|
||||
name: 'FolderRow',
|
||||
components: { Icon },
|
||||
components: {Icon},
|
||||
|
||||
props: {
|
||||
directory: {type: Object, required: true},
|
||||
|
|
@ -37,7 +37,7 @@
|
|||
/**
|
||||
* Return a formatted directory path that is used to switch to a nested directory.
|
||||
*/
|
||||
getClickablePath (directory: string): string {
|
||||
getClickablePath(directory: string): string {
|
||||
return `${this.currentDirectory.replace(/\/$/, '')}/${directory}`;
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,8 @@
|
|||
<div class="animated-fade-in">
|
||||
<div class="filemanager-breadcrumbs">
|
||||
/<span class="px-1">home</span><!--
|
||||
-->/<router-link :to="{ name: 'server-files' }" class="px-1">container</router-link><!--
|
||||
-->/
|
||||
<router-link :to="{ name: 'server-files' }" class="px-1">container</router-link><!--
|
||||
--><span v-for="crumb in breadcrumbs" class="inline-block">
|
||||
<span v-if="crumb.path">
|
||||
/<router-link :to="{ name: 'server-files', params: { path: crumb.path } }" class="px-1">{{crumb.directoryName}}</router-link>
|
||||
|
|
@ -34,7 +35,7 @@
|
|||
<FolderRow :directory="directory"/>
|
||||
</div>
|
||||
<div v-for="file in files">
|
||||
<FileRow :file="file" :editable="editableFiles" />
|
||||
<FileRow :file="file" :editable="editableFiles"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -51,121 +52,121 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import {mapState} from "vuex";
|
||||
import { map } from 'lodash';
|
||||
import getDirectoryContents from "@/api/server/getDirectoryContents";
|
||||
import FileRow from "@/components/server/components/filemanager/FileRow.vue";
|
||||
import FolderRow from "@/components/server/components/filemanager/FolderRow.vue";
|
||||
import Vue from 'vue';
|
||||
import {mapState} from "vuex";
|
||||
import {map} from 'lodash';
|
||||
import getDirectoryContents from "@/api/server/getDirectoryContents";
|
||||
import FileRow from "@/components/server/components/filemanager/FileRow.vue";
|
||||
import FolderRow from "@/components/server/components/filemanager/FolderRow.vue";
|
||||
|
||||
type DataStructure = {
|
||||
loading: boolean,
|
||||
errorMessage: string | null,
|
||||
currentDirectory: string,
|
||||
files: Array<any>,
|
||||
directories: Array<any>,
|
||||
editableFiles: Array<string>,
|
||||
}
|
||||
type DataStructure = {
|
||||
loading: boolean,
|
||||
errorMessage: string | null,
|
||||
currentDirectory: string,
|
||||
files: Array<any>,
|
||||
directories: Array<any>,
|
||||
editableFiles: Array<string>,
|
||||
}
|
||||
|
||||
export default Vue.extend({
|
||||
name: 'FileManager',
|
||||
components: { FileRow, FolderRow },
|
||||
computed: {
|
||||
...mapState('server', ['server', 'credentials']),
|
||||
...mapState('socket', ['connected']),
|
||||
export default Vue.extend({
|
||||
name: 'FileManager',
|
||||
components: {FileRow, FolderRow},
|
||||
computed: {
|
||||
...mapState('server', ['server', 'credentials']),
|
||||
...mapState('socket', ['connected']),
|
||||
|
||||
/**
|
||||
* Configure the breadcrumbs that display on the filemanager based on the directory that the
|
||||
* user is currently in.
|
||||
*/
|
||||
breadcrumbs: function () {
|
||||
const directories = this.currentDirectory.replace(/^\/|\/$/, '').split('/');
|
||||
if (directories.length < 1 || !directories[0]) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return map(directories, function (value: string, key: number) {
|
||||
if (key === directories.length - 1) {
|
||||
return { directoryName: value };
|
||||
/**
|
||||
* Configure the breadcrumbs that display on the filemanager based on the directory that the
|
||||
* user is currently in.
|
||||
*/
|
||||
breadcrumbs: function () {
|
||||
const directories = this.currentDirectory.replace(/^\/|\/$/, '').split('/');
|
||||
if (directories.length < 1 || !directories[0]) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return {
|
||||
directoryName: value,
|
||||
path: directories.slice(0, key + 1).join('/'),
|
||||
};
|
||||
});
|
||||
},
|
||||
},
|
||||
return map(directories, function (value: string, key: number) {
|
||||
if (key === directories.length - 1) {
|
||||
return {directoryName: value};
|
||||
}
|
||||
|
||||
watch: {
|
||||
/**
|
||||
* When the route changes reload the directory.
|
||||
*/
|
||||
'$route': function (to) {
|
||||
this.currentDirectory = to.params.path || '/';
|
||||
return {
|
||||
directoryName: value,
|
||||
path: directories.slice(0, key + 1).join('/'),
|
||||
};
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
/**
|
||||
* Watch the current directory setting and when it changes update the file listing.
|
||||
*/
|
||||
currentDirectory: function () {
|
||||
watch: {
|
||||
/**
|
||||
* When the route changes reload the directory.
|
||||
*/
|
||||
'$route': function (to) {
|
||||
this.currentDirectory = to.params.path || '/';
|
||||
},
|
||||
|
||||
/**
|
||||
* Watch the current directory setting and when it changes update the file listing.
|
||||
*/
|
||||
currentDirectory: function () {
|
||||
this.listDirectory();
|
||||
},
|
||||
|
||||
/**
|
||||
* When we reconnect to the Daemon make sure we grab a listing of all of the files
|
||||
* so that the error message disappears and we then load in a fresh listing.
|
||||
*/
|
||||
connected: function () {
|
||||
// @ts-ignore
|
||||
if (this.connected) {
|
||||
this.listDirectory();
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
data: function (): DataStructure {
|
||||
return {
|
||||
currentDirectory: this.$route.params.path || '/',
|
||||
loading: true,
|
||||
errorMessage: null,
|
||||
directories: [],
|
||||
editableFiles: [],
|
||||
files: [],
|
||||
};
|
||||
},
|
||||
|
||||
mounted: function () {
|
||||
this.listDirectory();
|
||||
},
|
||||
|
||||
/**
|
||||
* When we reconnect to the Daemon make sure we grab a listing of all of the files
|
||||
* so that the error message disappears and we then load in a fresh listing.
|
||||
*/
|
||||
connected: function () {
|
||||
// @ts-ignore
|
||||
if (this.connected) {
|
||||
this.listDirectory();
|
||||
}
|
||||
methods: {
|
||||
/**
|
||||
* List the contents of a directory.
|
||||
*/
|
||||
listDirectory: function () {
|
||||
this.loading = true;
|
||||
|
||||
const directory = encodeURI(this.currentDirectory.replace(/^\/|\/$/, ''));
|
||||
getDirectoryContents(this.$route.params.id, directory)
|
||||
.then((response) => {
|
||||
this.files = response.files;
|
||||
this.directories = response.directories;
|
||||
this.editableFiles = response.editable;
|
||||
this.errorMessage = null;
|
||||
})
|
||||
.catch((err) => {
|
||||
if (typeof err === 'string') {
|
||||
this.errorMessage = err;
|
||||
return;
|
||||
}
|
||||
|
||||
console.error('An error was encountered while processing this request.', {err});
|
||||
})
|
||||
.then(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
data: function (): DataStructure {
|
||||
return {
|
||||
currentDirectory: this.$route.params.path || '/',
|
||||
loading: true,
|
||||
errorMessage: null,
|
||||
directories: [],
|
||||
editableFiles: [],
|
||||
files: [],
|
||||
};
|
||||
},
|
||||
|
||||
mounted: function () {
|
||||
this.listDirectory();
|
||||
},
|
||||
|
||||
methods: {
|
||||
/**
|
||||
* List the contents of a directory.
|
||||
*/
|
||||
listDirectory: function () {
|
||||
this.loading = true;
|
||||
|
||||
const directory = encodeURI(this.currentDirectory.replace(/^\/|\/$/, ''));
|
||||
getDirectoryContents(this.$route.params.id, directory)
|
||||
.then((response) => {
|
||||
this.files = response.files;
|
||||
this.directories = response.directories;
|
||||
this.editableFiles = response.editable;
|
||||
this.errorMessage = null;
|
||||
})
|
||||
.catch((err) => {
|
||||
if (typeof err === 'string') {
|
||||
this.errorMessage = err;
|
||||
return;
|
||||
}
|
||||
|
||||
console.error('An error was encountered while processing this request.', { err });
|
||||
})
|
||||
.then(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue