钟表维修管理系统技术解析(四) 订购配件

钟表维修配件订购系统

最新推荐文章于 2023-11-27 19:51:19 发布

原创最新推荐文章于 2023-11-27 19:51:19 发布 · 4.4k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#MVC #分页 #实例 #linq #session

MVC 专栏收录该内容

9 篇文章

订阅专栏

本文介绍了一套针对钟表维修业务的配件订购管理系统的技术实现细节，包括订购配件流程、数据库设计、界面控件使用及分页查询等功能。

钟表维修管理系统技术解析(四) 订购配件

在工单录入完成后，在检测过程中，发现在该店库存没有需要的配件，其配件又要专门订购时，则采用该订购配件功能；点击转至采购订货，则进入采购界面，对维修单进行订购配件，点击查看订购信息，则可看到已经订购配件的维修单的采购明细

界面效果图：

订购配件查询界面：

2.2.5图(1)

查看采购信息界面：

2.2.5图(2)

进入维修订购界面：

2.2.5图(3)

界面中使用到的控件有：

控件名称	说明
日期控件(easyui-datebox)	第一要设置每个控件的id，第二设置大小不设置也有默认，第三（data-options）是数据操作:可以设置控件的一些属性和事件
下拉框控件(easyui-combobox)
文本框控件(easyui-textbox)
按钮(easyui-linkbutton)
表格(easyui-datagrid)

功能实现:

第一步：数据库

1. 表与表之间的关系

2.2.5图(4)

表1：工单录入表（pw_GongDianLuRu）

用于存放钟表录入的信息

列名	数据类型	主键/外键	说明
GongDanLuRuID	int	主键	工单录入ID
YuanShiDanHaoID	int	外键	原始单号ID
GongDanZhuanTaiID	int	外键	工单状态ID
JinEZhuangTaiID	int	外键	金额状态ID
GongDanLeiXingID	int	外键	工单类型ID
KeHuID	int	外键	客户ID
JianXiuLeiXingID	int	外键	检修类型ID
PinPaiID	int	外键	品牌ID
GongDanRiQi	date		工单日期
GongDanBianHao	nchar(50)		工单编号
SongXiuRiQi	data		送修日期
YuFanRiQi	data		预返日期
FenYongJinE	decimal(18, 2)		费用金额
ZhongBiaoLeiXing	nchar(10)		钟表类型
BiaoKuan	nchar(10)		表款
GuiGe	text		规格/名称
XiuPeiJiLu	text		修配记录
JiXinXingHao	nchar(50)		机芯号
BiaoXingHao	nchar(50)		表型号
BiaoShenHao	nchar(50)		表身号
BiaoDaiJieShu	nchar(50)		表带节数
ZhongBiaoQiTaoMiaoShu	varchar(200)		钟表其他描述
WaiGuan	text		外观
KeHuZhiShu	varchar(200)		客户自述
YouXiaoFou	Bit		有效否

表2：工单采购表（pw_GongDanCaiGou）

列名	数据类型	主键/外键	说明
GongDanCaiGouID	int	主键	工单采购ID
GongDanLuRID	int	外键	工单录入ID
CaiGouDanID	int	外键	采购单ID
YouXiaoFou	bit		有效否

表3：采购单（pw_CaiGouDan）

列名	数据类型	主键/外键	说明
CaiGouDanID	int	主键	采购单ID
DaoHuoMenDianID	int	外键	到货门店ID
LuRuYuanID	int	外键	录入员ID
GongYingShangID	int	外键	供应商ID
SongHuoFangShiID	int	外键	送货方式ID
CaiGouLeiBieID	int	外键	采购类别ID
CaiGouFuKuanLeiXingID	int	外键	采购付款类型ID
FuKuanZhuangTaiID	int	外键	付款状态ID
RuKuZhuangTaiID	int	外键	入库状态ID
CaiGouDanBianHao	nchar(50)		采购单编号
DanJuZhuangTai	data		单据状态
CaiGouRiQi	data		采购日期
DaoHuoRiQi	decimal(18, 2)		到货日期
JinE	nchar(10)		金额
FaPiaoHao	nchar(10)		发票号
BeiZhu	text		备注
DingGouFou	text		订购否
DeleteFou	nchar(50)		删除否
YouXiaoFou	nchar(50)		有效否
GengXinShiJian	nchar(50)		更新时间

表4：采购单明细表（pw_CaiGouDanMingXi）

列名	数据类型	主键/外键	说明
CaiGouDanMingXiID	int	主键	采购单明细ID
CaiGouDanID	int	外键	采购单ID
CangWeiID	int	外键	仓位ID
ChanPinID	int	外键	产品ID
DanJia	int		单价
ShuLiang	int		数量
ChengGongTuiHuoShu	int		成功退货数
YiRuKuShu	int		已入库数
YiTuiHuoShu	int		已退货数
YouXiaoFou	bit		有效否
BeiZhu	nchar(50)		备注

