Layui项目实战

使用语言：C#，Js，Html
使用框架：MVC，Layui
使用插件：JQuery，Layui

一.Layui父窗体前端代码：

1.Html代码：

    

        


            

                

                    

                        

                            
                                刷新
                            
                            
                                增加
                            
                        
                    
                


                

                    
列表标题
                    

                        
                    
                



            

        
    

2.Js代码：

申明Layui公共变量：

二.C#后台代码：

注意：业务逻辑层代码不予展示，请根据自己的业务去写。

父窗体界面：

/// 

    /// 解锁配置界面
    /// 
    /// 
    public ActionResult Unlockconf()
    {
        return View();
    }

子窗体界面（增加|修改）：

    /// 

    /// 增加|修改 解锁配置界面 
    /// 
    /// 
    public ActionResult UnlockconfInfo(string ID, string country, string sex, string num, string fee, string state, string operatorId)
    {
        ViewBag.ID = ID;
        ViewBag.Country = country;
        ViewBag.Sex = sex;
        ViewBag.Num = num;
        ViewBag.Fee = fee;
        ViewBag.State = state;
        ViewBag.OperatorId = operatorId;
        return View();
    }

搜索方法，绑定列表：

    /// 

    /// 解锁配置列表
    /// 
    /// 
    /// 
    public ActionResult GetUnlockconfList(string userId, GridPager d)
    {
        int total = 0;
        var list = new LiveProider().GetUnlockconfList(userId);

        if (list != null)
        {
            if (list.Count > 0)
            {
                total = list.Count;
                list = list.OrderByDescending(t=>t.Time).Skip((d.page - 1) * d.limit).Take(d.limit).ToList();
            }
        }

        return Json(new
        {
            code = 0,
            msg = "",
            count = total,
            data = list
        }, JsonRequestBehavior.AllowGet);
    }

增加方法：

    /// 

    /// 添加附近解锁设置
    /// 
    /// 
    /// 
    /// 
    /// 
    /// 
    /// 
    /// 
    /// 
    public ActionResult AddUnlocknearby(string country, string sex, string num, string fee, string state,  string operatorId)
    {
        var res = new LiveProider().AddUnlocknearby(country, sex, num, fee, state, operatorId);
        return Json(res);
    }

修改方法：

    /// 

    /// 修改附近解锁设置
    /// 
    /// 
    /// 
    /// 
    /// 
    /// 
    /// 
    /// 
    /// 
    public ActionResult EditUnlocknearby(string ID, string country, string sex, string num, string fee, string state, string operatorId)
    {
        var res = new LiveProider().EditUnlocknearby(ID, country, sex, num, fee, state,operatorId);
        return Json(res);
    }

删除方法：

    /// 

    /// 删除附近解锁设置
    /// 
    /// 
    /// 
    /// 
    public ActionResult DelUnlocknearby(string ID, string operatorId)
    {
        var res = new LiveProider().DelUnlocknearby(ID, operatorId);
        return Json(res);
    }

三.子窗体前端代码：

1.Html代码：

@{
Layout = null;
}













    

        

            

                
ID：
                
 
            
            

                
国家：
                

                    

                        
                            全部
                            中国
                            俄罗斯
                            越南
                            其他
                        
                    
                
            
            

                
性别：
                

                    


                        
                            全部
                            男
                            女
                        
                    
                
            
            

                
解锁数量：
                

            
            

                
价格/h币：
                

            

            

                
状态：
                

                    

                        
                            关闭
                            开启
                        
                    
                
            
            

                
操作人：
                

            
            

                

                    
                
            
        

    
、

2.Js代码：

Load方法，窗体加载：

四.扩展：

Js时间戳与日期的相互转换：
1.日期转时间戳：

//$(".startDate")是一个日期文本框
var sjc = new Date($(".startDate").val()).valueOf()/1000;

2.时间戳转日期：

//d.joinTime是一个时间戳
var date = new Date(parseInt(d.joinTime) * 1000);
return date.toLocaleString().replace(/:\d{1,2}$/, ' ');