vnPopover code clean, vnSearchbar popover bugs solved
This commit is contained in:
parent
378f053b18
commit
1c8b541e83
|
@ -88,6 +88,9 @@ export default class Popover extends Component {
|
|||
this.showTimeout = this.$timeout(() => {
|
||||
this.element.style.display = 'none';
|
||||
this.showTimeout = null;
|
||||
|
||||
if (this.onClose)
|
||||
this.onClose();
|
||||
}, 250);
|
||||
|
||||
this.document.removeEventListener('keydown', this.docKeyDownHandler);
|
||||
|
@ -95,9 +98,6 @@ export default class Popover extends Component {
|
|||
|
||||
if (this.deregisterCallback)
|
||||
this.deregisterCallback();
|
||||
|
||||
if (this.onClose)
|
||||
this.onClose();
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -186,35 +186,3 @@ ngModule.component('vnPopover', {
|
|||
onClose: '&?'
|
||||
}
|
||||
});
|
||||
|
||||
class PopoverService {
|
||||
constructor($document, $compile, $transitions, $rootScope) {
|
||||
this.$compile = $compile;
|
||||
this.$rootScope = $rootScope;
|
||||
this.$document = $document;
|
||||
this.stack = [];
|
||||
}
|
||||
show(child, parent, $scope) {
|
||||
let element = this.$compile('<vn-popover/>')($scope || this.$rootScope)[0];
|
||||
let popover = element.$ctrl;
|
||||
popover.parent = parent;
|
||||
popover.child = child;
|
||||
popover.show();
|
||||
popover.onClose = () => {
|
||||
this.$document[0].body.removeChild(element);
|
||||
if ($scope) $scope.$destroy();
|
||||
};
|
||||
this.$document[0].body.appendChild(element);
|
||||
return popover;
|
||||
}
|
||||
|
||||
showComponent(componentTag, $scope, parent) {
|
||||
let $newScope = $scope.$new();
|
||||
let childElement = this.$compile(`<${componentTag}/>`)($newScope)[0];
|
||||
this.show(childElement, parent, $newScope);
|
||||
return childElement;
|
||||
}
|
||||
}
|
||||
PopoverService.$inject = ['$document', '$compile', '$transitions', '$rootScope'];
|
||||
|
||||
ngModule.service('vnPopover', PopoverService);
|
||||
|
|
|
@ -1,14 +1,18 @@
|
|||
<form ng-submit="$ctrl.onSubmit()">
|
||||
<vn-horizontal>
|
||||
<vn-textfield vn-one label="Search" model="$ctrl.stringSearch"></vn-textfield>
|
||||
<vn-icon
|
||||
pad-medium-top
|
||||
ng-if="$ctrl.advanced"
|
||||
ng-click="$ctrl.onpenFilters($event)"
|
||||
icon="keyboard_arrow_down"
|
||||
style="cursor: pointer;">
|
||||
</vn-icon>
|
||||
<vn-button ng-if="$ctrl.label" vn-none label="{{$ctrl.label}}"></vn-button>
|
||||
<vn-icon-button ng-if="!$ctrl.label" icon="search" ng-click="$ctrl.clearFilter()"></vn-icon-button>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal>
|
||||
<vn-textfield vn-one label="Search" model="$ctrl.stringSearch"></vn-textfield>
|
||||
<vn-icon
|
||||
pad-medium-top
|
||||
ng-if="$ctrl.advanced"
|
||||
ng-click="$ctrl.onpenFilters($event)"
|
||||
icon="keyboard_arrow_down"
|
||||
style="cursor: pointer;">
|
||||
</vn-icon>
|
||||
<vn-button ng-if="$ctrl.label" vn-none label="{{$ctrl.label}}"></vn-button>
|
||||
<vn-icon-button ng-if="!$ctrl.label" icon="search" ng-click="$ctrl.clearFilter()"></vn-icon-button>
|
||||
</vn-horizontal>
|
||||
</form>
|
||||
<vn-popover
|
||||
vn-id="popover"
|
||||
on-close="$ctrl.onPopoverClose()">
|
||||
</vn-popover>
|
||||
|
|
|
@ -1,12 +1,10 @@
|
|||
import ngModule from '../../module';
|
||||
|
||||
export default class Controller {
|
||||
constructor($element, $scope, $document, $compile, vnPopover, $timeout, $state, $transitions) {
|
||||
constructor($element, $scope, $compile, $timeout, $state, $transitions) {
|
||||
this.element = $element[0];
|
||||
this.$scope = $scope;
|
||||
this.$document = $document;
|
||||
this.$ = $scope;
|
||||
this.$compile = $compile;
|
||||
this.vnPopover = vnPopover;
|
||||
this.$timeout = $timeout;
|
||||
this.stringSearch = '';
|
||||
this.$state = $state;
|
||||
|
@ -91,23 +89,32 @@ export default class Controller {
|
|||
filter = this.getFiltersFromString(this.stringSearch);
|
||||
}
|
||||
|
||||
this.child = this.vnPopover.showComponent(this.popover, this.$scope, this.element);
|
||||
this.$child = this.$compile(`<${this.popover}/>`)(this.$.$new());
|
||||
|
||||
// XXX: ¿Existe una forma más adecuada de acceder al controlador de un componente?
|
||||
var childCtrl = angular.element(this.child).isolateScope().$ctrl;
|
||||
var childCtrl = this.$child.isolateScope().$ctrl;
|
||||
childCtrl.filter = Object.assign({}, filter);
|
||||
childCtrl.onSubmit = filter => this.onChildSubmit(filter);
|
||||
if (this.data)
|
||||
childCtrl.data = Object.assign({}, this.data);
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
this.$.popover.parent = this.element;
|
||||
this.$.popover.child = this.$child[0];
|
||||
this.$.popover.show();
|
||||
}
|
||||
|
||||
onPopoverClose() {
|
||||
this.$child.scope().$destroy();
|
||||
this.$child.remove();
|
||||
this.$child = null;
|
||||
}
|
||||
|
||||
onChildSubmit(filter) {
|
||||
this.$.popover.hide();
|
||||
this.stringSearch = this.createStringFromObject(filter);
|
||||
this.clearFilter();
|
||||
this.$timeout(() => {
|
||||
this.onSubmit();
|
||||
});
|
||||
this.$timeout(() => this.onSubmit());
|
||||
}
|
||||
|
||||
onSubmit() {
|
||||
|
@ -120,12 +127,6 @@ export default class Controller {
|
|||
if (this.onSearch)
|
||||
this.onSearch();
|
||||
|
||||
if (angular.element(this.child)) {
|
||||
if (angular.element(this.child).scope())
|
||||
angular.element(this.child).scope().$destroy();
|
||||
angular.element(this.child).remove();
|
||||
}
|
||||
delete this.child;
|
||||
this.pushFiltersToState(filter);
|
||||
}
|
||||
|
||||
|
@ -139,12 +140,10 @@ export default class Controller {
|
|||
let filter = JSON.parse(decodeURIComponent(this.$state.params.q));
|
||||
this.stringSearch = this.createStringFromObject(filter);
|
||||
}
|
||||
this.$timeout(() => {
|
||||
this.onSubmit();
|
||||
});
|
||||
this.$timeout(() => this.onSubmit());
|
||||
}
|
||||
}
|
||||
Controller.$inject = ['$element', '$scope', '$document', '$compile', 'vnPopover', '$timeout', '$state', '$transitions'];
|
||||
Controller.$inject = ['$element', '$scope', '$compile', '$timeout', '$state', '$transitions'];
|
||||
|
||||
ngModule.component('vnSearchbar', {
|
||||
template: require('./searchbar.html'),
|
||||
|
|
Loading…
Reference in New Issue