mirror of https://gitee.com/y_project/RuoYi.git
剔除页签操作功能
RuoYi
parent
7b4c8f89e1
commit
49001edac8
|
|
@ -3,149 +3,180 @@
|
|||
* 新增支持IE全屏显示
|
||||
* Copyright (c) 2019 ruoyi
|
||||
*/
|
||||
(function(jQuery) {
|
||||
|
||||
/*jshint browser: true, jquery: true */
|
||||
(function($){
|
||||
"use strict";
|
||||
/**
|
||||
* Sets or gets the fullscreen state.
|
||||
*
|
||||
* @param {boolean=} state
|
||||
* True to enable fullscreen mode, false to disable it. If not
|
||||
* specified then the current fullscreen state is returned.
|
||||
* @return {boolean|Element|jQuery|null}
|
||||
* When querying the fullscreen state then the current fullscreen
|
||||
* element (or true if browser doesn't support it) is returned
|
||||
* when browser is currently in full screen mode. False is returned
|
||||
* if browser is not in full screen mode. Null is returned if
|
||||
* browser doesn't support fullscreen mode at all. When setting
|
||||
* the fullscreen state then the current jQuery selection is
|
||||
* returned for chaining.
|
||||
* @this {jQuery}
|
||||
*/
|
||||
function fullScreen(state)
|
||||
{
|
||||
var e, func, doc;
|
||||
|
||||
// These helper functions available only to our plugin scope.
|
||||
function supportFullScreen(){
|
||||
var doc = document.documentElement;
|
||||
// Do nothing when nothing was selected
|
||||
if (!this.length) return this;
|
||||
|
||||
return ('requestFullscreen' in doc) ||
|
||||
('msRequestFullscreen' in doc) ||
|
||||
('mozRequestFullScreen' in doc && document.mozFullScreenEnabled) ||
|
||||
('webkitRequestFullScreen' in doc);
|
||||
// We only use the first selected element because it doesn't make sense
|
||||
// to fullscreen multiple elements.
|
||||
e = (/** @type {Element} */ this[0]);
|
||||
|
||||
// Find the real element and the document (Depends on whether the
|
||||
// document itself or a HTML element was selected)
|
||||
if (e.ownerDocument)
|
||||
{
|
||||
doc = e.ownerDocument;
|
||||
}
|
||||
else
|
||||
{
|
||||
doc = e;
|
||||
e = doc.documentElement;
|
||||
}
|
||||
|
||||
function requestFullScreen(elem){
|
||||
if (elem.requestFullscreen) {
|
||||
elem.requestFullscreen();
|
||||
} else if (elem.mozRequestFullScreen) {
|
||||
elem.mozRequestFullScreen();
|
||||
} else if (elem.webkitRequestFullScreen) {
|
||||
elem.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
|
||||
} else if (elem.msRequestFullscreen) {
|
||||
elem.msRequestFullscreen();
|
||||
}
|
||||
// When no state was specified then return the current state.
|
||||
if (state == null)
|
||||
{
|
||||
// When fullscreen mode is not supported then return null
|
||||
if (!((/** @type {?Function} */ doc["exitFullscreen"])
|
||||
|| (/** @type {?Function} */ doc["webkitExitFullscreen"])
|
||||
|| (/** @type {?Function} */ doc["webkitCancelFullScreen"])
|
||||
|| (/** @type {?Function} */ doc["msExitFullscreen"])
|
||||
|| (/** @type {?Function} */ doc["mozCancelFullScreen"])))
|
||||
{
|
||||
return null;
|
||||
}
|
||||
|
||||
function fullScreenStatus(){
|
||||
return document.fullscreen ||
|
||||
document.mozFullScreen ||
|
||||
document.webkitIsFullScreen ||
|
||||
document.msFullscreenElement ||
|
||||
false;
|
||||
// Check fullscreen state
|
||||
state = !!doc["fullscreenElement"]
|
||||
|| !!doc["msFullscreenElement"]
|
||||
|| !!doc["webkitIsFullScreen"]
|
||||
|| !!doc["mozFullScreen"];
|
||||
if (!state) return state;
|
||||
|
||||
// Return current fullscreen element or "true" if browser doesn't
|
||||
// support this
|
||||
return (/** @type {?Element} */ doc["fullscreenElement"])
|
||||
|| (/** @type {?Element} */ doc["webkitFullscreenElement"])
|
||||
|| (/** @type {?Element} */ doc["webkitCurrentFullScreenElement"])
|
||||
|| (/** @type {?Element} */ doc["msFullscreenElement"])
|
||||
|| (/** @type {?Element} */ doc["mozFullScreenElement"])
|
||||
|| state;
|
||||
}
|
||||
|
||||
function cancelFullScreen(){
|
||||
if (document.exitFullscreen) {
|
||||
document.exitFullscreen();
|
||||
} else if (document.mozCancelFullScreen) {
|
||||
document.mozCancelFullScreen();
|
||||
} else if (document.webkitCancelFullScreen) {
|
||||
document.webkitCancelFullScreen();
|
||||
} else if (document.msExitFullscreen) {
|
||||
document.msExitFullscreen();
|
||||
// When state was specified then enter or exit fullscreen mode.
|
||||
if (state)
|
||||
{
|
||||
// Enter fullscreen
|
||||
func = (/** @type {?Function} */ e["requestFullscreen"])
|
||||
|| (/** @type {?Function} */ e["webkitRequestFullscreen"])
|
||||
|| (/** @type {?Function} */ e["webkitRequestFullScreen"])
|
||||
|| (/** @type {?Function} */ e["msRequestFullscreen"])
|
||||
|| (/** @type {?Function} */ e["mozRequestFullScreen"]);
|
||||
if (func)
|
||||
{
|
||||
func.call(e);
|
||||
}
|
||||
}
|
||||
|
||||
function onFullScreenEvent(callback){
|
||||
$(document).on("fullscreenchange mozfullscreenchange webkitfullscreenchange", function(){
|
||||
// The full screen status is automatically
|
||||
// passed to our callback as an argument.
|
||||
callback(fullScreenStatus());
|
||||
});
|
||||
}
|
||||
|
||||
// Adding a new test to the jQuery support object
|
||||
$.support.fullscreen = supportFullScreen();
|
||||
|
||||
// Creating the plugin
|
||||
$.fn.fullScreen = function(props){
|
||||
if(!$.support.fullscreen || this.length !== 1) {
|
||||
// The plugin can be called only
|
||||
// on one element at a time
|
||||
|
||||
return this;
|
||||
}
|
||||
|
||||
if(fullScreenStatus()){
|
||||
// if we are already in fullscreen, exit
|
||||
cancelFullScreen();
|
||||
else
|
||||
{
|
||||
// Exit fullscreen
|
||||
func = (/** @type {?Function} */ doc["exitFullscreen"])
|
||||
|| (/** @type {?Function} */ doc["webkitExitFullscreen"])
|
||||
|| (/** @type {?Function} */ doc["webkitCancelFullScreen"])
|
||||
|| (/** @type {?Function} */ doc["msExitFullscreen"])
|
||||
|| (/** @type {?Function} */ doc["mozCancelFullScreen"]);
|
||||
if (func) func.call(doc);
|
||||
return this;
|
||||
}
|
||||
|
||||
// You can potentially pas two arguments a color
|
||||
// for the background and a callback function
|
||||
|
||||
var options = $.extend({
|
||||
'background' : '#111',
|
||||
'callback' : $.noop( ),
|
||||
'fullscreenClass' : 'fullScreen'
|
||||
}, props),
|
||||
|
||||
elem = this,
|
||||
|
||||
// This temporary div is the element that is
|
||||
// actually going to be enlarged in full screen
|
||||
|
||||
fs = $('<div>', {
|
||||
'css' : {
|
||||
'overflow-y' : 'auto',
|
||||
'background' : options.background,
|
||||
'width' : '100%',
|
||||
'height' : '100%'
|
||||
}
|
||||
})
|
||||
.insertBefore(elem)
|
||||
.append(elem);
|
||||
|
||||
// You can use the .fullScreen class to
|
||||
// apply styling to your element
|
||||
elem.addClass( options.fullscreenClass );
|
||||
|
||||
// Inserting our element in the temporary
|
||||
// div, after which we zoom it in fullscreen
|
||||
|
||||
requestFullScreen(fs.get(0));
|
||||
|
||||
fs.click(function(e){
|
||||
if(e.target == this){
|
||||
// If the black bar was clicked
|
||||
cancelFullScreen();
|
||||
}
|
||||
});
|
||||
|
||||
elem.cancel = function(){
|
||||
cancelFullScreen();
|
||||
return elem;
|
||||
};
|
||||
|
||||
onFullScreenEvent(function(fullScreen){
|
||||
if(!fullScreen){
|
||||
// We have exited full screen.
|
||||
// Detach event listener
|
||||
$(document).off( 'fullscreenchange mozfullscreenchange webkitfullscreenchange' );
|
||||
// Remove the class and destroy
|
||||
// the temporary div
|
||||
|
||||
elem.removeClass( options.fullscreenClass ).insertBefore(fs);
|
||||
fs.remove();
|
||||
}
|
||||
|
||||
// Calling the facultative user supplied callback
|
||||
if(options.callback) {
|
||||
options.callback(fullScreen);
|
||||
/**
|
||||
* Toggles the fullscreen mode.
|
||||
*
|
||||
* @return {!jQuery}
|
||||
* The jQuery selection for chaining.
|
||||
* @this {jQuery}
|
||||
*/
|
||||
function toggleFullScreen()
|
||||
{
|
||||
return (/** @type {!jQuery} */ fullScreen.call(this,
|
||||
!fullScreen.call(this)));
|
||||
}
|
||||
});
|
||||
|
||||
return elem;
|
||||
};
|
||||
/**
|
||||
* Handles the browser-specific fullscreenchange event and triggers
|
||||
* a jquery event for it.
|
||||
*
|
||||
* @param {?Event} event
|
||||
* The fullscreenchange event.
|
||||
*/
|
||||
function fullScreenChangeHandler(event)
|
||||
{
|
||||
jQuery(document).trigger(new jQuery.Event("fullscreenchange"));
|
||||
}
|
||||
|
||||
$.fn.cancelFullScreen = function( ) {
|
||||
cancelFullScreen();
|
||||
/**
|
||||
* Handles the browser-specific fullscreenerror event and triggers
|
||||
* a jquery event for it.
|
||||
*
|
||||
* @param {?Event} event
|
||||
* The fullscreenerror event.
|
||||
*/
|
||||
function fullScreenErrorHandler(event)
|
||||
{
|
||||
jQuery(document).trigger(new jQuery.Event("fullscreenerror"));
|
||||
}
|
||||
|
||||
/**
|
||||
* Installs the fullscreenchange event handler.
|
||||
*/
|
||||
function installFullScreenHandlers()
|
||||
{
|
||||
var e, change, error;
|
||||
|
||||
// Determine event name
|
||||
e = document;
|
||||
if (e["webkitCancelFullScreen"])
|
||||
{
|
||||
change = "webkitfullscreenchange";
|
||||
error = "webkitfullscreenerror";
|
||||
}
|
||||
else if (e["msExitFullscreen"])
|
||||
{
|
||||
change = "MSFullscreenChange";
|
||||
error = "MSFullscreenError";
|
||||
}
|
||||
else if (e["mozCancelFullScreen"])
|
||||
{
|
||||
change = "mozfullscreenchange";
|
||||
error = "mozfullscreenerror";
|
||||
}
|
||||
else
|
||||
{
|
||||
change = "fullscreenchange";
|
||||
error = "fullscreenerror";
|
||||
}
|
||||
|
||||
// Install the event handlers
|
||||
jQuery(document).bind(change, fullScreenChangeHandler);
|
||||
jQuery(document).bind(error, fullScreenErrorHandler);
|
||||
}
|
||||
|
||||
jQuery.fn["fullScreen"] = fullScreen;
|
||||
jQuery.fn["toggleFullScreen"] = toggleFullScreen;
|
||||
installFullScreenHandlers();
|
||||
|
||||
})(jQuery);
|
||||
|
||||
return this;
|
||||
};
|
||||
}(jQuery));
|
||||
|
|
|
|||
|
|
@ -3313,7 +3313,7 @@ nav.page-tabs .page-tabs-content {
|
|||
}
|
||||
|
||||
.roll-right.tabRight {
|
||||
right: 140px;
|
||||
right: 60px;
|
||||
}
|
||||
|
||||
.roll-right.btn-group {
|
||||
|
|
|
|||
|
|
@ -139,14 +139,14 @@ $(function() {
|
|||
|
||||
//查看左侧隐藏的选项卡
|
||||
function scrollTabLeft() {
|
||||
var marginLeftVal = Math.abs(parseInt($('.page-tabs-content').css('margin-left')) + 50);
|
||||
var marginLeftVal = Math.abs(parseInt($('.page-tabs-content').css('margin-left')));
|
||||
// 可视区域非tab宽度
|
||||
var tabOuterWidth = calSumWidth($(".content-tabs").children().not(".menuTabs"));
|
||||
//可视区域tab宽度
|
||||
var visibleWidth = $(".content-tabs").outerWidth(true) - tabOuterWidth;
|
||||
//实际滚动宽度
|
||||
var scrollVal = 0;
|
||||
if (($(".page-tabs-content").width() + 50) < visibleWidth) {
|
||||
if (($(".page-tabs-content").width()) < visibleWidth) {
|
||||
return false;
|
||||
} else {
|
||||
var tabElement = $(".menuTab:first");
|
||||
|
|
@ -425,7 +425,7 @@ $(function() {
|
|||
|
||||
// 全屏显示
|
||||
$('#fullScreen').on('click', function () {
|
||||
$('#wrapper').fullScreen();
|
||||
$(document).toggleFullScreen();
|
||||
});
|
||||
|
||||
// 刷新按钮
|
||||
|
|
@ -533,7 +533,8 @@ $(function() {
|
|||
icon: "fa-arrows-alt",
|
||||
callback: function(key, opt) {
|
||||
setActiveTab(this);
|
||||
opt.$trigger.find('i').trigger("dblclick");
|
||||
var target = $('.RuoYi_iframe[data-id="' + this.data('id') + '"]');
|
||||
target.fullScreen(true);
|
||||
}
|
||||
},
|
||||
"refresh": {
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@
|
|||
</li>
|
||||
<li th:each="menu : ${menus}">
|
||||
<a href="#">
|
||||
<i class="fa fa fa-bar-chart-o" th:class="${menu.icon}"></i>
|
||||
<i class="fa fa-bar-chart-o" th:class="${menu.icon}"></i>
|
||||
<span class="nav-label" th:text="${menu.menuName}">一级菜单</span>
|
||||
<span class="fa arrow"></span>
|
||||
</a>
|
||||
|
|
@ -86,7 +86,7 @@
|
|||
<ul class="nav navbar-top-links navbar-right welcome-message">
|
||||
<li><a title="视频教程" href="http://doc.ruoyi.vip/#/standard/spjc" target="_blank"><i class="fa fa-video-camera"></i> 视频教程</a></li>
|
||||
<li><a title="开发文档" href="http://doc.ruoyi.vip" target="_blank"><i class="fa fa-question-circle"></i> 开发文档</a></li>
|
||||
<li><a title="全屏显示" id="fullScreen"><i class="fa fa-arrows-alt"></i> 全屏显示</a></li>
|
||||
<li><a title="全屏显示" href="javascript:void(0)" id="fullScreen"><i class="fa fa-arrows-alt"></i> 全屏显示</a></li>
|
||||
<li class="dropdown user-menu">
|
||||
<a href="javascript:void(0)" class="dropdown-toggle" data-hover="dropdown">
|
||||
<img th:src="(${user.avatar} == '') ? @{/img/profile.jpg} : @{/profile/avatar/} + ${user.avatar}" class="user-image">
|
||||
|
|
@ -123,17 +123,6 @@
|
|||
<button class="roll-nav roll-right tabRight">
|
||||
<i class="fa fa-forward"></i>
|
||||
</button>
|
||||
<div class="btn-group roll-nav roll-right">
|
||||
<button class="dropdown J_tabClose" data-toggle="dropdown">
|
||||
页签操作<span class="caret"></span>
|
||||
</button>
|
||||
<ul role="menu" class="dropdown-menu dropdown-menu-right">
|
||||
<li><a class="tabCloseCurrent" href="javascript:void();">关闭当前</a></li>
|
||||
<li><a class="tabCloseOther" href="javascript:void();">关闭其他</a></li>
|
||||
<li><a class="tabCloseAll" href="javascript:void();">全部关闭</a></li>
|
||||
<li><a class="tabMaxCurrent" href="javascript:void();">全屏显示</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<a href="#" class="roll-nav roll-right tabReload"><i class="fa fa-refresh"></i> 刷新</a>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue