first commit
This commit is contained in:
67
public/component/pear/module/frame.js
Executable file
67
public/component/pear/module/frame.js
Executable file
@ -0,0 +1,67 @@
|
||||
layui.define(['jquery', 'element'], function (exports) {
|
||||
"use strict";
|
||||
|
||||
var $ = layui.jquery;
|
||||
|
||||
var pearFrame = function (opt) {
|
||||
this.option = opt;
|
||||
};
|
||||
|
||||
pearFrame.prototype.render = function (opt) {
|
||||
var option = {
|
||||
elem: opt.elem,
|
||||
url: opt.url,
|
||||
title: opt.title,
|
||||
width: opt.width,
|
||||
height: opt.height,
|
||||
done: opt.done ? opt.done : function () { console.log("菜单渲染成功"); }
|
||||
}
|
||||
createFrameHTML(option);
|
||||
$("#" + option.elem).width(option.width);
|
||||
$("#" + option.elem).height(option.height);
|
||||
return new pearFrame(option);
|
||||
}
|
||||
|
||||
pearFrame.prototype.changePage = function (url, loading) {
|
||||
var $frameLoad = $("#" + this.option.elem).find(".pear-frame-loading");
|
||||
var $frame = $("#" + this.option.elem + " iframe");
|
||||
$frame.attr("src", url);
|
||||
frameLoading($frame, $frameLoad, loading);
|
||||
}
|
||||
|
||||
pearFrame.prototype.changePageByElement = function (elem, url, title, loading) {
|
||||
var $frameLoad = $("#" + elem).find(".pear-frame-loading");
|
||||
var $frame = $("#" + elem + " iframe");
|
||||
$frame.attr("src", url);
|
||||
$("#" + elem + " .title").html(title);
|
||||
frameLoading($frame, $frameLoad, loading);
|
||||
}
|
||||
|
||||
pearFrame.prototype.refresh = function (loading) {
|
||||
var $frameLoad = $("#" + this.option.elem).find(".pear-frame-loading");
|
||||
var $frame = $("#" + this.option.elem).find("iframe");
|
||||
$frame.attr("src", $frame.attr("src"));
|
||||
frameLoading($frame, $frameLoad, loading);
|
||||
}
|
||||
|
||||
function createFrameHTML(option) {
|
||||
var iframe = "<iframe class='pear-frame-content' style='width:100%;height:100%;' scrolling='auto' frameborder='0' src='" + option.url + "' allowfullscreen='true' ></iframe>";
|
||||
var loading = '<div class="pear-frame-loading">' +
|
||||
'<div class="ball-loader">' +
|
||||
'<span></span><span></span><span></span><span></span>' +
|
||||
'</div>' +
|
||||
'</div></div>';
|
||||
$("#" + option.elem).html("<div class='pear-frame'>" + iframe + loading + "</div>");
|
||||
}
|
||||
|
||||
function frameLoading(iframeEl, loadingEl, isLoading) {
|
||||
if (isLoading) {
|
||||
loadingEl.css({ display: 'block' });
|
||||
$(iframeEl).on('load', function () {
|
||||
loadingEl.fadeOut(1000);
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
exports('frame', new pearFrame());
|
||||
});
|
Reference in New Issue
Block a user