Esayui Datagrid 动态列表 设置单元格字体颜色 操作列

后台代码

		/// <summary>
        /// 获取标题   通过模板控制显示哪些列
        /// </summary>
        /// <param name="context"></param>
        public void GetFiledData(HttpContext context)
        {
            //获取模板
            var Modulelist = _ModuleBll.GetModuleList();
            List<FieldModel> list = new List<FieldModel>();
            if (Modulelist != null && Modulelist .Count > 0)
            {
                FieldModel field1 = new FieldModel()
                {
                    field = $"Name",
                    title = $"姓名",
                };
                FieldModel field2 = new FieldModel()
                {
                    field = $"Sex",
                    title = $"性别",
                };
                list.Add(field1);
                list.Add(field2);
                foreach (var item in Modulelist )
                {
                    var text = getStr(item.ModuleID.ToString()); //根据ID生成名称
                    FieldModel field = new FieldModel()
                    {
                        field = $"{text}",
                        title = $"{item.ModuleName}",
                    };

                    list.Add(field);
                }

                FieldModel field3 = new FieldModel()
                {
                    field = $"TotalWeight",
                    title = $"小计",
                };
                FieldModel field4 = new FieldModel()
                {
                    field = $"Opt",
                    title = $"操作",
                    halign = $"center",
                    align = $"center",
                    width = 140
                };
                FieldModel field5 = new FieldModel()
                {
                    field = $"PlanIntro",
                    title = $"备注",

                };
                list.Add(field3);
                list.Add(field4);
                list.Add(field5);
            }
            var v = list.ToJSON();
            v = $"[{v}]";
            context.Response.Write(v);
        }

		/// <summary>
        /// 获取计划汇总列表
        /// </summary>
        /// <param name="context"></param>
		public void GetPlanSummaryList(HttpContext context)
        {
            //获取查询条件
            SearchModel searchModel = new SearchModel(context);
			//通过模板查询数据
            var ds = _PlanBLL.GetPlanSummaryList(searchModel);

            DataTable dt = ds.Tables[0];

            for (int i = 0; i < dt.Rows.Count; i++)
            {
                var dr = dt.Rows[i];
                var TotalWeight = 0;
                for (int j = 2; j < dt.Columns.Count - 2; j++)
                {
                    var value = dr[j].ToString("").ToInt(0);
                    if (value > 0)
                    {
                        TotalWeight += value;
                    }
                }
                dr["TotalWeight"] = TotalWeight;
            }

            if (dt != null && dt.Rows.Count > 0)
            {
                DataRow drRow = dt.NewRow();
                // 空的数据列 
                drRow[0] = DBNull.Value;
                drRow[1] = DBNull.Value;
                drRow[2] = "合计";
                for (int i = 0; i < dt.Rows.Count; i++)
                {
                    var dr = dt.Rows[i];
                    for (int j = 3; j < dt.Columns.Count - 1; j++)
                    {
                        var value = dr[j].ToString("").ToInt(0);
                        if (value > 0)
                        {
                            var val = drRow[j].ToString().ToInt(0);
                            val += value;
                            drRow[j] = val;
                        }
                    }
                }
                dt.Rows.Add(drRow);
            }
            context.Response.Write(dt.ToJSON());
        }

WEB代码

		//加载列表
        function LoadGrid() {
            //获取查询条件
            var queryParams = GetQueryParams();

            //加载数据
            var options = $('#dgMain').datagrid('options');
            options.url = 'Plan_Handler.ashx?method=GetPlanSummaryList';
            options.method = 'post';
            $('#dgMain').datagrid('load', queryParams);
        }

        //加载标题
        function LoadField() {
            //加载数据
            $.getJSON('Plan_Handler.ashx?method=GetFiledData',
                function (option, textStatus, jqXHR) {
                    if (option) {
                        var len = option[0].length;
                        option[0][len - 3]['formatter'] = DateFieldFormatter;   //设置日期格式
                        option[0][len - 2]['formatter'] = dgMainRowFormatter_Opt;  //设置操作列

                        for (var i = 2; i < len - 4; i++) {
                            option[0][i]['formatter'] = setColumnForeColor;      //设置字体颜色
                        }
                    }
                    $('#dgMain').datagrid({
                        columns: option,
                    });
                });
        }
		//操作列
        function dgMainRowFormatter_Opt(value, rec) {
            //按钮的html
            var val = '';
            var MaterielPurchasePlanID = rec.MaterielPurchasePlanID;
            var TotalWeight = rec.TotalWeight;
            if (MaterielPurchasePlanID > 0) {
                val += '<a class="clsEdit" href="javascript:void(0);" onClick="CreateRecord(\'' + PlanID + '\')">删除</a>';
            }
            return val;
        }
        
		//设置单元格字体颜色
        function setColumnForeColor(value, row, index) {
            if (value == null) {
                return "<span style='color: red'>" + '' + "</span>";
            }
            else {
                if (value.indexOf("/") != -1) {
                    var i = value.lastIndexOf("/");
                    if (i <= 0) {
                        var strEnd = value.substring(i + 1, value.length);
                        return "<span style='color: red'>" + strEnd + "</span>";
                    }
                    else {
                        var strStart = value.substring(0, i);
                        var strEnd = value.substring(i, value.length);
                        return strStart + "<span style='color: red'>" + strEnd + "</span>";
                    }
                }
                else {
                    return "<span style='color: black'>" + value + "</span>";
                }
            }
        }