vue.js el-cascader控件的应用

最近自己在学习过程中,由于是datafirst,发现科室、人员、科室人员关系表,生成el-cascader所需要的json数据时,组织特别麻烦。现在问题已经解决。方法如下。

1、官网目标数据格式如下:https://element.eleme.cn/#/zh-CN/component/cascader

vue.js el-cascader控件的应用_第1张图片

2、我的表结构如下

1、科室

vue.js el-cascader控件的应用_第2张图片

2、人员主要如下,(其他字段 可以忽略)

vue.js el-cascader控件的应用_第3张图片

3、科室人员关系表:

vue.js el-cascader控件的应用_第4张图片

4、新建了一个虚拟的实体类 用来转换需要的目标结构

vue.js el-cascader控件的应用_第5张图片

 5、具体的代码如下

vue.js el-cascader控件的应用_第6张图片

public ActionResult GetDeptUserList()
        {
            FMSEntities fms = new FMSEntities();
            string sessionusrCompany = CurrentUser.User_company.ToString().Trim();
            List dpR = fms.RL_User_Dept.ToList();
            List tu = fms.T_User.Where(t => t.User_company == sessionusrCompany).ToList();
            List d = fms.CT_Dept.Where(t => t.dept_co_code == sessionusrCompany).ToList();
            var list = from T1 in dpR
                       join T2 in tu on T1.user_id equals T2.User_id
                       select new { value = T2.User_id,label = T2.User_name ,deptid=T1.dp_id};

            List listA = new List();
            try
            {
                foreach (var item in d)
                {
                   DeptUserClass bduser = new DeptUserClass();
                    bduser.label = item.dept_name.Trim();
                    bduser.value = item.dept_id.ToString().Trim();
                    bduser.children = null;
                    List duchildrens = new List();
                    foreach (var item1 in list)
                    {
                        if (item1.deptid == item.dept_id)
                        {
                            DeptUserClass duser = new DeptUserClass();
                            duser.label = item1.label.ToString().Trim();
                            duser.value = item1.value.ToString().Trim();
                            duchildrens.Add(duser);
                        }
                        bduser.children = duchildrens;

                    }
                    listA.Add(bduser);
                }

            }
            catch (Exception)
            {

                throw;
            }
           

         

            return Json(new { code = 0, data = listA }, JsonRequestBehavior.AllowGet);
            //return View();
        }

 

你可能感兴趣的:(vue,C#,mvc)