412 Second entity of ABP framework applications - chempkovsky/CS82ANGULAR GitHub Wiki

Note

Entity

Modify DBContext

Dto

Web Api

Typescript Classes

Result

Note

Our second entity will be PhbkEnterprise. We just follow the same steps as for 020 Second entity: Enterprise

Entity

In the Phbk folder of the rupbes.firstapp.Domain.csproj project, create a class as shown below. We inherit the class from Entity

Click to show the code

using System;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;
using Volo.Abp;
using Volo.Abp.Auditing;
using Volo.Abp.Domain.Entities;
using Volo.Abp.MultiTenancy;

namespace rupbes.firstapp.Phbk
{
    public class PhbkEnterprise : Entity<int>, IMultiTenant, IHasConcurrencyStamp
    {
        [DatabaseGenerated(DatabaseGeneratedOption.None)]
        [Display(Description = "Row id", Name = "Id of the Enterprise", Prompt = "Enter Enterprise  Id", ShortName = "Enterprise Id")]
        [Required]
        public override int Id { get; protected set; } = default!;

        [Display(Description = "Name of the Enterprise", Name = "Name of the Enterprise", Prompt = "Enter Enterprise Name", ShortName = "Enterprise Name")]
        [StringLength(20, MinimumLength = 3, ErrorMessage = "Invalid")]
        [Required]
        public string EntrprsName { get; protected set; } = null!;

        [Display(Description = "Description of the Enterprise", Name = "Description of the Enterprise", Prompt = "Description Enterprise Name", ShortName = "Enterprise Description")]
        [StringLength(250, ErrorMessage = "Invalid")]
        public string? EntrprsDesc { get; protected set; }

        [DisableAuditing]
        [Display(Description = "Concurrency Stamp", Name = "Concurrency Stamp", Prompt = "Enter Concurrency Stamp", ShortName = "Concurrency Stamp")]
        [StringLength(40, MinimumLength = 0, ErrorMessage = "Invalid")]
        [Required]
        [ConcurrencyCheck]
        public virtual string ConcurrencyStamp { get; set; } = default!;


        [Display(Description = "Tenant id", Name = "Tenant Id", Prompt = "Enter Tenant Id", ShortName = "Tenant Id")]
        public virtual Guid? TenantId { get; protected set; }

        public PhbkEnterprise() : base()
        {
            ConcurrencyStamp = Guid.NewGuid().ToString("N");
        }

        public PhbkEnterprise(int id, string entrprsName, string? entrprsDesc) : base(id)
        {
            Check.NotNullOrWhiteSpace(entrprsName, nameof(EntrprsName));
            EntrprsName = entrprsName;
            EntrprsDesc = entrprsDesc;
            ConcurrencyStamp = Guid.NewGuid().ToString("N");
        }

        public virtual void ChangeVals(string entrprsName, string? entrprsDesc, string concurrencyStamp)
        {
            Check.NotNullOrWhiteSpace(entrprsName, nameof(EntrprsName));
            EntrprsName = entrprsName;
            EntrprsDesc = entrprsDesc;
            ConcurrencyStamp = concurrencyStamp;
        }

    }
}

Modify DBContext

Repeat the steps of the 403 Modify DBContext for the first entity (PhoneType). OnModelCreating must be as follows:

Click to show the code

    protected override void OnModelCreating(ModelBuilder builder)
    {

#if (!NOTMODELING)
        builder.Entity<PhbkFile>().HasKey(p => new { p.FileId, p.FlNm });
        builder.Entity<PhbkPhoneType>().HasKey(p => p.Id);
        builder.Entity<PhbkEnterprise>().HasKey(p => p.Id);
#endif
        base.OnModelCreating(builder);
        /* Include modules to your migration db context */
        builder.ConfigurePermissionManagement();
        builder.ConfigureSettingManagement();
        builder.ConfigureBackgroundJobs();
        builder.ConfigureAuditLogging();
        builder.ConfigureFeatureManagement();
        builder.ConfigureIdentity();
        builder.ConfigureOpenIddict();
        builder.ConfigureTenantManagement();
        builder.ConfigureBlobStoring();
        /* Configure your own tables/entities inside here */
        //builder.Entity<YourEntity>(b =>
        //{
        //    b.ToTable(firstappConsts.DbTablePrefix + "YourEntities", firstappConsts.DbSchema);
        //    b.ConfigureByConvention(); //auto configure for the base class props
        //    //...
        //});
        builder.ConfigurefirstappDbContext();
    }

