Re-add socket mixin, works fine?

This commit is contained in:
Dane Everitt 2019-02-03 14:49:04 -08:00
parent 1c6fa6c0bb
commit d7ce62c047
No known key found for this signature in database
GPG Key ID: EEA66103B3D71F53
2 changed files with 15 additions and 9 deletions

View File

@ -1,16 +1,21 @@
import Vue from 'vue'; import Vue from 'vue';
import Navigation from '../core/Navigation'; import Navigation from '@/components/core/Navigation';
import ProgressBar from './components/ProgressBar'; import ProgressBar from './components/ProgressBar';
import { mapState } from 'vuex'; import { mapState } from 'vuex';
import * as io from 'socket.io-client'; import * as io from 'socket.io-client';
import { Socketio } from "@/mixins/socketio";
import Icon from "@/components/core/Icon";
import PowerButtons from "@/components/server/components/PowerButtons";
export default Vue.component('server', { export default Vue.component('server', {
components: { ProgressBar, Navigation }, components: { ProgressBar, PowerButtons, Navigation, Icon },
computed: { computed: {
...mapState('server', ['server', 'credentials']), ...mapState('server', ['server', 'credentials']),
...mapState('socket', ['connected', 'connectionError']), ...mapState('socket', ['connected', 'connectionError']),
}, },
mixins: [ Socketio ],
// Watch for route changes that occur with different server parameters. This occurs when a user // Watch for route changes that occur with different server parameters. This occurs when a user
// uses the search bar. Because of the way vue-router works, it won't re-mount the server component // uses the search bar. Because of the way vue-router works, it won't re-mount the server component
// so we will end up seeing the wrong server data if we don't perform this watch. // so we will end up seeing the wrong server data if we don't perform this watch.
@ -83,25 +88,25 @@ export default Vue.component('server', {
</div> </div>
<div class="mt-6 sidenav mr-6 bg-white border rounded"> <div class="mt-6 sidenav mr-6 bg-white border rounded">
<router-link :to="{ name: 'server', params: { id: $route.params.id } }"> <router-link :to="{ name: 'server', params: { id: $route.params.id } }">
<terminal-icon class="h-4"></terminal-icon> Console <icon name="terminal" class="h-4"></icon> Console
</router-link> </router-link>
<router-link :to="{ name: 'server-files' }"> <router-link :to="{ name: 'server-files' }">
<folder-icon class="h-4"></folder-icon> Files <icon name="folder" class="h-4"></icon> Files
</router-link> </router-link>
<router-link :to="{ name: 'server-subusers' }"> <router-link :to="{ name: 'server-subusers' }">
<users-icon class="h-4"></users-icon> Subusers <icon name="users" class="h-4"></icon> Subusers
</router-link> </router-link>
<router-link :to="{ name: 'server-schedules' }"> <router-link :to="{ name: 'server-schedules' }">
<calendar-icon class="h-4"></calendar-icon> Schedules <icon name="calendar" class="h-4"></icon> Schedules
</router-link> </router-link>
<router-link :to="{ name: 'server-databases' }"> <router-link :to="{ name: 'server-databases' }">
<database-icon class="h-4"></database-icon> Databases <icon name="database" class="h-4"></icon> Databases
</router-link> </router-link>
<router-link :to="{ name: 'server-allocations' }"> <router-link :to="{ name: 'server-allocations' }">
<globe-icon class="h-4"></globe-icon> Allocations <icon name="globe" class="h-4"></icon> Allocations
</router-link> </router-link>
<router-link :to="{ name: 'server-settings' }"> <router-link :to="{ name: 'server-settings' }">
<settings-icon class="h-4"></settings-icon> Settings <icon name="settings" class="h-4"></icon> Settings
</router-link> </router-link>
</div> </div>
</div> </div>

View File

@ -164,6 +164,7 @@ module.exports = {
extensions: ['.ts', '.js', '.vue', '.json'], extensions: ['.ts', '.js', '.vue', '.json'],
alias: { alias: {
'vue$': 'vue/dist/vue.esm.js', 'vue$': 'vue/dist/vue.esm.js',
'@': path.join(__dirname, 'resources/assets/scripts'),
}, },
symlinks: false, symlinks: false,
}, },