Authored by Aiden Xu

Merge branch 'feature/product' into develop

... ... @@ -7,6 +7,7 @@
'use strict';
const $ = require('yoho-jquery');
const template = require('components/modal.hbs');
const Overlay = require('./overlay');
... ...
... ... @@ -7,6 +7,8 @@
'use strict';
const $ = require('yoho-jquery');
const ANIMATIONS = {
none: {
in: 'overlay-in',
... ... @@ -66,6 +68,18 @@ class Overlay {
.removeClass(this.settings.animationClasses.out);
}
_cleanupListener() {
this.elem.css({
visibility: 'hidden'
});
this._clearStylesClasses();
this.isVisible = false;
this.elem.detach();
// 一次性监听,动画完成事件触发后删除监听器
this.elem[0].removeEventListener('webkitTransitionEnd', this._cleanupListener);
}
/**
* 显示覆盖层
*/
... ... @@ -95,19 +109,8 @@ class Overlay {
hide() {
if (this.isVisible) {
this._clearStylesClasses();
const listener = () => {
this.elem.css({
visibility: 'hidden'
});
this._clearStylesClasses();
this.isVisible = false;
this.elem.detach();
// 一次性监听,动画完成事件触发后删除监听器
this.elem[0].removeEventListener('webkitTransitionEnd', listener);
};
this.elem[0].addEventListener('webkitTransitionEnd', listener);
this.elem[0].addEventListener('webkitTransitionEnd', this._cleanupListener.bind(this));
this.elem.addClass(this.settings.animationClasses.out);
if (this.settings.disableScrolling) {
... ... @@ -116,6 +119,10 @@ class Overlay {
});
}
setTimeout(()=> {
this._cleanupListener();
}, 100);
this.settings.onClose();
}
}
... ...
const Vue = require('yoho-vue');
const app = require('product/detail/index.vue');
const loading = require('common/loading');
const _ = require('lodash');
const lazyload = require('yoho-vue-lazyload');
require('../common/overlay');
Vue.use(lazyload);
(() => {
let stop = 0;
$(document).ajaxStart(()=> {
// start = new Date().getTime();
// setTimeout(()=> {
if (stop === 0) { // 超过100ms请求仍未结束则显示
loading.show();
}
// }, 100);
});
$(document).ajaxStop(()=> {
stop = new Date().getTime();
loading.hide();
});
})();
new Vue({
el: '#app',
components: {
... ... @@ -12,14 +34,4 @@ new Vue({
}
});
$(document).ajaxStart(()=> {
_.debounce(()=> {
loading.show();
}, 100)();
});
$(document).ajaxStop(()=> {
_.debounce(()=> {
loading.hide();
}, 500)();
});
... ...