84 lines
1.8 KiB
JavaScript
84 lines
1.8 KiB
JavaScript
/**
|
||
* UI::tabbar
|
||
* - 创建一个面板
|
||
* 开写：2016/05/03
|
||
* 更新：-
|
||
* 作者：蚁逅 <https://github.com/antoor>
|
||
*/
|
||
|
||
'use strict';
|
||
|
||
class Tabbar {
|
||
constructor(opts) {
|
||
// 生成一个随机ID，用于指定唯一的面板
|
||
let id = 'tabbar_' + (Math.random() * +new Date).toString(16).replace('.', '').substr(0,11);
|
||
let tabbar = antSword['tabbar'];
|
||
// 添加面板对象
|
||
tabbar.addTab(
|
||
id,
|
||
'<i class="fa fa-puzzle-piece"></i>',
|
||
null, null, true, true
|
||
);
|
||
this.cell = tabbar.tabs(id);
|
||
}
|
||
|
||
/**
|
||
* 面板获取焦点
|
||
* @return {[type]} [description]
|
||
* @return {Object} this
|
||
*/
|
||
active() {
|
||
this.cell.setActive();
|
||
return this;
|
||
}
|
||
|
||
/**
|
||
* 关闭面板
|
||
* @return {Object} this
|
||
*/
|
||
close() {
|
||
this.cell.close();
|
||
return this;
|
||
}
|
||
|
||
/**
|
||
* 设置面板标题
|
||
* @param {String} title = 'New Title' [description]
|
||
* @return {Object} this
|
||
*/
|
||
setTitle(title = 'New Title') {
|
||
this.cell.setText(`<i class="fa fa-puzzle-piece"></i> ${title}`);
|
||
return this;
|
||
}
|
||
|
||
/**
|
||
* 安全输出HTML
|
||
* - 采用`iframe`框架进行HTML输出，避免变量污染&&一些安全问题
|
||
* @param {String} html = "" [description]
|
||
* @return {Object} this
|
||
*/
|
||
safeHTML(html = "") {
|
||
let _html = new Buffer(html).toString('base64');
|
||
let _iframe = `
|
||
<iframe
|
||
src="data:text/html;base64,${_html}"
|
||
style="width:100%;height:100%;border:0;padding:0;margin:0;">
|
||
</iframe>
|
||
`;
|
||
this.cell.attachHTMLString(_iframe);
|
||
return this;
|
||
}
|
||
|
||
/**
|
||
* 显示加载中
|
||
* @param {Boolean} loading = true 是否显示/false=隐藏
|
||
* @return {Object} this
|
||
*/
|
||
showLoading(loading = true) {
|
||
this.cell[loading ? 'progressOn' : 'progressOff']();
|
||
return this;
|
||
}
|
||
}
|
||
|
||
module.exports = Tabbar;
|