64 lines
1.8 KiB
JavaScript
64 lines
1.8 KiB
JavaScript
import ngModule from '../../module';
|
|
import Component from '../../lib/component';
|
|
import './style.scss';
|
|
|
|
export default class Controller extends Component {
|
|
constructor($element, $scope, $transclude, $timeout) {
|
|
super($element, $scope);
|
|
this.$timeout = $timeout;
|
|
let element = $element[0];
|
|
element.tabIndex = 0;
|
|
|
|
element.addEventListener('focus', () => {
|
|
if (this.field || this.disabled) return;
|
|
$transclude((tClone, tScope) => {
|
|
this.field = tClone;
|
|
this.tScope = tScope;
|
|
this.element.querySelector('.field').appendChild(this.field[0]);
|
|
element.tabIndex = -1;
|
|
}, null, 'field');
|
|
element.classList.add('selected');
|
|
});
|
|
|
|
element.addEventListener('focusout', event => {
|
|
if (!this.field || this.disabled) return;
|
|
// this.destroyTimer();
|
|
this.lastEvent = event;
|
|
let target = event.relatedTarget;
|
|
while (target && target != element)
|
|
target = target.parentNode;
|
|
|
|
if (!target) {
|
|
this.tScope.$destroy();
|
|
this.field.remove();
|
|
this.field = null;
|
|
element.classList.remove('selected');
|
|
element.tabIndex = 0;
|
|
}
|
|
});
|
|
}
|
|
destroyTimer() {
|
|
if (this.timer) {
|
|
this.$timeout.cancel(this.timer);
|
|
this.timer = null;
|
|
}
|
|
}
|
|
|
|
$onDestroy() {
|
|
this.destroyTimer();
|
|
}
|
|
}
|
|
Controller.$inject = ['$element', '$scope', '$transclude', '$timeout'];
|
|
|
|
ngModule.component('vnTdEditable', {
|
|
template: require('./index.html'),
|
|
controller: Controller,
|
|
bindings: {
|
|
disabled: '<?'
|
|
},
|
|
transclude: {
|
|
text: 'text',
|
|
field: '?field'
|
|
}
|
|
});
|