vnSideMenu, vnBackground, style fixes
This commit is contained in:
parent
84c0002cb1
commit
1dbb75a1b8
|
@ -13,6 +13,5 @@ COPY front/nginx.conf sites-available/salix
|
||||||
RUN rm sites-enabled/default && ln -s ../sites-available/salix sites-enabled/salix
|
RUN rm sites-enabled/default && ln -s ../sites-available/salix sites-enabled/salix
|
||||||
|
|
||||||
COPY dist /salix/dist
|
COPY dist /salix/dist
|
||||||
COPY front/salix/manifest.json /salix/dist/
|
|
||||||
|
|
||||||
CMD ["nginx", "-g", "daemon off;"]
|
CMD ["nginx", "-g", "daemon off;"]
|
||||||
|
|
|
@ -38,3 +38,4 @@ October: Octubre
|
||||||
November: Noviembre
|
November: Noviembre
|
||||||
December: Diciembre
|
December: Diciembre
|
||||||
Has delivery: Hay reparto
|
Has delivery: Hay reparto
|
||||||
|
Loading: Cargando
|
|
@ -3,10 +3,10 @@
|
||||||
<img src="./logo.svg" alt="Logo"></img>
|
<img src="./logo.svg" alt="Logo"></img>
|
||||||
</a>
|
</a>
|
||||||
<vn-icon
|
<vn-icon
|
||||||
ng-if="$ctrl.showLeftMenuButton"
|
|
||||||
class="show-menu"
|
|
||||||
icon="menu"
|
icon="menu"
|
||||||
ng-click="$ctrl.showLeftMenu()">
|
class="show-menu"
|
||||||
|
ng-if="$ctrl.leftMenu"
|
||||||
|
ng-click="$ctrl.leftMenu.show()">
|
||||||
</vn-icon>
|
</vn-icon>
|
||||||
<div class="main-title" translate>
|
<div class="main-title" translate>
|
||||||
{{$ctrl.$state.current.description}}
|
{{$ctrl.$state.current.description}}
|
||||||
|
@ -14,20 +14,15 @@
|
||||||
<vn-spinner enable="$ctrl.vnApp.loading"></vn-spinner>
|
<vn-spinner enable="$ctrl.vnApp.loading"></vn-spinner>
|
||||||
<vn-main-menu></vn-main-menu>
|
<vn-main-menu></vn-main-menu>
|
||||||
<vn-icon
|
<vn-icon
|
||||||
ng-if="$ctrl.rightMenu"
|
|
||||||
class="show-menu"
|
|
||||||
icon="menu"
|
icon="menu"
|
||||||
ng-click="$ctrl.showRightMenu()">
|
class="show-menu"
|
||||||
|
ng-if="$ctrl.rightMenu"
|
||||||
|
ng-click="$ctrl.rightMenu.show()">
|
||||||
</vn-icon>
|
</vn-icon>
|
||||||
</vn-topbar>
|
</vn-topbar>
|
||||||
<div ui-view
|
<div ui-view
|
||||||
class="main-view"
|
class="main-view"
|
||||||
ng-class="{'padding': $ctrl.showTopbar}">
|
ng-class="{padding: $ctrl.showTopbar}">
|
||||||
<vn-home></vn-home>
|
<vn-home></vn-home>
|
||||||
</div>
|
</div>
|
||||||
<div
|
|
||||||
class="background"
|
|
||||||
ng-class="{shown: $ctrl.leftMenuShown || $ctrl.rightMenuShown}"
|
|
||||||
ng-click="$ctrl.hideMenus()">
|
|
||||||
</div>
|
|
||||||
<vn-snackbar vn-id="snackbar"></vn-snackbar>
|
<vn-snackbar vn-id="snackbar"></vn-snackbar>
|
|
@ -1,19 +1,18 @@
|
||||||
import ngModule from '../../module';
|
import ngModule from '../../module';
|
||||||
import './style.scss';
|
import './style.scss';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* The main graphical application component.
|
||||||
|
*
|
||||||
|
* @property {SideMenu} leftMenu The left menu, if it's present
|
||||||
|
* @property {SideMenu} rightMenu The left menu, if it's present
|
||||||
|
*/
|
||||||
export default class App {
|
export default class App {
|
||||||
constructor($, $element, vnApp, $state, $transitions) {
|
constructor($, $state, vnApp) {
|
||||||
Object.assign(this, {
|
Object.assign(this, {
|
||||||
$,
|
$,
|
||||||
$element,
|
$state,
|
||||||
vnApp,
|
vnApp
|
||||||
$state
|
|
||||||
});
|
|
||||||
|
|
||||||
$transitions.onStart({}, transition => {
|
|
||||||
let state = transition.targetState().name();
|
|
||||||
this.showLeftMenuButton = state.split('.').length >= 3;
|
|
||||||
this.hideMenus();
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -30,33 +29,6 @@ export default class App {
|
||||||
return state && state != 'login';
|
return state && state != 'login';
|
||||||
}
|
}
|
||||||
|
|
||||||
get leftMenu() {
|
|
||||||
return this.$element[0].querySelector('.left-menu');
|
|
||||||
}
|
|
||||||
|
|
||||||
showLeftMenu() {
|
|
||||||
if (!this.leftMenu) return;
|
|
||||||
this.leftMenu.classList.add('shown');
|
|
||||||
this.leftMenuShown = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
showRightMenu() {
|
|
||||||
if (!this.rightMenu) return;
|
|
||||||
this.rightMenu.classList.add('shown');
|
|
||||||
this.rightMenuShown = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
hideMenus() {
|
|
||||||
if (this.leftMenuShown) {
|
|
||||||
this.leftMenu.classList.remove('shown');
|
|
||||||
this.leftMenuShown = false;
|
|
||||||
}
|
|
||||||
if (this.rightMenuShown) {
|
|
||||||
this.rightMenu.classList.remove('shown');
|
|
||||||
this.rightMenuShown = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
showMessage(message) {
|
showMessage(message) {
|
||||||
this.$.snackbar.show({message: message});
|
this.$.snackbar.show({message: message});
|
||||||
}
|
}
|
||||||
|
@ -69,7 +41,7 @@ export default class App {
|
||||||
this.$.snackbar.showError({message: message});
|
this.$.snackbar.showError({message: message});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
App.$inject = ['$scope', '$element', 'vnApp', '$state', '$transitions'];
|
App.$inject = ['$scope', '$state', 'vnApp'];
|
||||||
|
|
||||||
ngModule.component('vnApp', {
|
ngModule.component('vnApp', {
|
||||||
template: require('./app.html'),
|
template: require('./app.html'),
|
||||||
|
|
|
@ -1,9 +1,6 @@
|
||||||
@import "background";
|
@import "background";
|
||||||
@import "margin";
|
@import "margin";
|
||||||
|
@import "variables";
|
||||||
$menu-width: 16em;
|
|
||||||
$topbar-height: 4em;
|
|
||||||
$mobile-width: 800px;
|
|
||||||
|
|
||||||
body {
|
body {
|
||||||
@extend .bg-content;
|
@extend .bg-content;
|
||||||
|
@ -72,27 +69,6 @@ vn-app {
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding-left: $menu-width;
|
padding-left: $menu-width;
|
||||||
|
|
||||||
%side-menu {
|
|
||||||
display: block;
|
|
||||||
position: fixed;
|
|
||||||
z-index: 5;
|
|
||||||
bottom: 0;
|
|
||||||
width: $menu-width;
|
|
||||||
min-width: $menu-width;
|
|
||||||
background-color: white;
|
|
||||||
box-shadow: 0 .1em .2em rgba(1, 1, 1, .2);
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
.left-menu {
|
|
||||||
@extend %side-menu;
|
|
||||||
top: $topbar-height;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
.right-menu {
|
|
||||||
@extend %side-menu;
|
|
||||||
top: $topbar-height;
|
|
||||||
right: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.main-with-right-menu {
|
.main-with-right-menu {
|
||||||
padding-right: $menu-width;
|
padding-right: $menu-width;
|
||||||
|
@ -102,18 +78,6 @@ vn-app {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
& > .background {
|
|
||||||
display: none;
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background-color: black;
|
|
||||||
z-index: 14;
|
|
||||||
opacity: 0;
|
|
||||||
transition: opacity 200ms ease-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: $mobile-width) {
|
@media screen and (max-width: $mobile-width) {
|
||||||
& > vn-topbar > header {
|
& > vn-topbar > header {
|
||||||
|
@ -135,32 +99,10 @@ vn-app {
|
||||||
}
|
}
|
||||||
vn-main-block {
|
vn-main-block {
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
|
|
||||||
%side-menu-mobile {
|
|
||||||
top: 0;
|
|
||||||
transition: transform 200ms ease-out;
|
|
||||||
z-index: 15;
|
|
||||||
|
|
||||||
&.shown {
|
|
||||||
transform: translateZ(0) translateX(0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.left-menu {
|
|
||||||
@extend %side-menu-mobile;
|
|
||||||
transform: translateZ(0) translateX(-$menu-width);
|
|
||||||
}
|
|
||||||
.right-menu {
|
|
||||||
@extend %side-menu-mobile;
|
|
||||||
transform: translateZ(0) translateX($menu-width);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.main-with-right-menu {
|
.main-with-right-menu {
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
& > .background.shown {
|
|
||||||
display: block;
|
|
||||||
opacity: .3;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1 @@
|
||||||
|
import './style.scss';
|
|
@ -0,0 +1,26 @@
|
||||||
|
@import "variables";
|
||||||
|
|
||||||
|
@keyframes fadein {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
vn-background {
|
||||||
|
display: none;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: black;
|
||||||
|
z-index: 14;
|
||||||
|
|
||||||
|
@media screen and (max-width: $mobile-width) {
|
||||||
|
&.shown {
|
||||||
|
display: block;
|
||||||
|
opacity: .3;
|
||||||
|
animation: 500ms ease-out fadein;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -2,6 +2,8 @@ import './app/app';
|
||||||
import './login/login';
|
import './login/login';
|
||||||
import './home/home';
|
import './home/home';
|
||||||
import './main-menu/main-menu';
|
import './main-menu/main-menu';
|
||||||
|
import './background/background';
|
||||||
|
import './side-menu/side-menu';
|
||||||
import './left-menu/left-menu';
|
import './left-menu/left-menu';
|
||||||
import './topbar/topbar';
|
import './topbar/topbar';
|
||||||
import './user-configuration-popover';
|
import './user-configuration-popover';
|
||||||
|
|
|
@ -5,26 +5,31 @@
|
||||||
class="unselectable">
|
class="unselectable">
|
||||||
{{currentUserName}}
|
{{currentUserName}}
|
||||||
</div>
|
</div>
|
||||||
<vn-icon
|
<div>
|
||||||
id="apps"
|
<vn-icon
|
||||||
icon="apps"
|
id="apps"
|
||||||
vn-popover="apps-menu"
|
icon="apps"
|
||||||
translate-attr="{title: 'Applications'}">
|
vn-popover="apps-menu"
|
||||||
</vn-icon>
|
translate-attr="{title: 'Applications'}">
|
||||||
<vn-menu vn-id="apps-menu">
|
</vn-icon>
|
||||||
<ul pad-small>
|
<vn-menu vn-id="apps-menu">
|
||||||
<li ng-repeat="mod in ::$ctrl.modules" ui-sref="{{::mod.route.state}}">
|
<ul pad-small>
|
||||||
<vn-icon icon="{{::mod.icon || 'photo'}}"></vn-icon>
|
<li ng-repeat="mod in ::$ctrl.modules" ui-sref="{{::mod.route.state}}">
|
||||||
<span translate>{{::mod.name}}</span>
|
<vn-icon icon="{{::mod.icon || 'photo'}}"></vn-icon>
|
||||||
</li>
|
<span translate>{{::mod.name}}</span>
|
||||||
</ul>
|
</li>
|
||||||
</vn-menu>
|
</ul>
|
||||||
<vn-icon
|
</vn-menu>
|
||||||
id="logout"
|
</div>
|
||||||
icon="exit_to_app"
|
<div>
|
||||||
translate-attr="{title: 'Logout'}"
|
<vn-icon
|
||||||
ng-click="$ctrl.onLogoutClick()">
|
id="logout"
|
||||||
</vn-icon>
|
icon="exit_to_app"
|
||||||
|
translate-attr="{title: 'Logout'}"
|
||||||
|
ng-click="$ctrl.onLogoutClick()">
|
||||||
|
</vn-icon>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<vn-user-configuration-popover vn-id="popover">
|
<vn-user-configuration-popover
|
||||||
|
vn-id="popover">
|
||||||
</vn-user-configuration-popover>
|
</vn-user-configuration-popover>
|
|
@ -2,13 +2,13 @@ import ngModule from '../../module';
|
||||||
import './style.scss';
|
import './style.scss';
|
||||||
|
|
||||||
export default class MainMenu {
|
export default class MainMenu {
|
||||||
constructor($translate, $scope, $http, $window, vnModules, vnAuth) {
|
constructor($, $http, vnAuth, vnModules) {
|
||||||
this.$ = $scope;
|
Object.assign(this, {
|
||||||
this.$http = $http;
|
$,
|
||||||
this.$translate = $translate;
|
$http,
|
||||||
this.$window = $window;
|
vnAuth,
|
||||||
this.modules = vnModules.get();
|
modules: vnModules.get()
|
||||||
this.vnAuth = vnAuth;
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
$onInit() {
|
$onInit() {
|
||||||
|
@ -30,7 +30,7 @@ export default class MainMenu {
|
||||||
this.vnAuth.logout();
|
this.vnAuth.logout();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
MainMenu.$inject = ['$translate', '$scope', '$http', '$window', 'vnModules', 'vnAuth'];
|
MainMenu.$inject = ['$scope', '$http', 'vnAuth', 'vnModules'];
|
||||||
|
|
||||||
ngModule.component('vnMainMenu', {
|
ngModule.component('vnMainMenu', {
|
||||||
template: require('./main-menu.html'),
|
template: require('./main-menu.html'),
|
||||||
|
|
|
@ -12,7 +12,7 @@ vn-main-menu {
|
||||||
|
|
||||||
& > * {
|
& > * {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding-left: .3em;
|
padding-left: .6em;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: $main-01;
|
color: $main-01;
|
||||||
|
@ -21,10 +21,9 @@ vn-main-menu {
|
||||||
& > #user {
|
& > #user {
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding-right: .4em;
|
margin-right: .2em;
|
||||||
}
|
}
|
||||||
& > vn-icon,
|
& > div > vn-icon {
|
||||||
& > a > vn-icon {
|
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 2.1em;
|
font-size: 2.1em;
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
<vn-background
|
||||||
|
ng-class="{shown: $ctrl.shown}"
|
||||||
|
ng-click="$ctrl.hide()">
|
||||||
|
</vn-background>
|
||||||
|
<div
|
||||||
|
class="menu"
|
||||||
|
ng-class="{shown: $ctrl.shown}"
|
||||||
|
ng-transclude>
|
||||||
|
</div>
|
|
@ -0,0 +1,78 @@
|
||||||
|
import ngModule from '../../module';
|
||||||
|
import './style.scss';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* A side menu.
|
||||||
|
*
|
||||||
|
* @property {String} side [left|right] The side where the menu is displayed
|
||||||
|
* @property {Boolean} shown Whether the menu it's currently displayed (Only for small viewports)
|
||||||
|
*/
|
||||||
|
export default class SideMenu {
|
||||||
|
constructor($, $element, $window, $transitions) {
|
||||||
|
Object.assign(this, {
|
||||||
|
$,
|
||||||
|
$element,
|
||||||
|
$window,
|
||||||
|
$transitions,
|
||||||
|
side: 'left'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
$onInit() {
|
||||||
|
this.menu = this.$element[0].querySelector('.menu');
|
||||||
|
|
||||||
|
if (this.side == 'right') {
|
||||||
|
this.menu.classList.add('right');
|
||||||
|
this.app.rightMenu = this;
|
||||||
|
} else {
|
||||||
|
this.menu.classList.add('left');
|
||||||
|
this.app.leftMenu = this;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$onDestroy() {
|
||||||
|
if (this.side == 'right')
|
||||||
|
this.app.rightMenu = null;
|
||||||
|
else
|
||||||
|
this.app.leftMenu = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
onEscape(event) {
|
||||||
|
if (!event.defaultPrevented && event.key == 'Escape') {
|
||||||
|
event.preventDefault();
|
||||||
|
this.hide();
|
||||||
|
this.$.$digest();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onTransition(transition) {
|
||||||
|
if (transition.from().name !== transition.to().name)
|
||||||
|
this.hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
show() {
|
||||||
|
this.shown = true;
|
||||||
|
this.handler = e => this.onEscape(e);
|
||||||
|
this.$window.addEventListener('keydown', this.handler);
|
||||||
|
this.stateHandler = this.$transitions.onStart({}, t => this.onTransition(t));
|
||||||
|
}
|
||||||
|
|
||||||
|
hide() {
|
||||||
|
this.$window.removeEventListener('keydown', this.handler);
|
||||||
|
this.stateHandler();
|
||||||
|
this.shown = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
SideMenu.$inject = ['$scope', '$element', '$window', '$transitions'];
|
||||||
|
|
||||||
|
ngModule.component('vnSideMenu', {
|
||||||
|
template: require('./side-menu.html'),
|
||||||
|
controller: SideMenu,
|
||||||
|
transclude: true,
|
||||||
|
bindings: {
|
||||||
|
side: '@?'
|
||||||
|
},
|
||||||
|
require: {
|
||||||
|
app: '^vnApp'
|
||||||
|
}
|
||||||
|
});
|
|
@ -0,0 +1,37 @@
|
||||||
|
@import "variables";
|
||||||
|
|
||||||
|
vn-side-menu > .menu {
|
||||||
|
display: block;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 5;
|
||||||
|
bottom: 0;
|
||||||
|
width: $menu-width;
|
||||||
|
min-width: $menu-width;
|
||||||
|
background-color: white;
|
||||||
|
box-shadow: 0 .1em .2em rgba(1, 1, 1, .2);
|
||||||
|
overflow: auto;
|
||||||
|
top: $topbar-height;
|
||||||
|
|
||||||
|
&.left {
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
&.right {
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: $mobile-width) {
|
||||||
|
top: 0;
|
||||||
|
transition: transform 200ms ease-out;
|
||||||
|
z-index: 15;
|
||||||
|
|
||||||
|
&.left {
|
||||||
|
transform: translateZ(0) translateX(-$menu-width);
|
||||||
|
}
|
||||||
|
&.right {
|
||||||
|
transform: translateZ(0) translateX($menu-width);
|
||||||
|
}
|
||||||
|
&.shown {
|
||||||
|
transform: translateZ(0) translateX(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -4,7 +4,7 @@
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=no"/>
|
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=no"/>
|
||||||
<meta name="mobile-web-app-capable" content="yes"/>
|
<meta name="mobile-web-app-capable" content="yes"/>
|
||||||
<link rel="manifest" href="manifest.json"/>
|
<link rel="manifest" href="<%= require('./manifest.json') %>"/>
|
||||||
<title vn-title translate></title>
|
<title vn-title translate></title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
|
@ -1,12 +1,12 @@
|
||||||
{
|
{
|
||||||
"name": "Salix",
|
"name": "Salix",
|
||||||
|
"start_url": "index.html",
|
||||||
|
"display": "standalone",
|
||||||
|
"theme_color": "#3d3d3d",
|
||||||
"icons": [
|
"icons": [
|
||||||
{
|
{
|
||||||
"src": "favicon.ico",
|
"src": "favicon.ico",
|
||||||
"sizes": "512x512"
|
"sizes": "512x512"
|
||||||
}
|
}
|
||||||
],
|
]
|
||||||
"start_url": "index.html",
|
|
||||||
"display": "standalone",
|
|
||||||
"theme_color": "#3d3d3d"
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -78,3 +78,8 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
vn-popover {
|
||||||
|
.vn-descriptor > .header > a:first-child {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,4 @@
|
||||||
|
|
||||||
|
$menu-width: 16em;
|
||||||
|
$topbar-height: 4em;
|
||||||
|
$mobile-width: 800px;
|
|
@ -17,14 +17,6 @@ class Controller {
|
||||||
this.ndMonth = this.$scope.ndMonth;
|
this.ndMonth = this.$scope.ndMonth;
|
||||||
}
|
}
|
||||||
|
|
||||||
$onInit() {
|
|
||||||
this.app.rightMenu = this.$element[0];
|
|
||||||
}
|
|
||||||
|
|
||||||
$onDestroy() {
|
|
||||||
this.app.rightMenu = null;
|
|
||||||
}
|
|
||||||
|
|
||||||
get zone() {
|
get zone() {
|
||||||
return this._zone;
|
return this._zone;
|
||||||
}
|
}
|
||||||
|
@ -152,9 +144,6 @@ Controller.$inject = ['$element', '$scope', '$stateParams', '$http'];
|
||||||
ngModule.component('vnZoneCalendar', {
|
ngModule.component('vnZoneCalendar', {
|
||||||
template: require('./index.html'),
|
template: require('./index.html'),
|
||||||
controller: Controller,
|
controller: Controller,
|
||||||
require: {
|
|
||||||
app: '^vnApp'
|
|
||||||
},
|
|
||||||
bindings: {
|
bindings: {
|
||||||
zone: '<'
|
zone: '<'
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<vn-main-block>
|
<vn-main-block>
|
||||||
<div class="left-menu">
|
<vn-side-menu side="left">
|
||||||
<vn-zone-descriptor zone="$ctrl.zone"></vn-zone-descriptor>
|
<vn-zone-descriptor zone="$ctrl.zone"></vn-zone-descriptor>
|
||||||
<vn-left-menu></vn-left-menu>
|
<vn-left-menu></vn-left-menu>
|
||||||
</div>
|
</vn-side-menu>
|
||||||
<div class="content-block" ui-view></div>
|
<div class="content-block" ui-view></div>
|
||||||
</vn-main-block>
|
</vn-main-block>
|
||||||
|
|
|
@ -16,8 +16,7 @@
|
||||||
on-selection="$ctrl.onSelection(item)">
|
on-selection="$ctrl.onSelection(item)">
|
||||||
</vn-treeview>
|
</vn-treeview>
|
||||||
</vn-card>
|
</vn-card>
|
||||||
<vn-zone-calendar
|
<vn-side-menu side="right">
|
||||||
class="right-menu"
|
<vn-zone-calendar zone="::$ctrl.zone"></vn-zone-calendar>
|
||||||
zone="::$ctrl.zone">
|
</vn-side-menu>
|
||||||
</vn-zone-calendar>
|
|
||||||
</div>
|
</div>
|
|
@ -1,7 +1,7 @@
|
||||||
<vn-main-block>
|
<vn-main-block>
|
||||||
<div class="left-menu">
|
<vn-side-menu side="left">
|
||||||
<vn-claim-descriptor claim="$ctrl.claim"></vn-claim-descriptor>
|
<vn-claim-descriptor claim="$ctrl.claim"></vn-claim-descriptor>
|
||||||
<vn-left-menu></vn-left-menu>
|
<vn-left-menu></vn-left-menu>
|
||||||
</div>
|
</vn-side-menu>
|
||||||
<div class="content-block" ui-view></div>
|
<div class="content-block" ui-view></div>
|
||||||
</vn-main-block>
|
</vn-main-block>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<vn-main-block>
|
<vn-main-block>
|
||||||
<div class="left-menu">
|
<vn-side-menu side="left">
|
||||||
<vn-client-descriptor client="$ctrl.client"></vn-client-descriptor>
|
<vn-client-descriptor client="$ctrl.client"></vn-client-descriptor>
|
||||||
<vn-left-menu></vn-left-menu>
|
<vn-left-menu></vn-left-menu>
|
||||||
</div>
|
</vn-side-menu>
|
||||||
<div class="content-block" ui-view></div>
|
<div class="content-block" ui-view></div>
|
||||||
</vn-main-block>
|
</vn-main-block>
|
||||||
|
|
|
@ -5,8 +5,5 @@ vn-client-descriptor-popover {
|
||||||
& > vn-card{
|
& > vn-card{
|
||||||
margin: 0!important;
|
margin: 0!important;
|
||||||
}
|
}
|
||||||
.header > a:first-child {
|
|
||||||
display: none
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -1,75 +1,75 @@
|
||||||
<div class="search-panel">
|
<div class="search-panel">
|
||||||
<form ng-submit="$ctrl.onSearch()">
|
<form ng-submit="$ctrl.onSearch()">
|
||||||
<vn-horizontal>
|
<vn-horizontal>
|
||||||
<vn-textfield
|
<vn-textfield
|
||||||
vn-one
|
vn-one
|
||||||
label="General search"
|
label="General search"
|
||||||
model="filter.search"
|
model="filter.search"
|
||||||
vn-focus>
|
vn-focus>
|
||||||
</vn-textfield>
|
</vn-textfield>
|
||||||
</vn-horizontal>
|
</vn-horizontal>
|
||||||
<vn-horizontal>
|
<vn-horizontal>
|
||||||
<vn-textfield
|
<vn-textfield
|
||||||
vn-one
|
vn-one
|
||||||
label="Client id"
|
label="Client id"
|
||||||
model="filter.id">
|
model="filter.id">
|
||||||
</vn-textfield>
|
</vn-textfield>
|
||||||
<vn-textfield
|
<vn-textfield
|
||||||
vn-one
|
vn-one
|
||||||
label="Tax number"
|
label="Tax number"
|
||||||
model="filter.fi">
|
model="filter.fi">
|
||||||
</vn-textfield>
|
</vn-textfield>
|
||||||
</vn-horizontal>
|
</vn-horizontal>
|
||||||
<vn-horizontal>
|
<vn-horizontal>
|
||||||
<vn-textfield
|
<vn-textfield
|
||||||
vn-one label="Name"
|
vn-one label="Name"
|
||||||
model="filter.name">
|
model="filter.name">
|
||||||
</vn-textfield>
|
</vn-textfield>
|
||||||
<vn-autocomplete
|
<vn-autocomplete
|
||||||
vn-one
|
vn-one
|
||||||
field="filter.salesPersonFk"
|
field="filter.salesPersonFk"
|
||||||
url="/client/api/Clients/activeWorkersWithRole"
|
url="/client/api/Clients/activeWorkersWithRole"
|
||||||
search-function="{firstName: $search}"
|
search-function="{firstName: $search}"
|
||||||
show-field="firstName"
|
show-field="firstName"
|
||||||
value-field="id"
|
value-field="id"
|
||||||
where="{role: 'salesPerson'}"
|
where="{role: 'salesPerson'}"
|
||||||
label="Salesperson">
|
label="Salesperson">
|
||||||
<tpl-item>{{firstName}} {{name}}</tpl-item>
|
<tpl-item>{{firstName}} {{name}}</tpl-item>
|
||||||
</vn-autocomplete>
|
</vn-autocomplete>
|
||||||
</vn-horizontal>
|
</vn-horizontal>
|
||||||
<vn-horizontal>
|
<vn-horizontal>
|
||||||
<vn-textfield
|
<vn-textfield
|
||||||
vn-one
|
vn-one
|
||||||
label="Social name"
|
label="Social name"
|
||||||
model="filter.socialName">
|
model="filter.socialName">
|
||||||
</vn-textfield>
|
</vn-textfield>
|
||||||
</vn-horizontal>
|
</vn-horizontal>
|
||||||
<vn-horizontal>
|
<vn-horizontal>
|
||||||
<vn-textfield
|
<vn-textfield
|
||||||
vn-one
|
vn-one
|
||||||
label="Town/City"
|
label="Town/City"
|
||||||
model="filter.city">
|
model="filter.city">
|
||||||
</vn-textfield>
|
</vn-textfield>
|
||||||
<vn-textfield
|
<vn-textfield
|
||||||
vn-one
|
vn-one
|
||||||
label="Postcode"
|
label="Postcode"
|
||||||
model="filter.postcode">
|
model="filter.postcode">
|
||||||
</vn-textfield>
|
</vn-textfield>
|
||||||
</vn-horizontal>
|
</vn-horizontal>
|
||||||
<vn-horizontal>
|
<vn-horizontal>
|
||||||
<vn-textfield
|
<vn-textfield
|
||||||
vn-one
|
vn-one
|
||||||
label="Email"
|
label="Email"
|
||||||
model="filter.email">
|
model="filter.email">
|
||||||
</vn-textfield>
|
</vn-textfield>
|
||||||
<vn-textfield
|
<vn-textfield
|
||||||
vn-one
|
vn-one
|
||||||
label="Phone"
|
label="Phone"
|
||||||
model="filter.phone">
|
model="filter.phone">
|
||||||
</vn-textfield>
|
</vn-textfield>
|
||||||
</vn-horizontal>
|
</vn-horizontal>
|
||||||
<vn-horizontal margin-large-top>
|
<vn-horizontal margin-large-top>
|
||||||
<vn-submit label="Search"></vn-submit>
|
<vn-submit label="Search"></vn-submit>
|
||||||
</vn-horizontal>
|
</vn-horizontal>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<vn-main-block>
|
<vn-main-block>
|
||||||
<div class="left-menu">
|
<vn-side-menu side="left">
|
||||||
<vn-item-descriptor item="$ctrl.item"></vn-item-descriptor>
|
<vn-item-descriptor item="$ctrl.item"></vn-item-descriptor>
|
||||||
<vn-left-menu></vn-left-menu>
|
<vn-left-menu></vn-left-menu>
|
||||||
</div>
|
</vn-side-menu>
|
||||||
<div class="content-block" ui-view></div>
|
<div class="content-block" ui-view></div>
|
||||||
</vn-main-block>
|
</vn-main-block>
|
||||||
|
|
|
@ -3,9 +3,5 @@ vn-item-descriptor-popover {
|
||||||
display: block;
|
display: block;
|
||||||
width: 16em;
|
width: 16em;
|
||||||
min-height: 28em;
|
min-height: 28em;
|
||||||
|
|
||||||
.header > a:first-child {
|
|
||||||
display: none
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -4,12 +4,8 @@ vn-ticket-descriptor-popover {
|
||||||
width: 16em;
|
width: 16em;
|
||||||
max-height: 28em;
|
max-height: 28em;
|
||||||
|
|
||||||
&>vn-card {
|
& > vn-card {
|
||||||
margin: 0!important;
|
margin: 0!important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header > a:first-child {
|
|
||||||
display: none
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -1,7 +1,7 @@
|
||||||
<vn-main-block>
|
<vn-main-block>
|
||||||
<div class="left-menu">
|
<vn-side-menu side="left">
|
||||||
<vn-order-descriptor order="$ctrl.order"></vn-order-descriptor>
|
<vn-order-descriptor order="$ctrl.order"></vn-order-descriptor>
|
||||||
<vn-left-menu></vn-left-menu>
|
<vn-left-menu></vn-left-menu>
|
||||||
</div>
|
</vn-side-menu>
|
||||||
<div class="content-block" ui-view></div>
|
<div class="content-block" ui-view></div>
|
||||||
</vn-main-block>
|
</vn-main-block>
|
||||||
|
|
|
@ -97,10 +97,9 @@
|
||||||
</vn-card>
|
</vn-card>
|
||||||
<vn-pagination margin-small-v model="model"></vn-pagination>
|
<vn-pagination margin-small-v model="model"></vn-pagination>
|
||||||
</div>
|
</div>
|
||||||
<vn-catalog-filter
|
<vn-side-menu side="right">
|
||||||
class="right-menu"
|
<vn-catalog-filter order="$ctrl.order"></vn-catalog-filter>
|
||||||
order="$ctrl.order">
|
</vn-side-menu>
|
||||||
</vn-catalog-filter>
|
|
||||||
<vn-order-prices-popover
|
<vn-order-prices-popover
|
||||||
vn-id="pricesPopover"
|
vn-id="pricesPopover"
|
||||||
order="$ctrl.order">
|
order="$ctrl.order">
|
||||||
|
|
|
@ -14,14 +14,6 @@ class Controller {
|
||||||
this.tags = [];
|
this.tags = [];
|
||||||
}
|
}
|
||||||
|
|
||||||
$onInit() {
|
|
||||||
this.app.rightMenu = this.$element[0];
|
|
||||||
}
|
|
||||||
|
|
||||||
$onDestroy() {
|
|
||||||
this.app.rightMenu = null;
|
|
||||||
}
|
|
||||||
|
|
||||||
get order() {
|
get order() {
|
||||||
return this._order;
|
return this._order;
|
||||||
}
|
}
|
||||||
|
@ -174,8 +166,7 @@ ngModule.component('vnCatalogFilter', {
|
||||||
template: require('./index.html'),
|
template: require('./index.html'),
|
||||||
controller: Controller,
|
controller: Controller,
|
||||||
require: {
|
require: {
|
||||||
catalog: '^vnOrderCatalog',
|
catalog: '^vnOrderCatalog'
|
||||||
app: '^vnApp'
|
|
||||||
},
|
},
|
||||||
bindings: {
|
bindings: {
|
||||||
order: '<',
|
order: '<',
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<vn-main-block>
|
<vn-main-block>
|
||||||
<div class="left-menu">
|
<vn-side-menu side="left">
|
||||||
<vn-ticket-descriptor ticket="$ctrl.ticket"></vn-ticket-descriptor>
|
<vn-ticket-descriptor ticket="$ctrl.ticket"></vn-ticket-descriptor>
|
||||||
<vn-left-menu></vn-left-menu>
|
<vn-left-menu></vn-left-menu>
|
||||||
</div>
|
</vn-side-menu>
|
||||||
<div class="content-block" ui-view></div>
|
<div class="content-block" ui-view></div>
|
||||||
</vn-main-block>
|
</vn-main-block>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<vn-main-block>
|
<vn-main-block>
|
||||||
<div class="left-menu">
|
<vn-side-menu side="left">
|
||||||
<vn-worker-descriptor worker="$ctrl.worker"></vn-worker-descriptor>
|
<vn-worker-descriptor worker="$ctrl.worker"></vn-worker-descriptor>
|
||||||
<vn-left-menu></vn-left-menu>
|
<vn-left-menu></vn-left-menu>
|
||||||
</div>
|
</vn-side-menu>
|
||||||
<div class="content-block" ui-view></div>
|
<div class="content-block" ui-view></div>
|
||||||
</vn-main-block>
|
</vn-main-block>
|
||||||
|
|
|
@ -29,7 +29,13 @@ let baseConfig = {
|
||||||
loader: 'json-loader!yaml-loader'
|
loader: 'json-loader!yaml-loader'
|
||||||
}, {
|
}, {
|
||||||
test: /\.html$/,
|
test: /\.html$/,
|
||||||
loader: 'html-loader'
|
loader: 'html-loader',
|
||||||
|
options: {
|
||||||
|
attrs: [
|
||||||
|
'img:src',
|
||||||
|
'link:href'
|
||||||
|
]
|
||||||
|
}
|
||||||
}, {
|
}, {
|
||||||
test: /\.css$/,
|
test: /\.css$/,
|
||||||
loader: 'style-loader!css-loader'
|
loader: 'style-loader!css-loader'
|
||||||
|
@ -50,6 +56,10 @@ let baseConfig = {
|
||||||
}, {
|
}, {
|
||||||
test: /\.(svg|png|ttf|woff|woff2)$/,
|
test: /\.(svg|png|ttf|woff|woff2)$/,
|
||||||
loader: 'file-loader'
|
loader: 'file-loader'
|
||||||
|
}, {
|
||||||
|
test: /manifest\.json$/,
|
||||||
|
type: 'javascript/auto',
|
||||||
|
loader: 'file-loader'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in New Issue