tsai
/
abp
mirror of https://github.com/abpframework/abp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Merge pull request #15585 from abpframework/issue/15467 

Angular UI minor improvements
pull/15758/head
Mahmut Gundogdu 4 years ago
committed by GitHub
parent
65b8941a6c b540eb1321
commit
e236d910f0
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 163 additions and 180 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 75
      npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.html
  2. 155
      npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
  3. 2
      npm/ng-packs/packages/identity/src/lib/identity.module.ts
  4. 103
      npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html
  5. 2
      npm/ng-packs/packages/tenant-management/src/lib/tenant-management.module.ts
  6. 2
      npm/ng-packs/packages/theme-shared/extensions/src/lib/components/page-toolbar/page-toolbar.component.html
  7. 2
      templates/app-nolayers/angular/package.json
  8. 2
      templates/app/angular/package.json

75
npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.html
View File

@ -1,48 +1,38 @@
<div id="identity-roles-wrapper" class="card"> <abp-page [title]="'AbpIdentity::Roles' | abpLocalization" [toolbar]="data.items">
<div class="card-header"> <div id="identity-roles-wrapper" class="card">
<div class="row"> <div class="card-body">
<div class="col col-md-6"> <abp-extensible-table
<h5 class="card-title">{{ 'AbpIdentity::Roles' | abpLocalization }}</h5> [data]="data.items"
</div> [recordsTotal]="data.totalCount"
<div class="text-end col col-md-6"> [list]="list"
<abp-page-toolbar [record]="data.items"></abp-page-toolbar> ></abp-extensible-table>
</div>
</div> </div>
</div> </div>
<div class="card-body"> <abp-modal [(visible)]="isModalVisible" [busy]="modalBusy">
<abp-extensible-table <ng-template #abpHeader>
[data]="data.items" <h3>{{ (selected?.id ? 'AbpIdentity::Edit' : 'AbpIdentity::NewRole') | abpLocalization }}</h3>
[recordsTotal]="data.totalCount" </ng-template>
[list]="list"
></abp-extensible-table>
</div>
</div>
<abp-modal [(visible)]="isModalVisible" [busy]="modalBusy">
<ng-template #abpHeader>
<h3>{{ (selected?.id ? 'AbpIdentity::Edit' : 'AbpIdentity::NewRole') | abpLocalization }}</h3>
</ng-template>
<ng-template #abpBody> <ng-template #abpBody>
<form [formGroup]="form" (ngSubmit)="save()" validateOnSubmit> <form [formGroup]="form" (ngSubmit)="save()" validateOnSubmit>
<abp-extensible-form [selectedRecord]="selected"></abp-extensible-form> <abp-extensible-form [selectedRecord]="selected"></abp-extensible-form>
</form> </form>
</ng-template> </ng-template>
<ng-template #abpFooter> <ng-template #abpFooter>
<button type="button" class="btn btn-secondary" abpClose> <button type="button" class="btn btn-secondary" abpClose>
{{ 'AbpIdentity::Cancel' | abpLocalization }} {{ 'AbpIdentity::Cancel' | abpLocalization }}
</button> </button>
<abp-button iconClass="fa fa-check" [disabled]="form?.invalid" (click)="save()">{{ <abp-button iconClass="fa fa-check" [disabled]="form?.invalid" (click)="save()">{{
'AbpIdentity::Save' | abpLocalization 'AbpIdentity::Save' | abpLocalization
}}</abp-button> }}</abp-button>
</ng-template> </ng-template>
</abp-modal> </abp-modal>
<abp-permission-management <abp-permission-management
#abpPermissionManagement="abpPermissionManagement" #abpPermissionManagement="abpPermissionManagement"
*abpReplaceableTemplate=" *abpReplaceableTemplate="
{ {
inputs: { inputs: {
providerName: { value: 'R' }, providerName: { value: 'R' },
@ -55,6 +45,7 @@
}; };
let init = initTemplate let init = initTemplate
" "
(abpInit)="init(abpPermissionManagement)" (abpInit)="init(abpPermissionManagement)"
> >
</abp-permission-management> </abp-permission-management>
</abp-page>

155
npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
View File

@ -1,89 +1,83 @@
<div id="identity-roles-wrapper" class="card"> <abp-page [title]="'AbpIdentity::Users' | abpLocalization" [toolbar]="data.items">
<div class="card-header">
<div class="row"> <div id="identity-roles-wrapper" class="card">
<div class="col col-md-6"> <div class="card-body">
<h5 class="card-title">{{ 'AbpIdentity::Users' | abpLocalization }}</h5> <div id="data-tables-table-filter" class="data-tables-filter mb-3">
</div> <div class="input-group">
<div class="text-end col col-md-6"> <input
<abp-page-toolbar [record]="data.items"></abp-page-toolbar> type="search"
</div> class="form-control"
</div> [placeholder]="'AbpUi::PagerSearch' | abpLocalization"
</div> [(ngModel)]="list.filter"
<div class="card-body"> />
<div id="data-tables-table-filter" class="data-tables-filter"> </div>
<div class="input-group">
<input
type="search"
class="form-control"
[placeholder]="'AbpUi::PagerSearch' | abpLocalization"
[(ngModel)]="list.filter"
/>
</div> </div>
</div>
<abp-extensible-table <abp-extensible-table
[data]="data.items" [data]="data.items"
[recordsTotal]="data.totalCount" [recordsTotal]="data.totalCount"
[list]="list" [list]="list"
></abp-extensible-table> ></abp-extensible-table>
</div>
</div> </div>
</div>
<abp-modal [(visible)]="isModalVisible" [busy]="modalBusy"> <abp-modal [(visible)]="isModalVisible" [busy]="modalBusy">
<ng-template #abpHeader> <ng-template #abpHeader>
<h3>{{ (selected?.id ? 'AbpIdentity::Edit' : 'AbpIdentity::NewUser') | abpLocalization }}</h3> <h3>{{ (selected?.id ? 'AbpIdentity::Edit' : 'AbpIdentity::NewUser') | abpLocalization }}</h3>
</ng-template> </ng-template>
<ng-template #abpBody> <ng-template #abpBody>
<ng-template #loaderRef <ng-template #loaderRef
><div class="text-center"><i class="fa fa-pulse fa-spinner"></i></div >
></ng-template> <div class="text-center"><i class="fa fa-pulse fa-spinner"></i></div
>
</ng-template>
<form *ngIf="form; else loaderRef" [formGroup]="form" (ngSubmit)="save()"> <form *ngIf="form; else loaderRef" [formGroup]="form" (ngSubmit)="save()">
<ul ngbNav #nav="ngbNav" class="nav-tabs"> <ul ngbNav #nav="ngbNav" class="nav-tabs">
<li ngbNavItem> <li ngbNavItem>
<a ngbNavLink>{{ 'AbpIdentity::UserInformations' | abpLocalization }}</a> <a ngbNavLink>{{ 'AbpIdentity::UserInformations' | abpLocalization }}</a>
<ng-template ngbNavContent> <ng-template ngbNavContent>
<abp-extensible-form [selectedRecord]="selected"></abp-extensible-form> <abp-extensible-form [selectedRecord]="selected"></abp-extensible-form>
</ng-template> </ng-template>
</li> </li>
<li ngbNavItem> <li ngbNavItem>
<a ngbNavLink>{{ 'AbpIdentity::Roles' | abpLocalization }}</a> <a ngbNavLink>{{ 'AbpIdentity::Roles' | abpLocalization }}</a>
<ng-template ngbNavContent> <ng-template ngbNavContent>
<div <div
*ngFor="let roleGroup of roleGroups; let i = index; trackBy: trackByFn" *ngFor="let roleGroup of roleGroups; let i = index; trackBy: trackByFn"
class="form-check mb-2" class="form-check mb-2"
> >
<input <input
type="checkbox" type="checkbox"
class="form-check-input" class="form-check-input"
[attr.id]="'roles-' + i" [attr.id]="'roles-' + i"
[formControl]="roleGroup.controls[roles[i].name]" [formControl]="roleGroup.controls[roles[i].name]"
/> />
<label class="form-check-label" [attr.for]="'roles-' + i">{{ roles[i].name }}</label> <label class="form-check-label" [attr.for]="'roles-' + i">{{ roles[i].name }}</label>
</div> </div>
</ng-template> </ng-template>
</li> </li>
</ul> </ul>
<div class="mt-2 fade-in-top" [ngbNavOutlet]="nav"></div> <div class="mt-2 fade-in-top" [ngbNavOutlet]="nav"></div>
</form> </form>
</ng-template> </ng-template>
<ng-template #abpFooter> <ng-template #abpFooter>
<button type="button" class="btn btn-secondary" abpClose> <button type="button" class="btn btn-secondary" abpClose>
{{ 'AbpIdentity::Cancel' | abpLocalization }} {{ 'AbpIdentity::Cancel' | abpLocalization }}
</button> </button>
<abp-button iconClass="fa fa-check" [disabled]="form?.invalid" (click)="save()">{{ <abp-button iconClass="fa fa-check" [disabled]="form?.invalid" (click)="save()">{{
'AbpIdentity::Save' | abpLocalization 'AbpIdentity::Save' | abpLocalization
}}</abp-button> }}</abp-button>
</ng-template> </ng-template>
</abp-modal> </abp-modal>
<abp-permission-management <abp-permission-management
#abpPermissionManagement="abpPermissionManagement" #abpPermissionManagement="abpPermissionManagement"
*abpReplaceableTemplate=" *abpReplaceableTemplate="
{ {
inputs: { inputs: {
providerName: { value: 'U' }, providerName: { value: 'U' },
@ -95,7 +89,8 @@
}; };
let init = initTemplate let init = initTemplate
" "
[entityDisplayName]="entityDisplayName" [entityDisplayName]="entityDisplayName"
(abpInit)="init(abpPermissionManagement)" (abpInit)="init(abpPermissionManagement)"
> >
</abp-permission-management> </abp-permission-management>
</abp-page>

2
npm/ng-packs/packages/identity/src/lib/identity.module.ts
View File

@ -17,6 +17,7 @@ import {
IDENTITY_ENTITY_PROP_CONTRIBUTORS, IDENTITY_ENTITY_PROP_CONTRIBUTORS,
IDENTITY_TOOLBAR_ACTION_CONTRIBUTORS, IDENTITY_TOOLBAR_ACTION_CONTRIBUTORS,
} from './tokens/extensions.token'; } from './tokens/extensions.token';
import { PageModule } from '@abp/ng.components/page';
@NgModule({ @NgModule({
declarations: [RolesComponent, UsersComponent], declarations: [RolesComponent, UsersComponent],
@ -30,6 +31,7 @@ import {
NgbDropdownModule, NgbDropdownModule,
PermissionManagementModule, PermissionManagementModule,
NgxValidateCoreModule, NgxValidateCoreModule,
PageModule,
], ],
}) })
export class IdentityModule { export class IdentityModule {

103
npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html
View File

@ -1,63 +1,55 @@
<div id="wrapper" class="card"> <abp-page [title]="'AbpTenantManagement::Tenants' | abpLocalization" [toolbar]="data.items">
<div class="card-header">
<div class="row">
<div class="col col-md-6">
<h5 class="card-title">{{ 'AbpTenantManagement::Tenants' | abpLocalization }}</h5>
</div>
<div class="text-end col col-md-6">
<abp-page-toolbar [record]="data.items"></abp-page-toolbar>
</div>
</div>
</div>
<div class="card-body">
<div id="data-tables-table-filter" class="data-tables-filter"> <div id="wrapper" class="card">
<div class="input-group"> <div class="card-body">
<input <div id="data-tables-table-filter" class="data-tables-filter mb-3">
type="search" <div class="input-group">
class="form-control" <input
[placeholder]="'AbpUi::PagerSearch' | abpLocalization" type="search"
[(ngModel)]="list.filter" class="form-control"
/> [placeholder]="'AbpUi::PagerSearch' | abpLocalization"
[(ngModel)]="list.filter"
/>
</div>
</div> </div>
</div>
<abp-extensible-table <abp-extensible-table
[data]="data.items || []" [data]="data.items || []"
[recordsTotal]="data.totalCount || 0" [recordsTotal]="data.totalCount || 0"
[list]="list" [list]="list"
></abp-extensible-table> ></abp-extensible-table>
</div>
</div> </div>
</div>
<abp-modal [(visible)]="isModalVisible" [busy]="modalBusy"> <abp-modal [(visible)]="isModalVisible" [busy]="modalBusy">
<ng-template #abpHeader> <ng-template #abpHeader>
<h3> <h3>
{{ {{
(selected?.id ? 'AbpTenantManagement::Edit' : 'AbpTenantManagement::NewTenant') (selected?.id ? 'AbpTenantManagement::Edit' : 'AbpTenantManagement::NewTenant')
| abpLocalization | abpLocalization
}} }}
</h3> </h3>
</ng-template> </ng-template>
<ng-template #abpBody> <ng-template #abpBody>
<form [formGroup]="tenantForm" (ngSubmit)="save()" [validateOnSubmit]="true"> <form [formGroup]="tenantForm" (ngSubmit)="save()" [validateOnSubmit]="true">
<abp-extensible-form [selectedRecord]="selected"></abp-extensible-form> <abp-extensible-form [selectedRecord]="selected"></abp-extensible-form>
</form> </form>
</ng-template> </ng-template>
<ng-template #abpFooter> <ng-template #abpFooter>
<button abpClose type="button" class="btn btn-secondary"> <button abpClose type="button" class="btn btn-secondary">
{{ 'AbpTenantManagement::Cancel' | abpLocalization }} {{ 'AbpTenantManagement::Cancel' | abpLocalization }}
</button> </button>
<abp-button iconClass="fa fa-check" (click)="save()" [disabled]="tenantForm?.invalid">{{ <abp-button iconClass="fa fa-check" (click)="save()" [disabled]="tenantForm?.invalid">{{
'AbpTenantManagement::Save' | abpLocalization 'AbpTenantManagement::Save' | abpLocalization
}}</abp-button> }}</abp-button>
</ng-template> </ng-template>
</abp-modal> </abp-modal>
<abp-feature-management <abp-feature-management
*abpReplaceableTemplate="{ *abpReplaceableTemplate="{
inputs: { inputs: {
providerName: { value: 'T' }, providerName: { value: 'T' },
providerKey: { value: providerKey }, providerKey: { value: providerKey },
@ -66,8 +58,9 @@
outputs: { visibleChange: $any(onVisibleFeaturesChange) }, outputs: { visibleChange: $any(onVisibleFeaturesChange) },
componentKey: featureManagementKey componentKey: featureManagementKey
}" }"
[(visible)]="visibleFeatures" [(visible)]="visibleFeatures"
providerName="T" providerName="T"
[providerKey]="providerKey" [providerKey]="providerKey"
> >
</abp-feature-management> </abp-feature-management>
</abp-page>

2
npm/ng-packs/packages/tenant-management/src/lib/tenant-management.module.ts
View File

@ -16,6 +16,7 @@ import {
TENANT_MANAGEMENT_ENTITY_PROP_CONTRIBUTORS, TENANT_MANAGEMENT_ENTITY_PROP_CONTRIBUTORS,
TENANT_MANAGEMENT_TOOLBAR_ACTION_CONTRIBUTORS, TENANT_MANAGEMENT_TOOLBAR_ACTION_CONTRIBUTORS,
} from './tokens/extensions.token'; } from './tokens/extensions.token';
import { PageModule } from '@abp/ng.components/page';
@NgModule({ @NgModule({
declarations: [TenantsComponent], declarations: [TenantsComponent],
@ -28,6 +29,7 @@ import {
NgbDropdownModule, NgbDropdownModule,
FeatureManagementModule, FeatureManagementModule,
UiExtensionsModule, UiExtensionsModule,
PageModule,
], ],
}) })
export class TenantManagementModule { export class TenantManagementModule {

2
npm/ng-packs/packages/theme-shared/extensions/src/lib/components/page-toolbar/page-toolbar.component.html
View File

@ -1,6 +1,6 @@
<div class="row justify-content-end mx-0 gap-2" id="AbpContentToolbar"> <div class="row justify-content-end mx-0 gap-2" id="AbpContentToolbar">
<div <div
class="col-auto px-0 pt-0 pt-md-2" class="col-auto px-0 pt-0 "
[class.pe-0]="last" [class.pe-0]="last"
*ngFor="let action of actionList; trackBy: trackByFn; let last = last" *ngFor="let action of actionList; trackBy: trackByFn; let last = last"
> >

2
templates/app-nolayers/angular/package.json
View File

@ -20,7 +20,7 @@
"@abp/ng.setting-management": "~7.0.1", "@abp/ng.setting-management": "~7.0.1",
"@abp/ng.tenant-management": "~7.0.1", "@abp/ng.tenant-management": "~7.0.1",
"@abp/ng.theme.shared": "~7.0.1", "@abp/ng.theme.shared": "~7.0.1",
"@abp/ng.theme.lepton-x": "~2.0.0-rc.4", "@abp/ng.theme.lepton-x": "~2.0.2",
"@angular/animations": "^15.0.1", "@angular/animations": "^15.0.1",
"@angular/common": "^15.0.1", "@angular/common": "^15.0.1",
"@angular/compiler": "^15.0.1", "@angular/compiler": "^15.0.1",

2
templates/app/angular/package.json
View File

@ -20,7 +20,7 @@
"@abp/ng.setting-management": "~7.0.1", "@abp/ng.setting-management": "~7.0.1",
"@abp/ng.tenant-management": "~7.0.1", "@abp/ng.tenant-management": "~7.0.1",
"@abp/ng.theme.shared": "~7.0.1", "@abp/ng.theme.shared": "~7.0.1",
"@abp/ng.theme.lepton-x": "~2.0.0-rc.4", "@abp/ng.theme.lepton-x": "~2.0.2",
"@angular/animations": "^15.0.1", "@angular/animations": "^15.0.1",
"@angular/common": "^15.0.1", "@angular/common": "^15.0.1",
"@angular/compiler": "^15.0.1", "@angular/compiler": "^15.0.1",

Write Preview
Loading…
Cancel
Save