ASP.NET MVC5+EF6+EasyUI 后台管理系統（43）-工作流設計-字段分類設計

系列目錄

建立好42節的表之后，每個字段英文表示都是有意義的說明。先建立，就知道表的關系和用處了，當然，我的設計只是一個參考，你可能有很多改進的地方。

我們的工作流具體細節流程是這樣的：

最終我們的模塊也是這樣的，最后理想也是這樣的。現在從表單設計入手一步一步來。

今天解決分類管理，字段管理

准備開始

1.同樣啟用代碼生成器生成最基礎的源碼。把表和目錄都創建起來，每一個類都是對應每一個表。

2.在App.Admin---->Areas---->創建Flow文件夾

3.修改路由規則

using System.Web.Mvc;

namespace App.Admin.Areas.Flow
{
    public class FlowAreaRegistration : AreaRegistration
    {
        public override string AreaName
        {
            get
            {
                return "Flow";
            }
        }

        public override void RegisterArea(AreaRegistrationContext context)
        {

            context.MapRoute(
               "FlowGlobalization", // 路由名稱
               "{lang}/Flow/{controller}/{action}/{id}", // 帶有參數的 URL
               new { lang = "zh", controller = "Home", action = "Index", id = UrlParameter.Optional }, // 參數默認值
               new { lang = "^[a-zA-Z]{2}(-[a-zA-Z]{2})?$" }    //參數約束
           );
            context.MapRoute(
                "Flow_default",
                "Flow/{controller}/{action}/{id}",
                new { action = "Index", id = UrlParameter.Optional }
            );
        }
    }
}

4.模塊管理添加，（注：只做工作流沒有權限和菜單的忽略這一步，本系統是可拆分的）

5.添加基礎控制器“分類管理”，在生成器生成

FlowTypeController並添加增刪改視圖。利用代碼生成器秒出結果，並添加幾個簡單日常用的流程類別

INSERT INTO [dbo.Flow_Type] ([Id],[Name],[Remark],[CreateTime],[Sort]) values ('10000','行政管理','行政管理','07 25 2014 10:09AM',1)
INSERT INTO [dbo.Flow_Type] ([Id],[Name],[Remark],[CreateTime],[Sort]) values ('20000','人事管理','人事管理','07 25 2014 10:09AM',2)
INSERT INTO [dbo.Flow_Type] ([Id],[Name],[Remark],[CreateTime],[Sort]) values ('30000','財務相關','財務相關','07 25 2014 10:09AM',3)
INSERT INTO [dbo.Flow_Type] ([Id],[Name],[Remark],[CreateTime],[Sort]) values ('40000','客戶服務','客戶服務','07 25 2014 10:09AM',4)
INSERT INTO [dbo.Flow_Type] ([Id],[Name],[Remark],[CreateTime],[Sort]) values ('50000','關鍵業務','關鍵業務','07 25 2014 10:09AM',5)
INSERT INTO [dbo.Flow_Type] ([Id],[Name],[Remark],[CreateTime],[Sort]) values ('60000','其他','其他','07 25 2014 10:09AM',6)

6.添加基礎表控制器“字段管理”，字段管理與分類是相關聯的。我們以一個請假申請為例，所屬類別在行政管理

我們有個約定Flow_FormAttr表中的AttrType是字段的類型，分別為文本，多行文本，數字，日期（高級點自己加個下拉）

具體實現如下，有布局大家就方便了

@model App.Models.Flow.Flow_FormAttrModel
@using App.Common;
@using App.Models.Flow;
@using App.Admin;
@using App.Models.Sys;
@{
    ViewBag.Title = "修改";
    Layout = "~/Views/Shared/_Index_LayoutEdit.cshtml";
    List<permModel> perm = (List<permModel>)ViewBag.Perm;
    if (perm == null)
    {
        perm = new List<permModel>();
    }
}

<script type="text/javascript">
    $(function () {
        $("#btnSave").click(function () {
            if ($("form").valid()) {
                $.ajax({
                    url: "@Url.Action("Create")",
                    type: "Post",
                    data: $("form").serialize(),
                    dataType: "json",
                    success: function (data) {
                        if (data.type == 1) {
                            window.parent.frameReturnByMes(data.message);
                            window.parent.frameReturnByReload(true);
                            window.parent.frameReturnByClose()
                        }
                        else {
                            window.parent.frameReturnByMes(data.message);
                        }
                    }
                });
            }
            return false;
        });
        $("#btnReturn").click(function () {
            window.parent.frameReturnByClose();
        });
    });
</script>
<div class="mvctool bgb">
    @Html.ToolButton("btnSave", "icon-save", "保存", perm, "Save", true)
    @Html.ToolButton("btnReturn", "icon-return", "返回", false)