表5：库存表（sys_KuCun）

记录库存中产品在某一仓位的数量

列名	数据类型	主键/外键	说明
KuCunID	int	主键	库存ID
LuRuYuanID	int	外键	录入员ID
CangWeiID	int	外键	仓位ID
ChanPinID	int	外键	产品ID
KuCunShuLiang	int		库存数量
GengXinShiJian	datetime		更新时间

表6：产品资料表（pw_ChanPinZiLiao）

产品资料记录表

列名	数据类型	主键/外键	说明
ChanPinID	int	主键	产品ID
LuRuYuanID	int	外键	录入员ID
CangKuLeiXingID	int	外键	仓库类型ID
ChanPinLeiXingID	int	外键	产品类型ID
ChanPinZhongLeiID	int	外键	产品种类ID
ChanPinPinPaiID	int	外键	产品品牌ID
DanWeiID	int	外键	单位ID
ChanPinBianHao	nchar(10)		产品编号
ChanPinMingCheng	nchar(10)		产品名称
CaiGouDanJia	decimal(18, 2)		采购单价
YiJiXiaoShouJia	decimal(18, 2)		销售价
JianJie	nchar(50)		简介
GengXinShiJian	datetime		更新时间
YouXiaoFou	bit		有效否

表7：仓位表（pw_CangWei）

门店仓位表

列名	数据类型	主键/外键	说明
CangWeiID	int	主键	仓位ID
MenDianID	int	外键	门店ID
CangWeiLeiXingID	int	外键	仓位类型ID
CangWeiMingCheng	nchar(50)		仓位名称
PaiXuHao	int		排序号
GengXinShiJian	datetime		更新时间
YouXiaoFou	bit		有效否
BeiZhu	nchar(50)		备注

表8：出入库表（pw_ChuRuKuDanJu）

列名	数据类型	主键/外键	说明
ChuRuKuDanID	int	主键	出入库单据ID
LuRuYuanID	int	外键	录入员ID
DanJuBianHao	nchar(10)		单据编号
DanJuRiQi	date		单据日期
ShenHeFou	bit		审核否
BeiZhu	nchar(50)		备注
RuKuFou	bit		入库否
YouXiaoFou	bit		有效否

表9：出入库明细表（pw_ChuRuKuDanJuMingXi）

列名	数据类型	主键/外键	说明
ChuRuKuDanMingXiID	int	主键	出入库明细ID
ChuRuKuDanJuID	int	外键	出入库单据ID
ChanPinID	int	外键	产品ID
CangWeiID	int	外键	仓位ID
ShuLiang	int	外键	数量
JinE	decimal(18, 2)		金额
YouXiaoFou	bit		有效否

控件使用方法：

1. 日期控件(easyui-datebox)：

作用：处理时间

日期控件截图：

2.2.5图(5)

html创建日期控件代码：

<input id="starRiQi" class="easyui-datebox" style="width:100px;height:28px"data-options="editable:false"/>

js赋值给界面控件代码：

$('#starRiQi').datebox('setValue', '2015-01-03');

js获取界面控件的值代码：

$("#starRiQi").datebox("getValue");

2. 下拉框控件(easyui-combobox)：

作用：绑定数据，实现选择功能

下拉框控件截图：

2.2.5图(6)

html创建下拉框控件代码：

<input id="cboGongDanZhuangTai" class="easyui-combobox" style="width:120px;height:28px" data-options="editable:false,url:'/WeiXiuGuanLi/SelectGongDanZhuangTai',valueField:'ShuXingMingXiID',textField:'ShuXingMingXiMingCheng'"/>

js选择下拉框第一个选项：

$('#cboGongDanZhuangTai').combobox('select', 0);

js获取界面控件的值：

$("#cboGongDanZhuangTai").combobox("getValue")

3. 文本框控件(easyui-textbox)：

作用：编辑字符串

文本框控件截图：

2.2.5图(7)

html创建文本框控件代码：

<input id="txtGuanJianZi" class="easyui-textbox" style="width:140px;height:28px"/>

js获取文本框值：

$("#txtGuanJianZi").val()

js设置文本框值：

$("#txtGuanJianZi").val('setValue',"123");

4. 按钮(easyui-linkbutton)：

作用：提交方法

按钮控件截图：

2.2.5图(8)

html创建按钮控件代码：

<a onclick="ClickSelect()" class="goodButton" style="width:80px;height:28px; line-height:30px;">查询</a>

Js点击按钮触发查询方法：

//查询
    function ClickSelect() {
        CurPage = 1;
        SelectDingGouPeiJian();
    }<span style="font-size:18px;">
</span>

第二步：控制器(Controllers)

2.2.5图(9)

linq语法查询数据

#region//订购配件
        /// <summary>
        /// 查询订购配件
        /// </summary>
        /// <param name="strChaXunNeiRong">查询内容</param>
        /// <param name="dtmStarRiQi">开始时间</param>
        /// <param name="dtmEndRiQi">结束时间</param>
        /// <param name="intGongDanZhuangTaiID">工单状态</param>
        /// <param name="PageSize">页数</param>
        /// <param name="CurPage">页码</param>
        /// <param name="intMenDianID">门店ID</param>
        /// <returns></returns>
        public ActionResult SelectDingGouPeiJian(string strChaXunNeiRong, DateTime dtmStarRiQi, DateTime dtmEndRiQi, int intGongDanZhuangTaiID, int PageSize, int CurPage,int intMenDianID)
        {
            var varGongDan = (from dtGonDan in myMdl.pw_GongDianLuRu
                              join dtKeHu in myMdl.sys_KeHu on dtGonDan.KeHuID equals dtKeHu.KeHuID
                              join dtPinPai in myMdl.sys_PinPai on dtGonDan.PinPaiID equals dtPinPai.PinPaiID
                              join dtGongDanZhuangTai in myMdl.sys_ShuXingMingXi on dtGonDan.GongDanZhuanTaiID equals dtGongDanZhuangTai.ShuXingMingXiID
                              join dtGongDanLeiXing in myMdl.sys_ShuXingMingXi on dtGonDan.GongDanLeiXingID equals dtGongDanLeiXing.ShuXingMingXiID
                              join dtJieShouYuan in myMdl.sys_YuanGong on dtGonDan.JieShouYuanID equals dtJieShouYuan.YuanGongID
                              join dtMenDian in myMdl.sys_MenDian on dtJieShouYuan.MenDianID equals dtMenDian.MenDianID
                              join dtJinEZhuanTai in myMdl.sys_ShuXingMingXi on dtGonDan.JinEZhuangTaiID equals dtJinEZhuanTai.ShuXingMingXiID
                              join dtYuanShiDanHao in myMdl.pw_GongDianLuRu on dtGonDan.YuanShiDanHaoID equals dtYuanShiDanHao.GongDanLuRuID into JoinedEmpDept
                              from dtYuanShiDanHao in JoinedEmpDept.DefaultIfEmpty()
                              where dtGonDan.YouXiaoFou == true && (dtGonDan.GongDanBianHao.Contains(strChaXunNeiRong) || (dtGonDan.JiXinXingHao.Contains(strChaXunNeiRong) || dtGonDan.KeHuZhiShu.Contains(strChaXunNeiRong)
                              || dtGonDan.WaiGuan.Contains(strChaXunNeiRong) || dtGonDan.XiuPeiJiLu.Contains(strChaXunNeiRong) || dtGonDan.ZhongBiaoQiTaoMiaoShu.Contains(strChaXunNeiRong)
                              || dtKeHu.KeHuXingMing.Contains(strChaXunNeiRong) || dtKeHu.JiaTingDianHua.Contains(strChaXunNeiRong))) && (dtGonDan.SongXiuRiQi >= dtmStarRiQi && dtGonDan.SongXiuRiQi <= dtmEndRiQi)
                              orderby dtGonDan.GongDanLuRuID descending//通过工单录入ID进行排序
                              select new
                              {
                                  dtGonDan.GongDanLuRuID,
                                  dtGonDan.GongDanLeiXingID,
                                  dtGonDan.KeHuID,
                                  dtJieShouYuan.MenDianID,
                                  dtMenDian.GongZuoZhanMingCheng,
                                  dtGonDan.PinPaiID,
                                  dtGonDan.JieShouYuanID,
                                  dtGonDan.WeiXiuLeiXingID,
                                  dtGonDan.GongDanZhuanTaiID,
                                  dtGonDan.GongDanBianHao,
                                  dtGonDan.GongDanRiQi,
                                  dtKeHu.KeHuXingMing,
                                  dtKeHu.YiDongShouJi,
                                  dtKeHu.TongXunDiZhi,
                                  dtPinPai.PinPaiMingCheng,
                                  dtGonDan.SongXiuLeiXingID,
                                  GongDanZhuangTai = dtGongDanZhuangTai.ShuXingMingXiMingCheng,
                                  dtGonDan.FenYongJinE,
                                  GongDanLeiXing = dtGongDanLeiXing.ShuXingMingXiMingCheng,
                                  LuRuRen = dtJieShouYuan.YuanGongXingMing,
                                  dtGonDan.ZhongBiaoQiTaoMiaoShu,
                                  dtGonDan.XiuPeiJiLu,
                                  dtGonDan.WaiGuan,
                                  dtGonDan.KeHuZhiShu,
                                  dtGonDan.BiaoKuan,
                                  dtGonDan.BiaoDaiJieShu,
                                  dtGonDan.BiaoXingHao,
                                  dtGonDan.BiaoShenHao,
                                  dtGonDan.ZhongBiaoLeiXing,
                                  dtGonDan.JiXinXingHao,
                                  dtGonDan.GuiGe,
                                  dtGonDan.SongXiuRiQi,
                                  dtGonDan.YuFangRiQi,
                                  dtGonDan.JinEZhuangTaiID,
                                  dtGonDan.YuanShiDanHaoID,
                                  YuanShiGongDan = dtYuanShiDanHao != null ? dtYuanShiDanHao.GongDanBianHao : "无原始工单",//三目运算符处理null数据
                                  JinEZhuangTai = dtJinEZhuanTai.ShuXingMingXiMingCheng
                              }).AsEnumerable().Select(n=>new {
                              n.GongDanLuRuID,
                                  n.GongDanLeiXingID,
                                  n.KeHuID,
                                  n.PinPaiID,
                                  n.JieShouYuanID,
                                  n.WeiXiuLeiXingID,
                                  n.GongDanZhuanTaiID,
                                  n.GongDanBianHao,
                              GongDanRiQi = n.GongDanRiQi.Value.ToString("yyyy-MM-dd"),//转换日期格式
                                  n.KeHuXingMing,
                                  n.YiDongShouJi,
                                  n.TongXunDiZhi,
                                  n.PinPaiMingCheng,
                                  n.SongXiuLeiXingID,
                              GongDanZhuangTai=n.GongDanZhuangTai.ToString().Trim(),
                                  n.FenYongJinE,
                                  n.GongDanLeiXing,
                                  n.LuRuRen ,
                                  n.ZhongBiaoQiTaoMiaoShu,
                                  n.XiuPeiJiLu,
                                  n.WaiGuan,
                                  n.KeHuZhiShu,
                                  n.BiaoKuan,
                                  n.BiaoDaiJieShu,
                                  n.BiaoXingHao,
                                  n.BiaoShenHao,
                                  n.ZhongBiaoLeiXing,
                                  n.JiXinXingHao,
                                  n.GuiGe,
                                  n.MenDianID,
                                  SuoShuMenDian = n.GongZuoZhanMingCheng,
                                  SongXiuRiQin=n.SongXiuRiQi.Value.ToString("yyyy-MM-dd"),
                                  YuFangRiQi=n.YuFangRiQi.Value.ToString("yyyy-MM-dd"),
                                  n.JinEZhuangTaiID,
                                  n.YuanShiDanHaoID,
                                  n.YuanShiGongDan,
                                  n.JinEZhuangTai
                              });
            varGongDan = varGongDan.Where(n => n.GongDanZhuangTai != "维修完成" && n.GongDanZhuangTai != "已通知客户取表" && n.GongDanZhuangTai != "已取表" && n.GongDanZhuangTai != "取消维修");//添加限制条件
            if (intMenDianID != 0) 
            {
                varGongDan = varGongDan.Where(n => n.MenDianID == intMenDianID);
            }
            if (intGongDanZhuangTaiID > 0)
            {
                varGongDan = varGongDan.Where(n => n.GongDanZhuanTaiID == intGongDanZhuangTaiID);
            }
            int i = 1;
            List<Dictionary<string, object>> myListTo = new List<Dictionary<string, object>>();

            //用foreach循环添加序号
             foreach (var varRow in varGongDan)
            {
                Dictionary<string, object> myDic = new Dictionary<string, object>();
                foreach (System.Reflection.PropertyInfo p in varRow.GetType().GetProperties())
                {
                    myDic.Add(p.Name, p.GetValue(varRow, null));
                }
                myDic.Add("order", i++);
                myListTo.Add(myDic);
            }
             if (CurPage > 0)
             {
                 varGongDan = varGongDan.Take(PageSize * CurPage).Skip(PageSize * (CurPage - 1));
             }
            //记录需要导出excel的数据
            List<Dictionary<string, object>> myList = new List<Dictionary<string, object>>();
            foreach (var varRow in varGongDan)
            {
                Dictionary<string, object> myDic = new Dictionary<string, object>();
                myDic.Add("工单编码", varRow.GongDanBianHao);
                myDic.Add("工单日期", varRow.GongDanRiQi);
                myDic.Add("客户姓名", varRow.KeHuXingMing);
                myDic.Add("品牌", varRow.PinPaiMingCheng);
                myDic.Add("表款", varRow.BiaoKuan);
                myDic.Add("工单状态", varRow.GongDanZhuangTai);
                myDic.Add("金额状态", varRow.JinEZhuangTai);
                myDic.Add("费用金额", varRow.FenYongJinE);
                myDic.Add("工单类型", varRow.GongDanLeiXing);
                myDic.Add("录入员", varRow.LuRuRen);
                myDic.Add("规格", varRow.GuiGe );
                myDic.Add("外观缺损", varRow.WaiGuan);
                myDic.Add("修配记录", varRow.XiuPeiJiLu);
                myList.Add(myDic);
            }
            if (myList.Count() > 0)
            {
                Session["datatable"] = ConvertHelper.ToDataTable(myList);//Session变量保存需要导出的数据
            }
            Dictionary<string, object> myMap = new Dictionary<string, object>();//实例化json集合
            myMap.Add("total", varGongDan.Count());//总页数
            myMap.Add("rows", myListTo.Take(PageSize * CurPage).Skip(PageSize * (CurPage - 1)));//分页返回数据
            return Json(myMap, JsonRequestBehavior.AllowGet);
        }
        /// <summary>
        /// 查询工单状态 绑定combobox
        /// </summary>
        /// <returns></returns>
        public ActionResult SelectGongDanZhuangTai()
        {
            var GongDanZhuangTai = (from dtGongDanZhuangTai in myMdl.sys_ShuXingMingXi
                                    where dtGongDanZhuangTai.ShuXingJiHeID == 27
                                    select dtGongDanZhuangTai).ToList();
            Models.sys_ShuXingMingXi mySXMX = new Models.sys_ShuXingMingXi();
            mySXMX.ShuXingJiHeID = 27;
            mySXMX.ShuXingMingXiMingCheng = "全部";
            mySXMX.ShuXingMingXiID = 0;
            GongDanZhuangTai.Add(mySXMX);
            return Json(GongDanZhuangTai, JsonRequestBehavior.AllowGet);
        }
        /// <summary>
        /// 通过维修单ID查询订购的配件
        /// </summary>
        /// <param name="intServiceID">维修单ID</param>
        /// <returns></returns>
        public ActionResult SelectOrderPassID(int intServiceID)
        {
            var OrderService = from dtOrderService in myMdl.pw_GongDanCaiGou
                               join dtService in myMdl.pw_GongDianLuRu on dtOrderService.GongDanLuRiID equals dtService.GongDanLuRuID
                               join dtOrder in myMdl.pw_CaiGouDan on dtOrderService.CaiGouDanID equals dtOrder.CaiGouDanID
                               join dtOrderList in myMdl.pw_CaiGouDanMingXi on dtOrder.CaiGouDanID equals dtOrderList.CaiGouDanID
                               join dtProduct in myMdl.sys_ChanPinZiLiao on dtOrderList.ChanPinID equals dtProduct.ChanPinID
                               join dtBrand in myMdl.sys_PinPai on dtProduct.ChanPinPinPaiID equals dtBrand.PinPaiID
                               join dtType in myMdl.sys_PinZhong on dtProduct.ChanPinZhongLeiID equals dtType.PinZhongID
                               join dtShipping in myMdl.sys_CangWei on dtOrderList.CangWeiID equals dtShipping.CangWeiID
                               where dtOrderService.YouXiaoFou == true && dtOrderService.GongDanLuRiID == intServiceID
                               select new {
                                   dtProduct.ChanPinBianHao,
                                   dtProduct.ChanPinMingCheng,
                                   dtBrand.PinPaiMingCheng,
                                   dtType.PinZhongMingCheng,
                                   dtOrderList.DanJia,
                                   dtOrderList.ShuLiang,
                                   dtOrderList.YiTuiHuoShu,
                                   dtOrderList.ChengGongTuiHuoShu,
                                    XiaoJi=(dtOrderList.ShuLiang*dtOrderList.DanJia),
                                   dtShipping.CangWeiMingCheng
                               };
            return Json(OrderService,JsonRequestBehavior.AllowGet);
        }
        /// <summary>
        /// 查询门店
        /// </summary>       
        public ActionResult SelectShopAll() 
        {
            var Shop = (from dtShop in myMdl.sys_MenDian
                       where dtShop.YouXiaoFou == true
                       select dtShop).ToList();
            Models.sys_MenDian All = new Models.sys_MenDian();
            All.GongZuoZhanMingCheng = "全部";
            All.MenDianID = 0;
            Shop.Add(All);
            var ShopALL = (Shop.Select(n => new { 
                value = n.MenDianID,
                text = n.GongZuoZhanMingCheng
            })).ToList();
            return Json(ShopALL, JsonRequestBehavior.AllowGet);
        }
        #endregion

