欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之五(三十一)

程序员文章站 2023-11-10 21:42:58
在上一篇文章abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之四(三十) 中我们实现了新增组织部门信息功能,不过还存在一些BUG,如下图。“自动展开和子级”没有显示,“上级组织”下拉框中没有数据显示。今天我们来继续完善组织部门信... ......

abp(net core)+easyui+efcore实现仓储管理系统目录

abp(net core)+easyui+efcore实现仓储管理系统——abp总体介绍(一)
abp(net core)+easyui+efcore实现仓储管理系统——解决方案介绍(二)
abp(net core)+easyui+efcore实现仓储管理系统——领域层创建实体(三)
 abp(net core)+easyui+efcore实现仓储管理系统——定义仓储并实现 (四)

abp(net core)+easyui+efcore实现仓储管理系统——创建应用服务(五)

abp(net core)+easyui+efcore实现仓储管理系统——展现层实现增删改查之控制器(六)
abp(net core)+easyui+efcore实现仓储管理系统——展现层实现增删改查之列表视图(七)
abp(net core)+easyui+efcore实现仓储管理系统——展现层实现增删改查之增删改视图(八)
abp(net core)+easyui+efcore实现仓储管理系统——展现层实现增删改查之菜单与测试(九)
abp(net core)+easyui+efcore实现仓储管理系统——多语言(十)
abp(net core)+easyui+efcore实现仓储管理系统——使用 webapi实现curd (十一)
abp(net core)+easyui+efcore实现仓储管理系统——菜单-上 (十六)

abp(net core)+easyui+efcore实现仓储管理系统——easyui前端页面框架 (十八)

abp(net core)+easyui+efcore实现仓储管理系统——easyui之货物管理一 (十九)
abp(net core)+easyui+efcore实现仓储管理系统——easyui之货物管理六(二十四)
abp(net core)+easyui+efcore实现仓储管理系统——easyui之货物管理七(二十五)
abp(net core)+easyui+efcore实现仓储管理系统——easyui之货物管理八(二十六)
 abp(net core)+easyui+efcore实现仓储管理系统——abp webapi与easyui结合增删改查之一(二十七)
abp(net core)+easyui+efcore实现仓储管理系统——abp webapi与easyui结合增删改查之二(二十八)
 
 
 

         在上一篇文章abp(net core)+easyui+efcore实现仓储管理系统——abp webapi与easyui结合增删改查之四(三十) 中我们实现了新增组织部门信息功能,不过还存在一些bug,如下图。“自动展开和子级”没有显示,“上级组织”下拉框中没有数据显示。今天我们来继续完善组织部门信息新增功能。

abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之五(三十一)

十、创建下拉框树

        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运行应用程序。登录之后,点击“[组织管理]”菜单,我们可以看到货物管理列表页面。然后点击“添加”按钮。如下图。

 abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之五(三十一)

      5.我们发现我们需要的“自动展开和子级”两个checkbox复选框没有显示,而且点击“上级组织”的下拉箭头,下拉列表中也没有任何数据。我们在浏览器中按f12。会发现如下图。

 abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之五(三十一)

     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>