官方彩票投注

abp(net core)+easyui+efcore實現倉儲管理系統——ABP WebAPI與EasyUI結合增刪改查之五(三十一)

abp(net core)+easyui+efcore實現倉儲管理系統目錄

abp(net core)+easyui+efcore實現倉儲管理系統——創建應用服務(五)

abp(net core)+easyui+efcore實現倉儲管理系統——EasyUI前端頁面框架 (十八)

 
 
 

         在上一篇文章abp(net core)+easyui+efcore實現倉儲管理系統——ABP WebAPI與EasyUI結合增刪改查之四(三十) 中我們實現了新增組織部門信息功能,不過還存在一些BUG,如下圖。“自動展開和子級”沒有顯示,“上級組織”下拉框中沒有數據顯示。今天我們來繼續完善組織部門信息新增功能。

十、創建下拉框樹

        1. 在Visual Studio 2017的“解決方案資源管理器”中,右鍵單擊在領域層“ABP.TPLMS.Web.Mvc”項目中的Models目錄。 選擇“添加” > “新建文件夾”。并重命名為“Orgs”。

         2. 在Visual Studio 2017的“解決方案資源管理器”中,鼠標右鍵單擊“Org”文件夾,然后選擇“添加” > “新建項…”。 在“添加新項-ABP.TPLMS.Web.Mvc”對話框中,選擇“類”,并將名稱命名為TreeJsonModel.cs。代碼如下。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

 

namespace ABP.TPLMS.Web.Models.Orgs
{

    /// <summary>
    /// 構建Json數據源的數據格式,屬性有id,test,children,這里名字不能夠更改否則不能夠讀取出來

    /// </summary>
    public class TreeJsonViewModel
    {        

            /// <summary>
            /// ID
            /// </summary>
            public int id { get; set; }

            /// <summary>
            /// 分類
            /// </summary>
            public string text { get; set; }
/// <summary>
            /// 子類
            /// </summary>
            public List<TreeJsonViewModel> children { get; set; }

            /// <summary>
            /// 父ID
            /// </summary>
            public int parentId { get; set; }
            public string url { get; set; }
            public string state { get; set; }
    }

}
       3. 在Visual Studio 2017的“解決方案資源管理器”中,右鍵單擊在領域層“ABP.TPLMS.Web.Mvc”項目中的Controller目錄中找到OrgsController.cs文件,在此文件中輸入創建下拉列表樹的JSON代碼。
[DontWrapResult]
[HttpGet]
public JsonResult GetJsonTree()
{

    PagedOrgResultRequestDto paged = new PagedOrgResultRequestDto();
    var classlist = _orgAppService.GetAll(paged).GetAwaiter().GetResult().Items;
    List<TreeJsonViewModel> list = LinqJsonTree(classlist,0);

    return Json(list);

}

 /// <summary>
/// 遞歸
 /// </summary>
/// <param name="list"></param>
/// <returns></returns>

private List<TreeJsonViewModel> LinqJsonTree(IReadOnlyList<OrgDto> orgs,int parentId)
{

   List<TreeJsonViewModel> jsonData = new List<TreeJsonViewModel>();
  List<OrgDto> classlist = orgs.Where(m => m.ParentId == parentId).ToList();

   classlist.ToList().ForEach(item =>
   {

       jsonData.Add(new TreeJsonViewModel
       {

          id = item.Id,
          children = LinqJsonTree(orgs, item.Id),
          parentId = item.ParentId,
          text = item.Name,
          url = string.Empty,
          state = parentId == 0 ? "open" : ""

       });
    });
       return jsonData;

 }

       4. 在Visual Studio 2017中按F5運行應用程序。登錄之后,點擊“[組織管理]”菜單,我們可以看到貨物管理列表頁面。然后點擊“添加”按鈕。如下圖。

 

      5.我們發現我們需要的“自動展開和子級”兩個Checkbox復選框沒有顯示,而且點擊“上級組織”的下拉箭頭,下拉列表中也沒有任何數據。我們在瀏覽器中按F12。會發現如下圖。

 

     6.對于上面的情況,是由于樣式沖突造成的。我們重寫對應的代碼。代碼如下。

<div id="divAddUpdOrg" class="easyui-dialog" closed="true" data-options="buttons: '#dlg-buttons'">
    <form name="OrgEditForm" role="form" novalidate class="form-validation">
        <table>
            <tr>
                <td><input type="hidden" name="Id" id="IDUpdate" /></td>
            </tr>
            <tr>
                <td>組織名稱:</td>
                <td>

                    <input type="text" id="NameUpdate" name="Name" class="form-control input-sm" />
                </td>
            </tr>

            <tr>
                <td> 組織代碼:</td>
                <td><input type="text" id="UpdBizCode" name="BizCode" class="form-control input-sm" /></td>

            </tr>
            <tr>

                <td>類型:</td>
                <td>
                    <input type="text" id="UpdType" name="Type" class="form-control input-sm" />
                </td>
            </tr>
            <tr>

                <td> 關區代碼:</td>
                <td><input type="text" id="UpdCustomCode" name="CustomCode" class="form-control input-sm" /></td>
            </tr>
            <tr>
                <td>自動展開:</td>
                <td>
                    <div class="form-control input-sm">
                        <input type="checkbox" name="IsAutoExpand" value="true" id="UpdIsAutoExpand" 
class
="filled-in" checked /> <label for="UpdIsAutoExpand"></label> </div> </td> </tr> <tr> <td>子級:</td> <td> <div class="form-control input-sm"> <input type="checkbox" name="IsLeaf" value="true" id="UpdIsLeaf" class="filled-in" checked /> <label for="UpdIsLeaf"></label> </div> </td> </tr> <tr> <td>狀態:</td> <td> <input type="text" id="UpdStatus" name="Status" class="form-control input-sm" /> </td> </tr> <tr> <td>上級組織:</td> <td> <input id="AddTree" name="ParentName" class="easyui-combotree" /> </td> </tr> <tr> <td>熱鍵:</td> <td> <input id="UpdHotKey" name="HotKey" class="form-control input-sm" /> </td> </tr> <tr> <td>圖標:</td> <td> <input id="UpdIconName" name="IconName" class="form-control input-sm" /> </td> </tr> <tr> <td> <input id="UpdParentId" name="ParentId" type="hidden" /> </td> </tr> <tr> <td>備注:</td> <td> <input type="text" id="RemarkUpdate" name="URemark" class="form-control input-sm" /> </td> </tr> </table> </form> </div>

 

 

 

posted @ 2019-12-20 14:24  DotNet菜園  閱讀(...)  評論(...收藏