第三步、视图层（views）

2.2.5图(10)

Html代码：

<div id="_revealloading"  class="reveal-loadding" style="display:block">
    <span class="loading" style="display:block">
    </span>
</div>

<div style="width:1140px;height:40px">
<center>
    <table>
        <tr>
        <td align="right">日期：<input id="starRiQi" class="easyui-datebox" style="width:100px;height:28px"data-options="editable:false"/>—<input id="endRiQi" class="easyui-datebox" style="width:100px;height:28px" data-options="editable:false"/></td>
        <td align="right">工单状态：<input id="cboGongDanZhuangTai" class="easyui-combobox" style="width:120px;height:28px" data-options="editable:false,url:'/WeiXiuGuanLi/SelectGongDanZhuangTai',valueField:'ShuXingMingXiID',textField:'ShuXingMingXiMingCheng'"/></td>        
        <td align="right">关键字：<input id="txtGuanJianZi" class="easyui-textbox" style="width:140px;height:28px"/> </td>        
        <td><a onclick="ClickSelect()" class="goodButton" style="width:80px;height:28px; line-height:30px;">查询</a></td>
        <td><a onclick="TiaoZhuanCaiGou()" class="goodButton" style="width:100px;height:28px; line-height:30px;">转至采购订货</a></td>
        <td><a onclick="OrderAccessories()" class="goodButton" style="width:100px;height:28px; line-height:30px;">查看订购信息</a></td>
        <td><a onclick="DeriveExcel()" class="goodButton_c1" style="width:100px;height:28px; line-height:30px;">导出Excel</a></td>           
        </tr>
    </table>
