diff --git a/src/app/pagination-demo/pagination-demo-routing.module.ts b/src/app/pagination-demo/pagination-demo-routing.module.ts
new file mode 100644
index 0000000..2fc85ac
--- /dev/null
+++ b/src/app/pagination-demo/pagination-demo-routing.module.ts
@@ -0,0 +1,15 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { PaginationDemoComponent } from './pagination-demo/pagination/pagination-demo.component';
+
+
+const routes: Routes = [{
+ path: '',
+ component: PaginationDemoComponent
+}];
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule]
+})
+export class PaginationDemoRoutingModule { }
diff --git a/src/app/pagination-demo/pagination-demo.module.ts b/src/app/pagination-demo/pagination-demo.module.ts
new file mode 100644
index 0000000..ba62201
--- /dev/null
+++ b/src/app/pagination-demo/pagination-demo.module.ts
@@ -0,0 +1,22 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { PaginationDemoRoutingModule } from './pagination-demo-routing.module';
+import { PaginationDemoComponent } from './pagination-demo/pagination/pagination-demo.component';
+import { DataGridModule } from '@poweredsoft/ngx-cdk-ui';
+import { FormGroupCommandModalModule,psbxPaginationModule, CommandModalModule } from '@poweredsoft/ngx-bootstrap';
+import { ReactiveFormsModule, FormsModule } from '@angular/forms';
+
+
+@NgModule({
+ declarations: [PaginationDemoComponent],
+ imports: [
+ CommonModule,
+ PaginationDemoRoutingModule,
+ psbxPaginationModule,
+ DataGridModule,
+ CommandModalModule,
+ FormsModule
+ ]
+})
+export class PaginationDemoModule { }
diff --git a/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.html b/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.html
new file mode 100644
index 0000000..86d4878
--- /dev/null
+++ b/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.html
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+ ID
+ {{model.id}}
+
+
+ Name
+ {{model.name}}
+
+
+ Address
+ {{model.address}}
+
+
+
+ Actions
+
+
+
+
+
+
+
+
+
+
+ New Name
+
+
+
+
+ Name
+
+ Address
+
+
\ No newline at end of file
diff --git a/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.scss b/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.ts b/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.ts
new file mode 100644
index 0000000..39af576
--- /dev/null
+++ b/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.ts
@@ -0,0 +1,51 @@
+import { Component, OnInit } from '@angular/core';
+import { IDataSource } from '@poweredsoft/data';
+import { IMerchant } from 'src/app/data/services/IMerchant';
+import { MerchantService } from 'src/app/data/services/merchant.service';
+import { IModelFormCreateEvent } from '@poweredsoft/ngx-bootstrap';
+import { FormBuilder, Validators } from '@angular/forms';
+
+@Component({
+ selector: 'ps-pagination',
+ templateUrl: './pagination-demo.component.html',
+ styleUrls: ['./pagination-demo.component.scss']
+})
+export class PaginationDemoComponent implements OnInit {
+ columns = ['id','name', 'address', 'commands']
+ merchantDataSource: IDataSource
;
+ constructor(private merchantService: MerchantService){
+ this.merchantDataSource = this.createDataSource();
+
+ }
+
+ pages:any;
+
+ newMerchant(name: string) {
+ this.merchantDataSource.executeCommandByName('addMerchant', {
+ name: name
+ }).subscribe(
+ res => {
+ alert('it worked!');
+ this.merchantDataSource.refresh();
+ },
+ err => {
+ console.log(err);
+ alert('failed');
+ }
+ );
+ }
+
+ createDataSource(): IDataSource {
+ return this.merchantService.createDataSource();
+ }
+
+ ngOnInit() {
+ this.merchantDataSource.refresh();
+ this.merchantDataSource.data$.subscribe(newData => {
+ if (newData)
+ this.pages = new Array(newData.numberOfPages);
+ });
+ }
+
+
+}
From dc0ec0cd9de6f5f130d6789067e8fa775a468596 Mon Sep 17 00:00:00 2001
From: Yubing325 <35515298+Yubing325@users.noreply.github.com>
Date: Thu, 11 Jun 2020 17:10:33 -0500
Subject: [PATCH 2/8] simple remove works
---
.../form-group-command-modal.directive.ts | 4 +--
.../services/IChangeMerchantNameCommand.ts | 4 +++
src/app/data/services/merchant.service.ts | 29 +++++++++++++++++--
.../form-group-modal-demo.component.html | 6 +++-
.../pagination/pagination-demo.component.html | 19 +++++++-----
.../pagination/pagination-demo.component.ts | 10 +++----
6 files changed, 54 insertions(+), 18 deletions(-)
diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/form-group-command-modal/directives/form-group-command-modal.directive.ts b/projects/poweredsoft/ngx-bootstrap/src/lib/form-group-command-modal/directives/form-group-command-modal.directive.ts
index 90cfdb2..a998d50 100644
--- a/projects/poweredsoft/ngx-bootstrap/src/lib/form-group-command-modal/directives/form-group-command-modal.directive.ts
+++ b/projects/poweredsoft/ngx-bootstrap/src/lib/form-group-command-modal/directives/form-group-command-modal.directive.ts
@@ -39,9 +39,7 @@ export class FormGroupCommandModalDirective {
command: this.command,
model: this.model
}).subscribe(commandModel => {
-
-
-
+ debugger;
const event = {
commandName: this.command,
viewModel: this.model,
diff --git a/src/app/data/services/IChangeMerchantNameCommand.ts b/src/app/data/services/IChangeMerchantNameCommand.ts
index 1441524..9cb17a6 100644
--- a/src/app/data/services/IChangeMerchantNameCommand.ts
+++ b/src/app/data/services/IChangeMerchantNameCommand.ts
@@ -6,3 +6,7 @@ export interface IAddMerchantCommand {
name: string;
address: string;
}
+
+export interface IRemoveMerchantCommand {
+ merchantId: string;
+}
\ No newline at end of file
diff --git a/src/app/data/services/merchant.service.ts b/src/app/data/services/merchant.service.ts
index 9ebe7ec..f02dad5 100644
--- a/src/app/data/services/merchant.service.ts
+++ b/src/app/data/services/merchant.service.ts
@@ -4,7 +4,7 @@ import { IDataSource, DataSource } from '@poweredsoft/data';
import { Apollo } from 'apollo-angular';
import gql from 'graphql-tag';
import { of } from 'rxjs';
-import { IChangeMerchantNameCommand, IAddMerchantCommand } from './IChangeMerchantNameCommand';
+import { IChangeMerchantNameCommand, IAddMerchantCommand, IRemoveMerchantCommand } from './IChangeMerchantNameCommand';
import { IMerchant } from './IMerchant';
@Injectable({
@@ -27,7 +27,7 @@ export class MerchantService {
(model) => model.id,
{
page: 1,
- pageSize: 150,
+ pageSize: 15,
},
true
);
@@ -83,6 +83,31 @@ export class MerchantService {
})
);
+ builder.addMutation(
+ 'removeMerchant', //<-- command name
+ 'removeMerchant', //<-- graph ql mutation name
+
+ // implementation of the command.
+ command => {
+
+ return this.apollo.use('command').mutate({
+ mutation: gql`
+ mutation executeAddMerchant($command: RemoveMerchantCommandInput) {
+ removeMerchant(params: $command)
+ }
+ `,
+ variables: {
+ command: command,
+ },
+ });
+ },
+
+ // viewModel -> transform to the form model for that command -> IChangeMerchantName
+ e => of({
+ merchantId: e.model.id,
+ })
+ );
+
const options = builder.create();
return new DataSource(options);
}
diff --git a/src/app/form-group-modal-demo/form-group-modal-demo/form-group-modal-demo.component.html b/src/app/form-group-modal-demo/form-group-modal-demo/form-group-modal-demo.component.html
index 8688a9f..6fd524e 100644
--- a/src/app/form-group-modal-demo/form-group-modal-demo/form-group-modal-demo.component.html
+++ b/src/app/form-group-modal-demo/form-group-modal-demo/form-group-modal-demo.component.html
@@ -19,11 +19,15 @@
Actions
-
+
+
+
+