JFinal-layui-pro专业版

JFinal-layui-pro专业版   

pro专业版和master开原版本的区别主要是前端界面的不同,在原有的基础上修改css,调整首页布局,优化部分功能,打造一款美观、好用、专业的后台管理系统

 JFinal-layui-pro下载地址https://gitee.com/QinHaiSenLin/Jfinal-layui/tree/pro/

 专业版在线演示系统JFinal-layui极速开发企业应用系统    账号:admin/123456


前端代码示例:

1、列表首页代码模板优化,通过代码器一键生成,也便于个性化扩展,快速控制列表工具栏按钮的显示隐藏:

#@layoutT('停车信息')
#define main()
<div class="container-wrap">
   #@formStart()
      #@queryStart('关键词查询')
   <input type="search" name="keyword" autocomplete="off" class="layui-input" placeholder="搜索关键词" style="padding-left:20px"/>
   <i class="layui-icon layui-icon-search" style="position: absolute;top:7px;left:2px"></i>
      #@queryEnd()
   #@formEnd()

   #@table()
</div>
#end

<!-- 自定义表头按钮 -->
#define button()
	<button class="layui-btn layui-btn-normal layui-btn-sm" lay-event="update">
	  <i class="layui-icon">&#xe642;</i> 编辑
	</button>
#end
<!-- 自定义表格行按钮 -->
#define buttonRow()
	<a class="layui-btn layui-btn-xs" lay-event="detail">详情</a>
#end

#define js()
<!-- 分页表格 -->
<script>
	function detailFunc(obj){
		var data=obj.data;
		var id=data.id;
		var url="#(path)/portal/business/car/detail?id="+id;
		openDialog("停车信息详情",url,false,null,null);
	}
    gridArgs.title='停车信息';
    gridArgs.dataId='carId';
    gridArgs.deleteUrl='#(path)/portal/business/car/delete';
    gridArgs.updateUrl='#(path)/portal/business/car/edit/';
    gridArgs.addUrl='#(path)/portal/business/car/add';
    gridArgs.gridDivId ='maingrid';
    initGrid({id : 'maingrid'
        ,elem : '#maingrid'
        ,toolbar:'#table_toolbar'//开启头部工具栏,并为其绑定左侧模板
        /*
        ,defaultToolbar:['filter', 'exports', 'print',{//自定义头部工具栏右侧图标。如无需自定义,去除该参数即可
            title:'提示',layEvent: 'LAYTABLE_TIPS',icon: 'layui-icon-tips'
        }]
        */
        ,cellMinWidth: 100
        ,cols : [ [
				 {title: '主键',field : 'carId',width : 35,checkbox : true},
				 {title:'序号',type:'numbers',width:35},
				 {title:'车牌号',field:'cardNo'},
				 {title:'进场时间',field:'inTime'},
				 {title:'出场时间',field:'outTime'},
				 {title:'进场拍照图片',field:'inPic'},
				 {title:'出场拍照图片',field:'outPic'},
				 {title:'停车费',field:'carFee'},
				 {title:'1:包月,2:临时停车',field:'financeType'},
				 {title:'0:未收费,1已收费,2:免费',field:'status'},
				 {title:'收费员',field:'userName'},
				 {title:'备注',field:'remark'},

            {fixed:'right',width : 180,align : 'left',toolbar : '#bar_maingrid'}
            ] ]
        ,url:"#(path)/portal/business/car/list"
        ,searchForm : 'searchForm'
    },{detail:detailFunc});//绑定自定义按钮事件

</script>
#end

2、界面效果:

image.png

系统截图:

1、登录界面,第一次不显示验证码,输错一次密码,则需要验证码

174600_440635b1_1692092.webp

174703_205ef05a_1692092.webp

2、功能管理

205555_32261dfa_1692092.webp

3、角色管理

205651_fe52e54d_1692092.webp

4、用户管理

205810_3dbc44b1_1692092.webp

5、部门管理

210053_ace40f91_1692092.webp

6、业务字典

210310_7dac4ab5_1692092.webp

7、系统日志

210349_446b56e5_1692092.webp

8、自定义sql

210432_96eaa6a8_1692092.webp

9、报表管理

160913_3f056759_1692092.webp

160958_f6997107_1692092.webp

10、代码生成器

210914_44c91768_1692092.webp160317_55b40123_1692092.webp

160810_05683f52_1692092.webp

11、图表统计

160140_a64d5839_1692092.webp

12、附件上传

160018_b02f38be_1692092.webp

160059_447aacad_1692092.webp

12、可编辑表格

161043_2b869643_1692092.webp

13、联级多选

161123_9f1cb41e_1692092.webp

14、响应式布局展示:

   211404_034d7e13_1692092.webp211445_16e2dfd0_1692092.webp

211616_9bf6a1e5_1692092.webp211652_f0cb6d53_1692092.webp

211941_93cff64b_1692092 (1).webp211941_93cff64b_1692092.webp

212333_7f747c6f_1692092.webp



评论区(1)

不急 2年前

图片都看不到了
顶部 客服 微信二维码 底部
>扫描二维码关注最代码为好友
扫描二维码加琴海森林为好友