</center>
</div>
<div>
<table id="dgvDingGouPeiJian" class="easyui-datagrid" style="width:1140px;height:auto" data-options="singleSelect:true,footer:'#_Paging'">
    <thead>
        <tr>
            <th data-options="field:'GongDanLeiXingID',width:80,align:'center',hidden:true">工单类型ID</th>
            <th data-options="field:'GongDanPaiGongID',width:80,align:'center',hidden:true">工单派工ID</th>
            <th data-options="field:'KeHuID',width:80,align:'center',hidden:true">客户ID</th>
            <th data-options="field:'PinPaiID',width:80,align:'center',hidden:true">品牌ID</th>
            <th data-options="field:'JinEZhuangTaiID',width:80,align:'center',hidden:true">金额状态ID</th>
            <th data-options="field:'JieShouYuanID',width:80,align:'center',hidden:true">接收员ID</th>
            <th data-options="field:'WeiXiuLeiXingID',width:80,align:'center',hidden:true">维修类型ID</th>
            <th data-options="field:'GongDanLuRuID',width:80,align:'center',hidden:true">工单录入ID</th>
            <th data-options="field:'GongDanZhuanTaiID',width:80,align:'center',hidden:true">工单状态ID</th>
            <th data-options="field:'order',width:'auto',align:'center'"></th>
            <th data-options="field:'GongDanBianHao',width:150,align:'center'">工单编号</th>
            <th data-options="field:'GongDanRiQi',width:100,align:'center'">工单日期</th>
            <th data-options="field:'KeHuXingMing',width:'auto',align:'center'">客户名称</th>
            <th data-options="field:'YiDongShouJi',width:'auto',align:'center'">客户联系电话</th>
            <th data-options="field:'PinPaiMingCheng',width:80,align:'center'">品牌</th>
            <th data-options="field:'GongDanZhuangTai',width:100,align:'center'">工单状态</th>
            <th data-options="field:'JinEZhuangTai',width:80,align:'center'">金额状态</th>
            <th data-options="field:'FenYongJinE',width:80,align:'center'">最新报价</th>
            <th data-options="field:'GuiGe',width:320,align:'center'">规格</th>
        </tr>
    </thead>
