lwei/OA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Online Server
2026-07-23 09:40:36 +08:00
commit 090abf48fa
989 changed files with 145728 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/static/assets/mbui/module/layer.js
+331
View File
@@ -0,0 +1,331 @@
mbui.define([], function (exports) {
var doc = document, query = 'querySelectorAll', claname = 'getElementsByClassName', S = function (s) {
return doc[query](s);
};
var template = {
warning: function (text) {
//警告提示
return `<div class="mbui-toptips mbui-toptips-warning fixed" id="${classs}${index}">
<i class="mbui-toptips-warning-icon"></i><span>${text}</span>
</div>`;
},
error: function (text) {
//失败提示
return `<div class="mbui-toptips mbui-toptips-error fixed" id="${classs}${index}">
<i class="mbui-toptips-error-icon"></i><span>${text}</span>
</div>`;
},
toast: function (text) {
//轻提示
return `<div class="mbui-toast" id="${classs}${index}">
<div class="mbui-toast-backdrop"></div>
<div class="mbui-toast-dialog">
<div class="mbui-toast-content">
<span>${text}</span>
</div>
</div>
</div>`;
},
loading: function (text) {
//轻提示
return `<div class="mbui-toast mbui-toast-loading" id="${classs}${index}">
<div class="mbui-toast-backdrop"></div>
<div class="mbui-toast-dialog">
<div class="mbui-toast-content">
<span>
<div class="mbui-toast-loading_icon">
<div class="loading-icon-leaf loading-icon-leaf_0"></div>
<div class="loading-icon-leaf loading-icon-leaf_1"></div>
<div class="loading-icon-leaf loading-icon-leaf_2"></div>
<div class="loading-icon-leaf loading-icon-leaf_3"></div>
<div class="loading-icon-leaf loading-icon-leaf_4"></div>
<div class="loading-icon-leaf loading-icon-leaf_5"></div>
<div class="loading-icon-leaf loading-icon-leaf_6"></div>
<div class="loading-icon-leaf loading-icon-leaf_7"></div>
<div class="loading-icon-leaf loading-icon-leaf_8"></div>
<div class="loading-icon-leaf loading-icon-leaf_9"></div>
<div class="loading-icon-leaf loading-icon-leaf_10"></div>
<div class="loading-icon-leaf loading-icon-leaf_11"></div>
</div>
${text}
</span>
</div>
</div>
</div>`;
},
success: function (text) {
//轻提示
return `<div class="mbui-toast mbui-toast-success" id="${classs}${index}">
<div class="mbui-toast-backdrop"></div>
<div class="mbui-toast-dialog">
<div class="mbui-toast-content">
<span><i class="mbui-toast-success-icon"></i>${text}</span>
</div>
</div>
</div>`;
}
}
//默认配置
var config = {
type: 1,
shade: true,
shadeClose: false,
fixed: true
};
var ready = {
extend: function (obj) {
var newobj = JSON.parse(JSON.stringify(config));
for (var i in obj) {
newobj[i] = obj[i];
}
return newobj;
},
timer: {}, end: {}
};
//点触事件
ready.touch = function (elem, fn) {
elem.addEventListener('click', function (e) {
fn.call(this, e);
}, false);
};
var index = 0, classs = ['mbui-layer'], Layer = function (options) {
var that = this;
that.config = ready.extend(options);
that.view();
};
Layer.prototype.view = function () {
var that = this, config = that.config, layerbox = doc.createElement('div');
that.id = layerbox.id = classs[0] + index;
layerbox.setAttribute('class', classs[0] + ' ' + classs[0] + (config.type || 0));
layerbox.setAttribute('index', index);
//标题区域
var title = (function () {
var titype = typeof config.title === 'object';
return config.title
? '<div class="modal-header" style="' + (titype ? config.title[1] : '') + '">' + (titype ? config.title[0] : config.title) + '</div>' : '';
}());
//按钮区域
var button = (function () {
typeof config.btn === 'string' && (config.btn = [config.btn]);
var btns = (config.btn || []).length, btndom;
if (btns === 0 || !config.btn) {
return '';
}
btndom = '<button type="button" types="1" class="btn btn-block active">' + config.btn[0] + '</button>'
if (btns === 2) {
btndom = '<a href="javascript:void(0);" types="0" class="btn">' + config.btn[1] + '</a><button type="button" types="1" class="btn active">' + config.btn[0] + '</button>';
}
return '<div class="modal-footer clearfix">' + btndom + '</div>';
}());
if (!config.fixed) {
config.top = config.hasOwnProperty('top') ? config.top : 100;
config.style = config.style || '';
config.style += ' top:' + (doc.body.scrollTop + config.top) + 'px';
}
if (config.type === 0) {
config.shade = false;
let content = template[config.template];
layerbox.innerHTML = content(config.content);
}
if (config.type === 2) {
config.content = '<div class="form-hairlines"><input type="text" id="prompt' + index + '" class="mbui-input" placeholder="请输入内容"></div>';
}
if (config.type === 3) {
config.className = 'modal-view top';
config.content = '<div style="padding:0 16px 16px;"><textarea rows="5" id="textarea' + index + '" class="mbui-textarea" placeholder="请输入内容"></textarea></div>';
}
if (config.type === 4) {
config.className = 'modal-actionsheet bottom';
}
if (config.type === 5) {
config.className = 'modal-view top';
}
if (config.type > 0) {
layerbox.innerHTML = (config.shade ? '<div ' + (typeof config.shade === 'string' ? 'style="' + config.shade + '"' : '') + ' class="mbui-layershade"></div>' : '')
+ '<div class="mbui-layermain" ' + (!config.fixed ? 'style="position:static;"' : '') + '>'
+ '<div class="modal-dialog">'
+ '<div class="modal-content ' + (config.className ? config.className : '') + '" ' + (config.style ? 'style="' + config.style + '"' : '') + '>'
+ title
+ '<div class="modal-body">' + config.content + '</div>'
+ button
+ '</div>'
+ '</div>'
+ '</div>';
}
document.body.appendChild(layerbox);
var elem = that.elem = S('#' + that.id)[0];
config.success && config.success(elem,index);
that.index = index++;
that.action(config, elem);
};
Layer.prototype.action = function (config, elem) {
var that = this;
//自动关闭
if (config.time && config.time > 0) {
ready.timer[that.index] = setTimeout(function () {
layer.close(that.index);
}, config.time * 1000);
}
//确认取消
var btn = function () {
var type = this.getAttribute('types');
if (type == 0) {
config.no && config.no();
layer.close(that.index);
} else {
config.yes ? config.yes(that.index) : layer.close(that.index);
}
};
if (config.btn) {
var btns = elem[claname]('modal-footer')[0].children, btnlen = btns.length;
for (var ii = 0; ii < btnlen; ii++) {
ready.touch(btns[ii], btn);
}
}
//点遮罩关闭
if (config.shade && config.shadeClose) {
var shade = elem[claname]('mbui-layershade')[0];
ready.touch(shade, function () {
layer.close(that.index, config.end);
});
}
config.end && (ready.end[that.index] = config.end);
};
var layer = {
v: '1.0',
index: index,
//核心方法
open: function (options) {
var o = new Layer(options || {});
return o.index;
},
alert: function (txt) {
layer.open({
type: 1,
title: '提示',
content: txt,
btn: ['确定']
});
},
confirm: function (txt, fun) {
layer.open({
type: 1,
title: '温馨提示',
content: txt,
btn: ['确定', '取消'],
yes: function (index) {
fun ? fun(index) : layer.close(index);
}
});
},
prompt: function (title,fun,txt) {
layer.open({
type: 2,
title: title,
content: txt,
btn: ['确定', '取消'],
yes: function (index) {
let val = $('#prompt' + index).val();
fun ? fun(val,index) : layer.close(index);
}
});
},
textarea: function (title,fun,txt) {
layer.open({
type: 3,
title: title,
content: txt,
btn: ['确定', '取消'],
yes: function (index) {
let val = $('#textarea' + index).val();
fun ? fun(val,index) : layer.close(index);
}
});
},
msg: function (txt = '', time = 3, template = 'toast') {
let msg = layer.open({
type: 0,
content: txt,
template: template,
time: time
});
return msg;
},
success: function (txt) {
layer.msg(txt, 3, 'success');
},
warning: function (txt) {
layer.msg(txt, 3, 'warning');
},
error: function (txt) {
layer.msg(txt, 3, 'error');
},
loading: function (txt) {
let loading = layer.msg(txt, 3, 'loading');
return loading;
},
photo: function (url) {
var $image = $('<div class="layer-image-photo"><img src="' + url + '"></div>');
$('body').append($image);
$image.fadeIn();
$image.click(function () {
$(this).fadeOut(function () {
$(this).remove();
});
});
},
close: function (index) {
var ibox = S('#' + classs[0] + index)[0];
if (!ibox) return;
ibox.innerHTML = '';
doc.body.removeChild(ibox);
clearTimeout(ready.timer[index]);
delete ready.timer[index];
typeof ready.end[index] === 'function' && ready.end[index]();
delete ready.end[index];
},
//关闭所有layer层
closeAll: function () {
var boxs = doc[claname](classs[0]);
for (var i = 0, len = boxs.length; i < len; i++) {
layer.close((boxs[0].getAttribute('index') | 0));
}
},
copy:function(content) {
var save = function(e){
e.clipboardData.setData('text/plain', content);
e.preventDefault();
}
document.addEventListener('copy', save);
document.execCommand('copy');
document.removeEventListener('copy',save);
if (content != '') {
layer.msg('复制成功');
}
}
};
// 输出接口
exports('layer', layer);
});