From 378a26a7c500c91c3fd369ba5149f7c5a96618b6 Mon Sep 17 00:00:00 2001 From: Dane Everitt Date: Sun, 3 Feb 2019 15:39:59 -0800 Subject: [PATCH] Finish migrating most everything to TS --- .../scripts/components/server/Server.ts | 24 ++-- .../components/server/ServerAllocations.vue | 13 -- .../components/server/ServerSchedules.vue | 13 -- .../components/server/ServerSettings.vue | 13 -- .../components/server/ServerSubusers.vue | 13 -- .../components/filemanager/FileContextMenu.ts | 8 +- .../components/filemanager/FolderRow.ts | 10 +- .../assets/scripts/components/server/index.ts | 8 +- .../components/server/subpages/Databases.ts | 117 +++++++++++++++++ .../components/server/subpages/Databases.vue | 116 ----------------- .../{FileManager.vue => FileManager.ts} | 122 +++++++++--------- .../assets/scripts/pterodactyl-shims.d.ts | 3 + resources/assets/scripts/router.ts | 12 +- 13 files changed, 209 insertions(+), 263 deletions(-) delete mode 100644 resources/assets/scripts/components/server/ServerAllocations.vue delete mode 100644 resources/assets/scripts/components/server/ServerSchedules.vue delete mode 100644 resources/assets/scripts/components/server/ServerSettings.vue delete mode 100644 resources/assets/scripts/components/server/ServerSubusers.vue create mode 100644 resources/assets/scripts/components/server/subpages/Databases.ts delete mode 100644 resources/assets/scripts/components/server/subpages/Databases.vue rename resources/assets/scripts/components/server/subpages/{FileManager.vue => FileManager.ts} (52%) diff --git a/resources/assets/scripts/components/server/Server.ts b/resources/assets/scripts/components/server/Server.ts index cbcb78aa8..1450f1c32 100644 --- a/resources/assets/scripts/components/server/Server.ts +++ b/resources/assets/scripts/components/server/Server.ts @@ -93,21 +93,21 @@ export default Vue.component('server', { Files - - Subusers - - - Schedules - + + + + + + Databases - - Allocations - - - Settings - + + + + + +
diff --git a/resources/assets/scripts/components/server/ServerAllocations.vue b/resources/assets/scripts/components/server/ServerAllocations.vue deleted file mode 100644 index 87fca2233..000000000 --- a/resources/assets/scripts/components/server/ServerAllocations.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - - - diff --git a/resources/assets/scripts/components/server/ServerSchedules.vue b/resources/assets/scripts/components/server/ServerSchedules.vue deleted file mode 100644 index 358962e40..000000000 --- a/resources/assets/scripts/components/server/ServerSchedules.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - - - diff --git a/resources/assets/scripts/components/server/ServerSettings.vue b/resources/assets/scripts/components/server/ServerSettings.vue deleted file mode 100644 index 41dcdc539..000000000 --- a/resources/assets/scripts/components/server/ServerSettings.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - - - diff --git a/resources/assets/scripts/components/server/ServerSubusers.vue b/resources/assets/scripts/components/server/ServerSubusers.vue deleted file mode 100644 index 969ba0a07..000000000 --- a/resources/assets/scripts/components/server/ServerSubusers.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - - - diff --git a/resources/assets/scripts/components/server/components/filemanager/FileContextMenu.ts b/resources/assets/scripts/components/server/components/filemanager/FileContextMenu.ts index ad93f6228..0a775ac26 100644 --- a/resources/assets/scripts/components/server/components/filemanager/FileContextMenu.ts +++ b/resources/assets/scripts/components/server/components/filemanager/FileContextMenu.ts @@ -2,17 +2,15 @@ import Vue from 'vue'; import Icon from "../../../core/Icon"; export default Vue.component('file-context-menu', { - components: { - Icon, - }, + components: { Icon }, template: `
- -
+ +
Rename
diff --git a/resources/assets/scripts/components/server/components/filemanager/FolderRow.ts b/resources/assets/scripts/components/server/components/filemanager/FolderRow.ts index d1d3e985b..e69a9a9b8 100644 --- a/resources/assets/scripts/components/server/components/filemanager/FolderRow.ts +++ b/resources/assets/scripts/components/server/components/filemanager/FolderRow.ts @@ -1,11 +1,9 @@ import Vue from 'vue'; -import { formatDate } from "../../../../helpers"; -import Icon from "../../../core/Icon"; +import { formatDate } from "@/helpers"; +import Icon from "@/components/core/Icon"; export default Vue.component('folder-row', { - components: { - Icon, - }, + components: { Icon }, props: { directory: {type: Object, required: true}, @@ -34,7 +32,7 @@ export default Vue.component('folder-row', { :to="{ name: 'server-files', params: { path: getClickablePath(directory.name).replace(/^\\//, '') }}" >
- +
{{directory.name}}
diff --git a/resources/assets/scripts/components/server/index.ts b/resources/assets/scripts/components/server/index.ts index ed068548b..44e57a8a9 100644 --- a/resources/assets/scripts/components/server/index.ts +++ b/resources/assets/scripts/components/server/index.ts @@ -1,8 +1,4 @@ export {default as Server} from './Server'; -export {default as ServerAllocations} from './ServerAllocations.vue'; export {default as ConsolePage} from './subpages/Console'; -export {default as DatabasesPage} from './subpages/Databases.vue'; -export {default as FileManagerPage} from './subpages/FileManager.vue'; -export {default as ServerSchedules} from './ServerSchedules.vue'; -export {default as ServerSettings} from './ServerSettings.vue'; -export {default as ServerSubusers} from './ServerSubusers.vue'; +export {default as DatabasesPage} from './subpages/Databases'; +export {default as FileManagerPage} from './subpages/FileManager'; diff --git a/resources/assets/scripts/components/server/subpages/Databases.ts b/resources/assets/scripts/components/server/subpages/Databases.ts new file mode 100644 index 000000000..543c27627 --- /dev/null +++ b/resources/assets/scripts/components/server/subpages/Databases.ts @@ -0,0 +1,117 @@ +import Vue from 'vue'; +import { map, filter } from 'lodash'; +import Modal from '@/components/core/Modal'; +import CreateDatabaseModal from './../components/database/CreateDatabaseModal.vue'; +import DatabaseRow from './../components/database/DatabaseRow.vue'; +import Icon from "@/components/core/Icon"; + +type DataStructure = { + loading: boolean, + showCreateModal: boolean, + databases: Array, +} + +export default Vue.component('server-databases', { + components: {DatabaseRow, CreateDatabaseModal, Modal, Icon }, + + data: function (): DataStructure { + return { + databases: [], + loading: true, + showCreateModal: false, + }; + }, + + mounted: function () { + this.getDatabases(); + + window.events.$on('server:deleted-database', this.removeDatabase); + }, + + methods: { + /** + * Get all of the databases that exist for this server. + */ + getDatabases: function () { + this.$flash.clear(); + this.loading = true; + + window.axios.get(this.route('api.client.servers.databases', { + server: this.$route.params.id, + include: 'password' + })) + .then(response => { + this.databases = map(response.data.data, (object) => { + const data = object.attributes; + + data.password = data.relationships.password.attributes.password; + data.showPassword = false; + delete data.relationships; + + return data; + }); + }) + .catch(err => { + this.$flash.error('There was an error encountered while attempting to fetch databases for this server.'); + console.error(err); + }) + .then(() => { + this.loading = false; + }); + }, + + /** + * Add the database to the list of existing databases automatically when the modal + * is closed with a successful callback. + */ + handleModalCallback: function (object: any) { + const data = object; + data.password = data.relationships.password.attributes.password; + data.showPassword = false; + + delete data.relationships; + + this.databases.push(data); + }, + + /** + * Handle event that is removing a database. + */ + removeDatabase: function (databaseId: number) { + this.databases = filter(this.databases, (database) => { + return database.id !== databaseId; + }); + } + }, + + template: ` +
+
+ +
+
+
+
+ +
+

You have no databases.

+
+
+
+
+ +
+
+ +
+ + + +
+
+ `, +}); diff --git a/resources/assets/scripts/components/server/subpages/Databases.vue b/resources/assets/scripts/components/server/subpages/Databases.vue deleted file mode 100644 index 1425c77c0..000000000 --- a/resources/assets/scripts/components/server/subpages/Databases.vue +++ /dev/null @@ -1,116 +0,0 @@ - - - diff --git a/resources/assets/scripts/components/server/subpages/FileManager.vue b/resources/assets/scripts/components/server/subpages/FileManager.ts similarity index 52% rename from resources/assets/scripts/components/server/subpages/FileManager.vue rename to resources/assets/scripts/components/server/subpages/FileManager.ts index 576e48011..ecf1dc35a 100644 --- a/resources/assets/scripts/components/server/subpages/FileManager.vue +++ b/resources/assets/scripts/components/server/subpages/FileManager.ts @@ -1,57 +1,21 @@ - +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"; +import FolderRow from "@/components/server/components/filemanager/FolderRow"; - + + template: ` +
+
+ /home/container + + /{{crumb.directoryName}} + + + /{{crumb.directoryName}} + + +
+
+ +
+
+
+
+
+
+
+
Name
+
Size
+
Modified
+
Actions
+
+
+

This directory is empty.

+
+
+
+ +
+
+ +
+
+
+
+ `, +}); diff --git a/resources/assets/scripts/pterodactyl-shims.d.ts b/resources/assets/scripts/pterodactyl-shims.d.ts index d762d2f24..55724c192 100644 --- a/resources/assets/scripts/pterodactyl-shims.d.ts +++ b/resources/assets/scripts/pterodactyl-shims.d.ts @@ -4,6 +4,8 @@ import {FlashInterface} from "./mixins/flash"; import {AxiosInstance} from "axios"; import {Vue as VueType} from "vue/types/vue"; import {ApplicationState} from "./store/types"; +import {Route} from "vue-router"; + // @ts-ignore import {Ziggy} from './helpers/ziggy'; @@ -35,6 +37,7 @@ declare module 'vue/types/options' { declare module 'vue/types/vue' { interface Vue { + $route: Route, $store: Store, $flash: FlashInterface, route: (name: string, params?: object, absolute?: boolean) => string, diff --git a/resources/assets/scripts/router.ts b/resources/assets/scripts/router.ts index 86947d30b..6bb21038e 100644 --- a/resources/assets/scripts/router.ts +++ b/resources/assets/scripts/router.ts @@ -11,13 +11,9 @@ import ResetPassword from './components/auth/ResetPassword'; import User from './models/user'; import { Server, - ServerAllocations, ConsolePage, FileManagerPage, DatabasesPage, - ServerSchedules, - ServerSettings, - ServerSubusers, } from './components/server'; const routes = [ @@ -43,11 +39,11 @@ const routes = [ children: [ {name: 'server', path: '', component: ConsolePage}, {name: 'server-files', path: 'files/:path(.*)?', component: FileManagerPage}, - {name: 'server-subusers', path: 'subusers', component: ServerSubusers}, - {name: 'server-schedules', path: 'schedules', component: ServerSchedules}, + // {name: 'server-subusers', path: 'subusers', component: ServerSubusers}, + // {name: 'server-schedules', path: 'schedules', component: ServerSchedules}, {name: 'server-databases', path: 'databases', component: DatabasesPage}, - {name: 'server-allocations', path: 'allocations', component: ServerAllocations}, - {name: 'server-settings', path: 'settings', component: ServerSettings}, + // {name: 'server-allocations', path: 'allocations', component: ServerAllocations}, + // {name: 'server-settings', path: 'settings', component: ServerSettings}, ], }, ];