</table>
<div class="_Paging" id="_Paging">
<center>
    	<table class="_Layout">
        	<tr>
            <td id="_Shop"></td>
             <td><select id="RowCount" title="显示行数" onchange="ClickSelect()" >
                		<option value="10">10</option>
                        <option value="20" selected="selected">20</option>
                        <option value="30">30</option>
                        <option value="40">40</option>
                        <option value="50">50</option>
                        <option value="60">60</option>
                        <option value="70">70</option>
                        <option value="80">80</option>
                        <option value="90">90</option>
                        <option value="100">100</option>
                	</select>
                </td>
                <td>|</td>
            	<td><a href="javascript:;" class="_HomePage" title="首页" onclick="ShouYe()"></a></td>
                <td><a href="javascript:;" class="_PreviousPage" title="上一页" onclick="ShangYiYe()"></a></td>
                 <td><input class="_Skip" id="txtTiaoZhuan" title="回车跳转" onkeypress="TiaoZhuan(event)" onkeyup="value=value.replace(/[^\d]/g,'') 

"onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" /></td>
                <td>/<label id="lblZonngYeShu"></label></td>
                <td><a href="javascript:;" class="_NextPage" title="下一页" onclick="XiaYiYe()"></a></td>
                <td><a href="javascript:;" class="_TrailerPage" title="尾页" onclick="WeiYe()"></a></td>
                 <td>|</td>
                <td>
                	总记录数：<label class = "_Totals" id="lblZongJiLuShu"></label>条
                </td>
            </tr>
        </table>
