ASP.NET MVC搭建项目后台UI框架—6、客户保管(添加、修改、查询、分页)

@model Core.Customer.CustomerInfo
@using ProjectBase.Utils
@Html.Raw(ViewBag.Msg)
<div class="areabx clear">
@*    <div class="areabx_header">@ViewBag.Title</div>*@
    <div class="tian_xi">
        @using (Html.BeginForm("AddCustomer", "Customer", FormMethod.Post, new { @clase = "form-inline", @role = "form", name = "from1" }))
        {
            <table width="100%" border="0" cellpadding="0" cellspacing="0">
                <tbody>
                    <tr style="height: 40px;">
                        <td style="width: 120px; text-align: right;">客户代码:</td>
                        <td>
                            @Html.TextBoxFor(x => x.CusCode, new { @class = "trade-timen", @id = "cusCode" })* @Html.ValidationMessageFor(m => m.CusCode)</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">客户名称:</td>
                        <td>
                            @Html.TextBoxFor(x => x.CusName, new { @class = "trade-timen", @id = "cusName" })* @Html.ValidationMessageFor(m => m.CusName)</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">手机:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Phone, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">电话:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Tel, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">邮箱:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Email, new { @class = "trade-timen", @id = "email" })@Html.ValidationMessageFor(m => m.Email)</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">传真:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Fax, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">国家:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Country, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">地址:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Address, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">公司名称:</td>
                        <td>
                            @Html.TextBoxFor(x => x.CompanyName, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">业务类型:</td>
                        <td>
                        @Html.DropDownListFor(x => x.BusssinessType, @Html.EnumToList(typeof(Core.Customer.Busssiness), false), new { @class = "trade-timen", style = "width:180px" })
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">是否启用:</td>
                        <td>是 @Html.RadioButtonFor(x => x.Status, "0", new { Checked = "checked", @name = "status" }) &nbsp;&nbsp;&nbsp;&nbsp;
                            否 @Html.RadioButtonFor(x => x.Status, "1", new { @name = "status" })</td>
                    </tr>
                </tbody>
            </table>
            <input type="submit" value="确定" class="popbtn1 mg">
            <input type="button" value="关闭" class="popbtn3 mg2" onclick="frameElement.api.opener.addDG.close();" />
        }
    </div>
</div>

添加UpdateCustomer视图

查询类CustomerFilter

 public class CustomerController : Controller
    {
 private string message = "<script>frameElement.api.opener.hidePublishWin('{0}', '{1}','{2}'); </script>"; //消息,是否关闭弹出窗,是否停留在当前分页(0,1)

        #region 客户管理主页
        public ActionResult Index()
        {
            return View();
        }

        /// <summary>
        /// 客户列表
        /// </summary>
        /// <param name="filter"></param>
        /// <returns></returns>
        [HttpPost]
        public JsonResult List(CustomerFilter filter)
        {
            filter.PageSize = int.MaxValue;
            var dataSource = CustomerInfo.GetByFilter(filter);

            List<CustomerInfo> queryData = dataSource.ToList();

            var data = queryData.Select(u => new
            {
                ID = u.ID,
                CusCode = u.CusCode,
                CusName = u.CusName,
                BusssinessType = u.BusssinessType.GetDescription(false),
                Balance = u.Balance,
                CreditAmount = u.CreditAmount,
                Status = u.Status.GetDescription(false),
                Country = u.Country,
                CompanyName = u.CompanyName,
                Delivery = GetDeliveryList(u.ExpressCurInfoBy)

            });

            //构造成Json的格式传递
            var result = new { iTotalRecords = queryData.Count, iTotalDisplayRecords = 10, data = data };
            return Json(result, JsonRequestBehavior.AllowGet);
        }
        #region 添加客户
        /// <summary>
        /// 添加客户
        /// </summary>
        /// <param name="id"></param>
        /// <returns></returns>
        public ActionResult AddCustomer()
        {
            ViewBag.Title = "添加客户";
            return View();
        }

        /// <summary>
        /// 添加客户
        /// </summary>
        /// <param name="info"></param>
        /// <returns></returns>
        [HttpPost]
        public ActionResult AddCustomer(CustomerInfo info)
        {
            string msg = string.Empty;
            if (ModelState.IsValid)
            {
                try
                {
                    info.Save();
                    msg = "添加客户成功。";
                }
                catch (Exception ex)
                {
                    msg = "添加客户失败!" + ex.Message;
                    ViewBag.Msg = string.Format(message, msg, false,"0");
                }
                ViewBag.Msg = string.Format(message, msg, true,"0");
            }
            return View();
        }
        #endregion

        #region 修改客户
        /// <summary>
        /// 修改客户
        /// </summary>
        /// <param name="id"></param>
        /// <returns></returns>
        public ActionResult UpdateCustomer(int id)
        {
            ViewBag.Title = "修改客户";
            var result = CustomerInfo.Load(id);

            return View(result);
        }

        /// <summary>
        /// 修改客户
        /// </summary>
        /// <param name="info"></param>
        /// <returns></returns>
        [HttpPost]
        public ActionResult UpdateCustomer(CustomerInfo info)
        {
            string msg = string.Empty;
            if (ModelState.IsValid)
            {
                try
                {
                    info.Update();
                    msg = "修改客户成功。";
                }
                catch (Exception ex)
                {
                    msg = "修改客户失败!" + ex.Message;
                    ViewBag.Msg = string.Format(message, msg, false,"1");
                }
                ViewBag.Msg = string.Format(message, msg, true,"1");
            }
            return View();
        }
        #endregion
    }

PHP 1PHP 2

添加视图Index

目录

PHP 3PHP 4

View Code

PHP 5PHP 6PHP 7

    public class CustomerFilter : ParameterFilter
    {
        /// <summary>
        /// 客户代码
        /// </summary>
        public virtual string CusCode { get; set; }
        /// <summary>
        /// 客户名称
        /// </summary>
        public virtual string CusName { get; set; }

        /// <summary>
        /// 生产NHQL查询语句
        /// </summary>
        /// <returns></returns>
        public override string ToHql()
        {
            string hql = "";
            if (!string.IsNullOrEmpty(CusCode))
            {
                hql += " and Cus_Code =:CusCode ";
            }
            if (!string.IsNullOrEmpty(CusName))
            {
                hql += " and Cus_Name =:CusName ";
            }

            return hql;
        }

        /// <summary>
        /// 构造查询参数
        /// </summary>
        /// <returns></returns>
        public override Dictionary<string, object> GetParameters()
        {
            var result = new Dictionary<string, object>();
            if (!string.IsNullOrEmpty(CusCode))
            {
                result["CusCode"] = CusCode.Trim();
            }
            if (!string.IsNullOrEmpty(CusName))
            {
                result["CusName"] = CusName.Trim();
            }
            return result;
        }
    }
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using ProjectBase.Utils.Entities;

namespace ProjectBase.Data
{
    public abstract class ParameterFilter
    {
        public ParameterFilter()
        {
            HasQueryString = false;
            PageSize = 10;
        }

        public string OrderBy { get;set; }

        public abstract string ToHql();

        public override string ToString()
        {
            return ToHql();
        }

        public abstract Dictionary<string, object> GetParameters();

        public string GetOrderString()
        {
            if (OrderBy.HasValue())
                return " Order By " + OrderBy;
            return String.Empty;
        }

        protected string GetLike(string value)
        {
            return "%" + value + "%";
        }

        public int PageIndex { get; set; }

        public int PageSize { get; set; }

        /// <summary>
        /// 标识此构造器是包含全部查询语句。
        /// 若为 False,则ToHql() 只需要构造条件查询,系统会自动在前面加上<code>" from " + typeof(T).Name + " a where 1=1 "</code>
        /// 若为 True, ToHql() 需要返回 连form在类的完整Hql语句
        /// </summary>
        public bool HasQueryString { get; set; }

        protected static bool HasValue(string str)
        {
            return str.HasValue();
        }

        public static bool HasValue<T>(System.Nullable<T> value) where T:struct
        {
            return value.HasValue;
        }       

    }
}

此处,作者将添加和修改用了八个差别的视图,当然也得以把添加和改动放到同2个视图中,不过要写一些业务逻辑代码来区分当前调用的是修改如故增进,依照添加和修改的不一致,而对界面进行分化的操作。

添加AddCustomer视图,此前集团ASP.NET
MVC的种类没有启用模型验证,界面验证代码都以友好js写的,小编晕,那用ASP.NET
MVC干嘛呢?使用框架就是要丰富发挥框架杰出的机能,尽大概快捷便捷的费用,并缩减开发人士的代码量。

PHP 8PHP 9

随即在此以前未写完的继续,本篇,作者将助教在此UI框架中和ASP.NET
MVC4展开重组开发。效果如下:

PHP 10PHP 11

View Code

View Code

@model Core.Customer.CustomerInfo
@using ProjectBase.Utils
@Html.Raw(ViewBag.Msg)
<div class="areabx clear">
@*    <div class="areabx_header">@ViewBag.Title</div>*@
    <div class="tian_xi">
        @using (Html.BeginForm("UpdateCustomer", "Customer", FormMethod.Post, new { @clase = "form-inline", @role = "form", name = "from1" }))
        {
            <table width="100%" border="0" cellpadding="0" cellspacing="0">
                <tbody>
                    <tr style="height: 40px;">
                        <td style="width: 120px; text-align: right;">客户代码:</td>
                        <td>
                            @Html.TextBoxFor(x => x.CusCode, new { @class = "trade-timen", @id = "cusCode", @readOnly = "readOnly" })* @Html.ValidationMessageFor(m => m.CusCode)</td>
                        @Html.HiddenFor(x => x.ID)
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">客户名称:</td>
                        <td>
                            @Html.TextBoxFor(x => x.CusName, new { @class = "trade-timen", @id = "cusName" })* @Html.ValidationMessageFor(m => m.CusName)</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">手机:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Phone, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">电话:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Tel, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">邮箱:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Email, new { @class = "trade-timen", @id = "email" }) @Html.ValidationMessageFor(m => m.Email)</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">传真:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Fax, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">国家:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Country, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">地址:</td>
                        <td>
                            @Html.TextBoxFor(x => x.Address, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">公司名称:</td>
                        <td>
                            @Html.TextBoxFor(x => x.CompanyName, new { @class = "trade-timen" })</td>
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">业务类型:</td>
                        <td>
                        @Html.DropDownListFor(x => x.BusssinessType, @Html.EnumToList(typeof(Core.Customer.Busssiness), false), new { @class = "trade-timen", style = "width:180px" })
                    </tr>
                    <tr style="height: 40px;">
                        <td align="right">是否启用:</td>
                        <td>是 @Html.RadioButtonFor(x => x.Status, "0", new { Checked = "checked", @name = "status" }) &nbsp;&nbsp;&nbsp;&nbsp;
                            否 @Html.RadioButtonFor(x => x.Status, "1", new { @name = "status" })</td>
                    </tr>
                </tbody>
            </table>
            <input type="submit" value="确定" class="popbtn1 mg">
            <input type="button" value="关闭" class="popbtn3 mg2" onclick="frameElement.api.opener.updateDG.close();" />
        }
    </div>
</div>

PHP 12PHP 13

  1. ASP.NET
    MVC搭建项目后台UI框架—1、后台主框架
  2. PHP,ASP.NET
    MVC搭建项目后台UI框架—二,菜单特效
  3. ASP.NET
    MVC搭建项目后台UI框架—三,面板折叠和展开
  4. ASP.NET
    MVC搭建项目后台UI框架—四,tab多页签协助
  5. ASP.NET
    MVC搭建项目后台UI框架—伍,Demo演示Controller和View的互动
  6. ASP.NET
    MVC搭建项目后台UI框架—六,客户保管(添加、修改、查询、分页)
  7. ASP.NET
    MVC搭建项目后台UI框架—柒,计算报表
  8. ASP.NET
    MVC搭建项目后台UI框架—八,将View中精选的数目行中的片段数据传入到Controller中
  9. ASP.NET
    MVC搭建项目后台UI框架—九,服务器端排序

View Code

客户实体CustomerInfo

PHP 14PHP 15

@{
    ViewBag.Title = "客户信息";
}
<link href="~/libs/DataTables-1.10.6/media/css/jquery.dataTablesNew.css" rel="stylesheet" />
<script src="~/libs/DataTables-1.10.6/media/js/jquery.dataTables.min.js"></script>
<script src="~/Scripts/DataTablesExt.js"></script>
<script type="text/javascript">
    //弹出框  
    var addDG, updateDG, matchDG;
    var w = 424, h = 520; //宽,高
    //添加记录
    function showPublishWin() {
        addDG = new $.dialog({
            id: "AddChannel",
            title: "添加客户",
            content: "url:/Customer/AddCustomer",
            width: w,
            height: h,
            max: false,
            min: false,
            lock: true,
            close: true,
            btnBar: false
        });
        addDG.show();
    }
    //修改记录
    function modifyRecord(id) {
        updateDG = new $.dialog({
            id: "UpdateCustomer",
            title: "修改客户",
            content: "url:/Customer/UpdateCustomer/" + id,
            width: w,
            height: h,
            max: false,
            min: false,
            lock: true,
            close: true,
            btnBar: false
        });
        updateDG.show();
    }
    //隐藏弹出框
    function hidePublishWin(msg, result, isStay) {
        var icon = "success.gif";
        if (result == "False") {
            icon = "error.gif";
        }
        $.dialog({
            title: "提示",
            icon: icon,
            titleIcon: 'lhgcore.gif',
            content: msg,
            lock: true,
            ok: true
        });
        if (result != "False") {
            if (addDG) {
                addDG.close();
            }
            if (updateDG) {
                updateDG.close();
            }
            if (matchDG) {
                matchDG.close();
            }
            if (isStay == 0) {
                reloadList();
            }
            else {
                reloadListNew();
            }
        }
    }
    function matchDelivery(id) {
        matchDG = new $.dialog({
            id: "UpdateCustomer",
            title: "客户匹配",
            content: "url:/Customer/DeliveryMatching/" + id,
            width: 800,
            height: h,
            max: false,
            min: false,
            lock: true,
            close: true,
            btnBar: false
        });
        matchDG.show();
    }
    //刷新,但是停留在当前分页
    function reloadListNew() {
        var tables = $('#table_local').dataTable().api();//获取DataTables的Api,详见 http://www.datatables.net/reference/api/
        tables.ajax.reload(null,false);
    }
</script>
<script type="text/javascript">
    $(function () {
        var h = $(document).height() - 258;
        var table = $("#table_local").dataTable({
            bProcessing: true,
            "scrollY": h,
            "scrollCollapse": "true",
            "dom": 'ftr<"bottom"lip><"clear">',
            "bServerSide": false,                    //指定从服务器端获取数据  
            sServerMethod: "POST",
            sAjaxSource: "@Url.Action("List", "Customer")",
            "fnServerParams": function (aoData) {  //查询条件
                aoData.push(
                    { "name": "CusCode", "value": $("#CusCode").val() },
                    { "name": "CusName", "value": $("#CusName").val() }
                    );
            },
            columns: [{ title: "1", "visible": false, "data": "ID" },
               { "data": "CusCode", title: "客户代码" },
               { "data": "CusName", title: "客户名称" },
               { "data": "BusssinessType", title: "业务类型", width: "100" },
               { "data": "Country", title: "国家", width: "200" },
               { "data": "CompanyName", title: "公司名称", width: "200" },
               { "data": "Delivery", title: "收货商", width: "150" },
               { "data": "Balance", title: "账户余额", width: "150" },
               { "data": "CreditAmount", title: "信用额度", width: "150" },
               { "data": "Status", title: "是否启用", width: "100" },
               {
                   "data": "ID", orderable: false, title: "操作", width: "140", "render": function (data, type, row, meta) { //自定义列
                       var re = "<div style='text-align:center'><a style='visibility:visible' onclick='modifyRecord(" + data + ")'>修改</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";
                       re = re + "<a style='visibility:visible' onclick='matchDelivery(" + data + ")'>匹配</a></div>";
                       return re;
                   }
               }
            ],
            paging: true,//分页
            ordering: true,//是否启用排序
            searching: true,//搜索
            language: {
                "sProcessing": "处理中...",
                lengthMenu: '每页显示:<select class="form-control input-xsmall">' + '<option value="5">5</option>' + '<option value="10">10</option>' + '<option value="15">15</option>'
                    + '<option value="20">20</option>' + '<option value="25">25</option>' + '<option value="30">30</option>' + '<option value="35">35</option>' + '<option value="40">40</option>',//左上角的分页大小显示。
                search: '搜索:',//右上角的搜索文本,可以写html标签

                paginate: {//分页的样式内容。
                    previous: "上一页",
                    next: "下一页",
                    first: "",
                    last: ""
                },

                zeroRecords: "暂无记录",//table tbody内容为空时,tbody的内容。
                //下面三者构成了总体的左下角的内容。
                info: "总共 (_PAGES_) 页,显示 _START_ -- _END_ ,共 (_TOTAL_) 条",//左下角的信息显示,大写的词为关键字。初始_MAX_ 条 
                infoEmpty: "0条记录",//筛选为空时左下角的显示。
                infoFiltered: ""//筛选之后的左下角筛选提示,
            },
            pagingType: "full_numbers"//分页样式的类型

        });
        //设置选中行样式
        $('#table_local tbody').on('click', 'tr', function () {
            if ($(this).hasClass('selected')) {
                $(this).removeClass('selected');
            }
            else {
                table.$('tr.selected').removeClass('selected');
                $(this).addClass('selected');
            }
        });
    });
    //查询 刷新
    function reloadList() {
        var tables = $('#table_local').dataTable().api();//获取DataTables的Api,详见 http://www.datatables.net/reference/api/
        tables.ajax.reload();
    }
</script>
<div class="areabx clear">
    @using (Html.BeginForm("List", null, FormMethod.Get, new { @clase = "form-inline", @role = "form" }))
    {
        <div class="areabx_header">客户信息</div>
        <ul class="formod mgt10">
            <li>客户代码:@Html.TextBox("CusCode", "", new { @class = "trade-time wid153" })</li>
            <li>客户名称:@Html.TextBox("CusName", "", new { @class = "trade-time" })</li>
            <li></li>
        </ul>
        <div class="botbtbx pdb0" style="margin-bottom: -30px;">
            <input type="button" value="添加客户" class="btn btn-primary" onclick="showPublishWin()" />
            <input type="button" value="查询" onclick="reloadList();" class="btn btn-primary">
        </div>
    }
    <div class="tob_box mgt15">
        <table id="table_local" class="display" cellspacing="0" cellpadding="0" border="0" style="width: 100%">
        </table>
    </div>
</div>

添加控制器Customer,关于立异操作,笔者就只可以想吐槽一下NHibernate,他妹的,每回都要先load五次,然后再Update()一遍,倘诺您一直save,它就把你表中有,然则界面上从未有过传过来的值全部翻新为null了,相比之下EF就好多了。

    /// <summary>
    /// 客户信息
    /// </summary>
    public class CustomerInfo //: DomainObject<CustomerInfo, int, ICustomerInfoRepository>
    {
        #region property
        /// <summary>
        /// 客户代码
        /// </summary>
        [Required(ErrorMessage = "客户代码不能为空!")]
        [StringLength(30, MinimumLength = 0, ErrorMessage = "客户代码最大长度为30个字符")]
        public virtual string CusCode { get; set; }
        /// <summary>
        /// 客户名称
        /// </summary>
        [Required(ErrorMessage = "客户名称不能为空!")]
        [StringLength(30, MinimumLength = 0, ErrorMessage = "客户名称最大长度为30个字符")]
        public virtual string CusName { get; set; }
        /// <summary>
        /// 客户业务类型
        /// </summary>
        public virtual Busssiness BusssinessType { get; set; }
        /// <summary>
        /// 手机
        /// </summary>
        public virtual string Phone { get; set; }
        /// <summary>
        /// 电话
        /// </summary>
        public virtual string Tel { get; set; }
        /// <summary>
        /// 邮箱
        /// </summary>
        [RegularExpression(@"^(\w)+(\.\w+)*@(\w)+((\.\w+)+)$", ErrorMessage="邮箱格式不正确!")]
        public virtual string Email { get; set; }
        /// <summary>
        /// 传真
        /// </summary>
        public virtual string Fax { get; set; }
        /// <summary>
        /// 国家
        /// </summary>
        public virtual string Country { get; set; }
        /// <summary>
        /// 地址
        /// </summary>
        public virtual string Address { get; set; }
        /// <summary>
        /// 公司名称
        /// </summary>
        public virtual string CompanyName { get; set; }
        /// <summary>
        /// 金额
        /// </summary>
        public virtual decimal Balance { get; set; }
        /// <summary>
        /// 信用额度
        /// </summary>
        public virtual decimal CreditAmount { get; set; }
        /// <summary>
        /// 状态
        /// </summary>
        public virtual CustomerStatus Status { get; set; }
        /// <summary>
        /// 快件收货商信息
        /// </summary>
        public virtual IList<ExpressCurInfo> ExpressCurInfoBy { get; set; }
        #endregion

        #region common method
        /// <summary>
        /// 分页获取数据
        /// </summary>
        /// <param name="filter"></param>
        /// <returns></returns>
        public static IPageOfList<CustomerInfo> GetByFilter(CustomerFilter filter)
        {
            return Dao.GetByFilter(filter);
        }
        #endregion
    }

在那边,作者只演示了控制器和视图的并行,至于Hhibernate和Unity等数码的操作,那里暂时不讲,因为您也得以采用任何的O揽胜极光M框架和IOC框架,诸如EF、AutoFac等等。这里根本讲解jquery
datatables和ASP.NET
MVC的重组使用,但是此地只演示了客户端分页排序,前边作者会讲服务器分页排序。我发觉,网上都并未ASP.NET
MVC和Datatables结合的完整的服务器分页、排序的Demo,只见到PHP的。于是本身不住的尝尝,只要武术深铁杵磨成针,终于试验成功了,前面我会为我们讲述完成格局。

View Code

View Code

相关文章