ConfigurefirstappDbContext must be as follows:

    public static class firstappDbContextCreatingExtensions
    {
        public static void ConfigurefirstappDbContext(
            this ModelBuilder builder)
        {
            Check.NotNull(builder, nameof(builder));

            builder.Entity<PhbkPhoneType>(b =>
            {
                b.ToTable(firstappConsts.DbTablePrefix + "PhbkPhoneTypes", firstappConsts.DbSchema);
                b.ConfigureByConvention(); //auto configure for the base class props
                                           //...
                b.HasKey(p => p.Id);
            });
            builder.Entity<PhbkFile>(b =>
            {
                b.ToTable(firstappConsts.DbTablePrefix + "PhbkFiles", firstappConsts.DbSchema);
                b.ConfigureByConvention(); //auto configure for the base class props
                                           //...
                b.HasKey(p => new { p.FileId, p.FlNm });
            });
            builder.Entity<PhbkEnterprise>(b =>
            {
                b.ToTable(firstappConsts.DbTablePrefix + "PhbkEnterprises", firstappConsts.DbSchema);
                b.ConfigureByConvention(); //auto configure for the base class props
                                           //...
                b.HasKey(p => p.Id);
            });

        }
    }

Dto

Repeat the steps of the 404 First View (PhoneType). Wizard repository

Click to show the picture

project structure

Web Api

Repeat the steps of the 405 First Web Api Service (PhoneType)

Click to show the picture

project structure

Typescript Classes

Repeat the steps of the 408 Typescript Classes for the First View of ABP framework.
Repeat the steps of the 409 Navigation aware typescript components for the First View of ABP framework.
UI List properties is as follows:

Click to show the picture

project structure

UI Form properties is as follows:

Click to show the picture

project structure

Modify app-routing.module.ts-file as follows:

Click to show the code

const enterprised: Routes = [

    { path: 'RDLPhbkEnterpriseDto', canActivate:[AppGlblSettingsServiceCanActivateFn],
        loadChildren: () => import('./components/phbk-enterprise-dto/phbk-enterprise-dto-rdl-lazy.routing.module').then(m => m.PhbkEnterpriseDtoRdlLazyRoutingModule),
        data: {pm:'firstapp.PhbkEnterpriseDto', vn: 'PhbkEnterpriseDto', va: 'l', ms: true, np: 'RDL', fh: 2, mh: 16, nh: 8, sf: true, /* title: 'Enterprises', */  dp: 1, uid: '5392aa88bfb54805bbe76627be90f037' }  },
];


const enterprise: Routes = [
    { path: 'PhbkEnterpriseDto/ViewPhbkEnterpriseDto/:hf2/:id2', canActivate:[AppGlblSettingsServiceCanActivateFn],
        loadChildren: () => import('./components/phbk-enterprise-dto/phbk-enterprise-dto-rv-lazy.routing.module').then(m => m.PhbkEnterpriseDtoRvLazyRoutingModule),
        data: {pm:'firstapp.PhbkEnterpriseDto', vn: 'PhbkEnterpriseDto', va: 'v', /* sf: true,  title: 'View Enterprise', */ hf: 'hf2',  id: 'id2', dp: 2}},

    { path: 'PhbkEnterpriseDto/AddPhbkEnterpriseDto/:hf2', canActivate:[AppGlblSettingsServiceCanActivateFn],
        loadChildren: () => import('./components/phbk-enterprise-dto/phbk-enterprise-dto-ra-lazy.routing.module').then(m => m.PhbkEnterpriseDtoRaLazyRoutingModule),
        data: {pm:'firstapp.PhbkEnterpriseDto.a', vn: 'PhbkEnterpriseDto', va: 'a', /* sf: true,  title: 'Add Enterprise', */ hf: 'hf2',  dp: 2}},

    { path: 'PhbkEnterpriseDto/UpdPhbkEnterpriseDto/:hf2/:id2', canActivate:[AppGlblSettingsServiceCanActivateFn],
        loadChildren: () => import('./components/phbk-enterprise-dto/phbk-enterprise-dto-ru-lazy.routing.module').then(m => m.PhbkEnterpriseDtoRuLazyRoutingModule),
        data: {pm:'firstapp.PhbkEnterpriseDto.u', vn: 'PhbkEnterpriseDto', va: 'u', /* sf: true,  title: 'Update Enterprise', */ hf: 'hf2',  id: 'id2',  dp: 2}},

    { path: 'PhbkEnterpriseDto/DelPhbkEnterpriseDto/:hf2/:id2', canActivate:[AppGlblSettingsServiceCanActivateFn],
        loadChildren: () => import('./components/phbk-enterprise-dto/phbk-enterprise-dto-rd-lazy.routing.module').then(m => m.PhbkEnterpriseDtoRdLazyRoutingModule),
        data: {pm:'firstapp.PhbkEnterpriseDto.d', vn: 'PhbkEnterpriseDto', va: 'd', /* sf: true,  title: 'Delete Enterprise', */ hf: 'hf2',  id: 'id2',  dp: 2}},

    { path: 'PhbkEnterpriseDto', canActivate:[AppGlblSettingsServiceCanActivateFn], 
        loadChildren: () => import('./components/phbk-enterprise-dto/phbk-enterprise-dto-rl-lazy.routing.module').then(m => m.PhbkEnterpriseDtoRlLazyRoutingModule),
        data: {pm:'firstapp.PhbkEnterpriseDto', vn: 'PhbkEnterpriseDto', va: 'l', ms: true,  fh: 2, mh: 16, nh: 8, sf: true, /* title: 'Enterprises', */  dp: 1, uid: '2596e7e980b64a8887d5e87defda9045' }  },

];