</div>
@using (Html.BeginForm())
{
    @Html.HiddenFor(model => model.Id)
    <table class="fromEditTable setTextWidth300">
        <tbody>
            <tr>
                <td style="width: 100px; text-align: right;">
                    @Html.LabelFor(model => model.Title)：
                </td>
                <td style="width: 310px">
                    @Html.EditorFor(model => model.Title)
                </td>
                <td>@Html.ValidationMessageFor(model => model.Title)</td>
            </tr>
            <tr>
                <td style="width: 100px; text-align: right;">
                    @Html.LabelFor(model => model.Name)：
                </td>
                <td style="width: 310px">
                    @Html.EditorFor(model => model.Name)
                </td>
                <td>@Html.ValidationMessageFor(model => model.Name)</td>
            </tr>
            <tr>
                <td style="width: 100px; text-align: right;">
                    @Html.LabelFor(model => model.AttrType)：
                </td>
                <td style="width: 310px">
                    <select id="AttrType" name="AttrType">
                        <option value='文本'>文本</option>
                        <option value='多行文本'>多行文本</option>
                        <option value='日期'>日期</option>
                        <option value='數字'>數字</option>
                    </select>
                </td>
                <td>@Html.ValidationMessageFor(model => model.AttrType)</td>
            </tr>
            <tr>
                <td style="width: 100px; text-align: right;">
                    @Html.LabelFor(model => model.CheckJS)：
                </td>
                 <td style="width: 310px" colspan="2">
                    @Html.TextAreaFor(model => model.CheckJS, 10, 80, new {@style="width:500px;" })
                </td>
               
            </tr>
            <tr>
                <td style="width: 100px; text-align: right;">
                    @Html.LabelFor(model => model.TypeId)：
                </td>
                <td style="width: 310px">
                      @Html.DropDownListFor(model => model.TypeId, ViewBag.FlowType as SelectList)
                </td>
                <td>@Html.ValidationMessageFor(model => model.TypeId)</td>
            </tr>
        </tbody>
    </table>
}

其中ViewBag.FlowType代碼為ViewBag.FlowType = new SelectList(typeBLL.GetList(ref setPager, ""), "Id", "Name");

具體控制器實現和試圖就不再重復說了，都是老掉牙的代碼方式了。添加請假用的字段

其中的校驗腳本，我這里是具體的JS代碼，有時間的可以寫好，讓用戶來導入即可。這樣才是人性化的選擇，比如讓用戶判斷是否為空，然后根據用戶的選擇來導入js代碼

INSERT INTO [Flow_FormAttr] ([Id],[Title],[Name],[AttrType],[CheckJS],[TypeId],[CreateTime],[OptionList],[IsValid]) values ('2014072917472089906674032266c50','請假標題','holidayTitle','文本','if($("#holidayTitle").val()=="")  {  $.messageBox5s(''提示'', ''標題不能為空！'')  $("#holidayTitle").focus();  return false;  }  if($("#holidayTitle").val().length>50)  {  $.messageBox5s(''提示'', ''不能大於50個字符！'')  $("#holidayTitle").focus();  return false;  }','10000','07 29 2014  5:53PM',NULL,NULL)
INSERT INTO [Flow_FormAttr] ([Id],[Title],[Name],[AttrType],[CheckJS],[TypeId],[CreateTime],[OptionList],[IsValid]) values ('20140729174821650541562116de794','開始日期','holidayBeginDate','日期','if($("#holidayBeginDate").val()=="")  {  $.messageBox5s(''提示'', ''確保輸入正確的日期！'')  $("#holidayBeginDate").focus();  return false;  }','10000','07 29 2014  5:53PM',NULL,NULL)
INSERT INTO [Flow_FormAttr] ([Id],[Title],[Name],[AttrType],[CheckJS],[TypeId],[CreateTime],[OptionList],[IsValid]) values ('201407291748430927679e300c2259e','結束日期','holidayEndDate','日期','if($("#holidayBeginDate").val()=="")  {  $.messageBox5s(''提示'', ''確保輸入正確的日期！'')  $("#holidayBeginDate").focus();  return false;  }','10000','07 29 2014  5:53PM',NULL,NULL)
INSERT INTO [Flow_FormAttr] ([Id],[Title],[Name],[AttrType],[CheckJS],[TypeId],[CreateTime],[OptionList],[IsValid]) values ('201407291750004471924b58806d5fb','請假天數','holidayNum','數字','if(!isNaN($("#setPrice").val()))  {  $.messageBox5s(''提示'', ''必須是正確的數字！'');  return false;  }  ','10000','07 29 2014  5:53PM',NULL,NULL)
INSERT INTO [Flow_FormAttr] ([Id],[Title],[Name],[AttrType],[CheckJS],[TypeId],[CreateTime],[OptionList],[IsValid]) values ('2014072917520247117178fa57285f4','請假原因','holidayDetails','多行文本',NULL,'10000','07 29 2014  5:53PM',NULL,NULL)

最后的控制器效果圖