Code Monkey home page Code Monkey logo

layuimini's Introduction

layuimini后台模板

项目介绍

最简洁、清爽、易用的layui后台框架模板。

项目会不定时进行更新,建议star和watch一份。

技术交流QQ群:7162359881165301500🈵667813249🈵561838086🈵 加群请备注来源:如gitee、github、官网等

主要特性

  • 界面足够简洁清爽,响应式且适配手机端。
  • 一个接口几行代码而已直接初始化整个框架,无需复杂操作。
  • 页面支持多配色方案,可自行选择喜欢的配色。
  • 支持多tab,可以打开多窗口。
  • 支持无限级菜单和对font-awesome图标库的完美支持。
  • 失效以及报错菜单无法直接打开,并给出弹出层提示完美的线上用户体验
  • url地址hash定位,可以清楚看到当前tab的地址信息。
  • 刷新页面会保留当前的窗口,并且会定位当前窗口对应左侧菜单栏。
  • 支持font-awesome图标选择插件

代码仓库(iframe 多tab版)

v2版

v1版

代码仓库(onepage 单页版)

v2版

v1版

下载方式

iframe v2版

  • GitHub下载命令:git clone https://github.com/zhongshaofa/layuimini -b v2
  • Gitee下载命令:git clone https://gitee.com/zhongshaofa/layuimini -b v2

iframe v1版

  • GitHub下载命令:git clone https://github.com/zhongshaofa/layuimini -b master
  • Gitee下载命令:git clone https://gitee.com/zhongshaofa/layuimini -b master

单页版 v2版

  • GitHub下载命令:git clone https://github.com/zhongshaofa/layuimini -b v2-onepage
  • Gitee下载命令:git clone https://gitee.com/zhongshaofa/layuimini -b v2-onepage

单页版 v1版

  • GitHub下载命令:git clone https://github.com/zhongshaofa/layuimini -b onepage
  • Gitee下载命令:git clone https://gitee.com/zhongshaofa/layuimini -b onepage

发行版地址

效果预览

总体预览

Image text

使用说明

文档地址:查看文档

免责声明

任何用户在使用layuimini后台模板框架前,请您仔细阅读并透彻理解本声明。您可以选择不使用layuimini后台模板框架,若您一旦使用layuimini后台模板框架,您的使用行为即被视为对本声明全部内容的认可和接受。

  • layuimini后台模板框架是一款开源免费的 Web UI 纯静态框架 ,主要用于更便捷地开发后台网页界面。且layuimini后台模板框架并不具备「互联网接入、网络数据存储、通讯传输以及窃取用户隐私」中的任何一项与用户数据等信息相关的动态功能,layuimini后台模板框架仅是 UI 组件或素材类的本地资源。
  • layuimini后台模板框架仅属于 Web 前端的 UI 组件库,并不涉及任何后台程序代码;其尊重并保护所有用户的个人隐私权,不窃取任何用户计算机中的信息。更不具备用户数据存储等网络传输功能。
  • 您承诺秉着合法、合理的原则使用layuimini后台模板框架,不利用layuimini后台模板框架进行任何违法、侵害他人合法利益等恶意的行为,亦不将layuimini后台模板框架运用于任何违反我国法律法规的 Web 平台。
  • 任何单位或个人因下载使用layuimini后台模板框架而产生的任何意外、疏忽、合约毁坏、诽谤、版权或知识产权侵犯及其造成的损失 (包括但不限于直接、间接、附带或衍生的损失等),本开源项目不承担任何法律责任。
  • 用户明确并同意本声明条款列举的全部内容,对使用layuimini后台模板框架可能存在的风险和相关后果将完全由用户自行承担,本开源项目不承担任何法律责任。
  • 任何单位或个人在阅读本免责声明后,应在《MIT 开源许可证》所允许的范围内进行合法的发布、传播和使用layuimini后台模板框架等行为,若违反本免责声明条款或违反法律法规所造成的法律责任(包括但不限于民事赔偿和刑事责任),由违约者自行承担。
  • 如果本声明的任何部分被认为无效或不可执行,其余部分仍具有完全效力。不可执行的部分声明,并不构成我们放弃执行该声明的权利。
  • 本开源项目有权随时对本声明条款及附件内容进行单方面的变更,并以消息推送、网页公告等方式予以公布,公布后立即自动生效,无需另行单独通知;若您在本声明内容公告变更后继续使用的,表示您已充分阅读、理解并接受修改后的声明内容。

捐赠支持

开源项目不易,若此项目能得到你的青睐,可以捐赠支持作者持续开发与维护,感谢所有支持开源的朋友。

Image text

layuimini's People

Contributors

25juan avatar 99php avatar chenlianglian avatar free365 avatar jzow avatar zhongshaofa avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

layuimini's Issues

单页版v2版 bug

数据表格的操作栏在宽度不够时进行完整展示的状态下,按钮点击就无效了

1586962800(1)

1586963244(1)

表单点击提交后怎么跳转到其他页面?

你好,layuimini很好用很漂亮
目前遇到的问题:
单页面版本中在提交了表单后,ajax的success回调中加了layer.msg怎么跳到新的页面?
当前写法:

$.ajax({
   ...
   success:function(data){
        layer.msg(data.msg,1000,function(){
              window.location.href = 'page/user-list.html';
        })
   }
})

只有地址栏的地址变了,但页面没有跳转?

