diff --git a/client/core/src/drop-down/drop-down.js b/client/core/src/drop-down/drop-down.js index c33aea7b5e..c40d286726 100644 --- a/client/core/src/drop-down/drop-down.js +++ b/client/core/src/drop-down/drop-down.js @@ -1,16 +1,27 @@ import {module} from '../module'; import './style.scss'; -/* export default class DropDown { -}*/ +export default class DropDown { + constructor($element, $window) { + this.$element = $element; + this.$window = $window; + } + $onChanges(changesObj) { + if (changesObj.show && changesObj.top && changesObj.top.currentValue) { + this.$element.css('top', changesObj.top.currentValue + 'px'); + } + } +} +DropDown.$inject = ['$element', '$window']; module.component('vnDropDown', { template: require('./drop-down.html'), - // controller: DropDown, + controller: DropDown, bindings: { items: '<', show: '<', - selected: '=' + selected: '=', + top: ' - + \ No newline at end of file diff --git a/client/core/src/icon-menu/icon-menu.js b/client/core/src/icon-menu/icon-menu.js index d1119bedbc..2a521ce4f2 100644 --- a/client/core/src/icon-menu/icon-menu.js +++ b/client/core/src/icon-menu/icon-menu.js @@ -6,6 +6,7 @@ export default class IconMenu { this.$http = $http; this.$timeout = $timeout; this._showDropDown = false; + this._pos = undefined; } get showDropDown() { return this._showDropDown; @@ -14,6 +15,13 @@ export default class IconMenu { this._showDropDown = value; } + get pos() { + return this._pos; + } + set pos(value) { + this._pos = value; + } + getItems() { this.$http.get(this.url).then( json => { @@ -26,9 +34,10 @@ export default class IconMenu { this.getItems(); } - this.$element.bind('mouseover', () => { + this.$element.bind('mouseover', e => { this.$timeout(() => { this.showDropDown = true; + this.pos = e.target.getBoundingClientRect(); }); }); @@ -38,6 +47,10 @@ export default class IconMenu { }); }); } + $onDestroy() { + this.$element.unbind('mouseover'); + this.$element.unbind('mouseout'); + } } IconMenu.$inject = ['$element', '$http', '$timeout']; diff --git a/client/core/src/tooltip/tooltip.js b/client/core/src/tooltip/tooltip.js index ff3f7472ff..4842979770 100644 --- a/client/core/src/tooltip/tooltip.js +++ b/client/core/src/tooltip/tooltip.js @@ -1,12 +1,18 @@ import {module} from '../module'; import './style.css'; -tooltip.$inject = ['$document', '$compile', '$sce', '$templateCache', '$http']; -function tooltip($document, $compile, $sce, $templateCache, $http) { - function getTemplate(tooltipTemplateUrl) { +tooltip.$inject = ['$document', '$compile', '$interpolate', '$sce', '$templateCache', '$http', '$q']; +function tooltip($document, $compile, $interpolate, $sce, $templateCache, $http, $q) { + var promise; + + function _getTemplate(tooltipTemplateUrl) { var template = $templateCache.get(tooltipTemplateUrl); if (typeof template === 'undefined') { template = $http.get(tooltipTemplateUrl).then(function onGetTemplateSuccess(response) { + if (promise) { + promise.resolve(response.data); + } + promise = undefined; return response.data; }); $templateCache.put(tooltipTemplateUrl, template); @@ -14,11 +20,23 @@ function tooltip($document, $compile, $sce, $templateCache, $http) { return template; } + function getTemplate(tooltipTemplateUrl) { + var _promise = $q.defer(); + var template = _getTemplate(tooltipTemplateUrl); + if (template) { + _promise.resolve(template); + } else { + promise = _promise; + } + return _promise.promise; + } + return { restrict: 'A', priority: -1, link: function(scope, element, attrs) { - var tip = $compile('
{{ text }}
')(scope); + var tipHtml = '
{{text}}
'; + var tip; var tipClassName = 'tooltip'; var tipActiveClassName = 'tooltip-show'; @@ -28,13 +46,17 @@ function tooltip($document, $compile, $sce, $templateCache, $http) { if (attrs.tooltipHtml) { scope.isHtmlContent = true; scope.htmlContent = $sce.trustAsHtml(attrs.tooltipHtml); + _compileTip(); } else if (attrs.tooltipTemplate) { - var template = getTemplate(attrs.tooltipTemplate); - scope.isHtmlContent = true; - scope.htmlContent = $sce.trustAsHtml(template); + getTemplate(attrs.tooltipTemplate).then(template => { + scope.isHtmlContent = true; + scope.htmlContent = $sce.trustAsHtml($interpolate(template)(scope)); + _compileTip(); + }); } else { scope.isHtmlContent = false; scope.htmlContent = null; + _compileTip(); } if (attrs.tooltipPosition) { @@ -43,53 +65,59 @@ function tooltip($document, $compile, $sce, $templateCache, $http) { scope.tipClass.push('tooltip-down'); } - $document.find('body').append(tip); + function _compileTip() { + tip = $compile(tipHtml)(scope); + $document.find('body').append(tip); + _bindEvents(); + } - element.bind('mouseover', function(e) { - tip.addClass(tipActiveClassName); + function _bindEvents() { + element.bind('mouseover', function(e) { + tip.addClass(tipActiveClassName); - let pos = e.target.getBoundingClientRect(); - let tipPos = tip[0].getBoundingClientRect(); - let offset = {top: 0, left: 0}; - let tipWidth = tipPos.width || tipPos.right - tipPos.left; - let tipHeight = tipPos.height || tipPos.bottom - tipPos.top; - let elWidth = pos.width || pos.right - pos.left; - let elHeight = pos.height || pos.bottom - pos.top; - let tipOffset = 10; + let pos = e.target.getBoundingClientRect(); + let tipPos = tip[0].getBoundingClientRect(); + let offset = {top: 0, left: 0}; + let tipWidth = tipPos.width || tipPos.right - tipPos.left; + let tipHeight = tipPos.height || tipPos.bottom - tipPos.top; + let elWidth = pos.width || pos.right - pos.left; + let elHeight = pos.height || pos.bottom - pos.top; + let tipOffset = 10; - if (tip.hasClass('tooltip-right')) { - offset.top = pos.top - (tipHeight / 2) + (elHeight / 2); - offset.left = pos.right + tipOffset; - } else if (tip.hasClass('tooltip-left')) { - offset.top = pos.top - (tipHeight / 2) + (elHeight / 2); - offset.left = pos.left - tipWidth - tipOffset; - } else if (tip.hasClass('tooltip-down')) { - offset.top = pos.top + elHeight + tipOffset; - offset.left = pos.left - (tipWidth / 2) + (elWidth / 2); - } else { - offset.top = pos.top - tipHeight - tipOffset; - offset.left = pos.left - (tipWidth / 2) + (elWidth / 2); - } + if (tip.hasClass('tooltip-right')) { + offset.top = pos.top - (tipHeight / 2) + (elHeight / 2); + offset.left = pos.right + tipOffset; + } else if (tip.hasClass('tooltip-left')) { + offset.top = pos.top - (tipHeight / 2) + (elHeight / 2); + offset.left = pos.left - tipWidth - tipOffset; + } else if (tip.hasClass('tooltip-down')) { + offset.top = pos.top + elHeight + tipOffset; + offset.left = pos.left - (tipWidth / 2) + (elWidth / 2); + } else { + offset.top = pos.top - tipHeight - tipOffset; + offset.left = pos.left - (tipWidth / 2) + (elWidth / 2); + } - tip.css('top', offset.top + 'px'); - tip.css('left', offset.left + 'px'); - }); + tip.css('top', offset.top + 'px'); + tip.css('left', offset.left + 'px'); + }); - element.on('mouseout', function() { - tip.removeClass(tipActiveClassName); - }); + element.on('mouseout', function() { + tip.removeClass(tipActiveClassName); + }); - tip.on('mouseover', function() { - tip.addClass(tipActiveClassName); - }); + tip.on('mouseover', function() { + tip.addClass(tipActiveClassName); + }); - tip.on('mouseout', function() { - tip.removeClass(tipActiveClassName); - }); + tip.on('mouseout', function() { + tip.removeClass(tipActiveClassName); + }); - element.on('$destroy', function() { - tip.remove(); - }); + element.on('$destroy', function() { + tip.remove(); + }); + } } }; } diff --git a/client/production/src/index/index.html b/client/production/src/index/index.html index e132f00336..44e0d3f5a8 100644 --- a/client/production/src/index/index.html +++ b/client/production/src/index/index.html @@ -49,7 +49,7 @@ - + @@ -57,23 +57,23 @@ - + - + {{::ticket.ticket}} {{::ticket.agency}} - {{::ticket.worker | ucwords}} + {{::ticket.salePerson | ucwords}} {{::ticket.hour}} {{ticket.state}} {{::ticket.lines}} {{::ticket.m3}} {{::ticket.boxes}} - + diff --git a/client/production/src/index/more-info-tooltip.tpl.html b/client/production/src/index/more-info-tooltip.tpl.html index 085187043c..e7cfddc507 100644 --- a/client/production/src/index/more-info-tooltip.tpl.html +++ b/client/production/src/index/more-info-tooltip.tpl.html @@ -1,18 +1,14 @@ - - - Población - Provincia - ID_Cliente - Comercial - - - - - {{ticket.city}} - {{ticket.province}} - {{ticket.client}} - {{ticket.salePerson}} - - + + Población + Provincia + ID_Cliente + Comercial + + + {{::ticket.city | ucwords}} + {{::ticket.province | ucwords}} + {{::ticket.client}} + {{::ticket.salePerson | ucwords}} + \ No newline at end of file diff --git a/client/salix/src/styles/colors.scss b/client/salix/src/styles/colors.scss index 9638ac0c87..dc939d113d 100644 --- a/client/salix/src/styles/colors.scss +++ b/client/salix/src/styles/colors.scss @@ -4,4 +4,5 @@ $color-orange: rgb(255,171,64); $color-white: white; $color-dark: #3c393b; $color-dark-grey: #424242; -$color-light-grey: #e6e6e6; \ No newline at end of file +$color-light-grey: #e6e6e6; +$color-medium-grey: #9D9D9D; \ No newline at end of file diff --git a/client/salix/src/styles/misc.scss b/client/salix/src/styles/misc.scss index 604e40d51b..2823fe4eab 100644 --- a/client/salix/src/styles/misc.scss +++ b/client/salix/src/styles/misc.scss @@ -1,5 +1,6 @@ @import "padding"; @import "margin"; +@import "colors"; .form { height: 100%; @@ -38,12 +39,12 @@ html [vn-left], .vn-left{ } .list-header{ - border-bottom: 3px solid #9D9D9D; + border-bottom: 3px solid $color-medium-grey; font-weight: bold; } .list-footer{ - border-top: 3px solid #9D9D9D; + border-top: 3px solid $color-medium-grey; font-weight: bold; } .list > vn-one, .list > [vn-one], .list > [vn-two], .list > vn-two{ @@ -54,9 +55,25 @@ html [vn-left], .vn-left{ } .list-body{ padding: 4px 0px; - border-bottom: 1px solid #9D9D9D; - + border-bottom: 1px solid $color-medium-grey; i { - color: #ffa410; + color: $color-orange; + } +} +.list-body:last-child{ + border: none; +} +.list-body.warning{ + background-color: $color-orange; + color:$color-white; + font-weight: bold; + i { + color: $color-white; + } + .mdl-checkbox.is-checked .mdl-checkbox__box-outline{ + border-color: $color-white; + } + .mdl-checkbox.is-checked .mdl-checkbox__tick-outline{ + background-color: $color-white; } } \ No newline at end of file diff --git a/gulpfile.js b/gulpfile.js index 5722981c0a..057483795c 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -58,7 +58,7 @@ gulp.task('services', ['copy'], function() { }); gulp.task('clean', function() { - return del(`${buildDir}/*`, {force: true}); + return del([`${buildDir}/*`, `!${buildDir}/templates`], {force: true}); }); // Spliting