剔除页签操作功能

ruoyi-admin/src/main/resources/static/ajax/libs/fullscreen/jquery.fullscreen.js

@@ -3,149 +3,180 @@
  * 新增支持IE全屏显示
  * Copyright (c) 2019 ruoyi
  */
+(function(jQuery) {
+    
+    /**
+     * 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;
+        
+        // Do nothing when nothing was selected
+        if (!this.length) return this;
+        
+        // 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;
+        }
+        
+        // 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;
+            }
+            
+            // 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;
+        }
+        
+        // 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);
+            }
+            return this;
+        }
+        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;
+        }
+    }
+    
+    /**
+     * Toggles the fullscreen mode.
+     * 
+     * @return {!jQuery}
+     *            The jQuery selection for chaining.
+     * @this {jQuery}
+     */
+    function toggleFullScreen()
+    {
+        return (/** @type {!jQuery} */ fullScreen.call(this, 
+            !fullScreen.call(this)));
+    }
+    
+    /**
+     * 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"));
+    }
+    
+    /**
+     * 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);
     
-/*jshint browser: true, jquery: true */
-(function($){
-	"use strict";
-
-	// These helper functions available only to our plugin scope.
-	function supportFullScreen(){
-		var doc = document.documentElement;
-
-		return ('requestFullscreen' in doc) ||
-		        ('msRequestFullscreen' in doc) ||
-				('mozRequestFullScreen' in doc && document.mozFullScreenEnabled) ||
-				('webkitRequestFullScreen' in doc);
-	}
-
-	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();
-		}
-	}
-
-	function fullScreenStatus(){
-		return document.fullscreen ||
-				document.mozFullScreen ||
-				document.webkitIsFullScreen ||
-				document.msFullscreenElement ||
-				false;
-	}
-
-	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();
-		}
-	}
-
-	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();
-			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);
-                        }
-		});
-
-		return elem;
-	};
-
-	$.fn.cancelFullScreen = function( ) {
-			cancelFullScreen();
-
-			return this;
-	};
-}(jQuery));

ruoyi-admin/src/main/resources/static/css/style.css

@@ -3313,7 +3313,7 @@ nav.page-tabs .page-tabs-content {
 }
 
 .roll-right.tabRight {
-    right: 140px;
+    right: 60px;
 }
 
 .roll-right.btn-group {

ruoyi-admin/src/main/resources/static/ruoyi/index.js

@@ -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": {

ruoyi-admin/src/main/resources/templates/index.html

@@ -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>