mirror of https://github.com/abpframework/abp.git
26 changed files with 497 additions and 20 deletions
@ -1 +0,0 @@ |
|||
export * from './comment-approve.component'; |
|||
@ -1 +0,0 @@ |
|||
export * from './comment-details.component'; |
|||
@ -1 +0,0 @@ |
|||
export * from './comment-list.component'; |
|||
@ -0,0 +1 @@ |
|||
export const CMS_KIT_COMMENTS_REQUIRE_APPROVEMENT = 'CmsKit.Comments.RequireApprovement'; |
|||
@ -1,3 +1,4 @@ |
|||
export * from './comment-list'; |
|||
export * from './comment-approve'; |
|||
export * from './comment-details'; |
|||
export * from './comment-list/comment-list.component'; |
|||
export * from './comment-approve/comment-approve.component'; |
|||
export * from './comment-details/comment-details.component'; |
|||
export * from './constants'; |
|||
|
|||
@ -0,0 +1,2 @@ |
|||
export * from './tag-list/tag-list.component'; |
|||
export * from './tag-modal/tag-modal.component'; |
|||
@ -0,0 +1,30 @@ |
|||
<abp-page [title]="'CmsKit::Tags' | abpLocalization" [toolbar]="data.items"> |
|||
<div class="card mb-4"> |
|||
<div class="card-body"> |
|||
<div class="row"> |
|||
<div class="col-12"> |
|||
<div class="input-group"> |
|||
<input |
|||
type="search" |
|||
class="form-control" |
|||
[placeholder]="'AbpUi::PagerSearch' | abpLocalization" |
|||
[(ngModel)]="filter" |
|||
(keyup.enter)="onSearch()" |
|||
/> |
|||
<button class="btn btn-primary" type="button" (click)="onSearch()"> |
|||
<i class="fa fa-search" aria-hidden="true"></i> |
|||
</button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="card"> |
|||
<abp-extensible-table [data]="data.items" [recordsTotal]="data.totalCount" [list]="list" /> |
|||
</div> |
|||
|
|||
@if (isModalVisible) { |
|||
<abp-tag-modal [selected]="selected" (visibleChange)="onVisibleModalChange($event)" /> |
|||
} |
|||
</abp-page> |
|||
@ -0,0 +1,97 @@ |
|||
import { Component, OnInit, inject } from '@angular/core'; |
|||
import { CommonModule } from '@angular/common'; |
|||
import { FormsModule } from '@angular/forms'; |
|||
import { ListService, PagedResultDto, LocalizationPipe } from '@abp/ng.core'; |
|||
import { ExtensibleTableComponent, EXTENSIONS_IDENTIFIER } from '@abp/ng.components/extensible'; |
|||
import { PageComponent } from '@abp/ng.components/page'; |
|||
import { TagAdminService, TagGetListInput, TagDto, TagDefinitionDto } from '@abp/ng.cms-kit/proxy'; |
|||
import { eCmsKitAdminComponents } from '../../../enums'; |
|||
import { TagModalComponent, TagModalVisibleChange } from '../tag-modal/tag-modal.component'; |
|||
|
|||
@Component({ |
|||
selector: 'abp-tag-list', |
|||
templateUrl: './tag-list.component.html', |
|||
providers: [ |
|||
ListService, |
|||
{ |
|||
provide: EXTENSIONS_IDENTIFIER, |
|||
useValue: eCmsKitAdminComponents.TagList, |
|||
}, |
|||
], |
|||
imports: [ |
|||
ExtensibleTableComponent, |
|||
PageComponent, |
|||
LocalizationPipe, |
|||
FormsModule, |
|||
CommonModule, |
|||
TagModalComponent, |
|||
], |
|||
}) |
|||
export class TagListComponent implements OnInit { |
|||
data: PagedResultDto<TagDto> = { items: [], totalCount: 0 }; |
|||
|
|||
public readonly list = inject(ListService<TagGetListInput>); |
|||
private tagService = inject(TagAdminService); |
|||
|
|||
filter = ''; |
|||
isModalVisible = false; |
|||
selected?: TagDto; |
|||
tagDefinitions: TagDefinitionDto[] = []; |
|||
|
|||
ngOnInit() { |
|||
this.loadTagDefinitions(); |
|||
this.hookToQuery(); |
|||
} |
|||
|
|||
private loadTagDefinitions() { |
|||
this.tagService.getTagDefinitions().subscribe(definitions => { |
|||
this.tagDefinitions = definitions; |
|||
}); |
|||
} |
|||
|
|||
onSearch() { |
|||
this.list.filter = this.filter; |
|||
this.list.get(); |
|||
} |
|||
|
|||
add() { |
|||
this.selected = {} as TagDto; |
|||
this.isModalVisible = true; |
|||
} |
|||
|
|||
edit(id: string) { |
|||
this.tagService.get(id).subscribe(tag => { |
|||
this.selected = tag; |
|||
this.isModalVisible = true; |
|||
}); |
|||
} |
|||
|
|||
private hookToQuery() { |
|||
this.list |
|||
.hookToQuery(query => { |
|||
let filters: Partial<TagGetListInput> = {}; |
|||
if (this.list.filter) { |
|||
filters.filter = this.list.filter; |
|||
} |
|||
const input: TagGetListInput = { |
|||
...query, |
|||
...filters, |
|||
}; |
|||
return this.tagService.getList(input); |
|||
}) |
|||
.subscribe(res => { |
|||
this.data = res; |
|||
}); |
|||
} |
|||
|
|||
onVisibleModalChange(visibilityChange: TagModalVisibleChange) { |
|||
if (visibilityChange.visible) { |
|||
return; |
|||
} |
|||
if (visibilityChange.refresh) { |
|||
this.list.get(); |
|||
} |
|||
this.selected = null; |
|||
this.isModalVisible = false; |
|||
} |
|||
} |
|||
@ -0,0 +1,28 @@ |
|||
<abp-modal [visible]="true" (visibleChange)="onVisibleChange($event)"> |
|||
<ng-template #abpHeader> |
|||
<h3> |
|||
{{ (selected()?.id ? 'AbpUi::Edit' : 'AbpUi::New') | abpLocalization }} |
|||
</h3> |
|||
</ng-template> |
|||
|
|||
<ng-template #abpBody> |
|||
@if (form) { |
|||
<form [formGroup]="form" (ngSubmit)="save()" validateOnSubmit> |
|||
<abp-extensible-form [selectedRecord]="selected()" /> |
|||
</form> |
|||
} @else { |
|||
<div class="text-center"> |
|||
<i class="fa fa-pulse fa-spinner" aria-hidden="true"></i> |
|||
</div> |
|||
} |
|||
</ng-template> |
|||
|
|||
<ng-template #abpFooter> |
|||
<button type="button" class="btn btn-outline-primary" abpClose> |
|||
{{ 'AbpUi::Cancel' | abpLocalization }} |
|||
</button> |
|||
<abp-button iconClass="fa fa-check" [disabled]="form?.invalid" (click)="save()"> |
|||
{{ 'AbpUi::Save' | abpLocalization }} |
|||
</abp-button> |
|||
</ng-template> |
|||
</abp-modal> |
|||
@ -0,0 +1,84 @@ |
|||
import { Component, OnInit, inject, Injector, input, output } from '@angular/core'; |
|||
import { CommonModule } from '@angular/common'; |
|||
import { ReactiveFormsModule, FormGroup } from '@angular/forms'; |
|||
import { NgxValidateCoreModule } from '@ngx-validate/core'; |
|||
import { LocalizationPipe } from '@abp/ng.core'; |
|||
import { |
|||
ExtensibleFormComponent, |
|||
FormPropData, |
|||
generateFormFromProps, |
|||
} from '@abp/ng.components/extensible'; |
|||
import { |
|||
ModalComponent, |
|||
ModalCloseDirective, |
|||
ButtonComponent, |
|||
ToasterService, |
|||
} from '@abp/ng.theme.shared'; |
|||
import { TagAdminService, TagDto, TagCreateDto, TagUpdateDto } from '@abp/ng.cms-kit/proxy'; |
|||
|
|||
export interface TagModalVisibleChange { |
|||
visible: boolean; |
|||
refresh: boolean; |
|||
} |
|||
|
|||
@Component({ |
|||
selector: 'abp-tag-modal', |
|||
templateUrl: './tag-modal.component.html', |
|||
imports: [ |
|||
ExtensibleFormComponent, |
|||
LocalizationPipe, |
|||
ReactiveFormsModule, |
|||
CommonModule, |
|||
NgxValidateCoreModule, |
|||
ModalComponent, |
|||
ModalCloseDirective, |
|||
ButtonComponent, |
|||
], |
|||
}) |
|||
export class TagModalComponent implements OnInit { |
|||
private tagService = inject(TagAdminService); |
|||
private injector = inject(Injector); |
|||
private toasterService = inject(ToasterService); |
|||
|
|||
selected = input<TagDto>(); |
|||
sectionId = input<string>(); |
|||
visibleChange = output<TagModalVisibleChange>(); |
|||
|
|||
form: FormGroup; |
|||
|
|||
ngOnInit() { |
|||
this.buildForm(); |
|||
} |
|||
|
|||
private buildForm() { |
|||
const data = new FormPropData(this.injector, this.selected()); |
|||
this.form = generateFormFromProps(data); |
|||
} |
|||
|
|||
onVisibleChange(visible: boolean, refresh = false) { |
|||
this.visibleChange.emit({ visible, refresh }); |
|||
} |
|||
|
|||
save() { |
|||
if (!this.form.valid) { |
|||
return; |
|||
} |
|||
|
|||
let observable$ = this.tagService.create(this.form.value as TagCreateDto); |
|||
|
|||
const selectedTag = this.selected(); |
|||
const { id } = selectedTag || {}; |
|||
|
|||
if (id) { |
|||
observable$ = this.tagService.update(id, { |
|||
...selectedTag, |
|||
...this.form.value, |
|||
} as TagUpdateDto); |
|||
} |
|||
|
|||
observable$.subscribe(() => { |
|||
this.onVisibleChange(false, true); |
|||
this.toasterService.success('AbpUi::SavedSuccessfully'); |
|||
}); |
|||
} |
|||
} |
|||
@ -1 +1,2 @@ |
|||
export * from './comments'; |
|||
export * from './tags'; |
|||
|
|||
@ -0,0 +1,32 @@ |
|||
import { TagCreateDto, TagAdminService, TagDefinitionDto } from '@abp/ng.cms-kit/proxy'; |
|||
import { FormProp, ePropType } from '@abp/ng.components/extensible'; |
|||
import { Validators } from '@angular/forms'; |
|||
import { map } from 'rxjs/operators'; |
|||
|
|||
export const DEFAULT_TAG_CREATE_FORM_PROPS = FormProp.createMany<TagCreateDto>([ |
|||
{ |
|||
type: ePropType.Enum, |
|||
name: 'entityType', |
|||
displayName: 'CmsKit::EntityType', |
|||
id: 'entityType', |
|||
validators: () => [Validators.required], |
|||
options: data => { |
|||
const tagService = data.getInjected(TagAdminService); |
|||
return tagService.getTagDefinitions().pipe( |
|||
map((definitions: TagDefinitionDto[]) => |
|||
definitions.map(def => ({ |
|||
key: def.displayName || def.entityType || '', |
|||
value: def.entityType || '', |
|||
})), |
|||
), |
|||
); |
|||
}, |
|||
}, |
|||
{ |
|||
type: ePropType.String, |
|||
name: 'name', |
|||
displayName: 'CmsKit::Name', |
|||
id: 'name', |
|||
validators: () => [Validators.required], |
|||
}, |
|||
]); |
|||
@ -0,0 +1,13 @@ |
|||
import { Validators } from '@angular/forms'; |
|||
import { TagUpdateDto } from '@abp/ng.cms-kit/proxy'; |
|||
import { FormProp, ePropType } from '@abp/ng.components/extensible'; |
|||
|
|||
export const DEFAULT_TAG_EDIT_FORM_PROPS = FormProp.createMany<TagUpdateDto>([ |
|||
{ |
|||
type: ePropType.String, |
|||
name: 'name', |
|||
displayName: 'CmsKit::Name', |
|||
id: 'name', |
|||
validators: () => [Validators.required], |
|||
}, |
|||
]); |
|||
@ -0,0 +1,40 @@ |
|||
import { TagDto } from '@abp/ng.cms-kit/proxy'; |
|||
import { EntityAction } from '@abp/ng.components/extensible'; |
|||
import { TagAdminService } from '@abp/ng.cms-kit/proxy'; |
|||
import { ConfirmationService, Confirmation } from '@abp/ng.theme.shared'; |
|||
import { ListService } from '@abp/ng.core'; |
|||
import { TagListComponent } from '../../components/tags/tag-list/tag-list.component'; |
|||
|
|||
export const DEFAULT_TAG_ENTITY_ACTIONS = EntityAction.createMany<TagDto>([ |
|||
{ |
|||
text: 'AbpUi::Edit', |
|||
action: data => { |
|||
const component = data.getInjected(TagListComponent); |
|||
component.edit(data.record.id!); |
|||
}, |
|||
permission: 'CmsKit.Tags.Update', |
|||
}, |
|||
{ |
|||
text: 'AbpUi::Delete', |
|||
action: data => { |
|||
const tagService = data.getInjected(TagAdminService); |
|||
const confirmationService = data.getInjected(ConfirmationService); |
|||
const list = data.getInjected(ListService); |
|||
|
|||
confirmationService |
|||
.warn('CmsKit::TagDeletionConfirmationMessage', 'AbpUi::AreYouSure', { |
|||
yesText: 'AbpUi::Yes', |
|||
cancelText: 'AbpUi::Cancel', |
|||
messageLocalizationParams: [data.record.name || ''], |
|||
}) |
|||
.subscribe((status: Confirmation.Status) => { |
|||
if (status === Confirmation.Status.confirm) { |
|||
tagService.delete(data.record.id!).subscribe(() => { |
|||
list.get(); |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
permission: 'CmsKit.Tags.Delete', |
|||
}, |
|||
]); |
|||
@ -0,0 +1,19 @@ |
|||
import { TagDto } from '@abp/ng.cms-kit/proxy'; |
|||
import { EntityProp, ePropType } from '@abp/ng.components/extensible'; |
|||
|
|||
export const DEFAULT_TAG_ENTITY_PROPS = EntityProp.createMany<TagDto>([ |
|||
{ |
|||
type: ePropType.String, |
|||
name: 'entityType', |
|||
displayName: 'CmsKit::EntityType', |
|||
sortable: true, |
|||
columnWidth: 200, |
|||
}, |
|||
{ |
|||
type: ePropType.String, |
|||
name: 'name', |
|||
displayName: 'CmsKit::Name', |
|||
sortable: true, |
|||
columnWidth: 250, |
|||
}, |
|||
]); |
|||
@ -0,0 +1,15 @@ |
|||
import { TagDto } from '@abp/ng.cms-kit/proxy'; |
|||
import { ToolbarAction } from '@abp/ng.components/extensible'; |
|||
import { TagListComponent } from '../../components/tags/tag-list/tag-list.component'; |
|||
|
|||
export const DEFAULT_TAG_TOOLBAR_ACTIONS = ToolbarAction.createMany<TagDto[]>([ |
|||
{ |
|||
text: 'CmsKit::NewTag', |
|||
action: data => { |
|||
const component = data.getInjected(TagListComponent); |
|||
component.add(); |
|||
}, |
|||
permission: 'CmsKit.Tags.Create', |
|||
icon: 'fa fa-plus', |
|||
}, |
|||
]); |
|||
@ -0,0 +1,5 @@ |
|||
export * from './default-tag-entity-actions'; |
|||
export * from './default-tag-entity-props'; |
|||
export * from './default-tag-toolbar-actions'; |
|||
export * from './default-tag-create-form-props'; |
|||
export * from './default-tag-edit-form-props'; |
|||
Loading…
Reference in new issue