基于thinkphp的后台管理系统模板快速搭建
当我们在搭建网站的时候,后端开发人员在编写后台的管理系统的时候,往往会因为缺少一个合适的后台管理系统的模板,而必须去重新编写一个,这几天由于工作上的安排,需要去研究一下thinkcmf的后台管理系统,于是发现那个模式是相当不错,感觉基本每个后台管理系统都可以套用,我把它的主题框架划分了4个大块,三级菜单栏、内容iframe、标签栏、顶栏,如下图:
是不是觉得挺可以的?是不是有种所有后台管理系统都可以套用的赶脚勒?由于整个后台过于庞大,但我们又只是要其这样的主体UI框架,其他的都不要,于是我把它重新复制粘贴了一下,把我们需要的这个UI的实现给提取出来了,
查看效果:http://www.live086.cn/Text/(空间2015/09/23会停用,所以可以下载面的源码,直接放在本地服务器(wampserver)就可以运行)
获取源码:http://pan.baidu.com/s/1gdEqUYJ 密码:c951
这个UI比较特别的地方在,我们在选择三级菜单栏时,右侧的内容iframe会即时的更换,所选择的菜单项也会以标签的形式出现在标签栏上,可以随意切换,关闭,同时也可以点击刷新当前的内容iframe,整个操作起来舒服简单方便,其代码主要从几个方面来实现这些功能:
openapp(url, appid, appname, selectObj)
这是一个核心的函数,就是打开与菜单栏或是标签栏相对应的iframe,url是iframe的路径,thinkphp用U方法生成,appid是iframe的唯一标识,必传,在切换标签栏的时候和iframe隐藏与否有很重要的作用,否则会出现点击菜单栏没有效果的,具体可以下载源码去看,appname则是标签显示名称,selectObj是触发对象
$current_iframe[0].contentWindow.location.reload();
而刷新功能则是使用到iframe的属性contentWindow,相当于获得iframe的window对象,于是可以达到刷新的作用,对于框架之间互相调用函数和变量,可前往看这篇博客http://www.cnblogs.com/wuxiaobin/p/4812732.html
至于三级菜单怎么实现?关闭标签的实现?其他细节功能可以查看源码去看!
基于thinkphp的后台管理系统模板快速搭建的更多相关文章
- SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 后端篇(一): 搭建基本环境、整合 Swagger、MyBatisPlus、JSR303 以及国际化操作
相关 (1) 相关博文地址: SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 前端篇(一):搭建基本环境:https://www.cnblogs.com/l-y- ...
- vue+element-ui JYAdmin后台管理系统模板-集成方案【项目搭建篇2】
项目搭建时间:2020-06-29 本章节:讲述基于vue/cli, 项目的基础搭建. 本主题讲述了: 1.跨域配置 2.axios请求封装 3.eslint配置 4.环境dev,test,pro(开 ...
- 3YAdmin-专注通用权限控制与表单的后台管理系统模板
3YAdmin基于React+Antd构建.GitHub搜索React+Antd+Admin出来的结果没有上百也有几十个,为什么还要写这个东西呢? 一个后台管理系统的核心我认为应该是权限控制,表单以及 ...
- Bootstrap 轻量级后台管理系统模板--ACE使用介绍
在上一篇基于Bootstrap介绍了一个免费的后台管理模板Charisma UI. 参见链接: 基于Jquery.Bootstrap的后台管理免费UI框架推荐--Charisma UI 今天继续分享一 ...
- SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 后端篇(五): 数据表设计、使用 jwt、redis、sms 工具类完善注册登录逻辑
(1) 相关博文地址: SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 前端篇(一):搭建基本环境:https://www.cnblogs.com/l-y-h/p ...
- vue+element-ui后台管理系统模板
vue+element-ui后台管理系统模板 前端:基于vue2.0+或3.0+加上element-ui组件框架 后端:springboot+mybatis-plus写接口 通过Axios调用接口完成 ...
- Admin Panel – 非常漂亮的后台管理系统模板
网站或者应用系统的管理后台的设计虽然不像前台界面那样要求设计精美,但是也需要有清晰的管理模块划分,下面分享的这个后台管理模板的设计非常漂亮,特别是导航部分,头部还有未读的短消息和提醒的条数显示.赶紧下 ...
- easyui+ztree 后台管理系统模板
用easyui+ztree做了个后台管理系统模板,效果图: 下载地址: csdn:http://download.csdn.net/detail/jackpay/6744505 github:http ...
- vue3项目后台管理系统模板
Vue3.0 发布第一个版本至今有一段时间了,到现在一直在更新优化,在性能方面,对比 Vue2.x ,性能的提升比较明显,打包后体积更小 来看下 Vue3.x 新增了哪些功能和特性. Performa ...
随机推荐
- Original Autel MaxiSys Pro MS908P support 2 Year Free Update Online
You can get 2 Year Free Update Online once you place an order on Autel MS908P. Software Version: Eve ...
- python画手绘图
第一步:插入代码 #e17.1HandDrawPic.py from PIL import Image import numpy as np vec_el = np.pi/2.2 # 光源的俯视角度, ...
- CentOS7 安装极点五笔输入法
下载并解压vissible-ibus.tar.gz 或者这个vissible-ibus.tar.gz cp vissible.db /usr/share/ibus-table/tables/ cp v ...
- 原创《分享(Angular 和 Vue)按需加载的项目实践优化方案》
针对前端优化的点有很多,例如:图片压缩,雪碧图,js/css/html 文件的压缩合并, cdn缓存, 减少重定向, 按需加载 等等 最近有心想针对 ionic项目 和 vue项目,做一个比较大的优 ...
- mime类型的解析与应用
MIME类型解析 MIME(Multipurpose Internet Mail Extensions)多用途网络邮件扩展类型,可被称为Media type或Content type, 它设定某种 ...
- java枚举类型详解
枚举类型是JDK1.5的新特性.显然,enum很像特殊的class,实际上enum声明定义的类型就是一个类.而这些类都是类库中Enum类的子类(java.lang.Enum<E>).它 ...
- 对于SQL注入的理解
从网上搜索的资料,结合自己的理解整理了一下,网友们在查看时若有发现问题,还请不吝指正,谢谢! 1.什么是SQL注入? ——官方说法:把SQL命令插入到web表单验证的输入框中,提交到服务器,以达到越过 ...
- SQL Server Management Studio 执行超大脚本文件
SQL Server Management Studio 执行超大脚本文件 启动cmd.exe , cd 到C:\Program Files (x86)\Microsoft SQL Server\11 ...
- loadrunner场景之集合点设置技巧
在loadrunner的虚拟用户中,术语concurrent(并发)和simultaneous(同时)存在一些区别,concurrent 是指虚拟场景中参于运行的虚拟用户. 而simultaneous ...
- 如何快速连接无线Wifi 使用二维码
无线Wifi现在已经很普及了,无论是在家.还是在单位.书店.餐馆.咖啡馆等公共场所,只要手机打开Wifi,选择相应的无线Wifi热点,手工输入密码后,即可通过无线Wifi访问互联网. 如何让用户更方便 ...