Production: modal para mensajes, filtros búsqueda en front 100%

This commit is contained in:
Dani Herrero 2017-06-20 09:27:49 +02:00
parent bcdc31d8d9
commit ca19369093
9 changed files with 102 additions and 45 deletions

View File

@ -96,9 +96,10 @@ export class Popover {
this.lastEvent = null;
this.docMouseDownHandler = null;
this.docKeyDownHandler = null;
if (this.removeScope) {
if (this.removeScope && angular.element(this.childElement).scope()) {
angular.element(this.childElement).scope().$destroy();
angular.element(this.childElement).remove();
this.removeScope = false;
}
}
onDocMouseDown(event) {

View File

@ -4,42 +4,41 @@
<vn-card margin-large>
<vn-vertical pad-medium>
<vn-horizontal vn-one margin-large-bottom class="locator-header">
<vn-title vn-one><span translate>Localizador</span></vn-title>
<vn-title vn-one><span translate>Finder</span></vn-title>
<vn-two vn-horizontal class="filterPanel">
<vn-autocomplete vn-one margin-medium-right field="$ctrl.filter.stateFk" data="$ctrl.states" label="Estado">
<vn-autocomplete vn-one margin-medium-right field="$ctrl.filter.stateFk" data="$ctrl.states" label="State">
</vn-autocomplete>
<vn-autocomplete vn-one margin-medium-right field="$ctrl.filter.alarmFk" data="$ctrl.states" label="Alarma">
<vn-autocomplete vn-one margin-medium-right field="$ctrl.filter.alarmFk" data="$ctrl.states" label="Alarm">
</vn-autocomplete>
<vn-autocomplete vn-one margin-medium-right field="$ctrl.filter.agencyFk" data="$ctrl.states" label="Agencias">
<vn-autocomplete vn-one margin-medium-right field="$ctrl.filter.agencyFk" data="$ctrl.states" label="Agency">
</vn-autocomplete>
<vn-icon
vn-none
margin-medium-right
pad-medium-top
icon="keyboard_arrow_down"
ng-click="$ctrl.moreFilters()">
ng-click="$ctrl.moreFilters($event)">
</vn-icon>
<vn-button vn-none pad-small-top label="Filtrar"></vn-button>
<vn-button vn-none pad-small-top label="Filtrar" ng-click="$ctrl.onSearch()"></vn-button>
</vn-two>
<vn-one vn-horizontal>
<vn-one></vn-one>
<vn-autocomplete vn-two
initial-value="$ctrl.warehouse"
field="$ctrl.warehouseFk" url="/production/api/Warehouses/list" label="Almacen">
field="$ctrl.warehouseFk" url="/production/api/Warehouses/list" label="Store">
</vn-autocomplete>
<vn-icon-button vn-none pad-ten-top icon="refresh"></vn-icon-button>
</vn-one>
</vn-horizontal>
<vn-horizontal vn-one margin-large-bottom>
<vn-one>
<vn-horizontal>
<vn-button vn-none margin-medium-right label="Impreso"></vn-button>
<vn-horizontal class="actionPanel">
<vn-button vn-none margin-medium-right label="Printed"></vn-button>
<vn-none margin-medium-right>
<vn-icon-menu icon="assignment" items="$ctrl.states" selected="$ctrl.actions.state"></vn-icon-menu>
</vn-none>
<vn-none margin-medium-right>
<vn-icon-menu icon="textsms" items="[{id:1,name:'prueba 01'},{id:2,name:'prueba 02'},{id:3,name:'prueba 03'}]" selected="$ctrl.actions.textsm"></vn-icon-menu>
<vn-icon-button icon="textsms" ng-click="$ctrl.doAction('addComment')"></vn-icon-button>
</vn-none>
<vn-none margin-medium-right>
<vn-icon-menu icon="person" items="[{id:1,name:'trabajador 01'},{id:2,name:'trabajador 02'},{id:3,name:'trabajador 03'}]"
@ -58,13 +57,13 @@
<vn-check model="$ctrl.checkAll"></vn-check>
</vn-none>
<vn-label vn-one text="ID Ticket"></vn-label>
<vn-label vn-two text="Agencia"></vn-label>
<vn-label vn-two text="Comercial"></vn-label>
<vn-label vn-one text="Hora"></vn-label>
<vn-label vn-one text="Estado"></vn-label>
<vn-label vn-one text="Lineas"></vn-label>
<vn-label vn-two text="Agency"></vn-label>
<vn-label vn-two text="Commercial"></vn-label>
<vn-label vn-one text="Hour"></vn-label>
<vn-label vn-one text="State"></vn-label>
<vn-label vn-one text="Lines"></vn-label>
<vn-label vn-one text="m3"></vn-label>
<vn-label vn-one text="Cajas"></vn-label>
<vn-label vn-one text="Boxes"></vn-label>
<vn-none></vn-none>
</vn-horizontal>
<vn-horizontal vn-one class="list list-body" ng-repeat="ticket in $ctrl.tickets track by $index" ng-class="{warning: ticket.problems==='RIESGO'}">

View File

@ -2,11 +2,14 @@ import ngModule from '../module';
import './style.scss';
export default class ProductionIndex {
constructor($element, $scope, $http, vnPopover) {
constructor($element, $scope, $http, vnPopover, vnApp, $translate) {
this.$element = $element;
this.$ = $scope;
this.$http = $http;
this.vnPopover = vnPopover;
this.vnApp = vnApp;
this.$translate = $translate;
this.filter = {};
this._checkAll = false;
this.tickets = [];
@ -19,6 +22,7 @@ export default class ProductionIndex {
hour: null
};
this.hourItems = [];
this.child = undefined;
}
get checkAll() {
return this._checkAll;
@ -36,6 +40,7 @@ export default class ProductionIndex {
}
);
}
// Actions Callbacks
_changeState(ids, sateteId, stateName, index) {
this.$http.put(`/production/api/TicketStates/[${ids}]/${sateteId}/changeState`).then(
() => {
@ -47,6 +52,10 @@ export default class ProductionIndex {
}
);
}
_publishComment(ids, comment) {
console.log("TODO: rest to publish comment", ids, comment);
}
// End Actions Callbacks
doAction(action) {
let checks = this.$element[0].querySelectorAll('.list-body input[type="checkbox"]:checked');
if (checks.length) {
@ -62,10 +71,12 @@ export default class ProductionIndex {
case 'changeState' :
this._changeState(ids, this.actions.state.id, this.actions.state.name, index);
break;
case 'addComment':
this._openComment(ids);
break;
}
} else {
console.log("TODO: dialog with no items selected", action);
// TODO: dialog with no items selected
this.vnApp.showMessage(this.$translate.instant('Error: No tickets selected!'));
}
}
sumTickets() {
@ -80,10 +91,43 @@ export default class ProductionIndex {
this.lines = lines;
this.meters = meters.toFixed(2);
}
onSearch() {
this.$.index.filter = this.filter;
this.$.index.accept();
// Start modals and actions modals
_openComment(ids) {
this.child = this.vnPopover.showComponent('vn-production-comment', this.$, this.$element[0].querySelector('.actionPanel'));
var childCtrl = angular.element(this.child).isolateScope().$ctrl;
childCtrl.ids = ids;
childCtrl.onComment = (ids, comment) => this.onChildComment(ids, comment);
childCtrl.onCancel = () => this.onChildCancel();
}
moreFilters(event) {
this.child = this.vnPopover.showComponent('vn-production-filter-panel', this.$, this.$element[0].querySelector('.filterPanel'));
var childCtrl = angular.element(this.child).isolateScope().$ctrl;
childCtrl.filter = Object.assign({}, this.filter);
childCtrl.onSubmit = filter => this.onChildSubmit(filter);
childCtrl.onCancel = () => this.onChildCancel();
event.preventDefault();
}
onSearch(filter) {
let filters = filter || this.filter;
/* this.$.index.filter = filters;
this.$.index.accept(); */
console.log('TODO: search with filters', filters);
}
onChildSubmit(filter) {
this.onSearch(filter);
this.onChildCancel();
}
onChildComment(ids, comment) {
this.onChildCancel();
this._publishComment(ids, comment);
}
onChildCancel() {
angular.element(this.child).scope().$destroy();
angular.element(this.child).remove();
delete this.child;
}
// END modals and actions modals
$doCheck() {
if (this.actions.state) {
this.doAction('changeState');
@ -100,16 +144,8 @@ export default class ProductionIndex {
this.hourItems.push({id: i, name: hour});
}
}
moreFilters(event) {
var child = this.vnPopover.showComponent('vn-production-filter-panel', this.$, this.$element[0].querySelector('.filterPanel'));
var childCtrl = angular.element(child).isolateScope().$ctrl;
childCtrl.filter = Object.assign({}, this.index.filter);
childCtrl.onSubmit = filter => this.onChildSubmit(filter);
event.preventDefault();
}
}
ProductionIndex.$inject = ['$element', '$scope', '$http', 'vnPopover'];
ProductionIndex.$inject = ['$element', '$scope', '$http', 'vnPopover', 'vnApp', '$translate'];
ngModule.component('vnProductionIndex', {
template: require('./index.html'),

View File

@ -1 +1,17 @@
{}
{
"Finder" : "Localizador",
"Error: No tickets selected!" : "Error: ¡No hay tickets seleccionados!",
"State" : "Estado",
"Alarm" : "Alarma",
"Agencies": "Agencias",
"Agency": "Agencia",
"Store" : "Almacén",
"Printed": "Impreso",
"Commercial": "Comercial",
"Hour" : "Hora",
"Lines" : "Líneas",
"Boxes" : "Cajas",
"Comment" : "Comentario",
"Message" : "Mensaje",
"Send" : "Enviar"
}

View File

@ -0,0 +1,4 @@
<form ng-submit="$ctrl.onComment($ctrl.ids, $ctrl.comment)" pad-large>
<vn-textfield vn-one label="Message" model="$ctrl.comment"></vn-textfield>
<vn-submit vn-one label="Send"></vn-submit>
</form>

View File

@ -0,0 +1,5 @@
import ngModule from '../module';
ngModule.component('vnProductionComment', {
template: require('./production-comment.html')
});

View File

@ -1,5 +1,5 @@
<form ng-submit="$ctrl.onSearch()" pad-large>
<form ng-submit="$ctrl.onSubmit($ctrl.filter)" pad-large>
<vn-horizontal>
<vn-textfield vn-one label="ID Ruta" model="$ctrl.filter.ruteId"></vn-textfield>
<vn-date-picker vn-one label="Fecha" model="$ctrl.filter.date"></vn-date-picker>
@ -19,5 +19,8 @@
<vn-check vn-one pad-medium-top label="Ticket con incidencia" field="$ctrl.filter.withIncidence"></vn-check>
<vn-textfield vn-one label="Agencia" model="$ctrl.filter.agency"></vn-textfield>
</vn-horizontal>
<vn-horizontal margin-large-top>
<vn-submit vn-one label="Filtrar"></vn-submit>
<vn-button vn-none label="Cancelar" ng-click="$ctrl.onCancel()"></vn-button>
</vn-horizontal>
</form>

View File

@ -1,13 +1,5 @@
import ngModule from '../module';
export default class Controller {
constructor($window) {
this.$window = $window;
}
}
Controller.$inject = ['$window'];
ngModule.component('vnProductionFilterPanel', {
template: require('./production-filters.html'),
controller: Controller
template: require('./production-filters.html')
});

View File

@ -4,3 +4,4 @@ export * from './module';
// import components
import './index/index';
import './production-filters/production-filters';
import './production-comment/production-comment';