2.11 实现登录

本节将以MVC的相关知识来实现“物流管理系统”的登录功能,包括模型创建、视图呈现及控制器的实现等。

1.模型

为方便“物流管理系统”项目的开发管理和架构的需要,将MVC中的Model独立成一个项目(项目名称为ZDSoft.LMS.Domain),所以将登录功能的模型定义在该项目中的User.cs文件中,代码如下:

        public class User
        {
            ///<summary>
            ///ID
            ///</summary>
            [Display(AutoGenerateField =false)]
            public int ID { get; set; }

            ///<summary>
            ///用户名
            ///</summary>
            [Property(NotNull =true, Length =20)]
            [Required(ErrorMessage ="不能为空")]
            [StringLength(20, ErrorMessage ="不能超过20个字符")]
            [Display(Name ="用户名")]
            public string UserName { get; set; }

            ///<summary>
            ///账户名
            ///</summary>
            [Property(NotNull =true, Length =50)]
            [Required(ErrorMessage ="不能为空")]
            [StringLength(20, ErrorMessage ="不能超过50个字符")]
            [Display(Name ="账号")]
            public string Account { get; set; }

            ///<summary>
            ///密码
            ///</summary>
            [Property(NotNull =true, Length =50)]
            [Display(Name ="密码")]
            public string Password { get; set; }

            ///<summary>
            ///是否激活,默认应该为true
            ///</summary>
            [Property(NotNull =true)]
            [Required]
            [Display(Name ="激活")]
            public bool IsActive { get; set; }
        }

以上模型代码中,定义了模型的类名为User,包括了ID、UserName、Account、Password、IsActive等5个属性。每个属性都通过元数据验证方式(如Property、Required、Display)进行了修饰。

2.控制器

登录功能的控制器定义在ZDSoft.LMS.Web项目中Controllers目录下的UserController.cs文件中,代码如下:

        using System;
        using System.Collections.Generic;
        using System.Linq;
        using System.Web;
        using System.Web.Mvc;
        using ZDSoft.LMS.Core;
        using ZDSoft.LMS.Service;
        using System.Web.UI;
        using ZDSoft.LMS.Web.Apps;
        using NHibernate.Criterion;
        using ZDSoft.LMS.Domain;
        using ZDSoft.LMS.Component;

        namespace ZDSoft.LMS.Web.Controllers
        {
            public class UserController : Controller
            {
                [HttpGet]
                public ViewResult Login()
                {
                    //实例化模型对象
                    User model =new User();
                    //将模型交给视图Login去处理
                    return View(model);
                }

                [HttpPost]
                public ActionResult Login(User model)
                {
                    //登录逻辑处理(略)

                    //跳转到系统的主页面
                    return RedirectToAction("Index", "Home");
                }
            }
        }

以上控制器代码中第一个Login方法用于处理Get请求,使用了[HttpGet]请求特性加以修饰,并在方法体中将实例化后的模型对象交给Login视图处理。

第二个Login方法用于处理视图的Post请求,使用了[HttpPost]请求特性加以修饰,该方法的参数为引用类型的User模型类,它会根据模型绑定的原理自动获取来自视图的参数。

3.视图

呈现登录功能的视图Login.cshtml文件定义在ZDSoft.LMS.Web项目中的View\User目录下,视图代码如下:

        @model ZDSoft.LMS.Domain.User
        @{
            Layout =null;              //不引用布局页
        }
        <html>
        <head>
            <title>物流业务支撑系统 -重庆广展物流有限公司</title>
            <link href="@Url.Content("~/Content/Site.css")"rel="stylesheet"type=
            "text/css" />
            <link href="@Url.Content("~/Content/Style/Login.css")"rel="stylesheet"
            type="text/css" />
            <script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type=
            "text/javascript"></script>
            <script src="@Url.Content("~/Scripts/JQuery.unobtrusive-ajax.min.js")"
            type="text/javascript"></script>
            <script src="@Url.Content("~/Scripts/jquery.simplemodal.1.4.1.min.js")"
            type="text/javascript"></script>
        </head>
        <body>
            <center>
                <div class="divMain">
                    <div>
                        <img src="@Url.Content("~/Content/Images/Login/Logo.jpg")"
                        alt="" />
                          <img src="@Url.Content("~/Content/Images/Login/SystemLogo.
                          jpg")"
                          alt="" /></div>
                    <div>
                        <img src="@Url.Content("~/Content/Images/Login/l_03.jpg")"
                        alt="" />
                        <img src="@Url.Content("~/Content/Images/Login/l_04.jpg")"
                        alt="" /></div>
                    <div class="divLoginArea">
                        <div class="divMain000">
                            <object codebase="http://download.macromedia.com/pub/
                            shockwave/cabs/flash/swflash.cab#version=6,0,29,0"
                                height="120" width="120" classid="clsid:D27CDB6E-
                                AE6D-11cf-96B8-444553540000">
                                <param name="Movie" value="@Url.Content("~/Content/
                                Images/Login/star.swf")"/>
                                <param name="Src" value="@Url.Content("~/Content/
                                Images/Login/star.swf")"/>
                                <param name="WMode" value="Transparent" />
                                <embed src="@Url.Content("~/Content/Image/Login/
                                star.swf")" width="120" height="120" quality="high"
                                pluginspage="http://www.macromedia.com/go/
                                getflashplayer"
                                type="application/x-shockwave-flash" wmode=
                                "transparent" />
                            </object>
                        </div>
                        <div class="divAccount">
                            <div class="divInput">
                            @using(Html.BeginForm())
                            {
                                <div class="divLoginLine">
                                  <span>用户名:
                                  </span>@Html.TextBoxFor(model=>model.Account)
                                  <br />
                                  </div>
                                  <div class="divLoginLine">
                                      <span>密        码:
                                          </span>@Html.PasswordFor(model=>model.
                                          Password)
                                  </div>
                                  <div class="divButton divLoginLine">
                                      <div id="divAjax">
                                          <input type="submit" id="btnLogin"
                                              class="btn3" value="登录" />
                                      </div>
                                      <div id="lblError" class="divNotice">
                                      </div>
                                  </div>
                              }
                          </div>
                      </div>
                      <div class="divPassword">
                      </div>
                  </div>
                  <div class="divBottom">
                      <div class="divWords">
                        Copyright (c) 2016-2020重庆广展物流有限公司
                            All Rights Reserved.
                      </div>
                  </div>
              </div>
            </center>
        </body>
        </html>

以上代码为强类型视图,接收的模型类型为ZDSoft.LMS.Domain.User,使用了using(Html.BeginForm()){}方法定义了表单,并使用了HTML帮助器。

        Html.TextBoxFor(model=>model.Account)
        Html.PasswordFor(model=>model.Password))

以上代码分别与模型绑定了Account和Password两个属性。

4.运行结果

通过以上3个步骤实现了登录功能的展示,有关登录功能的验证与实现将在后面的章节中做补充介绍。在ZDSoft.LMS.Web项目属性的Web选项页中,选择启动操作为特定页,并设置值为User/Login。选择VisualStudio2013工具栏中的启动调试功能,程序运行结果如图2-24所示。

图2-24 登录功能