const routes: Routes = [
...
];

...

@NgModule({
  imports: [RouterModule.forRoot([...enterprised, ...enterprise, ...phonetypesd, ...phonetypes, ...routes], {})],
  exports: [RouterModule],
})
export class AppRoutingModule {}

Modify route.provider.ts-file as follows:

Click to show the code

import { RoutesService, eLayoutType } from '@abp/ng.core';
import { inject, provideAppInitializer } from '@angular/core';

export const APP_ROUTE_PROVIDER = [
  provideAppInitializer(() => {
    configureRoutes();
  }),
];

function configureRoutes() {
  const routes = inject(RoutesService);
  routes.add([
      {
        path: '/',
        name: '::Menu:Home',
        iconClass: 'fas fa-home',
        order: 1,
        layout: eLayoutType.application,
      },
      {
        path: '/RDLPhbkPhoneTypeDto',
        name: 'Phone Type Dlg',
        requiredPolicy: 'firstapp.PhbkPhoneTypeDto',
        iconClass: 'fas fa-phone',
        order: 20,
        layout: eLayoutType.application,
      },
      {
        path: '/PhbkPhoneTypeDto',
        name: 'Phone Type',
        requiredPolicy: 'firstapp.PhbkPhoneTypeDto',
        iconClass: 'fas fa-phone',
        order: 30,
        layout: eLayoutType.application,
      },

      {
        path: '/RDLPhbkFileDto',
        name: 'Phone book file Dlg',
        requiredPolicy: 'firstapp.PhbkFileDto',
        iconClass: 'fas fa-file',
        order: 40,
        layout: eLayoutType.application,
      },
      {
        path: '/PhbkFileDto',
        name: 'Phone book file',
        requiredPolicy: 'firstapp.PhbkFileDto',
        iconClass: 'fas fa-file',
        order: 50,
        layout: eLayoutType.application,
      }


      {
        name: 'firstapp::Psn:PhbkEnterpriseDto',
        group: 'firstapp::Psn:PhbkEnterpriseDto',
        order: 11,
        iconClass: 'fas fa-building',
      },      
      {
        path: '/RDLPhbkEnterpriseDto',
        name: 'Enterprise Dlg',
        requiredPolicy: 'firstapp.PhbkEnterpriseDto',
        iconClass: 'fas fa-building',
        parentName: 'firstapp::Psn:PhbkEnterpriseDto',
        order: 40,
        layout: eLayoutType.application,
      },
      {
        path: '/PhbkEnterpriseDto',
        name: 'Enterprise',
        requiredPolicy: 'firstapp.PhbkEnterpriseDto',
        parentName: 'firstapp::Psn:PhbkEnterpriseDto',
        iconClass: 'fas fa-building',
        order: 50,
        layout: eLayoutType.application,
      },

  ]);
}

Result

Click to show the picture

project structure

412 Second entity of ABP framework applications - chempkovsky/CS82ANGULAR GitHub Wiki

Note

Entity

Modify DBContext

Dto

Web Api

Typescript Classes

Result

Note

Entity

Modify DBContext

Dto

Web Api

Typescript Classes

Result

⚠️ **GitHub.com Fallback** ⚠️

⚠️ GitHub.com Fallback ⚠️