diff --git a/client/core/src/components.js b/client/core/src/components.js index 2c8a09630..fc5c92d34 100644 --- a/client/core/src/components.js +++ b/client/core/src/components.js @@ -14,6 +14,7 @@ import './title/title'; import './subtitle/subtitle'; import './spinner/spinner'; import './snackbar/snackbar'; +import './tooltip/tooltip'; export {NAME as BUTTON, directive as ButtonDirective} from './button/button'; export {NAME as BUTTON_MDL, factory as buttonMdl} from './button/button.mdl'; diff --git a/client/core/src/tooltip/style.css b/client/core/src/tooltip/style.css new file mode 100644 index 000000000..943a92c9c --- /dev/null +++ b/client/core/src/tooltip/style.css @@ -0,0 +1,60 @@ +[vn-tooltip]{ + cursor: help; +} +.tooltip { + display: none; + position: fixed; + background-color: #fff; + padding: 15px; + max-width: 250px; + color: #424242; + z-index: 999; + border: 1px solid #A7A7A7; + text-align: justify; +} + +.tooltip-show { + display: inherit; +} + +.tooltip-arrow { + position: absolute; + width: 0; + height: 0; +} + +.tooltip-down .tooltip-arrow { + top: -15px; + left: 50%; + margin-left: -10px; + border-left: 10px solid transparent; + border-right: 10px solid transparent; + border-bottom: 15px solid #A7A7A7; +} + +.tooltip-up .tooltip-arrow { + bottom: -15px; + left: 50%; + margin-left: -10px; + border-left: 10px solid transparent; + border-right: 10px solid transparent; + border-top: 15px solid #A7A7A7; +} + +.tooltip-right .tooltip-arrow { + left: -15px; + top: 50%; + margin-top: -10px; + border-top: 10px solid transparent; + border-bottom: 10px solid transparent; + border-right: 15px solid #A7A7A7; +} + +.tooltip-left .tooltip-arrow { + right: -15px; + top: 50%; + margin-top: -10px; + border-top: 10px solid transparent; + border-bottom: 10px solid transparent; + border-left: 15px solid #A7A7A7; +} \ No newline at end of file diff --git a/client/core/src/tooltip/tooltip.js b/client/core/src/tooltip/tooltip.js new file mode 100644 index 000000000..1ea5df24a --- /dev/null +++ b/client/core/src/tooltip/tooltip.js @@ -0,0 +1,74 @@ +import {module} from '../module'; +import './style.css'; + +tooltip.$inject = ['$document', '$compile']; +function tooltip($document, $compile) { + return { + restrict: 'A', + scope: true, + link: function(scope, element, attrs) { + var tip = $compile('
{{ text }}
')(scope); + var tipClassName = 'tooltip'; + var tipActiveClassName = 'tooltip-show'; + + scope.tipClass = [tipClassName]; + scope.text = attrs.vnTooltip; + + if (attrs.tooltipPosition) { + scope.tipClass.push('tooltip-' + attrs.tooltipPosition); + } else { + scope.tipClass.push('tooltip-down'); + } + + $document.find('body').append(tip); + + 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; + + 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'); + }); + + element.bind('mouseout', function() { + tip.removeClass(tipActiveClassName); + }); + + tip.bind('mouseover', function() { + tip.addClass(tipActiveClassName); + }); + + tip.bind('mouseout', function() { + tip.removeClass(tipActiveClassName); + }); + + element.on('$destroy', function() { + tip.remove(); + }); + } + }; +} + +module.directive('vnTooltip', tooltip); diff --git a/client/production/src/index/index.html b/client/production/src/index/index.html index 7ab9356a2..49c24f3bf 100644 --- a/client/production/src/index/index.html +++ b/client/production/src/index/index.html @@ -1,5 +1,5 @@ - + Localizador @@ -50,22 +50,37 @@ - - + - + - {{::item.id}} - {{::item.agency.id}} - {{::item.employee.name}} - {{::item.hour}} - {{::item.state.name}} - {{::item.lines}} - {{::item.meters}} - {{::item.boxes}} + + + + {{ticket.id}} + {{ticket.agency.id}} + {{ticket.employee.name}} + {{ticket.hour}} + {{ticket.state.name}} + {{ticket.lines}} + {{ticket.meters}} + {{ticket.boxes}} + + : + {{$ctrl.tickets.length}} + + + + + + + + + + \ No newline at end of file diff --git a/client/production/src/index/index.js b/client/production/src/index/index.js index 73a40ed8b..a901c863c 100644 --- a/client/production/src/index/index.js +++ b/client/production/src/index/index.js @@ -5,6 +5,7 @@ export default class ProductionIndex { constructor() { this.model = {}; this.checkAll = false; + this.tickets = []; } search(index) { index.filter.search = this.model.search; diff --git a/client/production/src/index/style.scss b/client/production/src/index/style.scss index d6f8d50e0..0571afb44 100644 --- a/client/production/src/index/style.scss +++ b/client/production/src/index/style.scss @@ -3,7 +3,9 @@ vn-production-index { height: 20px; padding: 0 6px; } - + .icon-square{ + height: 36px; + } .list-header{ border-bottom: 3px solid #9D9D9D; font-weight: bold; @@ -13,14 +15,15 @@ vn-production-index { border-top: 3px solid #9D9D9D; font-weight: bold; } - .list > vn-one{ - text-align: center; - } - .list > [vn-one]{ + .list > vn-one, .list > [vn-one], .list > [vn-two], .list > vn-two{ text-align: center; } .list-body{ padding: 4px 0px; border-bottom: 1px solid #9D9D9D; + + i { + color: #ffa410; + } } } \ No newline at end of file diff --git a/gulpfile.js b/gulpfile.js index 07d99c182..b1a8968c0 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -36,9 +36,9 @@ gulp.task('client', ['clean'], function() { gulp.task('copy', function() { var streams = []; - for (i=0; i < services.services.length; i++) { + for (i = 0; i < services.services.length; i++) { var service = services.services[i]; - for (j=0; j < services.files.length; j++) { + for (j = 0; j < services.files.length; j++) { var file = services.files[j]; streams.push(gulp.src("./services/service/models/" + file) .pipe(gulp.dest(service + "/common/models/"))); @@ -52,14 +52,15 @@ gulp.task('services', ['copy'], function() { require('./services/salix/server/server.js').start(); require('./services/mailer/server.js').start(); - for (i=0; i < services.services.length; i++) { + for (i = 0; i < services.services.length; i++) { require(services.services[i] + "/server/server.js").start(); } }); +/* Nota (dani): Comentado para que no me borre el mock del Localizador gulp.task('clean', function() { return del(`${buildDir}/*`, {force: true}); -}); +}); */ // Spliting