</center>
</div>
</div>
<div id="OrderAccessories" class="reveal-modal" style="width:720px;height:300px;background-color:White">
    <table class="easyui-datagrid" id="OrederService" style="width:720px;height:300px;">
        <thead>
            <tr>
                <th data-options="field:'ChanPinBianHao',width:80,align:'center'">产品编号</th>
                <th data-options="field:'ChanPinMingCheng',width:80,align:'center'">产品名称</th>
                <th data-options="field:'PinPaiMingCheng',width:80,align:'center'">产品品牌</th>
                <th data-options="field:'PinZhongMingCheng',width:80,align:'center'">产品种类</th>
                <th data-options="field:'CangWeiMingCheng',width:80,align:'center'">存放仓位</th>
                <th data-options="field:'DanJia',width:60,align:'center'">单价</th>
                <th data-options="field:'ShuLiang',width:60,align:'center'">数量</th>
                <th data-options="field:'ChengGongTuiHuoShu',width:70,align:'center'">已退货数</th>
                <th data-options="field:'YiTuiHuoShu',width:60,align:'center'">申请退货数</th>
                <th data-options="field:'XiaoJi',width:60,align:'center'">小计</th>
            </tr>
        </thead>
    </table>
			<a class="close-reveal-modal">×</a>
</div><span style="font-size:18px;"><span style="font-weight: bold;">
</span></span>

jQuery代码：

