新增黑暗主题

2022-05-27 15:34:41 +08:00
parent 9b702b0297
commit 559733bb61
16 changed files with 517 additions and 188 deletions
--- a/modules/core/src/main/resources/static/images/ruler.png
+++ b/modules/core/src/main/resources/static/images/ruler.png
--- a/modules/core/src/main/resources/views/layouts/default.html
+++ b/modules/core/src/main/resources/views/layouts/default.html
@@ -7,11 +7,12 @@
 * @param libs 要引用的js或css类库
 */
 var themeName = @Global.getConfig('web.view.themeName', 'default');
-%>
-<% print('<'+'!DOC'+'TYPE html'+'>'); %>
-<% print('<'+'html'+'><'+'head'+'>'); %>
-<% include('/include/head.html', {title: text(title!)}){} %>
-<% include('/themes/'+themeName+'/include/header.html', {libs: libs!}){} %>
+// 获取当前皮肤样式名称：详见jeesite-common项目下的static/adminlte/css/skins目录
+var defaultSkinName = @Global.getConfig('sys.index.skinName', 'skin-blue-light3');
+var skinName = cookie('skinName_'+session.userCode, false, defaultSkinName);
+print('<'+'!DOC'+'TYPE html'+'><'+'html class="'+skinName+'"><'+'head'+'>');
+include('/include/head.html', {title: text(title!)}){}
+include('/themes/'+themeName+'/include/header.html', {libs: libs!, skinName: skinName}){} %>
 </head><body class="hold-transition ${bodyClass!}">
 <% if (!@ListUtils.inString('layout', libs!)){ %>
 <div class="wrapper">${layoutContent}</div>
--- a/modules/core/src/main/resources/views/modules/sys/onlineList.html
+++ b/modules/core/src/main/resources/views/modules/sys/onlineList.html
@@ -56,10 +56,10 @@ $('#dataGrid').dataGrid({
 		{header:'${text("超时时间")}', name:'timeout', width:100, align:'center'},
 		{header:'${text("客户主机")}', name:'host', width:70, align:'center'},
 		{header:'${text("用户类型")}', name:'userType', width:50, align:'center', formatter: function(val, obj, row, act){
-			return js.getDictLabel(${@DictUtils.getDictListJson('sys_user_type')}, val, '未设置', true);
+			return js.getDictLabel(${@DictUtils.getDictListJson('sys_user_type')}, val, '${text('未设置')}', true);
 		}},
 		{header:'${text("设备类型")}', name:'deviceType', width:50, align:'center', formatter: function(val, obj, row, act){
-			return js.getDictLabel(${@DictUtils.getDictListJson('sys_device_type')}, val, '未设置', true);
+			return js.getDictLabel(${@DictUtils.getDictListJson('sys_device_type')}, val, '${text('未设置')}', true);
 		}}
 		<% if(hasPermi('sys:online:edit')){ %>
 		,{header:'${text("操作")}', name:'actions', width:100, sortable:false, formatter: function(val, obj, row, act){
--- a/modules/core/src/main/resources/views/modules/sys/switchSkin.html
+++ b/modules/core/src/main/resources/views/modules/sys/switchSkin.html
@@ -1,7 +1,9 @@
 <% layout('/layouts/default.html', {title:'切换主题'}){ %>
 <style>
 	.list-unstyled{margin:10px;}
+	.skin-dark .list-unstyled {color:#a8a8a8}
 	.full-opacity-hover{opacity:1;filter:none;border:1px solid #fff}
+	.skin-dark .full-opacity-hover {border:1px solid #888}
 	.full-opacity-hover:hover{border:1px solid #f00;}
 </style>
 <ul class="list-unstyled clearfix">
@@ -167,10 +169,13 @@
 		</a>
 		<p class="text-center no-margin">${text('浅蓝-无界')}</p>
 	</li>
-	<li style="float:left;width:32%;padding-top:8px;text-align:center;">
+	<li style="float:left;width:32%;padding-top:8px;padding-left:20px;">
 		<#form:checkbox name="formLayerModel" label="${text('表单弹窗模式')}" class="form-control"/>
 		<#form:checkbox name="tabPageModel" label="${text('取消页签模式')}" class="form-control"/>
 	</li>
+	<li style="float:left;width:100%;" id="skinDark">
+		<button class="full-opacity-hover mt10 form-control" data-skin="skin-dark">${text('黑暗模式')}</button>
+	</li>
 </ul>
 <% } %>
 <script>
@@ -178,6 +183,8 @@ $('.full-opacity-hover').click(function(){
 	js.window.location = '${ctx}/switchSkin/' + $(this).data('skin');
 });

+$('#skinDark').toggle(!$('html').hasClass('skin-dark'));
+
 $('#formLayerModel')
 .iCheck(js.cookie('formLayerModel') == 'true' ? 'check' : 'uncheck')
 .on('ifChecked', function(){
--- a/modules/core/src/main/resources/views/modules/sys/sysDesktop.html
+++ b/modules/core/src/main/resources/views/modules/sys/sysDesktop.html
--- a/modules/core/src/main/resources/views/modules/sys/user/empUserFormAuthDataScope.html
+++ b/modules/core/src/main/resources/views/modules/sys/user/empUserFormAuthDataScope.html
@@ -36,7 +36,7 @@
 				<div id="dataScopeTrees"></div>
 				<script id="dataScopeTpl" type="text/template">
 					<div class="pull-left" style="padding:0 15px;min-width:300px;">
-						<div class="box box-solid" style="background:#FAFAFA">
+						<div class="box box-solid box-trees">
 							<div class="box-header">
 								<div class="box-title icheck">
 									<label><input type="checkbox" id="checkall_{{d.key}}"
@@ -110,8 +110,8 @@ var setting = {
 		onCheck: function (event, treeId, treeNode){ }
 	}
 },
-moduleCodes = '${toJson(@ModuleUtils.getEnableModuleCodes())}';
-dataScopes = ${@Global.getConfig('user.dataScopes','[]')},
+moduleCodes = '${toJson(moduleCodes)}';
+dataScopes = ${toJson(dataScopes)},
 dataScopeTrees = {}; // 用sysCode分类存储所有菜单树
 for (var i=0; i<dataScopes.length; i++){
 	var dataScope = dataScopes[i];
@@ -129,7 +129,7 @@ for (var i=0; i<dataScopes.length; i++){
 	$.ajax({
 		type: 'POST',
 		url: "${ctx}" + ctrlDataUrl + (ctrlDataUrl.indexOf("?")!=-1?'&':'?') + "___t=" + new Date().getTime(),
-		data: {ctrlPermi: '${@Global.getConfig("user.adminCtrlPermi", "2")}'},
+		data: {ctrlPermi: '${ctrlPermi}'},
 		dataType: 'json',
 		async: false,
 		error: function(data){
--- a/modules/core/src/main/resources/views/modules/sys/user/secAdminForm.html
+++ b/modules/core/src/main/resources/views/modules/sys/user/secAdminForm.html
@@ -36,7 +36,7 @@
 				<div id="dataScopeTrees"></div>
 				<script id="dataScopeTpl" type="text/template">
 					<div class="pull-left" style="padding:0 15px;min-width:300px;">
-						<div class="box box-solid" style="background:#FAFAFA">
+						<div class="box box-solid box-trees">
 							<div class="box-header">
 								<div class="box-title icheck">
 									<label><input type="checkbox" id="checkall_{{d.key}}"
@@ -110,8 +110,8 @@ var setting = {
 		onCheck: function (event, treeId, treeNode){ }
 	}
 },
-moduleCodes = '${toJson(@ModuleUtils.getEnableModuleCodes())}';
-dataScopes = ${@Global.getConfig('user.dataScopes','[]')},
+moduleCodes = '${toJson(moduleCodes)}';
+dataScopes = ${toJson(dataScopes)},
 dataScopeTrees = {}; // 用sysCode分类存储所有菜单树
 for (var i=0; i<dataScopes.length; i++){
 	var dataScope = dataScopes[i];
@@ -129,7 +129,7 @@ for (var i=0; i<dataScopes.length; i++){
 	$.ajax({
 		type: 'POST',
 		url: "${ctx}" + ctrlDataUrl + (ctrlDataUrl.indexOf("?")!=-1?'&':'?') + "___t=" + new Date().getTime(),
-		data: {ctrlPermi: '${@Global.getConfig("user.adminCtrlPermi", "2")}'},
+		data: {ctrlPermi: '${ctrlPermi}'},
 		dataType: 'json',
 		async: false,
 		error: function(data){
--- a/modules/core/src/main/resources/views/themes/default/include/header.html
+++ b/modules/core/src/main/resources/views/themes/default/include/header.html
@@ -1,6 +1,3 @@
-<% include('/include/csslibs.html', {libs: libs!}){}
-// 获取当前皮肤样式名称：详见jeesite-common项目下的static/adminlte/css/skins目录
-var defaultSkinName = @Global.getConfig('sys.index.skinName', 'skin-blue-light');
-var skinName = cookie('skinName_'+session.userCode, false, defaultSkinName); %>
+<% include('/include/csslibs.html', {libs: libs!}){} %>
 <link rel="stylesheet" href="${ctxStatic}/adminlte/css/skins/${skinName}.css?${_version}">
 <link rel="stylesheet" href="${ctxStatic}/common/common.css?${_version}">