點(diǎn)擊上方藍(lán)字"小黑在哪里"關(guān)注我吧

• 擴(kuò)展實(shí)體

• 路由整理

前言

上一篇實(shí)現(xiàn)了前端vue部分的用戶(hù)登錄和菜單權(quán)限控制，但是有一些問(wèn)題需要解決，比如用戶(hù)頭像、用戶(hù)介紹字段目前還沒(méi)有，下面就來(lái)完善一下。

開(kāi)始

因?yàn)橛脩?hù)實(shí)體是ABP模板自動(dòng)生成的，其中的屬性都預(yù)先定義好了，但是ABP是允許我們擴(kuò)展模塊實(shí)體的，我們可以通過(guò)擴(kuò)展用戶(hù)實(shí)體來(lái)增加用戶(hù)頭像和用戶(hù)介紹字段。

擴(kuò)展實(shí)體

ABP支持多種擴(kuò)展實(shí)體的方式：

將所有擴(kuò)展屬性以json格式存儲(chǔ)在同一個(gè)數(shù)據(jù)庫(kù)字段中

將每個(gè)擴(kuò)展屬性存儲(chǔ)在獨(dú)立的數(shù)據(jù)庫(kù)字段中

創(chuàng)建一個(gè)新的實(shí)體類(lèi)映射到原有實(shí)體的同一個(gè)數(shù)據(jù)庫(kù)表中

創(chuàng)建一個(gè)新的實(shí)體類(lèi)映射到獨(dú)立的數(shù)據(jù)庫(kù)表中

這里選擇第2種方式就好，它們的具體區(qū)別請(qǐng)見(jiàn)官網(wǎng)：擴(kuò)展實(shí)體^[1]

src\Xhznl.HelloAbp.Domain\Users\AppUser.cs：

///?<summary> ///?頭像 ///?</summary> public?string?Avatar?{?get;?set;?}///?<summary> ///?個(gè)人介紹 ///?</summary> public?string?Introduction?{?get;?set;?}

src\Xhznl.HelloAbp.EntityFrameworkCore\EntityFrameworkCore\HelloAbpDbContext.cs：

builder.Entity<AppUser>(b?=> {。。。。。。b.Property(x?=>?x.Avatar).IsRequired(false).HasMaxLength(AppUserConsts.MaxAvatarLength).HasColumnName(nameof(AppUser.Avatar));b.Property(x?=>?x.Introduction).IsRequired(false).HasMaxLength(AppUserConsts.MaxIntroductionLength).HasColumnName(nameof(AppUser.Introduction)); });

src\Xhznl.HelloAbp.EntityFrameworkCore\EntityFrameworkCore\HelloAbpEfCoreEntityExtensionMappings.cs：

OneTimeRunner.Run(()?=> {ObjectExtensionManager.Instance.MapEfCoreProperty<IdentityUser,?string>(nameof(AppUser.Avatar),b?=>?{?b.HasMaxLength(AppUserConsts.MaxAvatarLength);?}).MapEfCoreProperty<IdentityUser,?string>(nameof(AppUser.Introduction),b?=>?{?b.HasMaxLength(AppUserConsts.MaxIntroductionLength);?}); });

src\Xhznl.HelloAbp.Application.Contracts\HelloAbpDtoExtensions.cs：

OneTimeRunner.Run(()?=> {ObjectExtensionManager.Instance.AddOrUpdateProperty<string>(new[]{typeof(IdentityUserDto),typeof(IdentityUserCreateDto),typeof(IdentityUserUpdateDto),typeof(ProfileDto),typeof(UpdateProfileDto)},"Avatar").AddOrUpdateProperty<string>(new[]{typeof(IdentityUserDto),typeof(IdentityUserCreateDto),typeof(IdentityUserUpdateDto),typeof(ProfileDto),typeof(UpdateProfileDto)},"Introduction"); });

注意最后一步，Dto也需要添加擴(kuò)展屬性，不然就算你實(shí)體中已經(jīng)有了新字段，但接口依然獲取不到。

