Mirrors/WebTools-NG
2
0
Fork 0
mirror of https://github.com/WebTools-NG/WebTools-NG synced 2024-11-22 02:53:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

added avatar to header, fetching plex resources now only saves owned and PMS

Browse source
This commit is contained in:
CPSO 2020-05-23 16:36:15 +02:00
parent 690be7ca94
commit c93c601d4b
4 changed files with 65 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/Login.vue
View file

@ -46,7 +46,7 @@
<script>
//onst axios = require('axios').default;
//const axios = require('axios').default;
import store from '../store'
//import router from '../router'

73
src/components/layout/Header.vue
View file

@ -1,41 +1,45 @@
<template>
<section class="hero is-dark is-small">
<div class="hero-body">
<div class="columns is-vcentered">
<figure class="image is-48x48 is-pulled-left">
<img src="https://bulma.io/images/placeholders/128x128.png">
</figure>
<div class="level">
<!-- <div id="title" >
<p id="top_title" class="title is-size-3 is-pulled-left">{{ $t("Common.AppName") }}</p>
</div> -->
<div class="level-left">
<div class="level-item">
<figure class="image is-48x48">
<img src="https://bulma.io/images/placeholders/128x128.png">
</figure>
<div id="title" >
<p id="top_title" class="title is-size-3">{{ $t("Common.AppName") }}</p>
</div>
</div>
</div>
<div id="title" >
<p id="top_title" class="title is-size-3">{{ $t("Common.AppName") }}</p>
<div class="level-right">
<div class="level-item">
<figure class="image is-48x48" id="avatar">
<img id="avatar" src="https://bulma.io/images/placeholders/128x128.png">
</figure>
</div>
<div class="container is-vcentered is-pulled-right">
<div class="select is-dark is-pulled-right">
<b-select placeholder="Select Server"
@input="assignTag">
<option
v-for="option in pserver"
:value="option.clientIdentifier"
:key="option.clientIdentifier"
v-on:change="onchange()"
>
{{ option.name }}
</option>
</b-select>
</div>
<b-button id="sync-button" @click="fetchServers" type="is-warning"
icon-left="fas fa-sync" icon-pack="fas" class="is-pulled-right" >
</b-button>
<div class="level-item">
<b-button id="sync-button" @click="fetchServers" type="is-warning"
icon-left="fas fa-sync" icon-pack="fas" class="is-pulled-right" >
</b-button>
<div class="select is-dark">
<b-select placeholder="Select Server"
@input="assignTag">
<option
v-for="option in pserver"
:value="option.clientIdentifier"
:key="option.clientIdentifier"
v-on:change="onchange()">
{{ option.name }}
</option>
</b-select>
</div>
</div>
</div>
</div>
</div>
</section>
@ -46,12 +50,11 @@ import store from '../../store';
export default {
methods: {
fetchServers(){
console.log("fetching servers")
this.$store.dispatch('getPlexServers', store.getters.getAuthToken);
this.$store.dispatch('fetchPlexServers', store.getters.getAuthToken);
},
assignTag: function (selected) {
this.selected = selected;
@ -63,11 +66,15 @@ export default {
},
created(){
console.log("menu created")
this.$store.dispatch('getPlexServers');
this.$store.dispatch('fetchPlexServers');
},
computed: {
pserver(){
return this.$store.getters.plexServers
return this.$store.getters.getPlexServers
},
userAvatar(){
return this.$store.getters.getAvatar
}
}

25
src/store/index.js
View file

@ -11,29 +11,12 @@ const vuexLocal = new VuexPersistence({
export default new Vuex.Store({
state: {
/*
authenticated: false,
authToken: ''
*/
},
mutations: {
/*
setAuthentication(state, status) {
state.authenticated = status;
},
setAuthToken(state, token){
state.authToken = token
}
*/
},
getters: {
},
actions: {
},
state: {},
mutations: {},
getters: {},
actions: {},
modules: {
plextv
},
plugins: [vuexLocal.plugin]
})

25
src/store/modules/plextv.js
View file

@ -6,7 +6,9 @@ const state = {
plexServers: [],
selectedServerId: '',
authenticated: false,
authToken: ''
authToken: '',
avatar: '',
filteredProducts: []
};
const mutations = {
@ -21,11 +23,14 @@ const mutations = {
},
UPDATE_AUTHTOKEN(state, value){
state.authToken = value
},
UPDATE_AVATAR(state, value){
state.avatar = value
}
};
const actions = {
getPlexServers({ commit, getters }) {
fetchPlexServers({ commit, getters }) {
axios({
method: 'get',
url: 'https://plex.tv/api/v2/resources?includeHttps=1&includeRelay=1',
@ -38,7 +43,15 @@ const actions = {
},
})
.then((response) => {
commit('UPDATE_PLEX_SERVERS', response.data)
let result=[];
response.data.forEach((req) => {
if (req.owned == true && req.product == "Plex Media Server") {
result.push(req);
}
})
console.log(result)
commit('UPDATE_PLEX_SERVERS', result)
})
.catch(function (error) {
if (error.response) {
@ -71,6 +84,7 @@ const actions = {
console.log(response.status)
commit('UPDATE_AUTHTOKEN', response.data.user.authToken)
commit('UPDATE_AUTHENTICATED', true)
commit('UPDATE_AVATAR', response.data.user.thumb)
router.replace({name: "home"});
})
.catch(function (error) {
@ -94,8 +108,9 @@ const actions = {
};
const getters = {
plexServers: state => state.plexServers,
getAuthToken: state => state.authToken
getPlexServers: state => state.plexServers,
getAuthToken: state => state.authToken,
getAvatar: state => state.avatar
};
const serverModule = {