mirror of
https://github.com/akveo/ngx-admin.git
synced 2025-12-31 22:58:49 +01:00
initiate to sit
This commit is contained in:
Zuhdan Ubay
parent
947ee4e0c2
commit
9101cdaa87
271 changed files with 990780 additions and 494 deletions
26
src/app/@core/data/partner-price-detail.ts
Normal file
26
src/app/@core/data/partner-price-detail.ts
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
export interface PartnerPriceDetail {
|
||||
agingType: string,
|
||||
createTmString: string,
|
||||
createdBy: string,
|
||||
createdTm: string,
|
||||
currencyCarry: string,
|
||||
currencyType: string,
|
||||
customerCode: string,
|
||||
customerName: string,
|
||||
destCode: string,
|
||||
flowType: string,
|
||||
id: number,
|
||||
invalidDate: string,
|
||||
invalidString: string,
|
||||
isSale: number,
|
||||
modifiedBy: string,
|
||||
modifiedTm: string,
|
||||
payCountry: string,
|
||||
priceCode: string,
|
||||
productCode: string,
|
||||
roundTrip: number,
|
||||
sourceCode: string,
|
||||
status: number,
|
||||
validDate: string,
|
||||
validString: string,
|
||||
}
|
||||
12
src/app/@core/data/partner-price.ts
Normal file
12
src/app/@core/data/partner-price.ts
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
export interface PartnerPrice {
|
||||
createdBy: string,
|
||||
createdTm: Date,
|
||||
customerCode: string,
|
||||
customerName: string,
|
||||
id: number,
|
||||
modifiedBy: string,
|
||||
modifiedTm: Date,
|
||||
quotationDesc: string,
|
||||
quotationNo: string,
|
||||
status: number,
|
||||
}
|
||||
|
|
@ -8,53 +8,29 @@ import {
|
|||
NbRequestPasswordComponent,
|
||||
NbResetPasswordComponent,
|
||||
} from '@nebular/auth';
|
||||
import { AppComponent } from './app.component';
|
||||
|
||||
export const routes: Routes = [
|
||||
{
|
||||
path: 'pages',
|
||||
loadChildren: () => import('./pages/pages.module')
|
||||
.then(m => m.PagesModule),
|
||||
},
|
||||
// {
|
||||
// path: 'pages',
|
||||
// loadChildren: () => import('./pages/pages.module')
|
||||
// .then(m => m.PagesModule),
|
||||
// },
|
||||
{
|
||||
path: 'auth',
|
||||
component: NbAuthComponent,
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
component: NbLoginComponent,
|
||||
},
|
||||
{
|
||||
path: 'login',
|
||||
component: NbLoginComponent,
|
||||
},
|
||||
{
|
||||
path: 'register',
|
||||
component: NbRegisterComponent,
|
||||
},
|
||||
{
|
||||
path: 'logout',
|
||||
component: NbLogoutComponent,
|
||||
},
|
||||
{
|
||||
path: 'request-password',
|
||||
component: NbRequestPasswordComponent,
|
||||
},
|
||||
{
|
||||
path: 'reset-password',
|
||||
component: NbResetPasswordComponent,
|
||||
},
|
||||
],
|
||||
loadChildren: () => import('./auth/auth.module').then(m => m.AuthModule),
|
||||
},
|
||||
{ path: '', redirectTo: 'pages', pathMatch: 'full' },
|
||||
{ path: '**', redirectTo: 'pages' },
|
||||
// { path: '', redirectTo: 'auth', pathMatch: 'full' },
|
||||
// { path: '**', redirectTo: 'auth' },
|
||||
];
|
||||
|
||||
const config: ExtraOptions = {
|
||||
useHash: false,
|
||||
};
|
||||
// const config: ExtraOptions = {
|
||||
// useHash: false,
|
||||
// };
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forRoot(routes, config)],
|
||||
// imports: [RouterModule.forRoot(routes, config)],
|
||||
imports: [RouterModule.forRoot(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class AppRoutingModule {
|
||||
|
|
|
|||
|
|
@ -11,13 +11,5 @@ import { SeoService } from './@core/utils/seo.service';
|
|||
selector: 'ngx-app',
|
||||
template: '<router-outlet></router-outlet>',
|
||||
})
|
||||
export class AppComponent implements OnInit {
|
||||
|
||||
constructor(private analytics: AnalyticsService, private seoService: SeoService) {
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.analytics.trackPageViews();
|
||||
this.seoService.trackCanonicalChanges();
|
||||
}
|
||||
export class AppComponent {
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,8 +19,13 @@ import {
|
|||
NbSidebarModule,
|
||||
NbToastrModule,
|
||||
NbWindowModule,
|
||||
NbLayoutModule,
|
||||
NbCardModule,
|
||||
NbButtonModule,
|
||||
} from '@nebular/theme';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { NbAuthModule, NbDummyAuthStrategy } from '@nebular/auth';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
|
|
|
|||
48
src/app/auth/auth-routing.module.ts
Normal file
48
src/app/auth/auth-routing.module.ts
Normal file
|
|
@ -0,0 +1,48 @@
|
|||
|
||||
/**
|
||||
* @license
|
||||
* Copyright Akveo. All Rights Reserved.
|
||||
* Licensed under the MIT License. See License.txt in the project root for license information.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import { NbAuthComponent } from '@nebular/auth';
|
||||
|
||||
import { LoginComponent } from './login/login.component';
|
||||
import { AuthComponent } from './auth.component';
|
||||
|
||||
export const routes: Routes = [
|
||||
|
||||
{
|
||||
path: '',
|
||||
component: AuthComponent,
|
||||
children: [
|
||||
{
|
||||
path: 'login',
|
||||
component: LoginComponent,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'auth',
|
||||
loadChildren: () => import('./auth.module').then(m => m.AuthModule),
|
||||
},
|
||||
// {
|
||||
// path: '',
|
||||
// component: NbAuthComponent,
|
||||
// children: [
|
||||
// {
|
||||
// path: 'login',
|
||||
// component: LoginComponent,
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class AuthRoutingModule {
|
||||
}
|
||||
24
src/app/auth/auth.component.ts
Normal file
24
src/app/auth/auth.component.ts
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Akveo. All Rights Reserved.
|
||||
* Licensed under the MIT License. See License.txt in the project root for license information.
|
||||
*/
|
||||
|
||||
import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-app',
|
||||
template: `
|
||||
<nb-layout>
|
||||
<nb-layout-column>
|
||||
<nb-card>
|
||||
<nb-card-body>
|
||||
<a nbButton routerLink="auth/login">Login</a>
|
||||
</nb-card-body>
|
||||
</nb-card>
|
||||
</nb-layout-column>
|
||||
</nb-layout>
|
||||
`,
|
||||
})
|
||||
export class AuthComponent {
|
||||
}
|
||||
57
src/app/auth/auth.module.ts
Normal file
57
src/app/auth/auth.module.ts
Normal file
|
|
@ -0,0 +1,57 @@
|
|||
|
||||
/**
|
||||
* @license
|
||||
* Copyright Akveo. All Rights Reserved.
|
||||
* Licensed under the MIT License. See License.txt in the project root for license information.
|
||||
*/
|
||||
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { NgModule } from '@angular/core';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { AuthRoutingModule } from './auth-routing.module';
|
||||
import { NbAuthModule, NbDummyAuthStrategy } from '@nebular/auth';
|
||||
import { NbAlertModule, NbButtonModule, NbCheckboxModule, NbInputModule, NbLayoutModule, NbCardModule } from '@nebular/theme';
|
||||
|
||||
import { LoginComponent } from './login/login.component';
|
||||
import { HttpClientModule } from '@angular/common/http';
|
||||
import { AppRoutingModule } from '../app-routing.module';
|
||||
import { AuthComponent } from './auth.component';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
NbAlertModule,
|
||||
NbInputModule,
|
||||
NbButtonModule,
|
||||
NbCheckboxModule,
|
||||
AuthRoutingModule,
|
||||
|
||||
NbAuthModule,
|
||||
|
||||
CommonModule,
|
||||
HttpClientModule,
|
||||
NbLayoutModule,
|
||||
NbCardModule,
|
||||
NbButtonModule,
|
||||
AppRoutingModule,
|
||||
|
||||
NbAuthModule.forRoot({
|
||||
strategies: [
|
||||
NbDummyAuthStrategy.setup({
|
||||
name: 'email',
|
||||
|
||||
alwaysFail: true,
|
||||
delay: 1000,
|
||||
}),
|
||||
],
|
||||
}),
|
||||
],
|
||||
declarations: [
|
||||
LoginComponent,
|
||||
AuthComponent,
|
||||
],
|
||||
})
|
||||
export class AuthModule {
|
||||
}
|
||||
105
src/app/auth/login/login.component.html
Normal file
105
src/app/auth/login/login.component.html
Normal file
|
|
@ -0,0 +1,105 @@
|
|||
<h1 id="title" class="title">Sign In</h1>
|
||||
|
||||
<nb-alert *ngIf="showMessages.error && errors?.length && !submitted" outline="danger" role="alert">
|
||||
<p class="alert-title"><b>Oh snap!</b></p>
|
||||
<ul class="alert-message-list">
|
||||
<li *ngFor="let error of errors" class="alert-message">{{ error }}</li>
|
||||
</ul>
|
||||
</nb-alert>
|
||||
|
||||
<nb-alert *ngIf="showMessages.success && messages?.length && !submitted" outline="success" role="alert">
|
||||
<p class="alert-title"><b>Hooray!</b></p>
|
||||
<ul class="alert-message-list">
|
||||
<li *ngFor="let message of messages" class="alert-message">{{ message }}</li>
|
||||
</ul>
|
||||
</nb-alert>
|
||||
|
||||
<form (ngSubmit)="login()" #form="ngForm" aria-labelledby="title">
|
||||
|
||||
<div class="form-control-group">
|
||||
<label class="label" for="input-email">Email address:</label>
|
||||
<input nbInput
|
||||
fullWidth
|
||||
[(ngModel)]="user.email"
|
||||
#email="ngModel"
|
||||
name="email"
|
||||
id="input-email"
|
||||
pattern=".+@.+\..+"
|
||||
placeholder="Email address"
|
||||
autofocus
|
||||
[status]="email.dirty ? (email.invalid ? 'danger' : 'success') : 'basic'"
|
||||
[required]="getConfigValue('forms.validation.email.required')"
|
||||
[attr.aria-invalid]="email.invalid && email.touched ? true : null">
|
||||
<ng-container *ngIf="email.invalid && email.touched">
|
||||
<p class="caption status-danger" *ngIf="email.errors?.required">
|
||||
Email is required!
|
||||
</p>
|
||||
<p class="caption status-danger" *ngIf="email.errors?.pattern">
|
||||
Email should be the real one!
|
||||
</p>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<div class="form-control-group">
|
||||
<label class="label" for="input-password">Password:</label>
|
||||
<input nbInput
|
||||
fullWidth
|
||||
[(ngModel)]="user.password"
|
||||
#password="ngModel"
|
||||
name="password"
|
||||
type="password"
|
||||
id="input-password"
|
||||
placeholder="Password"
|
||||
[status]="password.dirty ? (password.invalid ? 'danger' : 'success') : 'basic'"
|
||||
[required]="getConfigValue('forms.validation.password.required')"
|
||||
[minlength]="getConfigValue('forms.validation.password.minLength')"
|
||||
[maxlength]="getConfigValue('forms.validation.password.maxLength')"
|
||||
[attr.aria-invalid]="password.invalid && password.touched ? true : null">
|
||||
<ng-container *ngIf="password.invalid && password.touched ">
|
||||
<p class="caption status-danger" *ngIf="password.errors?.required">
|
||||
Password is required!
|
||||
</p>
|
||||
<p class="caption status-danger" *ngIf="(password.errors?.minlength || password.errors?.maxlength)">
|
||||
Password should contains
|
||||
from {{ getConfigValue('forms.validation.password.minLength') }}
|
||||
to {{ getConfigValue('forms.validation.password.maxLength') }}
|
||||
characters
|
||||
</p>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<div class="form-control-group accept-group">
|
||||
<nb-checkbox name="rememberMe" [(ngModel)]="user.rememberMe" *ngIf="rememberMe">Remember me</nb-checkbox>
|
||||
<a class="forgot-password" routerLink="../request-password">Forgot Password?</a>
|
||||
</div>
|
||||
|
||||
<button nbButton
|
||||
fullWidth
|
||||
status="success"
|
||||
[disabled]="submitted || !form.valid"
|
||||
[class.btn-pulse]="submitted">
|
||||
Sign In
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<section *ngIf="socialLinks && socialLinks.length > 0" class="links" aria-label="Social sign in">
|
||||
Or connect with:
|
||||
<div class="socials">
|
||||
<ng-container *ngFor="let socialLink of socialLinks">
|
||||
<a *ngIf="socialLink.link"
|
||||
[routerLink]="socialLink.link"
|
||||
[attr.target]="socialLink.target"
|
||||
[attr.class]="socialLink.icon"
|
||||
[class.with-icon]="socialLink.icon">{{ socialLink.title }}</a>
|
||||
<a *ngIf="socialLink.url"
|
||||
[attr.href]="socialLink.url"
|
||||
[attr.target]="socialLink.target"
|
||||
[attr.class]="socialLink.icon"
|
||||
[class.with-icon]="socialLink.icon">{{ socialLink.title }}</a>
|
||||
</ng-container>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="another-action" aria-label="Register">
|
||||
Don't have an account? <a class="text-link" routerLink="../register">Sign Up</a>
|
||||
</section>
|
||||
15
src/app/auth/login/login.component.ts
Normal file
15
src/app/auth/login/login.component.ts
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
|
||||
/**
|
||||
* @license
|
||||
* Copyright Akveo. All Rights Reserved.
|
||||
* Licensed under the MIT License. See License.txt in the project root for license information.
|
||||
*/
|
||||
import { Component } from '@angular/core';
|
||||
import { NbLoginComponent } from '@nebular/auth';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-login',
|
||||
templateUrl: './login.component.html',
|
||||
})
|
||||
export class LoginComponent extends NbLoginComponent {
|
||||
}
|
||||
|
|
@ -1,85 +1,37 @@
|
|||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<form>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Partner Code</label>
|
||||
<input nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.customerID">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">User Id</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.customerID">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Promo Type</label>
|
||||
<input nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.promotionType">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Periode </label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.validDay">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Coupon Code</label>
|
||||
<input nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.code">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Valid Start</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.validFrom">
|
||||
</div>
|
||||
</form>
|
||||
<div class="form-group row">
|
||||
<label class="label col-sm-3 col-form-label">Quotation No</label>
|
||||
<div class="col-sm-9">
|
||||
<input type="email" nbInput placeholder="Email">
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Valid End</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.validTo">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Promo</label>
|
||||
<input type="number" nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.value">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Max. Promo</label>
|
||||
<input type="number" nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.maximumDiscount">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Quota per User</label>
|
||||
<input nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.maximumPerUser">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">User Type</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.customerType">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Coverage Pickup</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.coverage">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label class="label col-sm-3 col-form-label">Partner</label>
|
||||
<div class="col-sm-9">
|
||||
<input nbInput placeholder="Password">
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<form>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Product</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.product">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Promo (IDR)</label>
|
||||
<input type="number" nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.value">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Promo (%)</label>
|
||||
<input type="number" nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.value">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Max. Promo</label>
|
||||
<input type="number" nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.maximumDiscountValue">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Budget</label>
|
||||
<input type="number" nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.maximumDiscount">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Quota</label>
|
||||
<input type="number" nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.quota">
|
||||
</div>
|
||||
<button (click)="onSubmit()" type="submit" nbButton status="primary">Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label class="label col-sm-3 col-form-label">Status</label>
|
||||
<div class="col-sm-9">
|
||||
<label>*SDS price is for first 5kg, each additional kg is additional Rp.</label>
|
||||
<input nbInput placeholder="Password">
|
||||
<label>for shipment total up to 10kg</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="form-group row">
|
||||
<div class="offset-sm-3 col-sm-9">
|
||||
<button (click)="onSubmit()" type="submit" nbButton status="primary">Sign in</button>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="form-group row">
|
||||
<label class="label col-sm-3 col-form-label">Add</label>
|
||||
<div class="col-sm-9">
|
||||
<input nbInput placeholder="Password">
|
||||
<label>Flow(s)</label>
|
||||
<!-- (click)="onSubmit()" -->
|
||||
<button type="submit" nbButton status="primary">Go</button> </div>
|
||||
</div>
|
||||
|
||||
<ng2-smart-table [settings]="settings" [source]="data" (deleteConfirm)="onDeleteConfirm($event)"
|
||||
(createConfirm)="onCreateConfirm($event)" (userRowSelect)="openWindowForm($event)">
|
||||
</ng2-smart-table>
|
||||
|
|
@ -1,30 +1,132 @@
|
|||
import { Component, Inject, Input } from '@angular/core';
|
||||
import { NbWindowRef, NB_WINDOW_CONTEXT } from '@nebular/theme';
|
||||
import { PromotionList } from '../../../@core/data/promotion';
|
||||
import { Component, Inject, Input, OnInit } from '@angular/core';
|
||||
import { NbWindowRef, NB_WINDOW_CONTEXT, NbWindowService } from '@nebular/theme';
|
||||
import { PartnerPriceService } from '../partner-price.service';
|
||||
import { PartnerPriceDetail } from '../../../@core/data/partner-price-detail';
|
||||
import { PartnerPrice } from '../../../@core/data/partner-price';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-partner-price-detail',
|
||||
templateUrl: './partner-price-detail.component.html',
|
||||
styleUrls: ['partner-price-detail.component.scss'],
|
||||
})
|
||||
export class PartnerPriceDetailComponent {
|
||||
export class PartnerPriceDetailComponent implements OnInit {
|
||||
|
||||
@Input() data: PromotionList;
|
||||
settings = {
|
||||
mode: 'inline',
|
||||
pager: {
|
||||
perPage: 2,
|
||||
},
|
||||
add: {
|
||||
addButtonContent: '<i class="nb-plus"></i>',
|
||||
createButtonContent: '<i class="nb-checkmark"></i>',
|
||||
cancelButtonContent: '<i class="nb-close"></i>',
|
||||
confirmCreate: true,
|
||||
},
|
||||
edit: {
|
||||
editButtonContent: '<i class="nb-edit"></i>',
|
||||
saveButtonContent: '<i class="nb-checkmark"></i>',
|
||||
cancelButtonContent: '<i class="nb-close"></i>',
|
||||
},
|
||||
delete: {
|
||||
deleteButtonContent: '<i class="nb-trash"></i>',
|
||||
confirmDelete: true,
|
||||
},
|
||||
columns: {
|
||||
productCode: {
|
||||
title: 'Product',
|
||||
type: 'string',
|
||||
},
|
||||
flowType: {
|
||||
title: 'Pricing Level',
|
||||
type: 'string',
|
||||
},
|
||||
sourceCode: {
|
||||
title: 'Origin',
|
||||
type: 'string',
|
||||
},
|
||||
destCode: {
|
||||
title: 'Destination',
|
||||
type: 'string',
|
||||
},
|
||||
priceCode: {
|
||||
title: 'Price',
|
||||
type: 'string',
|
||||
},
|
||||
agingType: {
|
||||
title: 'SLA',
|
||||
type: 'string',
|
||||
},
|
||||
validDate: {
|
||||
title: 'Valid Date Start',
|
||||
type: 'string',
|
||||
},
|
||||
invalidDate: {
|
||||
title: 'Valid Date End',
|
||||
type: 'string',
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
constructor(private service: PartnerPriceService, public windowRef: NbWindowRef, @Inject(NB_WINDOW_CONTEXT) context) {
|
||||
@Input() data: PartnerPriceDetail[];
|
||||
headerData: PartnerPrice;
|
||||
|
||||
constructor(private service: PartnerPriceService, public windowRef: NbWindowRef, @Inject(NB_WINDOW_CONTEXT) context, private windowService: NbWindowService) {
|
||||
if (context != null) {
|
||||
this.data = Object.assign({}, context.data);
|
||||
this.headerData = Object.assign({}, context.data);
|
||||
}
|
||||
}
|
||||
|
||||
onSubmit(){
|
||||
this.service.postPromotion(this.data).subscribe((value) => {
|
||||
this.close();
|
||||
filter: any = {
|
||||
customerCode: '',
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.filter.customerCode = this.headerData.customerCode;
|
||||
this.getData();
|
||||
}
|
||||
|
||||
getData(){
|
||||
this.service.getDetailPartnerPrice(this.filter).subscribe((result) => {
|
||||
this.data = Object.assign([], result);
|
||||
});
|
||||
}
|
||||
|
||||
onSubmit() {
|
||||
// this.service.postPromotion(this.data).subscribe((value) => {
|
||||
// this.close();
|
||||
// });
|
||||
}
|
||||
|
||||
close() {
|
||||
this.windowRef.close();
|
||||
}
|
||||
|
||||
onCreateConfirm(event) {
|
||||
if (window.confirm('Are you sure you want to save?')) {
|
||||
event.newData.status = 1;
|
||||
this.service.getHeaderPartnerPrice(event.newData).subscribe((value) => {
|
||||
// this.initData();
|
||||
});
|
||||
event.confirm.resolve(event.newData);
|
||||
} else {
|
||||
event.confirm.reject();
|
||||
}
|
||||
}
|
||||
|
||||
onDeleteConfirm(event): void {
|
||||
if (window.confirm('Are you sure you want to delete?')) {
|
||||
event.confirm.resolve();
|
||||
} else {
|
||||
event.confirm.reject();
|
||||
}
|
||||
}
|
||||
|
||||
openWindowForm(event) {
|
||||
this.windowService.open(PartnerPriceDetailComponent, {
|
||||
title: 'Partner Price Detail',
|
||||
context: {
|
||||
data: event.data,
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
<nb-card>
|
||||
<nb-card-header>
|
||||
Partner Price
|
||||
Partner Price - dev 90%
|
||||
</nb-card-header>
|
||||
|
||||
<nb-card-body>
|
||||
<ng2-smart-table [settings]="settings" [source]="source" (deleteConfirm)="onDeleteConfirm($event)"
|
||||
(createConfirm)="onCreateConfirm($event)" (userRowSelect)="openWindowForm($event)">
|
||||
(createConfirm)="onCreateConfirm($event)" (userRowSelect)="openWindowForm($event)" (create)="openCreateDialog($event)">
|
||||
</ng2-smart-table>
|
||||
</nb-card-body>
|
||||
</nb-card>
|
||||
|
|
@ -1,8 +1,8 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import { PromotionList } from '../../@core/data/promotion';
|
||||
import { PartnerPriceService } from './partner-price.service';
|
||||
import { PartnerPriceDetailComponent } from './partner-price-detail/partner-price-detail.component';
|
||||
import { NbWindowService } from '@nebular/theme';
|
||||
import { PartnerPrice } from '../../@core/data/partner-price';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-partner-price',
|
||||
|
|
@ -11,7 +11,7 @@ import { NbWindowService } from '@nebular/theme';
|
|||
})
|
||||
export class PartnerPriceComponent implements OnInit {
|
||||
settings = {
|
||||
mode: 'inline',
|
||||
mode: 'external',
|
||||
add: {
|
||||
addButtonContent: '<i class="nb-plus"></i>',
|
||||
createButtonContent: '<i class="nb-checkmark"></i>',
|
||||
|
|
@ -28,26 +28,39 @@ export class PartnerPriceComponent implements OnInit {
|
|||
confirmDelete: true,
|
||||
},
|
||||
columns: {
|
||||
code: {
|
||||
title: 'Coupon Code',
|
||||
customerCode: {
|
||||
title: 'Partner Code',
|
||||
type: 'string',
|
||||
},
|
||||
validDay: {
|
||||
title: 'Period',
|
||||
customerName: {
|
||||
title: 'Partner Name',
|
||||
type: 'string',
|
||||
},
|
||||
validFrom: {
|
||||
title: 'Valid Start',
|
||||
quotationNo: {
|
||||
title: 'Reference',
|
||||
type: 'string',
|
||||
},
|
||||
validTo: {
|
||||
title: 'Valid End',
|
||||
modifiedBy: {
|
||||
title: 'Modified by',
|
||||
type: 'string',
|
||||
},
|
||||
modifiedTm: {
|
||||
title: 'Modified Date',
|
||||
type: 'string',
|
||||
},
|
||||
status: {
|
||||
title: 'Status',
|
||||
type: 'string',
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
source: PromotionList[] = [];
|
||||
filter: any = {
|
||||
start: 0,
|
||||
column: 'customerCode',
|
||||
}
|
||||
|
||||
source: PartnerPrice[] = [];
|
||||
|
||||
constructor(private service: PartnerPriceService, private windowService: NbWindowService) {
|
||||
|
||||
|
|
@ -57,8 +70,8 @@ export class PartnerPriceComponent implements OnInit {
|
|||
this.initData();
|
||||
}
|
||||
|
||||
initData(){
|
||||
this.service.getPromotion().subscribe((result) => {
|
||||
initData() {
|
||||
this.service.getHeaderPartnerPrice(this.filter).subscribe((result) => {
|
||||
this.source = Object.assign([], result);
|
||||
});
|
||||
}
|
||||
|
|
@ -66,7 +79,7 @@ export class PartnerPriceComponent implements OnInit {
|
|||
onCreateConfirm(event) {
|
||||
if (window.confirm('Are you sure you want to save?')) {
|
||||
event.newData.status = 1;
|
||||
this.service.postPromotion(event.newData).subscribe((value) => {
|
||||
this.service.getHeaderPartnerPrice(event.newData).subscribe((value) => {
|
||||
this.initData();
|
||||
});
|
||||
event.confirm.resolve(event.newData);
|
||||
|
|
@ -83,9 +96,14 @@ export class PartnerPriceComponent implements OnInit {
|
|||
}
|
||||
}
|
||||
|
||||
openCreateDialog(event) {
|
||||
|
||||
//logic
|
||||
}
|
||||
|
||||
openWindowForm(event) {
|
||||
this.windowService.open(PartnerPriceDetailComponent, {
|
||||
title: 'Promotion Detail',
|
||||
title: 'Partner Price Detail',
|
||||
context: {
|
||||
data: event.data,
|
||||
},
|
||||
|
|
|
|||
|
|
@ -4,6 +4,8 @@ import { Observable, throwError } from 'rxjs';
|
|||
import { map, catchError } from 'rxjs/operators';
|
||||
import { HttpErrorResponse } from '@angular/common/http';
|
||||
import { PromotionList } from '../../@core/data/promotion';
|
||||
import { PartnerPrice } from '../../@core/data/partner-price';
|
||||
import { PartnerPriceDetail } from '../../@core/data/partner-price-detail';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root',
|
||||
|
|
@ -12,28 +14,40 @@ export class PartnerPriceService {
|
|||
constructor(private http: HttpClient) {
|
||||
}
|
||||
|
||||
getPromotion(): Observable<any> {
|
||||
const url = 'http://localhost:8011/api/promotions/all';
|
||||
return this.http.get(url).pipe(
|
||||
getHeaderPartnerPrice(filter: any): Observable<any> {
|
||||
const url = 'http://34.87.6.140:8011/api/productFlow/pagingFlowHeader?start=0&sort=asc&length=10&column=' + filter.column;
|
||||
return this.http.post(url, null).pipe(
|
||||
map(this.extractData),
|
||||
catchError(this.handleError),
|
||||
);
|
||||
}
|
||||
|
||||
postPromotion(data: PromotionList): Observable<any> {
|
||||
const headers = new HttpHeaders({
|
||||
'Content-Type': 'application/json',
|
||||
'X-Requested-Method': 'POST',
|
||||
});
|
||||
const options = { headers: headers };
|
||||
const url = 'http://localhost:8011/api/promotions/add';
|
||||
return this.http.post(url, JSON.stringify(data), options).pipe(
|
||||
getDetailPartnerPrice(filter: any): Observable<any> {
|
||||
const url = 'http://34.87.6.140:8011/api/productFlow/pagingByCustomerCode?start=0&sort=asc&length=10&column=modifiedTm&customerCode=' + filter.customerCode;
|
||||
return this.http.post(url, null).pipe(
|
||||
map(this.extractData),
|
||||
catchError(this.handleError),
|
||||
);
|
||||
}
|
||||
|
||||
private extractData(body: any): PromotionList[] {
|
||||
return Object.assign(body.promotionList);
|
||||
// postPromotion(data: PromotionList): Observable<any> {
|
||||
// const headers = new HttpHeaders({
|
||||
// 'Content-Type': 'application/json',
|
||||
// 'X-Requested-Method': 'POST',
|
||||
// });
|
||||
// const options = { headers: headers };
|
||||
// const url = 'http://localhost:8011/api/promotions/add';
|
||||
// return this.http.post(url, JSON.stringify(data), options).pipe(
|
||||
// catchError(this.handleError),
|
||||
// );
|
||||
// }
|
||||
|
||||
private extractData(body: any): PartnerPrice[] {
|
||||
return Object.assign(body.content);
|
||||
}
|
||||
|
||||
private extractDataDetail(body: any): PartnerPriceDetail[] {
|
||||
return Object.assign(body.content);
|
||||
}
|
||||
|
||||
private handleError(error: HttpErrorResponse | any) {
|
||||
|
|
|
|||
|
|
@ -1,80 +1,92 @@
|
|||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Partner Code</label>
|
||||
<input nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.customerID">
|
||||
<label class="label">Partner Code</label>
|
||||
<input nbInput fullWidth [(ngModel)]="data.customerID">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">User Id</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.customerID">
|
||||
<label class="label">User Id</label>
|
||||
<input nbInput fullWidth [(ngModel)]="data.customerID">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Promo Type</label>
|
||||
<input nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.promotionType">
|
||||
<label class="label">Promo Type</label>
|
||||
<!-- <input nbInput fullWidth [(ngModel)]="data.promotionType"> -->
|
||||
<nb-card-body>
|
||||
<nb-select [(selected)]="data.promotionType">
|
||||
<nb-option value="Discount">Discount</nb-option>
|
||||
<nb-option value="Cashback">Cashback</nb-option>
|
||||
</nb-select>
|
||||
</nb-card-body>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Periode </label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.validDay">
|
||||
<label class="label">Periode </label>
|
||||
<input nbInput fullWidth [(ngModel)]="data.validDay">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Coupon Code</label>
|
||||
<input nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.code">
|
||||
<label class="label">Coupon Code</label>
|
||||
<input nbInput fullWidth [(ngModel)]="data.code">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Valid Start</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.validFrom">
|
||||
<label class="label">Valid Start</label>
|
||||
<!-- <input nbInput fullWidth [(ngModel)]="data.validFrom"> -->
|
||||
<input nbInput fullWidth placeholder="Select Date" [nbDatepicker]="formpickerstart" [(ngModel)]="data.validFrom">
|
||||
<nb-datepicker #formpickerstart></nb-datepicker>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Valid End</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.validTo">
|
||||
<label class="label">Valid End</label>
|
||||
<!-- <input nbInput fullWidth [(ngModel)]="data.validTo"> -->
|
||||
<input nbInput fullWidth placeholder="Select Date" [nbDatepicker]="formpickerend" [(ngModel)]="data.validTo">
|
||||
<nb-datepicker #formpickerend></nb-datepicker>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Promo</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.value">
|
||||
<label class="label">Quota per User</label>
|
||||
<input (keypress)="numberOnly($event)" nbInput fullWidth [(ngModel)]="data.maximumPerUser">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Max. Promo</label>
|
||||
<input nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.maximumDiscount">
|
||||
<label class="label">User Type</label>
|
||||
<input nbInput fullWidth [(ngModel)]="data.customerType">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputEmail1" class="label">Quota per User</label>
|
||||
<input nbInput fullWidth id="exampleInputEmail1" [(ngModel)]="data.maximumPerUser">
|
||||
<label class="label">Coverage Pickup</label>
|
||||
<input nbInput fullWidth [(ngModel)]="data.coverage">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">User Type</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.customerType">
|
||||
<label class="label">Product</label>
|
||||
<!-- <input nbInput fullWidth [(ngModel)]="data.promotionType"> -->
|
||||
<nb-card-body>
|
||||
<nb-select [(selected)]="data.product">
|
||||
<nb-option value="Regular">Regular</nb-option>
|
||||
<nb-option value="Next Day">Next Day</nb-option>
|
||||
<nb-option value="Same Day">Same Day</nb-option>
|
||||
<nb-option value="Same Day Service">Same Day Service</nb-option>
|
||||
<nb-option value="Instant Delivery">Instant Delivery</nb-option>
|
||||
<nb-option value="Free Ongkir Regular">Free Ongkir Regular</nb-option>
|
||||
</nb-select>
|
||||
</nb-card-body>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Coverage Pickup</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.coverage">
|
||||
<label class="label">Promo (IDR)</label>
|
||||
<input (keypress)="numberOnly($event)" nbInput fullWidth [(ngModel)]="data.value">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Product</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.product">
|
||||
<label class="label">Promo (%)</label>
|
||||
<input (keypress)="numberOnly($event)" nbInput fullWidth [(ngModel)]="data.value">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Promo (IDR)</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.value">
|
||||
<label class="label">Max. Promo</label>
|
||||
<input (keypress)="numberOnly($event)" nbInput fullWidth [(ngModel)]="data.maximumDiscountValue">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Promo (%)</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.value">
|
||||
<label class="label">Budget</label>
|
||||
<input (keypress)="numberOnly($event)" nbInput fullWidth [(ngModel)]="data.maximumDiscount">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Max. Promo</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.maximumDiscountValue">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Budget</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.maximumDiscount">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleInputPassword1" class="label">Quota</label>
|
||||
<input nbInput fullWidth id="exampleInputPassword1" [(ngModel)]="data.quota">
|
||||
<label class="label">Quota</label>
|
||||
<input (keypress)="numberOnly($event)" nbInput fullWidth [(ngModel)]="data.quota">
|
||||
</div>
|
||||
<button (click)="onSubmit()" type="submit" nbButton status="primary">Submit</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@ import { Component, Inject, Input } from '@angular/core';
|
|||
import { NbWindowRef, NB_WINDOW_CONTEXT } from '@nebular/theme';
|
||||
import { PromotionList } from '../../../@core/data/promotion';
|
||||
import { PromotionService } from '../promotion.service';
|
||||
import { NgForm } from '@angular/forms';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-promotion-detail',
|
||||
|
|
@ -19,7 +18,7 @@ export class PromotionDetailComponent {
|
|||
}
|
||||
}
|
||||
|
||||
onSubmit(){
|
||||
onSubmit() {
|
||||
this.service.postPromotion(this.data).subscribe((value) => {
|
||||
this.close();
|
||||
});
|
||||
|
|
@ -28,4 +27,14 @@ export class PromotionDetailComponent {
|
|||
close() {
|
||||
this.windowRef.close();
|
||||
}
|
||||
|
||||
numberOnly(event): boolean {
|
||||
const charCode = (event.which) ? event.which : event.keyCode;
|
||||
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<nb-card>
|
||||
<nb-card-header>
|
||||
Promotion
|
||||
Promotion - dev 100%
|
||||
</nb-card-header>
|
||||
|
||||
<nb-card-body>
|
||||
|
|
|
|||
|
|
@ -58,7 +58,7 @@ export class PromotionComponent implements OnInit {
|
|||
this.initData();
|
||||
}
|
||||
|
||||
initData(){
|
||||
initData() {
|
||||
this.service.getPromotion().subscribe((result) => {
|
||||
this.source = Object.assign([], result);
|
||||
});
|
||||
|
|
@ -78,6 +78,9 @@ export class PromotionComponent implements OnInit {
|
|||
|
||||
onDeleteConfirm(event): void {
|
||||
if (window.confirm('Are you sure you want to delete?')) {
|
||||
this.service.deletePromotion(event.data).subscribe((value) => {
|
||||
this.initData();
|
||||
});
|
||||
event.confirm.resolve();
|
||||
} else {
|
||||
event.confirm.reject();
|
||||
|
|
|
|||
|
|
@ -6,7 +6,9 @@ import {
|
|||
NbTreeGridModule,
|
||||
NbButtonModule,
|
||||
NbCheckboxModule,
|
||||
NbRadioModule
|
||||
NbRadioModule,
|
||||
NbSelectModule,
|
||||
NbDatepickerModule
|
||||
} from '@nebular/theme';
|
||||
import { Ng2SmartTableModule } from 'ng2-smart-table';
|
||||
|
||||
|
|
@ -28,6 +30,8 @@ import { FormsModule } from '@angular/forms';
|
|||
NbCheckboxModule,
|
||||
Ng2SmartTableModule,
|
||||
FormsModule,
|
||||
NbSelectModule,
|
||||
NbDatepickerModule,
|
||||
],
|
||||
declarations: [
|
||||
PromotionComponent,
|
||||
|
|
|
|||
|
|
@ -12,8 +12,10 @@ export class PromotionService {
|
|||
constructor(private http: HttpClient) {
|
||||
}
|
||||
|
||||
// 34.87.6.140
|
||||
|
||||
getPromotion(): Observable<any> {
|
||||
const url = 'http://localhost:8011/api/promotions/all';
|
||||
const url = 'http://34.87.6.140:8011/api/promotions/all';
|
||||
return this.http.get(url).pipe(
|
||||
map(this.extractData),
|
||||
catchError(this.handleError),
|
||||
|
|
@ -26,12 +28,25 @@ export class PromotionService {
|
|||
'X-Requested-Method': 'POST',
|
||||
});
|
||||
const options = { headers: headers };
|
||||
const url = 'http://localhost:8011/api/promotions/add';
|
||||
const url = 'http://34.87.6.140:8011/api/promotions/add';
|
||||
return this.http.post(url, JSON.stringify(data), options).pipe(
|
||||
catchError(this.handleError),
|
||||
);
|
||||
}
|
||||
|
||||
deletePromotion(data: PromotionList): Observable<any> {
|
||||
const id = data.id;
|
||||
const headers = new HttpHeaders({
|
||||
'Content-Type': 'application/json',
|
||||
'X-Requested-Method': 'PUT',
|
||||
});
|
||||
const options = { headers: headers };
|
||||
const url = 'http://34.87.6.140:8011/api/promotion/delete';
|
||||
return this.http.put(url, id, options).pipe(
|
||||
catchError(this.handleError),
|
||||
);
|
||||
}
|
||||
|
||||
private extractData(body: any): PromotionList[] {
|
||||
return Object.assign(body.promotionList);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,36 +0,0 @@
|
|||
import { Component } from '@angular/core';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { ServerDataSource } from 'ng2-smart-table';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-advanced-example-server',
|
||||
styleUrls: ['./examples.component.scss'],
|
||||
template: `
|
||||
<ng2-smart-table [settings]="settings" [source]="source"></ng2-smart-table>
|
||||
`,
|
||||
})
|
||||
export class AdvancedExampleServerComponent {
|
||||
|
||||
settings = {
|
||||
columns: {
|
||||
id: {
|
||||
title: 'ID',
|
||||
},
|
||||
albumId: {
|
||||
title: 'Album',
|
||||
},
|
||||
title: {
|
||||
title: 'Title',
|
||||
},
|
||||
url: {
|
||||
title: 'Url',
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
source: ServerDataSource;
|
||||
|
||||
constructor(http: HttpClient) {
|
||||
this.source = new ServerDataSource(http, { endPoint: 'https://jsonplaceholder.typicode.com/photos' });
|
||||
}
|
||||
}
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
import { Component } from '@angular/core';
|
||||
|
||||
import { LocalDataSource } from 'ng2-smart-table';
|
||||
import { BasicExampleLoadService } from './basic-example-load.service';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-basic-example-load',
|
||||
providers: [BasicExampleLoadService],
|
||||
styleUrls: ['./examples.component.scss'],
|
||||
template: `
|
||||
<ng2-smart-table [settings]="settings" [source]="source"></ng2-smart-table>
|
||||
`,
|
||||
})
|
||||
export class BasicExampleLoadComponent {
|
||||
|
||||
source: LocalDataSource;
|
||||
|
||||
settings = {
|
||||
columns: {
|
||||
id: {
|
||||
title: 'ID',
|
||||
editable: false,
|
||||
addable: false,
|
||||
},
|
||||
|
||||
name: {
|
||||
title: 'Full Name',
|
||||
},
|
||||
username: {
|
||||
title: 'User Name',
|
||||
},
|
||||
email: {
|
||||
title: 'Email',
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
constructor(protected service: BasicExampleLoadService) {
|
||||
this.source = new LocalDataSource();
|
||||
|
||||
this.service.getData().then((data) => {
|
||||
this.source.load(data);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
|
||||
@Injectable()
|
||||
export class BasicExampleLoadService {
|
||||
|
||||
static DATA_SIZE = 500;
|
||||
|
||||
// emulating request to the server
|
||||
getData(): Promise<any> {
|
||||
return new Promise((resolve, reject) => {
|
||||
setTimeout(() => {
|
||||
resolve(this.generateData());
|
||||
}, 2000);
|
||||
});
|
||||
}
|
||||
|
||||
getNewExampleObj(n?: number): any {
|
||||
n = typeof n !== 'undefined' ? n : Math.random() * 1000;
|
||||
return {
|
||||
id: n,
|
||||
name: `Jack London ${n}`,
|
||||
username: `jack_london_${n}`,
|
||||
email: `jack_london_${n}@example.com`,
|
||||
};
|
||||
}
|
||||
|
||||
protected generateData(): Array<any> {
|
||||
const data = [];
|
||||
for (let i = 0; i < BasicExampleLoadService.DATA_SIZE; i++) {
|
||||
data.push(this.getNewExampleObj(i));
|
||||
}
|
||||
return data;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,65 +0,0 @@
|
|||
.with-sidebar {
|
||||
position: relative;
|
||||
|
||||
.main-content-body {
|
||||
padding-left: 16rem;
|
||||
}
|
||||
|
||||
.fixed-sidebar {
|
||||
display: block;
|
||||
padding: 0 1rem;
|
||||
margin-top: 2rem;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
padding-top: 290px;
|
||||
width: 16rem;
|
||||
font-size: 0.875rem;
|
||||
|
||||
.back-top {
|
||||
display: none;
|
||||
margin-bottom: 1rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 1rem;
|
||||
list-style: none;
|
||||
margin-bottom: 0.875rem;
|
||||
}
|
||||
|
||||
&.scrolled {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
|
||||
.back-top {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.examples-menu {
|
||||
a.active {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 64em) {
|
||||
.with-sidebar {
|
||||
.fixed-sidebar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 42em) and (max-width: 64em) {
|
||||
.with-sidebar {
|
||||
padding: 2rem 4rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 42em) {
|
||||
.with-sidebar {
|
||||
padding: 2rem 1rem;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
import {NgModule} from '@angular/core';
|
||||
import {HttpClientModule} from '@angular/common/http';
|
||||
import {ServerExamplesComponent} from './server-examples.component';
|
||||
import {BasicExampleLoadComponent} from './basic-example-load.component';
|
||||
import {AdvancedExampleServerComponent} from './advanced-example-server.component';
|
||||
import {Ng2SmartTableModule} from 'ng2-smart-table';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
HttpClientModule,
|
||||
Ng2SmartTableModule,
|
||||
],
|
||||
declarations: [
|
||||
ServerExamplesComponent,
|
||||
BasicExampleLoadComponent,
|
||||
AdvancedExampleServerComponent,
|
||||
],
|
||||
})
|
||||
export class SampleModule { }
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
<h2>Get data from external source example</h2>
|
||||
<h3><a id="from-server" class="anchor" href="#from-server" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Loading From Server Example</h3>
|
||||
<p>
|
||||
This example shows how to pass the data loaded from some API to the table DataSource.
|
||||
</p>
|
||||
<div class="with-source">
|
||||
<ngx-basic-example-load></ngx-basic-example-load>
|
||||
</div>
|
||||
|
||||
<h3><a id="server" class="anchor" href="#server" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Server Data Source Example</h3>
|
||||
<p>
|
||||
An example on how to load data user Server DataSource:
|
||||
</p>
|
||||
<div class="with-source">
|
||||
<ngx-advanced-example-server></ngx-advanced-example-server>
|
||||
</div>
|
||||
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-server-examples',
|
||||
styleUrls: ['./examples.component.scss'],
|
||||
templateUrl: './server-examples.component.html',
|
||||
})
|
||||
export class ServerExamplesComponent { }
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { LocalDataSource } from 'ng2-smart-table';
|
||||
import { map } from 'rxjs/operators';
|
||||
|
||||
@Injectable()
|
||||
export class CustomServerDataSource extends LocalDataSource {
|
||||
|
||||
lastRequestCount: number = 0;
|
||||
|
||||
constructor(protected http: HttpClient) {
|
||||
super();
|
||||
}
|
||||
|
||||
count(): number {
|
||||
return this.lastRequestCount;
|
||||
}
|
||||
|
||||
getElements(): Promise<any> {
|
||||
let url = 'https://jsonplaceholder.typicode.com/photos?';
|
||||
|
||||
if (this.sortConf) {
|
||||
this.sortConf.forEach((fieldConf) => {
|
||||
url += `_sort=${fieldConf.field}&_order=${fieldConf.direction.toUpperCase()}&`;
|
||||
});
|
||||
}
|
||||
|
||||
if (this.pagingConf && this.pagingConf['page'] && this.pagingConf['perPage']) {
|
||||
url += `_page=${this.pagingConf['page']}&_limit=${this.pagingConf['perPage']}&`;
|
||||
}
|
||||
|
||||
if (this.filterConf.filters) {
|
||||
this.filterConf.filters.forEach((fieldConf) => {
|
||||
if (fieldConf['search']) {
|
||||
url += `${fieldConf['field']}_like=${fieldConf['search']}&`;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return this.http.get(url, { observe: 'response' })
|
||||
.pipe(
|
||||
map(res => {
|
||||
this.lastRequestCount = +res.headers.get('x-total-count');
|
||||
return res.body;
|
||||
}),
|
||||
).toPromise();
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue