let tpl = '
{svg}
',
loading = '.dcat-loading',
LOADING_SVG = [
'',
'',
];
class Loading {
constructor(Dcat, options) {
options = $.extend({
container: Dcat.config.pjax_container_selector,
zIndex: 100,
width: '52px',
color: '#7985d0',
background: '#fff',
style: '',
svg: LOADING_SVG[0]
}, options);
let _this = this,
defStyle = 'position:absolute;left:10px;right:10px;',
content;
_this.$container = $(options.container);
content = $(
tpl
.replace('{svg}', options.svg)
.replace('{color}', options.color)
.replace('{color}', options.color)
.replace('{width}', options.width)
.replace('{style}', `${defStyle}background:${options.background};z-index:${options.zIndex};${options.style}`)
);
content.appendTo(_this.$container);
}
destory() {
this.$container.find(loading).remove();
}
}
function destroyAll() {
$(loading).remove();
}
function extend(Dcat) {
// 全屏居中loading
Dcat.loading = function (options) {
if (options === false) {
// 关闭loading
return setTimeout(destroyAll, 70);
}
// 配置参数
options = $.extend({
color: '#5c6bc6',
zIndex: 999991014,
width: '58px',
shade: 'rgba(255, 255, 255, 0.1)',
background: 'transparent',
top: 200,
svg: LOADING_SVG[1],
}, options);
var win = $(window),
// 容器
$container = $(''),
// 遮罩层直接沿用layer
shadow = $('');
$container.appendTo('body');
if (options.shade) {
shadow.appendTo('body');
}
function resize() {
$container.css({
left: (win.width() - 300)/2,
top: (win.height() - options.top)/2
});
}
// 自适应窗口大小
win.on('resize', resize);
resize();
$container.loading(options);
};
//
$.fn.loading = function (opt) {
if (opt === false) {
return $(this).find(loading).remove();
}
opt = opt || {};
opt.container = $(this);
return new Loading(Dcat, opt);
};
}
export default extend