java adminlte 使用_AdminLTE的使用

java adminlte 使用_AdminLTE的使用第一次听说这个模板,留着以后用1.AdminLTE的必要配置文件2.自定义主题样式(1)在body中设置class。skin-blue:主题颜色,如果引入了_all-skins.min.css,有很多颜色可以选择,如左图,设置为skin-blue默认就为右图的主题样式。sidebar-mini:在AdminLTE.css中可以找到。(2)wrapper设置:AdminLTE…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

第一次听说这个模板,留着以后用

1.AdminLTE的必要配置文件

48304ba5e6f9fe08f3fa1abda7d326ab.png

2.自定义主题样式

(1)在body中设置class。

skin-blue:主题颜色,如果引入了_all-skins.min.css,有很多颜色可以选择,如左图,设置为skin-blue默认就为右图的主题样式。

675fbefb5478dd1d60e3bb1d660051b8.png        

c00e082aa5eba091885661a0d105ac30.png

sidebar-mini:在AdminLTE.css中可以找到。

56870c78debfcc27b6047bdb5557e97b.png   

bade51d7ff63ee30996f2224bf416bd4.png

(2)wrapper设置: AdminLTE.css

header设置:放在header标签里。

48304ba5e6f9fe08f3fa1abda7d326ab.png

java adminlte 使用_AdminLTE的使用

xxx后台管理系统

Toggle navigation

48304ba5e6f9fe08f3fa1abda7d326ab.png

header效果如下图所示,点击sidebar toggle button,logo-lg隐藏,logo-mini显示,如右图。

bcd4b5da78594575192b36f4dcf396c3.png    

0cab8df4afda4f1ace1438ed3d8358e4.png

aside设置:放在aside标签里。

48304ba5e6f9fe08f3fa1abda7d326ab.png

导航

首页

{
{each sub1 as value i}} //sub1 对应js代码中的 sub1 .

{
{value.name}}

  • {
    {each value.sub as value1 i1}}//对应 rootList[i].sub
  • {
    {value1.name}}

{
{/each}}

{
{/each}}

48304ba5e6f9fe08f3fa1abda7d326ab.png

48304ba5e6f9fe08f3fa1abda7d326ab.png

functionsloveSliderData (list, pid){

var retList = [ ];

var len = list.length;

if (len > 0)

{

for (var i = 0; i < len; i++)

{

var x = list[i];

if (x.pid == pid)

{

var node = {};

node.name = x.name;

if (x.url == undefined || x.url == null || x.url == “”)

{

node.url = null;

}

else

{

node.url = “${ctx}${apath}/page/” + x.url;

}

node.ico = x.ico;

node.pid = x.pid;

node.id = x.id;

retList.push (node);

}

else

{

}

}

}

return retList;

}

$.HTTP.list (

{

url : “${ctx}${apath}/permission/list”,

success : function (list, pageinfo) {

var rootList = [ ];

rootList = sloveSliderData (list, 0); //根据根菜单的pid为0,挑选出根菜单

if (list.length > 0)

{

for (var i = 0; i < rootList.length; i++)

{

rootList[i].sub = sloveSliderData (list, rootList[i].id); //根据pid为0挑选出的根菜单的id,作为子菜单的pid。

}

}

//组装数据源

var sidebardata =

{

sub1 : rootList

};

console.log(sidebardata);

//渲染菜单数据

var dt = template(“left-sidebarTmp”, sidebardata); //artTemplate方法

$(“#left-sidebar”).html(dt);

}

});

48304ba5e6f9fe08f3fa1abda7d326ab.png

注意:

${ctx}${apath}/permission/list接口的数据在数据库中手动添加,java后台有代码将数据存入这个接口。数据库字段与js代码所需的字段对应一致。

c520c6ac1a6d940e4b3b484f20daf3ee.png

经过js处理过的sidebardata:

85fe9848485010362372f68f6c63ae47.png

成功后sidebar显示如下图所示:

cd11db0207dc10d619e6823257674bfc.png

content设置:放在section标签里。

48304ba5e6f9fe08f3fa1abda7d326ab.png

  • 首页

48304ba5e6f9fe08f3fa1abda7d326ab.png

点击sidebar的链接,对应的页面都会在iframe_box中显示出来。

18ccd45341834baa833e6c94f085003d.png

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/164548.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • window 下 win10 jdk8安装与环境变量的配置(超级详细)[通俗易懂]

    window 下 win10 jdk8安装与环境变量的配置(超级详细)[通俗易懂]1、jdk的下载1.1官网下载地址https://www.oracle.com/java/technologies/javase-downloads.html这里以为下载需要登录所以我准备了百度网盘1.2百度网盘下载链接:https://pan.baidu.com/s/1uBm0XqBtbdafWgn_YUSWLA提取码:2mqh2、新建文件夹2.1、新建Java文件夹我这里选择的是安装的文件夹我在H盘里面新建了个java文件夹,这里盘符可以改的CDE啥都无所谓

    2022年6月18日
    54
  • 超人学院Hadoop大数据资源共享

    超人学院Hadoop大数据资源共享

    2022年1月15日
    47
  • iframe高度自适应_读取跨域iframe

    iframe高度自适应_读取跨域iframe采用JavaScript来控制iframe元素的高度是iframe高度自适应的关键,同时由于JavaScript对不同域名下权限的控制,引发出同域、跨域两种情况。由于客户端js使用浏览器的同源安全策略,跨域情况下,被嵌套页面如果想要获取和修改父页面的DOM属性会出现权限不足的情况,提示错误:Permissiondeniedtoaccessproperty’document’。这是

    2022年10月12日
    3
  • 电子商务网站安全_跨境电商有哪些平台

    电子商务网站安全_跨境电商有哪些平台电商网站安全应对之道(电商网站安全的威胁类型:https://blog.csdn.net/qq_29039705/article/details/80486795)一、预防逻辑漏洞进行业务流程梳理接口会发加签名和超时机制避免通过前端进行验证和现在减少暴露给用户的参数增加共享数据互斥机制不要相信用户输入检查用户输入二、预防越权操作任何涉及用户权限的操作均匀会话关联参数的加密及模糊化严格验证程序逻辑顺…

    2022年10月1日
    2
  • 原则与执着:暴雪王牌总结游戏研发得失成败「建议收藏」

    原则与执着:暴雪王牌总结游戏研发得失成败「建议收藏」暴雪执行副总裁、diablo3设计师RobPardo在本年度GDC上详细讲述了暴雪在游戏设计理念的主要原则,总结暴雪过去十余年中的经验教训。  RobPardo在暴雪长期负责游戏设计方面的工作,具有极其丰富的成功经验。他曾是《星际争霸》、《星际争霸:母巢之战》、《魔兽争霸3:混乱之治》、《魔兽争霸3:冰封王座》、《魔兽世界》、《魔兽世界:燃烧远征》的主要设计者,2006年他以《魔兽世界》

    2022年5月7日
    78
  • python【图片转字符画】,图片灰度值处理

    python【图片转字符画】,图片灰度值处理

    2021年3月12日
    160

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号