range chaine #4
@ -16,7 +16,6 @@ export default {
|
||||
font-family: 'Avenir', Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
}
|
||||
h1,
|
||||
h2 {
|
||||
|
@ -1,28 +1,18 @@
|
||||
import axios from "axios";
|
||||
import axios from 'axios';
|
||||
|
||||
const API_PATH = `${process.env.ROOT_API}/api/v1`;
|
||||
|
||||
export function fetchchaine(num) {
|
||||
|
||||
return axios.get(`${API_PATH}/chaine/${num}`)
|
||||
return axios.get(`${API_PATH}/chaine/${num}`);
|
||||
}
|
||||
|
||||
export function fetchemission(num) {
|
||||
|
||||
return axios.get(`${API_PATH}/chaine/${num}/emission`)
|
||||
|
||||
return axios.get(`${API_PATH}/chaine/${num}/emission`);
|
||||
}
|
||||
|
||||
export function putparsechaine(jwt) {
|
||||
|
||||
return axios.put(`${API_PATH}/chaine/`, '', { headers: { Authorization: `Bearer: ${jwt}` } });
|
||||
|
||||
}
|
||||
|
||||
export function authenticate(userData) {
|
||||
return axios.post(`${API_PATH}/login/`, userData)
|
||||
return axios.post(`${API_PATH}/login/`, userData);
|
||||
}
|
||||
|
||||
// export function register(userData) {
|
||||
// return axios.post(`${API_URL}/register/`, userData)
|
||||
// return axios.post(`${API_URL}/register/`, userData);
|
||||
// }
|
@ -30,7 +30,8 @@
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<ul class v-if="this.$store.state.arrayresultchaines">
|
||||
<li class="box" v-for="result in this.$store.state.arrayresultchaines" v-bind:key="result.chaine">
|
||||
<li class="box" v-for="result in this.$store.state.arrayresultchaines"
|
||||
v-bind:key="result.chaine">
|
||||
<h3 class="title is-5">{{result.chaine}} : {{result.name}}</h3>
|
||||
<ul v-if="(result.emission!='can\'t find channel' && result.emission)">
|
||||
<li>
|
||||
@ -74,30 +75,29 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {putparsechaine} from "../api";
|
||||
import { putparsechaine } from '../api';
|
||||
|
||||
export default {
|
||||
name: "chainetv",
|
||||
name: 'chainetv',
|
||||
data() {
|
||||
return {
|
||||
chaine: ""
|
||||
chaine: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
||||
checkchaine() {
|
||||
if (this.chaine === "") {
|
||||
alert("rentrer un numéro");
|
||||
if (this.chaine === '') {
|
||||
alert('rentrer un numéro');
|
||||
return;
|
||||
}
|
||||
this.$store.state.arrayresultchaines = [];
|
||||
const arraychaine = [...new Set(this.chaine.split(" "))];
|
||||
const re = new RegExp("^[0-9]*-[0-9]*$");
|
||||
arraychaine.forEach(element => {
|
||||
if (element != "") {
|
||||
const arraychaine = [...new Set(this.chaine.split(' '))];
|
||||
const re = new RegExp('^[0-9]*-[0-9]*$');
|
||||
arraychaine.forEach((element) => {
|
||||
if (element !== '') {
|
||||
if (re.test(element)) {
|
||||
var range=element.split("-")
|
||||
for (var i = range[0]; i <= range[1]; i++) {
|
||||
const range = element.split('-');
|
||||
for (let i = range[0]; i <= range[1]; i += 1) {
|
||||
this.$store.dispatch('getchaine', { num: i });
|
||||
}
|
||||
} else {
|
||||
@ -108,30 +108,27 @@ export default {
|
||||
},
|
||||
parsechaine() {
|
||||
if (!this.$store.getters.isAuthenticated) {
|
||||
this.$router.push('/login')
|
||||
this.$router.push('/login');
|
||||
} else {
|
||||
console.log(this.$store.state.jwt.token)
|
||||
return putparsechaine(this.$store.state.jwt.token)
|
||||
.then(res => {
|
||||
if (res.data == "OK") {
|
||||
alert("update database OK");
|
||||
.then((res) => {
|
||||
if (res.data === 'OK') {
|
||||
alert('update database OK');
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
// eslint-disable-next-line
|
||||
if (error.response) {
|
||||
alert(error.response.data.message);
|
||||
|
||||
} else {
|
||||
|
||||
console.error(error);
|
||||
}
|
||||
this.$router.push('/login')
|
||||
this.$router.push('/login');
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style >
|
||||
|
@ -35,42 +35,42 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {EventBus} from "../utils"
|
||||
import { EventBus } from '../utils';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
name: '',
|
||||
password: '',
|
||||
errorMsg: ''
|
||||
}
|
||||
errorMsg: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
authenticate() {
|
||||
this.$store.dispatch('login', { name: this.name, password: this.password })
|
||||
.then(() => {
|
||||
if (this.$store.getters.isAuthenticated) {
|
||||
this.$router.push('/')
|
||||
this.$router.push('/');
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
},
|
||||
);
|
||||
},
|
||||
register() {
|
||||
this.$store.dispatch('register', { name: this.name, password: this.password })
|
||||
.then(() => this.$router.push('/'))
|
||||
}
|
||||
.then(() => this.$router.push('/'));
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
EventBus.$on('failedRegistering', (msg) => {
|
||||
this.errorMsg = msg
|
||||
})
|
||||
this.errorMsg = msg;
|
||||
});
|
||||
EventBus.$on('failedAuthentication', (msg) => {
|
||||
this.errorMsg = msg
|
||||
})
|
||||
this.errorMsg = msg;
|
||||
});
|
||||
},
|
||||
beforeDestroy() {
|
||||
EventBus.$off('failedRegistering')
|
||||
EventBus.$off('failedAuthentication')
|
||||
}
|
||||
}
|
||||
EventBus.$off('failedRegistering');
|
||||
EventBus.$off('failedAuthentication');
|
||||
},
|
||||
};
|
||||
</script>
|
@ -16,7 +16,7 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
getMessage() {
|
||||
const path = process.env.ROOT_API + '/api/v1/ping';
|
||||
const path = `${process.env.ROOT_API}/api/v1/ping`;
|
||||
axios.get(path)
|
||||
.then((res) => {
|
||||
this.msg = res.data;
|
||||
|
@ -3,10 +3,10 @@
|
||||
import Vue from 'vue';
|
||||
import App from './App';
|
||||
import router from './router';
|
||||
import store from './store'
|
||||
import './../node_modules/bulma/css/bulma.css'
|
||||
Vue.config.productionTip = false;
|
||||
import store from './store';
|
||||
import './../node_modules/bulma/css/bulma.css';
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
/* eslint-disable no-new */
|
||||
new Vue({
|
||||
el: '#app',
|
||||
|
@ -3,9 +3,9 @@ import Router from 'vue-router';
|
||||
import ping from '@/components/ping';
|
||||
import chainetv from '@/components/chainetv';
|
||||
import login from '@/components/login';
|
||||
import store from '@/store'
|
||||
Vue.use(Router);
|
||||
import store from '@/store';
|
||||
|
||||
Vue.use(Router);
|
||||
export default new Router({
|
||||
routes: [
|
||||
{
|
||||
@ -16,7 +16,7 @@ export default new Router({
|
||||
{
|
||||
path: '/login',
|
||||
name: 'Login',
|
||||
component: login
|
||||
component: login,
|
||||
},
|
||||
{
|
||||
path: '/ping',
|
||||
@ -24,11 +24,11 @@ export default new Router({
|
||||
component: ping,
|
||||
beforeEnter(to, from, next) {
|
||||
if (!store.getters.isAuthenticated) {
|
||||
next('/login')
|
||||
next('/login');
|
||||
} else {
|
||||
next()
|
||||
}
|
||||
next();
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
|
@ -1,55 +1,45 @@
|
||||
// src/store/index.js
|
||||
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
import Vue from 'vue';
|
||||
import Vuex from 'vuex';
|
||||
import { fetchchaine, fetchemission, authenticate } from '../api';
|
||||
import { isValidJwt, EventBus } from '../utils'
|
||||
Vue.use(Vuex)
|
||||
const state = {
|
||||
// single source of data
|
||||
arrayresultchaines: [],
|
||||
user: {},
|
||||
jwt: ''
|
||||
}
|
||||
const API_PATH=`${process.env.ROOT_API}/api/v1`;
|
||||
import { isValidJwt, EventBus } from '../utils';
|
||||
|
||||
Vue.use(Vuex);
|
||||
const actions = {
|
||||
// asynchronous operations
|
||||
getchaine(context, { num }) {
|
||||
|
||||
return fetchchaine(num)
|
||||
.then( res => {
|
||||
.then((res) => {
|
||||
if (res.status === 200) {
|
||||
context.dispatch('getemission',{chaine:num,name:res.data})
|
||||
context.dispatch('getemission', { chaine: num, name: res.data });
|
||||
} else {
|
||||
context.commit('push_chaine',{chaine:num,name:res.data})
|
||||
context.commit('push_chaine', { chaine: num, name: res.data });
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
// eslint-disable-next-line
|
||||
console.error(error);
|
||||
});
|
||||
},
|
||||
getemission(context, { chaine, name }) {
|
||||
return fetchemission(chaine)
|
||||
.then(res_emission => {
|
||||
context.commit('push_chaine',{chaine:chaine,name:name,emission:res_emission.data})
|
||||
.then((resEmission) => {
|
||||
context.commit('push_chaine', { chaine, name, emission: resEmission.data });
|
||||
})
|
||||
.catch(error => {
|
||||
context.commit('push_chaine',{chaine:chaine,name:name})
|
||||
.catch((error) => {
|
||||
context.commit('push_chaine', { chaine, name });
|
||||
console.error(error);
|
||||
});
|
||||
},
|
||||
login(context, userData) {
|
||||
context.commit('setUserData', { userData })
|
||||
context.commit('setUserData', { userData });
|
||||
return authenticate(userData)
|
||||
.then(response => context.commit('setJwtToken', { jwt: response.data }))
|
||||
.catch(error => {
|
||||
|
||||
console.log('Error Authenticating: ', error)
|
||||
EventBus.$emit('failedAuthentication', error.response.data.message)
|
||||
|
||||
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('Error Authenticating: ', error);
|
||||
EventBus.$emit('failedAuthentication', error.response.data.message);
|
||||
});
|
||||
},
|
||||
// register (context, userData) {
|
||||
// context.commit('setUserData', { userData })
|
||||
@ -60,44 +50,53 @@ const actions = {
|
||||
// EventBus.$emit('failedRegistering: ', error)
|
||||
// })
|
||||
// }
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
const mutations = {
|
||||
// isolated data mutations
|
||||
push_chaine(state, payload) {
|
||||
if (!payload.name) {
|
||||
state.arrayresultchaines.push({ chaine: payload.chaine, name: "inconnue" });
|
||||
state.arrayresultchaines.push({ chaine: payload.chaine, name: 'inconnue' });
|
||||
} else {
|
||||
state.arrayresultchaines.push({chaine: payload.chaine,name: payload.name,emission: payload.emission});
|
||||
state.arrayresultchaines.push({
|
||||
chaine: payload.chaine, name: payload.name, emission: payload.emission,
|
||||
});
|
||||
}
|
||||
state.arrayresultchaines=state.arrayresultchaines.sort(function (a,b){
|
||||
return ((a.chaine < b.chaine) ? -1 : ((a.chaine > b.chaine) ? 1 : 0));
|
||||
})
|
||||
state.arrayresultchaines = state.arrayresultchaines.sort((a, b) => {
|
||||
if (a.chaine < b.chaine) return -1;
|
||||
if (a.chaine > b.chaine) return 1;
|
||||
return 0;
|
||||
});
|
||||
},
|
||||
setUserData(state, payload) {
|
||||
console.log('setUserData payload = ', payload)
|
||||
state.userData = payload.userData
|
||||
console.log('setUserData payload = ', payload);
|
||||
state.userData = payload.userData;
|
||||
},
|
||||
setJwtToken(state, payload) {
|
||||
console.log('setJwtToken payload = ', payload)
|
||||
localStorage.token = payload.jwt.token
|
||||
state.jwt = payload.jwt
|
||||
}
|
||||
}
|
||||
console.log('setJwtToken payload = ', payload);
|
||||
localStorage.token = payload.jwt.token;
|
||||
state.jwt = payload.jwt;
|
||||
},
|
||||
};
|
||||
|
||||
const getters = {
|
||||
// reusable data accessors
|
||||
isAuthenticated(state) {
|
||||
return isValidJwt(state.jwt.token)
|
||||
}
|
||||
}
|
||||
return isValidJwt(state.jwt.token);
|
||||
},
|
||||
};
|
||||
|
||||
const state = {
|
||||
// single source of data
|
||||
arrayresultchaines: [],
|
||||
user: {},
|
||||
jwt: '',
|
||||
};
|
||||
const store = new Vuex.Store({
|
||||
state,
|
||||
actions,
|
||||
mutations,
|
||||
getters
|
||||
})
|
||||
getters,
|
||||
});
|
||||
|
||||
export default store
|
||||
export default store;
|
||||
|
@ -1,13 +1,12 @@
|
||||
import Vue from 'vue'
|
||||
|
||||
export const EventBus = new Vue()
|
||||
import Vue from 'vue';
|
||||
|
||||
export const EventBus = new Vue();
|
||||
export function isValidJwt(jwt) {
|
||||
if (!jwt || jwt.split('.').length < 3) {
|
||||
return false
|
||||
return false;
|
||||
}
|
||||
const data = JSON.parse(atob(jwt.split('.')[1]))
|
||||
const exp = new Date(data.exp * 1000) // JS deals with dates in milliseconds since epoch
|
||||
const now = new Date()
|
||||
return now < exp
|
||||
const data = JSON.parse(atob(jwt.split('.')[1]));
|
||||
const exp = new Date(data.exp * 1000); // JS deals with dates in milliseconds since epoch
|
||||
const now = new Date();
|
||||
return now < exp;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user