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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • idea集成gitee_git和idea

    idea集成gitee_git和ideaidea集成git,傻瓜式教程,超详细

    2025年6月27日
    7
  • goland激活码永久(破解版激活)

    goland激活码永久(破解版激活),https://javaforall.net/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

    2022年3月16日
    145
  • 2020年5月份编程语言排行榜「建议收藏」

    2020年5月份编程语言排行榜「建议收藏」前言本文章中语言排名数据来自TIOBE排行榜和PYPL排行榜。这段时间一直在忙,都忘记更新这个排行榜了,今天重操旧业,给大家看一下5月份的编程语言排行榜TIOBE排行榜5月份数据2020年5月TIOBE指数以下是官方说明五月标题:编程语言C又回到了第一位Java和C在4月份已经非常接近了,但是这个月C再次超越了Java。上一次C排名第一是在2015年。我们只能猜测为什么C又是第一名。其中一个原因可能是冠状病毒。这听起来可能很傻,但有些编程语言确实从这种情况中受益。数据科学领域的例子有P

    2022年5月31日
    63
  • 粒子群算法的matlab实现(一)[通俗易懂]

    粒子群算法的matlab实现(一)[通俗易懂]粒子群算法(ParticleSwarmOptimization,PSO)是20世纪90年代兴起的一门学科,因其概念简明、实现方便、收敛速度快而为人所知。粒子群算法的基本思想是模拟鸟群随机搜寻食物的捕食行为,鸟群通过自身经验和种群之间的交流调整自己的搜寻路径,从而找到食物最多的地点。其中每只鸟的位置/路径则为自变量组合,每次到达的地点的食物密度即函数值。每次搜寻都会根据自身经验(自身历史搜寻的最

    2022年6月10日
    32
  • 建立内网Windows补丁服务器「建议收藏」

    建立内网Windows补丁服务器建立内网Windows补丁服务器实施方案一、完成内网WSUS服务器的架设。二、对客户端计算机进行设置。三、进行外网WSUS服务器的架设。建立内网Windows补丁服务器众所周知,Windows系统有着种种安全漏洞和不足,这些都要依靠微软发布的一个个补丁来弥补,但公司内网无法访问Internet,,不能及时地下载更新。补丁的分发是微软应尽的责任,所以他们开发了WindowsServerUpdateServices(简称WSUS)这一软件,可以实现通过一台服务器下载更新

    2022年4月16日
    52
  • 大疆网上测评题库_大疆在线测评 – 逻辑题「建议收藏」

    大疆网上测评题库_大疆在线测评 – 逻辑题「建议收藏」收到大疆测评的邮件,在知乎百度搜了一圈也没搜到题目,只好直接去测评了。我的测评是90道题,其中逻辑题挺烧脑,出现了6道逻辑题,幸好之前看过逻辑学三段论,都能答对。2-7是我测评中出现的题,一模一样,今后是否一样就不能确保了,仅供参考。1.所有的老虎会动;一些动物是老虎;因此,一些动物会动。参考解:True2.所有的宗教狂热分子都偏执;所有偏执的人都是种族主义者;因此,所有的种族主义者都是宗教狂…

    2022年6月29日
    102

发表回复

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

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