EasyUi – 2.布局Layout + 3.登录界面
1.页面布局
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="index.aspx.cs" Inherits="Easyui.Web.index" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>XX科技 - 监控</title>
<script src="Scripts/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script>
<script src="Scripts/jquery-easyui-1.3.2/jquery.easyui.min.js"></script>
<link href="Scripts/jquery-easyui-1.3.2/themes/default/easyui.css" rel="stylesheet">
<link href="Scripts/jquery-easyui-1.3.2/themes/icon.css" rel="stylesheet" />
<script src="Scripts/jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js"></script> <style>
.nav-item
{
text-align: center;
} .nav-item a
{
color: #000;
text-decoration: none;
}
/*菜单js打开tab出现的滚动条隐藏*/
.panel-body-noborder
{
overflow: hidden;
}
</style> <script type="text/javascript">
$(function () { }) function addTab(title, href) {
var tt = $('#main-center');
if (tt.tabs('exists', title)) {
tt.tabs('select', title);
} else {
if (href) {
var content = '<iframe scrolling="yes" frameborder="0" src="' + href + '" style="width:100%;height:100%;"></iframe>';
} else {
var content = '未实现';
}
tt.tabs('add', {
title: title,
closable: true,
content: content
});
}
}
</script>
</head>
<body id="cc" class="easyui-layout">
<div data-options="region:'north',split:true" style="height: 50px; background-color: gray"></div>
<div data-options="region:'west',title:'导航菜单',split:true" style="width: 150px;">
<div id="aa" class="easyui-accordion" fit="true" style="height: auto;">
<div title="设备监控" data-options="iconCls:'icon-save'" style="overflow: auto; padding: 10px;">
<div class="nav-item">
<a href="javascript:addTab('设备申购')">
<img src="data:images/kdmconfig.png"></img><br />
<span>设备申购</span>
</a>
</div>
<div class="nav-item">
<a href="javascript:addTab('设备档案','device/index')">
<img src="data:images/hammer_32.png"></img><br />
<span>设备档案</span>
</a>
</div>
<div class="nav-item">
<a href="javascript:addTab('设备申购')">
<img src="data:images/kdmconfig.png"></img><br />
<span>设备申购</span>
</a>
</div>
</div>
<div title="系统设置" data-options="iconCls:'icon-wrench-screwdriver'" style="padding: 10px;">
<div title="业务操作" selected="true" style="overflow: auto;">
<div class="nav-item">
<a href="javascript:addTab('用户管理','AdminUser/main.html')">
<img src="data:images/32/users_business_32.png"></img><br />
<span>用户管理</span>
</a>
</div>
<div class="nav-item">
<a href="javascript:addTab('设备申购')">
<img src="data:images/kdmconfig.png"></img><br />
<span>操作日志</span>
</a>
</div>
<div class="nav-item">
<a href="javascript:addTab('设备维修')">
<img src="data:images/package_settings.png"></img><br />
<span>设备维修</span>
</a>
</div>
</div> </div>
</div>
</div>
<div data-options="region:'center'" style="padding: 5px; background: #eee;">
<div id="main-center" class="easyui-tabs" fit="true" border="false">
<div title="首页" style="padding: 20px;">
<img src="data:images/banner.gif"></img>
<div style="margin-top: 20px;">
<p>xxxx有限公司。</p>
<p> </p>
<p>监控平台。</p>
<p> </p>
</div>
</div>
</div>
</div>
</body>
</html>
2.登录界面
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>用户登录 - 防盗器监控管理系统</title>
<link href="css/sexybuttons.css" rel="stylesheet" type="text/css" />
<link href="css/mainlogin.css" rel="stylesheet" type="text/css" />
<script src="Scripts/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script>
<script src="Scripts/jquery-easyui-1.3.2/jquery.easyui.min.js"></script>
<link href="Scripts/jquery-easyui-1.3.2/themes/default/easyui.css" rel="stylesheet">
<link href="Scripts/jquery-easyui-1.3.2/themes/icon.css" rel="stylesheet" />
<script src="Scripts/jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js"></script> <script type="text/javascript"> var LoginAndReg; function login() {
var txtUserName = $("#txtUserName");
var txtPassword = $("#txtPassword"); if (txtUserName.val() == "") {
alert("请输入用户名！");
txtUserName.focus();
return false;
} else if (txtPassword.val() == "") {
alert("请输入密码！");
txtPassword.focus();
return false;
} else {
//$("#btnLogin").click(function () {
console.info($("#txtPassword").val());
var user = encodeSTR($("#txtUserName").val());
var pass = encodeSTR($("#txtPassword").val());
$.post(
"Login.ashx",
{ txtUsername: user, txtPass: pass, }, function (e) {
console.info(e);
alert(e);
if (e == "登录成功！") {
window.location.href = "index.aspx";
}
}, "html"
);
//}); }
} function encodeSTR(str) { var t = ""; for (var x = 0; x < str.length; x++) { var a = str.charCodeAt(x); if (x != 0) {
t += '|';
} t += new Number(a).toString(10);
} return t;
} function decodeSTR(str) { var a1 = str.split('|'); for (var x = 0; x < a1.length; x++) {
a1[x] = String.fromCharCode(a1[x]);
} return a1.join('');
} function getsize() {
var windowHeight = 0;
var widowWidth = 0;
if (typeof (window.innerHeight) == 'number') {
windowHeight = window.innerHeight;
widowWidth = window.innerWidth;
}
else {
if (document.documentElement && document.documentElement.clientHeight) {
windowHeight = document.documentElement.clientHeight;
widowWidth = document.documentElement.clientWidth;
}
else {
if (document.body && document.body.clientHeight) {
windowHeight = document.body.clientHeight;
widowWidth = document.body.clientWidth;
}
}
} return { width: widowWidth, height: windowHeight };
} $(function () { $('#btnLogin').click(function () { login(); return false; });
//响应键盘的回车事件
//$(this).keydown(function (event) {
// if (event.keyCode == 13) {
// event.returnValue = false;
// event.cancel = true;
// return login();
// }
//});
//$('#txtorgcode').combobox({
// data:orgdata,valueField:'id',textField:'text',panelHeight:'300',width:160
//})
}) </script>
</head>
<body>
<div id="LoginCircle">
<div id="LoginDoc">
<div id="SysName"></div> <form id="LoginFrom" method="post">
<div id="SysInput">
<!--<ul>
<li>单位代码：</li>
<li>
<input id="txtorgcode" name="orgcode" value="" type="text" class="InputStyle" maxlength="18" /></li>
</ul>-->
<ul>
<li>用户名：</li>
<li>
<input id="txtUserName" name="username" value="" type="text" class="InputStyle" maxlength="18" /></li>
</ul>
<ul>
<li>密 码：</li>
<li>
<input name="password" type="pass" class="InputStyle" value="" id="txtPassword" /></li>
</ul>
<ul>
<li> </li>
</ul>
<ul>
<li></li>
<li>
<div style="width: 170px; text-align: left">
<button class="sexybutton" id="btnLogin"><span><span><span class="usergo">登录</span></span></span></button>
<button class="sexybutton" type="reset"><span><span><span class="reload">重置</span></span></span></button>
</div>
</li> </ul>
</div>
</form>
<div class="clear">
</div>
</div>
</div>
<div id="Copy">
<font color="red">防盗器监控管理系统</font> Version 1.0 由XX科技提供技术支持！
<br />
</div>
</body>
</html>
一般处理程序
Login.ashx
using System;
using System.Collections.Generic;
using System.Data;
using System.Data.Common;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.SessionState;
using Easyui.Common;
using Easyui.Common.DEncrypt; namespace Easyui.Web
{ //<summary>
//Login 的摘要说明
//</summary>
public class Login : IHttpHandler
{
HttpRequest Request;
HttpResponse Response;
HttpSessionState Session;
HttpServerUtility Server;
HttpCookie Cookie;
public void ProcessRequest(HttpContext context)
{
context.Response.Buffer = true;
context.Response.ExpiresAbsolute = DateTime.Now.AddDays(-);
context.Response.AddHeader("pragma", "no-cache");
context.Response.AddHeader("cache-control", "");
context.Response.CacheControl = "no-cache";
context.Response.ContentType = "text/plain";
Request = context.Request;
Response = context.Response;
Session = context.Session;
Server = context.Server; //string userName = PageValidate.InputText(decodeSTR(Request["txtUsername"].ToString()), 30);
//string Password = PageValidate.InputText(decodeSTR(Request["txtPassword"].ToString()), 30);
string userName = Request["txtUsername"].ToString();
string Password = Request["txtPass"].ToString(); Easyui.BLL.TUser person = new Easyui.BLL.TUser();
DESEncrypt encrypt = new DESEncrypt(); //userName = encrypt.Encrypto(userName);
//Password = encrypt.Encrypto(Password); bool checkPass = person.UserCheckIn11(decodeSTR(userName.ToString()), decodeSTR(Password.ToString())); if (!checkPass)
{ Response.Write("登陆失败！");
}
else
{
//person.UserHistoryAdd(userName);
//Session["userName"] = userName;
//person.Log("登录成功！");
//this.Response.Redirect("index.aspx");
Response.Write("登录成功！");
} } public bool IsReusable
{
get
{
return false;
}
} private string decodeSTR(string str)
{ string[] str1 = str.Split('|'); string str2 = null; foreach (var item in str1)
{ str2 += (char)int.Parse(item); } return str2; }
public string encode(string str)
{
var t = ""; for (var x = ; x < str.Length; x++)
{ var a = Convert.ToByte(str[x]); if (x != )
{
t += '|';
} t += a;
}
return t;
} ///// <summary>
///// 用户登录 用户登录信息加入
///// </summary>
///// <param name="UserName"></param>
///// <param name="PassWord"></param>
///// <returns></returns>
////public bool UserCheckIn(string UserName, string PassWord)
//{
// DbCommand dbcommand = db.GetStoredProcCommand("Person_UserCheckIn"); // db.AddInParameter(dbcommand, "@UserName", DbType.AnsiString, UserName);
// db.AddInParameter(dbcommand, "@PassWord", DbType.AnsiString, PassWord);
// dbcommand.CommandType = CommandType.StoredProcedure; // SqlDataReader sdr = (SqlDataReader)db.ExecuteReader(dbcommand); // if (sdr.Read())
// {
// if (System.Convert.ToInt32(sdr["rowc"]) > 0)
// {
// HttpContext context = HttpContext.Current;
// context.Session["UserName"] = UserName;
// context.Session["UserClass"] = sdr["Usertype"];
// context.Session["Psn_id"] = sdr["Psn_id"];
// context.Session["Name"] = sdr["Name"];
// context.Session["Depart_id"] = sdr["Depart_id"];
// context.Session["DepartName"] = sdr["DepartName"];
// sdr.Close();
// return true;
// }
// }
// else
// {
// sdr.Close();
// }
// return false;
//} }
}
借用 疯狂秀才 的界面。
EasyUi – 2.布局Layout + 3.登录界面的更多相关文章
- EasyUi – 2.布局Layout + 3.登录界面
1.页面布局 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="index.a ...
- 布局(layout)文件图形界面不能显示：An error has occurred. See error log for more details. java.lang.NullPointe
#问题解析# Android工程中Layout文件夹下的布局文件图形界面无法显示,一般发生这种情况在导入工程操作后极易出现,因为可能eclipse使用的sdk版本不同,target类型不同,所用And ...
- [转]Android：布局实例之模仿QQ登录界面
Android:布局实例之模仿QQ登录界面 预览图: 准备: 1.找到模仿对象 QQ登陆界面UI下载>>>>> 2.导入工程 3.查看布局结构和使用控件 其对应效果图分布 ...
- Android：布局实例之模仿QQ登录界面
预览图: 准备: 1.找到模仿对象 QQ登陆界面UI下载>>>>> 2.导入工程 3.查看布局结构和使用控件 其对应效果图分布为 4.分析样式选择器 下拉箭头2种样式:点 ...
- 前端框架 EasyUI （2）页面布局 Layout
在 Web 程序中,页面布局对应用程序的用户体验至关重要. 在一般的信息管理类的 Web 应用程序中,页面结构通常有一个主工作区,然后在工作区上下左右靠近边界的区域设置一些边栏,用于显示信息或放置一些 ...
- QQ登录界面布局
简单的qq登录界面布局 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmln ...
- 基于easyUI实现登录界面
此文章是基于 EasyUI+Knockout实现经典表单的查看.编辑 一. 准备工作 1. 点击此下载相关文件,并把文件放到 ims 工程对应的文件夹下 二. 相关文件介绍 1. login.jsp: ...
- Android：布局实例之模仿京东登录界面
预览图及布局结构参考: 布局: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout ...
- swing实现QQ登录界面1.0（ 实现了同一张图片只加载一次）、（以及实现简单的布局面板添加背景图片控件的标签控件和添加一个关闭按钮控件）
swing实现QQ登录界面1.0( 实现了同一张图片只加载一次).(以及实现简单的布局面板添加背景图片控件的标签控件和添加一个关闭按钮控件) 代码思路分析: 1.(同一张图片仅仅需要加载一次就够了,下 ...
随机推荐
- Unity3d用户手册用户指南 电影纹理(Movie Texture)
http://www.58player.com/blog-2327-952.html 电影纹理(Movie Texture) 注意:这只是专业/高级功能. 桌面 电影纹理是从视频文件创建的动画纹理 ...
- ionic不同view跳转到同一个
ionic不同view跳转到同一个 view并保留历史的路由设计 上代码:state 里面新加一个状态 .state("other", { url: "/other&qu ...
- PO、VO、DAO、BO、POJO
一.PO :(persistant object ),持久对象 可以看成是与数据库中的表相映射的java对象.使用Hibernate来生成PO是不错的选择.二.VO :(value object) , ...
- django ATOMIC_REQUESTS
在数据库配置中,如果配置了此属性为True,如下: DATABASES = { 'default': { 'ENGINE': 'django.db.backends.xxx', 'NAME': '', ...
- dtw算法
dtw路径与线性变换路径对比 转自:http://baike.baidu.com/link?url=z4gFUEplOyqpgboea6My0mZP ...
- 转：jquery向普通aspx页面发送ajax请求
本文将介绍在ASP.NET中如何方便使用Ajax,第一种当然是使用jQuery的ajax,功能强大而且操作简单方便,第二种是使用.NET封装好的ScriptManager. $.ajax向普通页面发送 ...
- C# 类成员备忘
隐藏基类的方法 调用重写或隐藏的基类方法 嵌套的类型定义 隐藏基类的方法 当从基类继承一个(非抽象)成员时,也就继承了其实现的代码,如果继承的成员是虚拟的,就可以用Overrid重写这段实现代码, 无 ...
- 【leetcode】Regular Expression Matching
Regular Expression Matching Implement regular expression matching with support for '.' and '*'. '.' ...
- IDEA 编译时报错 “未结束的字符串文字” “解析时已经达到文件结尾”
Information:Using javac 1.7.0_75 to compile java sourcesInformation:java: Errors occurred while comp ...
- 4个http常用的content type
转的: http://www.aikaiyuan.com/6324.html HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS.GET.HEAD.POST.PUT.DELETE.TR ...