manage plugins of a template

This commit is contained in:
argirok 2023-10-17 09:20:16 +03:00
parent 8b9c8ec665
commit ea116a2b10
7 changed files with 128 additions and 22 deletions

View File

@ -6,7 +6,8 @@ import {PluginsComponent} from "./plugins.component";
@NgModule({
imports: [
RouterModule.forChild([
{ path: '', component: PluginsComponent}
{ path: '', component: PluginsComponent},
{ path: ':templateCode', component: PluginsComponent, data: {templateView:true}}
])
]
})

View File

@ -24,7 +24,7 @@
</div>
</ng-container>
<ng-container *ngIf="!editView">
<div class="uk-width-expand">
<div *ngIf="!templateView" class="uk-width-expand">
<a routerLink="../pages" class="uk-flex uk-flex-middle uk-h5 uk-link-reset">
<span class="uk-margin-right">
<icon name="west" ratio="1.7" [flex]="true"></icon>
@ -32,6 +32,14 @@
<h1 *ngIf="page" class="uk-h5 uk-margin-remove">{{page.name}}</h1>
</a>
</div>
<div *ngIf="templateView" class="uk-width-expand">
<a routerLink="../.." class="uk-flex uk-flex-middle uk-h5 uk-link-reset">
<span class="uk-margin-right">
<icon name="west" ratio="1.7" [flex]="true"></icon>
</span>
<h1 *ngIf="template" class="uk-h5 uk-margin-remove">{{template.name}}</h1>
</a>
</div>
<div search-input [disabled]="showLoading" [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search plugins" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1">
</div>
<div>
@ -61,12 +69,15 @@
<div class="uk-card uk-card-default">
<div class="uk-card-body uk-flex">
<div class="uk-width-expand uk-text-small">
<ng-container *ngIf="check.template">
<ng-container *ngIf="check.template && !templateView">
<h6>{{check.template.name}}</h6>
<div class="uk-margin-small-bottom">
{{check.template.description}}
</div>
</ng-container>
<ng-container *ngIf="templateView">
<h6>Community: {{check.plugin.pid}}</h6>
</ng-container>
<ng-container *ngIf="!check.template">
<h6>{{check.plugin.code}}</h6>
<div class="uk-margin-small-bottom uk-text-warning">

View File

@ -25,6 +25,7 @@ import {Plugin} from "../../utils/entities/adminTool/plugin";
import {StringUtils} from "../../utils/string-utils.class";
import {Portal} from "../../utils/entities/adminTool/portal";
import {PluginTemplate} from "../../utils/entities/adminTool/pluginTemplate";
import template = CKEDITOR.template;
@Component({
selector: 'plugins',
@ -76,7 +77,9 @@ export class PluginsComponent implements OnInit {
public selectedPageId: string;
public community: Portal;
public page: Page;
public templateView = false;
public templateCode:string = null;
public template
constructor(private element: ElementRef, private route: ActivatedRoute, private _router: Router,
private title: Title, private _helpContentService: HelpContentService,
private _pluginsService: PluginsService, private _fb: UntypedFormBuilder,
@ -93,29 +96,30 @@ export class PluginsComponent implements OnInit {
this.searchText = new RegExp(value, 'i');
this.applyFilters();
}));
/*this.subscriptions.push(this.filterForm.get('type').valueChanges.subscribe(value => {
this.applyFilters();
}));*/
this.subscriptions.push(this.route.params.subscribe(params => {
console.log(params)
this.portal = (this.route.snapshot.data.portal) ? this.route.snapshot.data.portal : this.route.snapshot.params[this.route.snapshot.data.param];
this.selectedCommunityPid = params.community;
this.portal = (this.route.snapshot.data.portal) ? this.route.snapshot.data.portal : this.route.snapshot.params[this.route.snapshot.data.param];
this.templateView = this.route.snapshot.data['templateView']
this.selectedCommunityPid = params.community;
this.templateCode = params['templateCode'];
if(this.templateView && this.templateCode){
this.getTemplateAndPlugins();
}
if(this.templateView && !this.templateCode){
this._router.navigate(['../..'], {relativeTo: this.route});
}
this.subscriptions.push(this.route.queryParams.subscribe(params => {
HelperFunctions.scroll();
console.log(params)
// this.selectedCommunityPid = params['communityId'];
this.selectedPageId = params['pageId'];
if (this.portal && this.selectedPageId) {
this.getPage(this.selectedPageId);
}
if (!this.selectedPageId) {
if (!this.selectedPageId && !this.templateView) {
this._router.navigate(['../pages'], {relativeTo: this.route});
}
}));
}));
}
ngOnDestroy(): void {
@ -145,13 +149,13 @@ export class PluginsComponent implements OnInit {
this._router.navigate(['./pageContents']);
} else {
this.page = page;
this.getPlugins();
this.getPagePlugins();
}
},
error => this.handleError('System error retrieving page', error)));
}
getPlugins() {
getPagePlugins() {
this.showLoading = true;
this.subscriptions.push(this._pluginsService.getPluginTemplatesByPage(this.properties.adminToolsAPIURL, this.selectedCommunityPid, this.selectedPageId).subscribe(
templates => {
@ -174,7 +178,31 @@ export class PluginsComponent implements OnInit {
},
error => this.handleError('System error retrieving templates', error)));
}
getTemplateAndPlugins(){
this.showLoading = true;
this.subscriptions.push(this._pluginsService.getPluginTemplate(this.properties.adminToolsAPIURL, this.templateCode).subscribe(
template => {
this.template = template;
this.pluginTemplates = [template]
this.subscriptions.push(this._pluginsService.getPluginsByTemplatesCode(this.properties.adminToolsAPIURL,"", this.template.code).subscribe(
plugins => {
this.plugins = plugins;
this.checkboxes = [];
let self = this;
this.plugins.forEach(_ => {
self.checkboxes.push({plugin: _, checked: false, template: this.template});
});
this.showLoading = false;
},
error => this.handleError('System error retrieving plugins', error)));
},
error => this.handleError('System error retrieving templates', error)));
}
public toggleCheckBoxes(event) {
this.checkboxes.forEach(_ => _.checked = event.target.checked);
}
@ -249,9 +277,13 @@ export class PluginsComponent implements OnInit {
public newPluginSelectTemplate() {
this.selectedPlugin = null;
this.selectedTemplate = null;
this.editView = true;
this.selectTemplateView = true;
if(!this.templateView) {
this.selectedTemplate = null;
this.selectTemplateView = true;
}else{
this.newPlugin( Object.assign({}, this.template));
}
}
public newPlugin(template) {

View File

@ -0,0 +1,40 @@
/*
import {NgModule} from '@angular/core';
import {RouterModule} from '@angular/router';
import {CommonModule} from '@angular/common';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {AlertModalModule} from '../../utils/modal/alertModal.module';
import {PluginsComponent} from './plugins.component';
import {AdminToolServiceModule} from "../../services/adminToolService.module";
import {InputModule} from "../../sharedComponents/input/input.module";
import {MatAutocompleteModule} from '@angular/material/autocomplete';
import { MatCheckboxModule } from "@angular/material/checkbox";
import { MatFormFieldModule } from "@angular/material/form-field";
import {MatChipsModule} from '@angular/material/chips';
import {AdminTabsModule} from "../sharedComponents/admin-tabs/admin-tabs.module";
import {PageContentModule} from "../sharedComponents/page-content/page-content.module";
import {PluginsRoutingModule} from "./plugins-routing.module";
import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module";
import {IconsModule} from "../../utils/icons/icons.module";
import {LoadingModule} from "../../utils/loading/loading.module";
import {PluginsService} from "../../services/plugins.service";
import {CKEditorModule} from "ng2-ckeditor";
import {MatSlideToggleModule} from "@angular/material/slide-toggle";
@NgModule({
imports: [
CommonModule, RouterModule, FormsModule,
AlertModalModule, ReactiveFormsModule, AdminToolServiceModule, InputModule, MatAutocompleteModule, MatFormFieldModule, MatChipsModule,
MatCheckboxModule, AdminTabsModule, PageContentModule, SearchInputModule, IconsModule, LoadingModule, CKEditorModule,
MatSlideToggleModule
],
providers:[PluginsService],
declarations: [PluginsComponent],
exports: [PluginsComponent]
})
export class PluginsComponentModule {}
*/

View File

@ -66,9 +66,12 @@
<div class="uk-position-bottom-left">
<div class="uk-padding-small uk-padding-remove-horizontal">
<button
class="uk-button uk-button-link uk-flex uk-flex-middle" [routerLink]="['./',check.template._id]" >
class="uk-button uk-button-link uk-flex uk-flex-middle" [routerLink]="['./plugins',check.template.code]" >
<icon name="edit" [flex]="true"></icon>
<span class="uk-margin-xsmall-left"> Manage Plugins</span>
<span class="uk-margin-xsmall-left"> Manage Plugins
<span *ngIf="pluginsCount[check.template.code]">({{pluginsCount[check.template.code]}}
)</span>
</span>
</button>
</div>
</div>

View File

@ -66,7 +66,8 @@ export class PluginTemplatesComponent implements OnInit {
selectedCommunityPid = null;
public portalUtils: PortalUtils = new PortalUtils();
private index: number;
pluginsCount = {};
constructor(private element: ElementRef, private route: ActivatedRoute, private _router: Router,
private title: Title,private _helpContentService: HelpContentService,
private _pluginsService: PluginsService, private _fb: UntypedFormBuilder,
@ -87,10 +88,12 @@ export class PluginTemplatesComponent implements OnInit {
this.applyFilters();
}));
this.getTemplates();
this.subscriptions.push(this.route.queryParams.subscribe(params => {
HelperFunctions.scroll();
this.selectedCommunityPid = params['communityId'];
this.getPages();
this.getPluginsCounts();
}));
}
@ -351,5 +354,11 @@ export class PluginTemplatesComponent implements OnInit {
}
return pageId;
}
getPluginsCounts() {
this.subscriptions.push(this._pluginsService.countPluginPerTemplate( this.properties.adminToolsAPIURL).subscribe(
countPlugins => {
this.pluginsCount = countPlugins;
},
error => this.handleError('System error retrieving page contents', error)));
}
}

View File

@ -12,6 +12,10 @@ export class PluginsService {
constructor(private http:HttpClient) {
}
getPluginTemplate(api:string, code:string) {
return this.http.get<PluginTemplate>(api + 'pluginTemplates/' + code)
}
getAllPluginTemplates(api:string) {
return this.http.get<Array<PluginTemplate>>(api + 'pluginTemplates')
@ -40,12 +44,18 @@ export class PluginsService {
countPluginTemplatePerPage( api:string, pid:string){
return this.http.get(api + properties.adminToolsPortalType + '/' +pid+'/pluginTemplate/page/count');
}
countPluginPerTemplate( api:string){
return this.http.get(api + '/plugin/template/count');
}
getPluginsByPage(api:string, pid:string, pageId:string){
return this.http.get<Array<Plugin>>(api + properties.adminToolsPortalType + '/' +pid+'/plugins/page/' + pageId);
}
getPluginTemplatesByPage(api:string, pid:string, pageId:string){
return this.http.get<Array<PluginTemplate>>(api + properties.adminToolsPortalType + '/' +pid+'/pluginTemplates/page/' + pageId);
}
getPluginsByTemplatesCode(api:string, pid:string, code:string){
return this.http.get<Array<Plugin>>(api +'/plugins/template/' + code);
}
togglePages(id : string,status : boolean, api:string) {
return this.http.post(api + 'plugin/status/' + id, status, CustomOptions.getAuthOptionsWithBody());