然后就是添加遷移更新數(shù)據(jù)庫(kù)了：

Add-Migration Added_AppUser_Properties

Update-Database ?也可以不用update，運(yùn)行DbMigrator項(xiàng)目來(lái)更新

查看數(shù)據(jù)庫(kù)，AppUsers表已經(jīng)生成這2個(gè)字段了：

目前還沒(méi)做設(shè)置界面，我先手動(dòng)給2個(gè)初始值：

再次請(qǐng)求/api/identity/my-profile接口，已經(jīng)返回了這2個(gè)擴(kuò)展字段：

修改一下前端部分：

src\store\modules\user.js：

//?get?user?info getInfo({?commit?})?{return?new?Promise((resolve,?reject)?=>?{getInfo().then(response?=>?{const?data?=?response;if?(!data)?{reject("Verification?failed,?please?Login?again.");}const?{?name,?extraProperties?}?=?data;commit("SET_NAME",?name);commit("SET_AVATAR",?extraProperties.Avatar);commit("SET_INTRODUCTION",?extraProperties.Introduction);resolve(data);}).catch(error?=>?{reject(error);});}); },

刷新界面，右上角的用戶(hù)頭像就回來(lái)了：

路由整理

刪除掉vue-element-admin多余的路由，并添加ABP模板自帶的身份認(rèn)證管理和租戶(hù)管理。

src\router\index.js：

/*?Router?Modules?*/ import?identityRouter?from?"./modules/identity"; import?tenantRouter?from?"./modules/tenant";export?const?asyncRoutes?=?[/**?when?your?routing?map?is?too?long,?you?can?split?it?into?small?modules?**/identityRouter,tenantRouter,//?404?page?must?be?placed?at?the?end?!!!{?path:?"*",?redirect:?"/404",?hidden:?true?} ];

src\router\modules\identity.js：

/**?When?your?routing?table?is?too?long,?you?can?split?it?into?small?modules?**/import?Layout?from?"@/layout";const?identityRouter?=?{path:?"/identity",component:?Layout,redirect:?"noRedirect",name:?"Identity",meta:?{title:?"identity",icon:?"user"},children:?[{path:?"roles",component:?()?=>?import("@/views/identity/roles"),name:?"Roles",meta:?{?title:?"roles",?policy:?"AbpIdentity.Roles"?}},{path:?"users",component:?()?=>?import("@/views/identity/users"),name:?"Users",meta:?{?title:?"users",?policy:?"AbpIdentity.Users"?}}] }; export?default?identityRouter;

src\router\modules\tenant.js：

/**?When?your?routing?table?is?too?long,?you?can?split?it?into?small?modules?**/import?Layout?from?"@/layout";const?tenantRouter?=?{path:?"/tenant",component:?Layout,redirect:?"/tenant/tenants",alwaysShow:?true,name:?"Tenant",meta:?{title:?"tenant",icon:?"tree"},children:?[{path:?"tenants",component:?()?=>?import("@/views/tenant/tenants"),name:?"Tenants",meta:?{?title:?"tenants",?policy:?"AbpTenantManagement.Tenants"?}}] }; export?default?tenantRouter;

運(yùn)行效果：

對(duì)應(yīng)ABP模板界面：

最后

本篇介紹了ABP擴(kuò)展實(shí)體的基本使用，并且整理了前端部分的系統(tǒng)菜單，但是菜單的文字顯示不對(duì)。下一篇將介紹ABP本地化，讓系統(tǒng)文字支持多國(guó)語(yǔ)言。

參考資料

[1]

擴(kuò)展實(shí)體: https://docs.abp.io/zh-Hans/abp/latest/Customizing-Application-Modules-Extending-Entities

如果本文對(duì)您有用，

不妨點(diǎn)個(gè)“在看”或者轉(zhuǎn)發(fā)朋友圈支持一下

總結(jié)

以上是生活随笔為你收集整理的初识ABP vNext（5）：ABP扩展实体的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。