var CurPage = 1;//初始化页数
    var HeadOfficeIs = @Session["HeadOfficeIs"];//获取是否总公司账号
    var MenDianID = @Session["ShopID"];//获取门店ID
    $(document).ready(function () {
        SetRiQi();//初始化日期格式
        $('#cboGongDanZhuangTai').combobox('select', 0);//初始化工单状态下拉框默认选择第一项
        ClickSelect();//初始化datagrid中的数据
        if (HeadOfficeIs == 1) {
        //如果是总公司账号登陆，则动态生成一个下拉框，供用户选择查看其它店铺的资料
            $.getJSON("/WeiXiuGuanLi/SelectShopAll", function (data) {
                var Generate = "<select style='width:100px;' id='Shop_id' title='选择店铺' onchange='SelectShop()'>";
                for (var i = 0; i < data.length; i++) {
                    if(data[i]["value"] == MenDianID){
                    Generate += "<option value=" + data[i]["value"] + " selected>" + data[i]["text"] + "</option>";
                    }else{
                    Generate += "<option value=" + data[i]["value"] + " >" + data[i]["text"] + "</option>";
                    }
                }
                Generate += "</select>";
                $("#_Shop").html(Generate);                
            });
        }
    });
    function SelectShop(){
        MenDianID = document.getElementById('Shop_id').value;//获取下拉框门店的ID
        ClickSelect();//进入查询功能
    }
    //通过条件查询数据绑定到datagrid中
    function SelectDingGouPeiJian() {
    $("#_revealloading").css("display", "block");//打开进度条
    //将需要查询条件的参数进行传值
        $.getJSON("/WeiXiuGuanLi/SelectDingGouPeiJian?strChaXunNeiRong=" + $("#txtGuanJianZi").val() + "&"//查询内容
        + "dtmStarRiQi=" + $("#starRiQi").datebox("getValue") + "&"//开始日期
        + "dtmEndRiQi=" + $("#endRiQi").datebox("getValue") + "&"//结束日期
        + "intGongDanZhuangTaiID=" + $("#cboGongDanZhuangTai").combobox("getValue") + "&"//工单状态
        + "PageSize=" + document.getElementById('RowCount').value + "&"//显示页数
        + "CurPage=" + CurPage + "&"//第几页
        + "intMenDianID=" +  MenDianID//门店ID
        , function (data) {
        //判断查询是否空数据
            $("#lblZonngYeShu").html(function () {
                if (data.length == 0) {
                    CurPage = 0;
                    $('#lblZongJiLuShu').html(0);
                    return 0;
                }
                else {
                    $('#lblZongJiLuShu').html(data["total"]);
                    return Math.ceil(data["total"] / document.getElementById('RowCount').value);
                }
            });
            $("#txtTiaoZhuan").val(CurPage);
            //表格赋值
            $("#dgvDingGouPeiJian").datagrid("loadData", data);
               $("#_revealloading").css("display", "none");//关闭进度条
               //导出Excel否
              if(IsExcel)
             {
             IsExcel=false;
              window.location.href = "/Excel/DownLoadExcelJiZuChaXunGenRenXiaoFeiJiLu";
             }
        });
    }

    function SetRiQi() {
        var curr_time = new Date();
        $('#endRiQi').datebox('setValue', curr_time.getFullYear() + "-" + ((curr_time.getMonth() + 1) < 10 ? "0" + (curr_time.getMonth() + 1) : (curr_time.getMonth() + 1)) + "-" + (curr_time.getDate() < 10 ? "0" + curr_time.getDate() : curr_time.getDate()));
        $('#starRiQi').datebox('setValue', curr_time.getFullYear() + "-" + ((curr_time.getMonth() - 2) < 10 ? "0" + (curr_time.getMonth() - 2) : (curr_time.getMonth() - 2)) + "-" + (curr_time.getDate() < 10 ? "0" + curr_time.getDate() : curr_time.getDate()));
    }
    //下一页
    function XiaYiYe() {
        if ($("#lblZonngYeShu").html() == CurPage) {
            $("#txtTiaoZhuan").val($("#lblZonngYeShu").html());
            alert("已到最后一页");
            return;
        }
        CurPage++;
        SelectDingGouPeiJian();
    }
    //上一页
    function ShangYiYe() {
        if (1 >= CurPage) {
            $("#txtTiaoZhuan").val("1");
            alert("已到第一页");
            return;
        }
        CurPage--;
        SelectDingGouPeiJian();
    }
    //首页
    function ShouYe() {
        if (CurPage == 1) {
            $("#txtTiaoZhuan").val(CurPage);
            alert("当前页已是首页！");
        } else {
            CurPage = 1;
            SelectDingGouPeiJian();
        }
    }
    //尾页
    function WeiYe() {
        if (CurPage == $("#lblZonngYeShu").html()) {
            $("#txtTiaoZhuan").val(CurPage);
            alert("当前页已是尾页！");
        } else {
            CurPage = $("#lblZonngYeShu").html();
            SelectDingGouPeiJian();
        }
    }
    //跳转
    function TiaoZhuan(e) {
        if (e.keyCode != 13) {
            return;
        }
        if ($("#txtTiaoZhuan").val() == "") {
            alert("请输入您要跳转的页数");
            $("#txtTiaoZhuan").val(CurPage);
            return;
        }

        if (Number($.trim($("#txtTiaoZhuan").val())) > Number($.trim($("#lblZonngYeShu").html()))) {
            alert("您输入的页数大于当前总页数");
            $("#txtTiaoZhuan").val(CurPage)
            return;
        }
        CurPage = $("#txtTiaoZhuan").val();
        SelectDingGouPeiJian();
    }
    //查询
    function ClickSelect() {
        CurPage = 1;//初始化页数
        SelectDingGouPeiJian();//进入查询
    }
    //点击转至采购订货，进入采购界面，对维修单进行采购订货
    function TiaoZhuanCaiGou() {
        var dtDingGouPeiJian = $("#dgvDingGouPeiJian").datagrid("getSelected");//获取datagrid中选中的维修单，进行采购订货
        if(dtDingGouPeiJian !=null){
        parent.addTab('编辑采购单', "/CaiGouGuanLi/XinJianCaiGouDan?intCaiGouDanID=" + 0 + "&intWeiXiuGaiGou="+dtDingGouPeiJian["GongDanLuRuID"]);
        }else{
            alert("请选择需要订购配件的单据！");
        }
    }
    //查看订购配件的信息
    function OrderAccessories() {
        var dtDingGouPeiJian=$('#dgvDingGouPeiJian').datagrid("getSelected");
        if (dtDingGouPeiJian != null) {
        //通过维修单ID查询该单是否有采购信息
            $.getJSON("/WeiXiuGuanLi/SelectOrderPassID?intServiceID=" + dtDingGouPeiJian["GongDanLuRuID"], function (data) {
                if (data.length == 0) {
                    alert("单号【" + $.trim(dtDingGouPeiJian["GongDanBianHao"]) + "】没有订购信息！");
                } else {
                //如果有采购信息，则加载到datagrid中
                    $('#OrederService').datagrid("loadData", data);
                    $('#OrderAccessories').reveal($(this).data());
                }
            });
        } else {
            alert("请选择您需要查看的单据信息！");
        }
    }
    var IsExcel=false;
    //点击导出Excel，判断是否有数据导出
    function DeriveExcel() {
        if (confirm("您确定导出Excel")) { } else { return; }
        if ($("#dgvDingGouPeiJian").datagrid("getData").rows.length > 0) {
            IsExcel=true;
            //如果有，则查询一次再进行导出
            SelectDingGouPeiJian();
        } else {
            alert("没有可以导出的数据！");
        }
    }

仅供学习，禁止用于商业用途