+created base html/css/js (added gstore + default templates)
This commit is contained in:
parent
6669ff7d8b
commit
a493db2bf2
|
@ -13,6 +13,7 @@
|
||||||
<link rel='shortcut icon' href='/favicon.ico'>
|
<link rel='shortcut icon' href='/favicon.ico'>
|
||||||
|
|
||||||
<!-- CSS dependencies -->
|
<!-- CSS dependencies -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
|
||||||
<link rel='stylesheet' type='text/css' href='/css/font-loader.css'>
|
<link rel='stylesheet' type='text/css' href='/css/font-loader.css'>
|
||||||
<link rel='stylesheet' type='text/css' href='/css/layout.css'>
|
<link rel='stylesheet' type='text/css' href='/css/layout.css'>
|
||||||
<link rel='stylesheet' type='text/css' href='/css/menu.css'>
|
<link rel='stylesheet' type='text/css' href='/css/menu.css'>
|
||||||
|
|
|
@ -0,0 +1,41 @@
|
||||||
|
import {GlobalStore} from '../lib/gstore'
|
||||||
|
|
||||||
|
window.gstore = new GlobalStore();
|
||||||
|
|
||||||
|
|
||||||
|
/* (1) Main components
|
||||||
|
---------------------------------------------------------*/
|
||||||
|
/* (1) Header */
|
||||||
|
gstore.add('header_title', 'ndli1718');
|
||||||
|
|
||||||
|
/* (2) Menu */
|
||||||
|
gstore.add('menu_item', {
|
||||||
|
dashboard: {
|
||||||
|
label: 'Accueil',
|
||||||
|
theme: 'dashboard'
|
||||||
|
}, emergency: {
|
||||||
|
label: 'Urgences',
|
||||||
|
theme: 'emergency'
|
||||||
|
}, event: {
|
||||||
|
label: 'Signalements',
|
||||||
|
theme: 'event'
|
||||||
|
}, inbox: {
|
||||||
|
label: 'Messagerie',
|
||||||
|
theme: 'inbox'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
gstore.add('URI', document.URL.replace(/^(?:\/\/|[^\/]+)*/, ''));
|
||||||
|
gstore.add('is_local', document.URL.replace(/^http:\/\/([^\/]+)(?::\d+)?\/?.*$/, '$1') == 'ptut.com');
|
||||||
|
gstore.add('min_menu', false);
|
||||||
|
|
||||||
|
// // Proccess current page from url
|
||||||
|
// if( /^\/(\w+)(?:\/?.*)$/.test(gstore.data.URI) ){
|
||||||
|
// var mi_keys = Object.keys( gstore.data.menu_item );
|
||||||
|
|
||||||
|
// // if current page exists
|
||||||
|
// if( !!~mi_keys.indexOf(RegExp.$1) ) gstore.add('menu_item_active', RegExp.$1);
|
||||||
|
// else gstore.add('menu_item_active', 'dashboard');
|
||||||
|
|
||||||
|
// }else
|
||||||
|
// gstore.add('menu_item_active', 'dashboard');
|
|
@ -0,0 +1 @@
|
||||||
|
gstore.add('blo', 12);
|
|
@ -0,0 +1,14 @@
|
||||||
|
/* classe GlobalStore */
|
||||||
|
export class GlobalStore{
|
||||||
|
|
||||||
|
constructor(){
|
||||||
|
|
||||||
|
this.get = {};
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
add(field, value){
|
||||||
|
this.get[field] = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
|
@ -9,13 +9,17 @@ import {APIClient} from '../lib/api-client'
|
||||||
/* (3) Vues */
|
/* (3) Vues */
|
||||||
import wrapper_vue from '../vue/wrapper.vue'
|
import wrapper_vue from '../vue/wrapper.vue'
|
||||||
|
|
||||||
|
/* (4) Data */
|
||||||
|
require('../data/common');
|
||||||
|
require('../data/home');
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* (2) Initialisation
|
/* (2) Initialisation
|
||||||
---------------------------------------------------------*/
|
---------------------------------------------------------*/
|
||||||
/* (1) API */
|
/* (1) API */
|
||||||
window.api = new APIClient(gstore.data.is_local ? 'http://ptut.com:8080/api/v/1.0/' : 'https://ptut.xdrm.io/api/v/1.0/');
|
window.api = new APIClient(gstore.get.is_local ? 'http://ptut.com:8080/api/v/1.0/' : 'https://ptut.xdrm.io/api/v/1.0/');
|
||||||
|
|
||||||
|
|
||||||
/* (2) Render view */
|
/* (2) Render view */
|
||||||
new Vue({
|
new Vue({
|
||||||
|
|
|
@ -0,0 +1,20 @@
|
||||||
|
* {
|
||||||
|
margin: none;
|
||||||
|
padding: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
body{
|
||||||
|
position: fixed;
|
||||||
|
display: block;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
background: #ccc;
|
||||||
|
|
||||||
|
font-size: 16px;
|
||||||
|
font-family: 'Open Sans';
|
||||||
|
|
||||||
|
color: #333;
|
||||||
|
}
|
|
@ -0,0 +1,25 @@
|
||||||
|
<template>
|
||||||
|
|
||||||
|
<div id='HEADER'>
|
||||||
|
|
||||||
|
<!-- Header Icon+Title -->
|
||||||
|
<div id='header-icon'>
|
||||||
|
<div class='header-title'>{{ gstore.header_title }}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'HEADER',
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
gstore: gstore.get,
|
||||||
|
is_connected: _SERVER.session.connected
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -0,0 +1,28 @@
|
||||||
|
<template>
|
||||||
|
|
||||||
|
<div id='MENU'>
|
||||||
|
|
||||||
|
<div v-for='(item, index) in gstore.menu_item' class='menu-item-wrapper'>
|
||||||
|
|
||||||
|
<div :class="(index == gstore.menu_item_active) ? 'menu-item active' : 'menu-item'" @click='navigate(index)' :data-theme='item.theme'>
|
||||||
|
<span>{{ item.label }}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'MENU',
|
||||||
|
data(){ return { gstore: gstore.get }; },
|
||||||
|
methods: {
|
||||||
|
navigate(uri){
|
||||||
|
console.log("Navigate to "+uri);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -0,0 +1,28 @@
|
||||||
|
<template>
|
||||||
|
<div id="WRAPPER">
|
||||||
|
|
||||||
|
<!-- Header -->
|
||||||
|
<header-comp></header-comp>
|
||||||
|
|
||||||
|
<!-- Menu -->
|
||||||
|
<menu-comp></menu-comp>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
import header_vue from './header.vue'
|
||||||
|
import menu_vue from './menu.vue'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'wrapper',
|
||||||
|
data(){ return { gstore: gstore.get }; },
|
||||||
|
components: {
|
||||||
|
'HeaderComp': header_vue,
|
||||||
|
'MenuComp': menu_vue
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
Loading…
Reference in New Issue