LigerUI的系统主界面

LigerUI的系统主界面


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
     String path = request.getContextPath();
     String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
< html  xmlns = "http://www.w3.org/1999/xhtml" >
< head >
     < base  href="<%=basePath%>">
     < script  src="<%=path%>/backui/jquery/jquery-1.3.2.min.js" type="text/javascript"></ script >
     < link  href="<%=path%>/backui/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css"/>
     < script  src="<%=path%>/backui/ligerUI/js/ligerui.all.js" type="text/javascript"></ script >
     < script  src="<%=path%>/backui/json2.js" type="text/javascript"></ script >
     < script  type = "text/javascript" >
         var mytab;
         function addtab(id, atext, aurl) {
             if (!mytab) return;
             mytab.addTabItem({tabid: id, text: atext, url: aurl})
         }
         //        var height = $(".l-layout-center").height();
         $(function () {
             $("#main").ligerLayout({topHeight: 40, leftWidth: 240});
//            alert(height);
//            $("#left").ligerAccordion({height: height});
             var data = [];
             data.push({ id: 1, pid: 0, text: '1' });
             data.push({ id: 2, pid: 1, text: '1.1' });
             data.push({url: 'top.html', id: 4, pid: 2, text: '第一个页面' });
             data.push({url: 'top.html', id: 5, pid: 2, text: '第二个页面' });
             data.push({url: 'http://www.baidu.com', id: 10, pid: 8, text: 'wefwfwfe' })
             var tree1 = $("#tree1").ligerTree({
                 data: data,
                 checkbox: false,
                 slide: false,
                 textFieldName: 'text',
                 idFieldName: 'id',
                 parentIDFieldName: 'pid',
                 onSelect: function (node) {
                     if (!node.data.url) return;
                     var tabid = $(node.target).attr("tabid");
                     if (!tabid) {
                         tabid = new Date().getTime();
                         $(node.target).attr("tabid", tabid)
                     }
                     f_addTab(tabid, node.data.text, node.data.url);
                 }
             });
             mytab = $("#home").ligerTab({
                 width: "100%", height: "100%",
                 showSwitchInTab: true,
                 showSwitch: true,
                 dblClickToClose: true,
                 dragToMove: true,
                 contextmenu: true });
             function f_addTab(tabid, text, url) {
                 mytab.addTabItem({
                     tabid: tabid,
                     text: text,
                     url: url,
                     callback: function () {
//                        addFrameSkinLink(tabid);
                     }
                 });
             }
             function onSelect(note) {
                 alert('onSelect:' + note.data.text);
             }
         })
     </ script >
</ head >
< body  style = "padding:2px; overflow: hidden;" >
< div  id = "main" >
     < div  position = "top" >< h2 >后台管理</ h2 ></ div >
     < div  position = "left" >
         < ul  id = "tree1"  style = "margin-top:3px;" />
     </ div >
     < div  id = "home"  position = "center" >
         < div  tabid = "a1"  title = "首页" >
             < iframe  src = "http://www.baidu.com"  frameborder = "0"  width = "100%" ></ iframe >
         </ div >
     </ div >
</ div >
</ body >
</ html >

wKiom1NoyPDjfa9bAAQ9AaIgzpk219.jpg




本文转自 leizhimin 51CTO博客,原文链接:http://blog.51cto.com/lavasoft/1407359,如需转载请自行联系原作者

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ligerRM V2是基于 ligerui的web应用系统。以权限管理作为设计重点,引入Northwind作为要的数据演示模块。权限方面,在上一个版本的基础上面加多了数据权限控制。后台方面采用dot net 3.5框架开发。 系统演示:http://case.ligerui.com 前台插件:jQuery、jQuery.ligerui、jQuery.form.js、jquery.validation 数据交互:liger.Data(一个小型的ORM组件) 源码下载:ligerRMV2 演示账户: 账户   名字 头衔 密码 test3 录入员1 基础数据录入员1 1 test2 录入员2 客户数据录入员2 1 test1 高级演示账号1 高级演示账号1 1 test4 订单查看员1 订单查看员1 - Sales Representative 1 test5 供应商1 供应商1 - Exotic Liquids44 1 系统特色 1,不采用code-behind机制,不使用任何服务器控件,全面将工作放在前台实现,后台只处理数据部分。页面还是用aspx后缀,继承于统一的页面基类(为了方便权限的控制)。 2, 极大得避免代码冗余。无论是列表页面还是明细页面,你看到的代码都是极其简洁的,就算是表单,甚至不需要任何的html代码,而是定义【有用的信息】,对【布局】、【数据】有用的 【数据结构】,当然表格、搜索框 都是如此。 3,统一的数据提交/接收接口,所有的数据请求通过ajax实现,经过 handler/*.ashx处理,针对前台数据请求类型的不同,一共有6个: ajax.ashx ---- 通用的数据请求入口(表单提交入口、表单加载入口、常用的数据加载入口等等) grid.ashx ---- 通用的ligerGrid表格数据加载入口 treegrid.ashx ---- 通用的ligerGrid表格树格式数据加载入口 tree.ashx ---- 通用的ligerTree树格式数据加载入口 select.ashx ---- 通用的ligerComboBox数据加载入口 validate.ashx ---- 通用的验证数据验证入口(针对jQuery.validation remote验证) 4,完善的数据权限控制机制。除了基本的 (用户角色) => (模块功能) 这类的功能权限控制,还在数据请求入口做了一点小动作,根据【当前的用户信息】和【配置好的数据权限规则】筛选过滤数据。 5,自动的搜索框、自动的表单。 表单和搜索框不再需要一堆复杂冗余的html,而是定义好字段的信息(字段名、宽度、类型等)就可以自动完成页面的构造。 6,自动的表格,同样地表格也只是需要一些配置信息,就可以自动完成。并利用过滤器插件,拥有高级自定义查询功能,和历史查询功能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值