Merge branch 'dev' of https://git.verdnatura.es/salix into dev
* 'dev' of https://git.verdnatura.es/salix: moved textfield styles textfield: clear icon dinamic display
This commit is contained in:
commit
720cf89204
|
@ -11,6 +11,7 @@ export default class DropDown {
|
|||
this._search = null;
|
||||
this.itemsFiltered = [];
|
||||
this._activeOption = -1;
|
||||
this._focusingFilter = false;
|
||||
}
|
||||
get show() {
|
||||
return this._show;
|
||||
|
@ -18,11 +19,13 @@ export default class DropDown {
|
|||
set show(value) {
|
||||
let oldValue = this.show;
|
||||
this._show = value;
|
||||
if (value && oldValue !== value && this.filter) {
|
||||
if (value && !this._focusingFilter && oldValue !== value && this.filter) {
|
||||
let inputFilterSearch = this.$element[0].querySelector('input');
|
||||
this._focusingFilter = true;
|
||||
this.$timeout(() => {
|
||||
inputFilterSearch.focus();
|
||||
});
|
||||
this._focusingFilter = false;
|
||||
}, 250);
|
||||
}
|
||||
}
|
||||
get search() {
|
||||
|
|
|
@ -1,4 +1,7 @@
|
|||
vn-textfield {
|
||||
div {
|
||||
outline: none; //remove chrome outline
|
||||
}
|
||||
.mdl-chip__action {
|
||||
position: absolute;
|
||||
width: auto;
|
||||
|
|
|
@ -1,4 +1,11 @@
|
|||
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
|
||||
<div
|
||||
class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label"
|
||||
tabindex="1"
|
||||
ng-focus="$ctrl.hasFocus = true"
|
||||
ng-blur="$ctrl.hasFocus = false"
|
||||
ng-mouseenter="$ctrl.hasMouseIn = true"
|
||||
ng-mouseleave="$ctrl.hasMouseIn = false"
|
||||
>
|
||||
<input
|
||||
class="mdl-textfield__input"
|
||||
type="{{$ctrl.type}}"
|
||||
|
@ -9,7 +16,7 @@
|
|||
ng-readonly="$ctrl.readonly"
|
||||
/>
|
||||
<div class="mdl-chip__action">
|
||||
<i class="material-icons pointer" ng-show="$ctrl.hasValue" ng-click="$ctrl.clear()">clear</i>
|
||||
<i class="material-icons pointer" ng-show="$ctrl.hasValue&&($ctrl.hasFocus||$ctrl.hasMouseIn)" ng-click="$ctrl.clear()">clear</i>
|
||||
<i class="material-icons" ng-if="$ctrl.hasInfo" vn-tooltip="{{$ctrl.info}}" tooltip-position="up">info_outline</i>
|
||||
</div>
|
||||
<label class="mdl-textfield__label" translate>{{$ctrl.label}}</label>
|
||||
|
|
|
@ -4,7 +4,7 @@ import * as normalizerFactory from '../lib/inputAttrsNormalizer';
|
|||
import './style.scss';
|
||||
|
||||
export default class TextfieldController extends Component {
|
||||
constructor($element, $scope, $attrs, normalizer) {
|
||||
constructor($element, $scope, $attrs, $timeout, normalizer) {
|
||||
super($element);
|
||||
|
||||
normalizer.normalize($attrs);
|
||||
|
@ -12,6 +12,7 @@ export default class TextfieldController extends Component {
|
|||
this.$scope = $scope;
|
||||
this.$attrs = $attrs;
|
||||
this.$element = $element;
|
||||
this.$timeout = $timeout;
|
||||
|
||||
this._value = null;
|
||||
this.type = this.$attrs.type || 'text';
|
||||
|
@ -20,6 +21,8 @@ export default class TextfieldController extends Component {
|
|||
this.focus = false;
|
||||
this.hasInfo = Boolean(this.$attrs.info);
|
||||
this.info = this.$attrs.info || null;
|
||||
this.hasFocus = false;
|
||||
this.hasMouseIn = false;
|
||||
componentHandler.upgradeElement($element[0].firstChild);
|
||||
}
|
||||
|
||||
|
@ -33,7 +36,7 @@ export default class TextfieldController extends Component {
|
|||
this.hasValue = Boolean(this._value);
|
||||
this.mdlUpdate();
|
||||
}
|
||||
|
||||
|
||||
mdlUpdate() {
|
||||
let mdlField = this.$element[0].firstChild.MaterialTextfield;
|
||||
if (mdlField)
|
||||
|
@ -45,7 +48,7 @@ export default class TextfieldController extends Component {
|
|||
this.input.focus();
|
||||
}
|
||||
}
|
||||
TextfieldController.$inject = ['$element', '$scope', '$attrs', normalizerFactory.NAME];
|
||||
TextfieldController.$inject = ['$element', '$scope', '$attrs', '$timeout', normalizerFactory.NAME];
|
||||
|
||||
module.component('vnTextfield', {
|
||||
template: require('./textfield.html'),
|
||||
|
|
Loading…
Reference in New Issue