表单验证问题

发现所有的layui框架的表单验证都和官方一致。非常不友好!
比如,手机非必填,但是格式填错了,必须提交的时候才能检测出来,如果这样的有几个,比如邮箱。那会非常的不友好,提交一次才能检测出来,而且是一个个检测。
没有失去焦点验证,是否有优化计划?

table的几点建议

1、table能否点新增在下面新增空行,可以直接录入 保存
2、table新增的空行能否在单元格内输入首字母检索,如下效果
WechatIMG8

On three level address linkage

This is a great project. I have some suggestions about the three-level address of the layarea. I have probably looked at the data structure of the address. It is not easy to maintain this kind of data in the later stage. Generally, the data needs to interact with the database, otherwise it becomes a decoration
很棒的项目,关于layarea地址的三级有点建议,我大概看了下地址的数据结构,这种后期不大好维护,这些数据一般要和数据库有交互,不然成摆设了

内容区多层滚动条

内容区多层滚动条
/**
todo 修复低版本IOS不能滑动问题, 但还是有问题, 低版本IOS部分情况下子页面无法自适应
*/
.layuimini-tab .layui-tab-content .layui-tab-item{
-webkit-overflow-scrolling: touch;
overflow: scroll; /导致内容区出现多层滚动条,改为hidden可以了/
width:100%;
height:100%;
}

不知和 "todo 修复低版本IOS不能滑动问题, 但还是有问题, 低版本IOS部分情况下子页面无法自适应" 这个bug有什么冲突没有

font-awesome图标选择

我这边图标选择改成了font-awesome5.14.0的版本,原来的选择不太适用,我已经把代码改好了,怎么提交给您呢?

url 地址栏显示问题

image

url地址里跳转的页面或者接口地址 不想显示在url地址栏里 能隐藏吗?
layuimini.config 文件在哪里 没有找了

TAB之间如何传值

其中一个TAB页面是表单,我希望提交后将这个表单的所有字段值传到新的TAB,请问如何实现传值?

谢谢

表格内容编辑时,不会把数据带到编辑页吗?

table.on('tool(currentTableFilter)', function (obj) {
var data = obj.data;
如题,请问默认不把data传到edit页面吗?怎么在edit页拿到data数据?

想到了这个解决办法,请问原始有简便的方法没?
// 对所选编辑行数据编码
var data = escape(JSON.stringify(obj.data));
if (obj.event === 'edit') {
var index = layer.open({
title: '编辑用户',
type: 2,
content: './table/user-edit.html?'+data,
// 编辑页解码,得到原始对象
console.log(JSON.parse(unescape(location.search).replace('?','')))

控件样式大小优化建议

非常喜欢layuimini模板,已经在几个项目中使用了,开发速度很快,但感觉控件整体风格偏大,显得不够细腻,特使表单控件,按钮,table 行高的,希望整个行高调整小一些,更适合后端管理系统的风格,一个页面能够显示更多的能容。
例如下面表单的按钮,使用sm会显得太大,normal显的太大,不协调。table行高也太大,笔记本屏幕上看不了几行,需要滚动。
image

下面只阿里云上产品管理操作界面风格,基本所有产品这个设计,感觉比较细腻,建议把layui 风格调整小一点供参考!

image
image

单页面版发现的问题

page/upload.html 1、2 行引入修改为

微信图片_20190904215824

53 54行 修改为
微信图片_20190904215904

<script src="./lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script> <script src="./lib/jq-module/zyupload/zyupload-1.0.0.min.js" charset="utf-8"></script>

form-step.html
第一行
微信图片_20190904215946

缺少文件

image

index.html
108行 修改
image
window.location = 'page/login-1.html';

表格组件的页面自适应

点击展开将左侧菜单缩小之后,右侧的表格组件的大小区域不能立即向右移动,即没有触发resize事件

menuChildOpen这个参数设置了没用

menuChildOpen这个参数设置了没用,下面源码中根本没用到
/**
* 单模块
* @param menuList 菜单数据
* @param menuChildOpen 是否默认展开
*/
renderSingleModule: function (menuList, menuChildOpen) {
menuList = menuList || [];
var leftMenuHtml = '',
childOpenClass = '',
leftMenuCheckDefault = 'layui-this';
var me = this ;
if (menuChildOpen) childOpenClass = ' layui-nav-itemed';
leftMenuHtml = this.renderLeftMenu(menuList) ;
$('.layui-layout-body').addClass('layuimini-single-module'); //单模块标识
$('.layuimini-header-menu').remove();
$('.layuimini-menu-left').html(leftMenuHtml);
element.init();
}

layuimini 国际化

layuimini 可以把JS中用到的中文 提取出来变量 支持国际化文件吗。。。 不然前台国际化太麻烦了

frame窗口动画 pageAnim: false 不起作用

1.frame窗口动画 pageAnim: false 不起作用,我试了多个浏览器 chrome ,火狐,360浏览器,都是不起作用
2.窗口动画 时间太长,用户体验不好,感觉是系加载统太慢

table 支持快捷复制cell 内容

实际场景中,经常复制code值,code 64位比较长,还有链接,不能双击快捷选中,只能选择复制,不太方便,可以提供一个选项,某一列可以复制。鼠标放在当前列的cell时,就弹出一个复制小菜单,鼠标点击以后,复制到剪贴板,鼠标移走,菜单消失。

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.