vue-vben-admin 与.net core 结合实例 【自学与教学 小白教程】—第4节—部门管理

ue-vben-admin 与.net core 结合实例 这里计划使用.net core 作为后端 。目标：打造好看 易用 开箱即用 的netcore一体化框架。Vue Vben Admin For NetCore 取命 hcrain-vvadmin 我不是前端人员 但有时开发还是要写一些界面。

之前使用layui是时候 狠心升级下了。

只为了好看———-于是 小白教程来了。可以根据 git提交一步步来重现我的实现。

【后面会发布到在线 效果预览还没发布啊 我要将它改造成我自己想要的。要时间。这里占个坑而已。不回改文章了。】

目录

目录

第4节—部门列表的增删查改及对应API开发

​编辑

目录

第4节—部门列表（树形列表）的增删查改及对应API开发

​编辑​

1部门表定义

2部门表API开发及定义

3列表新的接触

表单页

git提交参考

1部门表定义

2部门表API开发及定义

本系列文章后在还说会什么?

第4节—部门列表（树形列表）的增删查改及对应API开发

​

1部门表定义

因为是层级结构 这里定义子级数据对象Children

/// 
/// 部门/// 
public class SysDep : RootEntityBase{public SysDep(){CreatedTime = DateTime.Now;}/// 
/// 机构代码/// 
public string OrgCode { get; set; }/// 
/// 上级代码/// 
public int ParentId { get; set; } = 0;/// 
/// 所属机构/// 
public long OrgId { get; set; }/// 
/// 部门名称/// 
public string DepName { get; set; }/// 
/// 部门代码/// 
public string DepCode { get; set; }/// 
/// 排序/// 
public int OrderNo { get; set; }/// 
/// 添加时间/// 
[SugarColumn(IndexGroupNameList = new string[] { "index_time1" })]public DateTime CreatedTime { get; set; }/// 
/// （子级）不映射数据库字段/// 
[SugarColumn(IsIgnore = true)]public List Children { get; set; }}

2部门表API开发及定义

系统使用ORM框架 —SqlSugar 有多好用 ，这里就不说了，建议.net 人员多支持。

后台系统对单表实现了所有的常规接口，不需要开发。只要单独开发树形查询接口即可。

添加/删除/导入/导出/统计/查询/列新

​

这里要单独实现非标准接口 树结构查询 。SqlSugar有支持，使用即可ToTree。

/// 
/// 部门/// 
[Route("api/[controller]/[action]")][ApiController]public class SysDepController : BaseSimpleController{public SysDepController(IUnitOfWork unitOfWork, IBaseRepository rep, IWebHostEnvironment env){ base._env = env;base._rep = rep;base._unitOfWork = unitOfWork;}/// 
/// 查询树/// 
/// /// [HttpPost]publicasync Task<ResultMo<List>> SearchTree(QueryPageInput input){input.queryKeyValue.Add(new AndWhere {FieldName= "ParentId", FieldValue="0"} );var main = await _rep.QueryPage(input);var Ids = main.data.Select(m => m.Id).ToList();var re = await _rep.Db.Queryable().Where(m => Ids.Contains(m.Id)|| Ids.Contains(m.ParentId)).ToTreeAsync(it => it.Children, it => it.ParentId, 0);re.ForEach(m =>{if (m.Children == null) m.Children = new List { };});return new ResultMo<List>(re, main.dataCount);}}

3列表新的接触

1查询时间段，数据处理

 console.log(prams);postsearch = [];for (let pS in prams) {if (pS != "page" && pS != "pageSize" && prams[pS]!=undefined) {if (pS.startsWith('find_rp_')) {//find_g_find_s_console.log('日期2');console.log(pS.replace('find_rp_',''));postsearch.push({fieldName: 'find_g_'+pS.replace('find_rp_',''),fieldValue: prams[pS][0]});postsearch.push({fieldName:'find_s_'+pS.replace('find_rp_',''),fieldValue: prams[pS][1]});}else {postsearch.push({fieldName: pS,fieldValue: prams[pS]});}}}

2树形的不用单独配置 他本身有字级后 会自动处理？我也不明白，哈哈。（开关没找到）

表单页

下拉数据的转换。

使用apiselect 只会第一次进行会加载，后面不会更新，那位大神可以告诉二次进入也可以更新的方法？

这里改成 select 每次进入接取绑定。

//下接数据获取var postsearch = [{ fieldName: 'ParentId', fieldValue: '0' }];postsearch.push({fieldName: 'find_q_orgCode',fieldValue: useUserStore().getUserInfo.orgCode});const listdata = await HcrainPost('/api/SysDep/Search', {queryKeyValue: postsearch,});var stype = [{}];for (let i in listdata.data) {stype.push({label: listdata.data[i]['depName'],value: listdata.data[i]['id']});}console.log(stype);//将数据放到下拉框上updateSchema({field: 'parentId',componentProps: {options: unref(stype),},});

git提交参考

​

多谢