Biukop
/
SFM-Broker
Obserwuj 1
Polub 0
Forkuj 0
Kod Zgłoszenia 1 Oczekujące zmiany 0 Wydania 2 Wiki Aktywność
Przeglądaj źródła

load edit only cares about add new, editing is another function totally.

tags/2.037
Patrick Sun 5 lat temu
rodzic
1ba6963e1c
commit
67d59e76c2
10 zmienionych plików z 409 dodań i 146 usunięć
Widok podzielony
Diff Options
Show Stats Download Patch File Download Diff File
  1. +3
    -1
      src/app/app-routing.module.ts
  2. +3
    -1
      src/app/app.module.ts
  3. +2
    -0
      src/app/loan-edit/dist/loan-edit.component.js
  4. +117
    -143
      src/app/loan-edit/loan-edit.component.html
  5. +4
    -0
      src/app/loan-edit/loan-edit.component.ts
  6. +2
    -1
      src/app/main-menu-items.ts
  7. +182
    -0
      src/app/transaction/transaction.component.html
  8. +20
    -0
      src/app/transaction/transaction.component.scss
  9. +25
    -0
      src/app/transaction/transaction.component.spec.ts
  10. +51
    -0
      src/app/transaction/transaction.component.ts

+ 3
- 1
src/app/app-routing.module.ts Wyświetl plik

@@ -4,13 +4,15 @@ import { AuthComponent } from './auth/auth.component';
import { CanvasComponent } from './canvas/canvas.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { AuthGuard } from './service/auth-guard.service';
import { TransactionComponent } from './transaction/transaction.component';


const routes: Routes = [
{path : '', component: DashboardComponent, canActivate: [AuthGuard]},
{path : 'canvas', component: CanvasComponent},
{path : 'dashboard', component: DashboardComponent, canActivate: [AuthGuard],},
{path : 'login', component: AuthComponent}
{path : 'login', component: AuthComponent},
{path : 'transaction', component: TransactionComponent, canActivate: [AuthGuard],},
];

@NgModule({

+ 3
- 1
src/app/app.module.ts Wyświetl plik

@@ -36,6 +36,7 @@ import { BkpDividerShadowBottomComponent } from './bkp-divider-shadow-bottom/bkp
import { BkpDividerTextComponent } from './bkp-divider-text/bkp-divider-text.component';
import { DateInputsModule } from '@progress/kendo-angular-dateinputs';
import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
import { TransactionComponent } from './transaction/transaction.component';



@@ -54,7 +55,8 @@ import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
LoanEditComponent,
BkpDividerComponent,
BkpDividerShadowBottomComponent,
BkpDividerTextComponent
BkpDividerTextComponent,
TransactionComponent
],
imports: [
BrowserModule,

+ 2
- 0
src/app/loan-edit/dist/loan-edit.component.js Wyświetl plik

@@ -9,6 +9,7 @@ exports.__esModule = true;
exports.LoanEditComponent = void 0;
var core_1 = require("@angular/core");
var forms_1 = require("@angular/forms");
var sample_product_1 = require("../models/sample_product");
var LoanEditComponent = /** @class */ (function () {
//form access
//@ViewChild('birthDate', {static: true}) birthDate: LoanEditComponent;
@@ -37,6 +38,7 @@ var LoanEditComponent = /** @class */ (function () {
{ text: 'William', value: 3 }
];
this.statis = { text: 'Female', value: 2 };
this.gridData = sample_product_1.sampleProducts;
}
LoanEditComponent.prototype.ngOnInit = function () {
};

+ 117
- 143
src/app/loan-edit/loan-edit.component.html Wyświetl plik

@@ -1,151 +1,125 @@
<div class="example-wrapper" style="opacity:1;">
<kendo-dialog title="Transaction" *ngIf="dialogOpened" (close)="close('dialog')" [minWidth]="500" [width]="850"
[minHeight]="600" [height]="800">
[minHeight]="600">
<div class="example-wrapper">
<div class="row">
<div class="col-xs-12 col-sm-12 ">
<kendo-splitter orientation="vertical" style="height: 675px;">

<kendo-splitter-pane>
<kendo-splitter>

<kendo-splitter-pane [collapsible]="true" size="50%">
<div class="pane-content">
<form class="k-form" [formGroup]="registerForm">
<fieldset class="k-form-fieldset">
<legend class="k-form-legend">Bank Transaction Details</legend>
<kendo-formfield>
<kendo-label [for]="transID" text="Transaction ID"></kendo-label>
<input formControlName="transID" kendoTextBox #transID required />

<kendo-formhint>Unique transaction
ID from bank </kendo-formhint>
<kendo-formerror>Error: the ID is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="submissionDate" [optional]="false"
text="Submission Date"></kendo-label>
<kendo-datepicker #submissionDate formControlName="submissionDate"
[min]="min" [max]="max">
</kendo-datepicker>

<kendo-formhint>Date in bank</kendo-formhint>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="clientNames" [optional]="false"
text="Client Names"></kendo-label>
<kendo-multiselect
#clientNames
formControlName="clientNames"
[textField]="'text'"
[valueField]="'value'"
[valuePrimitive]="true"
[data]="listClientNames"
>
</kendo-multiselect>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="brokers" [optional]="false"
text="Brokers Names"></kendo-label>
<kendo-multiselect
#brokers
formControlName="brokers"
[textField]="'text'"
[valueField]="'value'"
[valuePrimitive]="true"
[data]="listClientNames"
>
</kendo-multiselect>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="referals" [optional]="false"
text="Referals/BDM"></kendo-label>
<kendo-multiselect
#referals
formControlName="referals"
[textField]="'text'"
[valueField]="'value'"
[valuePrimitive]="true"
[data]="listClientNames"
>
</kendo-multiselect>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="status" [text]="'Progress Status'"></kendo-label>
<kendo-dropdownlist
#status
formControlName="status"
[data]="listClientNames"
[defaultItem]="{ text: 'Select Status', value: null }"
[textField]="'text'"
[valueField]="'value'"
required
>
</kendo-dropdownlist>
<kendo-formerror>Error: status is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="lender" text="Lender Organization">
</kendo-label>
<input formControlName="lender" kendoTextBox #lender required />

<kendo-formhint>E.g. NAB Bank</kendo-formhint>
<kendo-formerror>Error: Lender is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="limit" text="Loan Limit">
</kendo-label>
<input formControlName="limit" kendoTextBox #limit required />

<kendo-formhint>E.g. 8000</kendo-formhint>
<kendo-formerror>Error: Limit is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="settlementDate" [optional]="false"
text="Settlement Date"></kendo-label>
<kendo-datepicker #settlementDate formControlName="settlementDate"
[min]="min" [max]="max">
</kendo-datepicker>

<kendo-formhint>Date Settled</kendo-formhint>
</kendo-formfield>

<div class="k-form-buttons">
<button class="k-button k-primary"
(click)="submitForm()">Submit</button>
<button class="k-button" (click)="clearForm()">Clear</button>
</div>
</fieldset>
</form>
</div>
</kendo-splitter-pane>

<kendo-splitter-pane [collapsible]="true">
<div class="pane-content">
<h3>Commission Splits</h3>
<p>Resizable and collapsible.</p>
</div>
</kendo-splitter-pane>

</kendo-splitter>
</kendo-splitter-pane>

<kendo-splitter-pane [collapsible]="true" size="100px">
<div class="pane-content">
<h3>Revelant Parties</h3>
<p> a table for revelant parties editable grid</p>
</div>
</kendo-splitter-pane>

</kendo-splitter>
<div class="pane-content">
<form class="k-form" [formGroup]="registerForm">
<fieldset class="k-form-fieldset">
<legend class="k-form-legend">Bank Transaction Details</legend>
<kendo-formfield>
<kendo-label [for]="transID" text="Transaction ID"></kendo-label>
<input formControlName="transID" kendoTextBox #transID required />

<kendo-formhint>Unique transaction
ID from bank </kendo-formhint>
<kendo-formerror>Error: the ID is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="submissionDate" [optional]="false"
text="Submission Date"></kendo-label>
<kendo-datepicker #submissionDate formControlName="submissionDate"
[min]="min" [max]="max">
</kendo-datepicker>

<kendo-formhint>Date in bank</kendo-formhint>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="clientNames" [optional]="false"
text="Client Names"></kendo-label>
<kendo-multiselect
#clientNames
formControlName="clientNames"
[textField]="'text'"
[valueField]="'value'"
[valuePrimitive]="true"
[data]="listClientNames"
>
</kendo-multiselect>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="brokers" [optional]="false"
text="Brokers Names"></kendo-label>
<kendo-multiselect
#brokers
formControlName="brokers"
[textField]="'text'"
[valueField]="'value'"
[valuePrimitive]="true"
[data]="listClientNames"
>
</kendo-multiselect>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="referals" [optional]="false"
text="Referals/BDM"></kendo-label>
<kendo-multiselect
#referals
formControlName="referals"
[textField]="'text'"
[valueField]="'value'"
[valuePrimitive]="true"
[data]="listClientNames"
>
</kendo-multiselect>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="status" [text]="'Progress Status'"></kendo-label>
<kendo-dropdownlist
#status
formControlName="status"
[data]="listClientNames"
[defaultItem]="{ text: 'Select Status', value: null }"
[textField]="'text'"
[valueField]="'value'"
required
>
</kendo-dropdownlist>
<kendo-formerror>Error: status is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="lender" text="Lender Organization">
</kendo-label>
<input formControlName="lender" kendoTextBox #lender required />

<kendo-formhint>E.g. NAB Bank</kendo-formhint>
<kendo-formerror>Error: Lender is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="limit" text="Loan Limit">
</kendo-label>
<input formControlName="limit" kendoTextBox #limit required />

<kendo-formhint>E.g. 8000</kendo-formhint>
<kendo-formerror>Error: Limit is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="settlementDate" [optional]="false"
text="Settlement Date"></kendo-label>
<kendo-datepicker #settlementDate formControlName="settlementDate"
[min]="min" [max]="max">
</kendo-datepicker>

<kendo-formhint>Date Settled</kendo-formhint>
</kendo-formfield>

<div class="k-form-buttons">
<button class="k-button k-primary"
(click)="submitForm()">Add New </button>
<button class="k-button" (click)="clearForm()">Clear</button>
</div>
</fieldset>
</form>
</div>
</div>
</div>
</div>

+ 4
- 0
src/app/loan-edit/loan-edit.component.ts Wyświetl plik

@@ -1,5 +1,6 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { sampleProducts } from '../models/sample_product';

@Component({
selector: 'app-loan-edit',
@@ -71,4 +72,7 @@ export class LoanEditComponent implements OnInit {
];

public statis: { text: string, value: number } = { text: 'Female', value: 2 };


public gridData: any[] = sampleProducts;
}

+ 2
- 1
src/app/main-menu-items.ts Wyświetl plik

@@ -18,7 +18,8 @@ export const mainMenuItems: any[] = [
text: 'Loans',
icon: 'dollar',
items: [
{ text: 'Add', icon: 'plus', popup: "loanEdit" },
{ text: 'Add+', icon: 'plus', popup: "loanEdit" },
{ text: 'Edit', icon: 'plus', url: "./#transaction" },
{ text: 'List All', icon: 'table' ,url: '#' },
{ text: '--', separator: "true" },
{ text: 'Export All Loans' , icon: "excel"},

+ 182
- 0
src/app/transaction/transaction.component.html Wyświetl plik

@@ -0,0 +1,182 @@
<div class="container outer">
<div class="container inner">
<div class="row">
<div class="col-xs-12 col-sm-12 ">
<kendo-splitter orientation="vertical" class="transSplit">

<kendo-splitter-pane>
<kendo-splitter>

<kendo-splitter-pane [collapsible]="true" size="50%">
<div class="pane-content">
<form class="k-form" [formGroup]="registerForm">
<fieldset class="k-form-fieldset">
<legend class="k-form-legend">Bank Transaction Details</legend>
<kendo-formfield>
<kendo-label [for]="transID" text="Transaction ID"></kendo-label>
<input formControlName="transID" kendoTextBox #transID required />

<kendo-formhint>Unique transaction
ID from bank </kendo-formhint>
<kendo-formerror>Error: the ID is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="submissionDate" [optional]="false"
text="Submission Date"></kendo-label>
<kendo-datepicker #submissionDate formControlName="submissionDate"
[min]="min" [max]="max">
</kendo-datepicker>

<kendo-formhint>Date in bank</kendo-formhint>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="clientNames" [optional]="false"
text="Client Names"></kendo-label>
<kendo-multiselect
#clientNames
formControlName="clientNames"
[textField]="'text'"
[valueField]="'value'"
[valuePrimitive]="true"
[data]="listClientNames"
>
</kendo-multiselect>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="brokers" [optional]="false"
text="Brokers Names"></kendo-label>
<kendo-multiselect
#brokers
formControlName="brokers"
[textField]="'text'"
[valueField]="'value'"
[valuePrimitive]="true"
[data]="listClientNames"
>
</kendo-multiselect>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="referals" [optional]="false"
text="Referals/BDM"></kendo-label>
<kendo-multiselect
#referals
formControlName="referals"
[textField]="'text'"
[valueField]="'value'"
[valuePrimitive]="true"
[data]="listClientNames"
>
</kendo-multiselect>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="status" [text]="'Progress Status'"></kendo-label>
<kendo-dropdownlist
#status
formControlName="status"
[data]="listClientNames"
[defaultItem]="{ text: 'Select Status', value: null }"
[textField]="'text'"
[valueField]="'value'"
required
>
</kendo-dropdownlist>
<kendo-formerror>Error: status is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="lender" text="Lender Organization">
</kendo-label>
<input formControlName="lender" kendoTextBox #lender required />

<kendo-formhint>E.g. NAB Bank</kendo-formhint>
<kendo-formerror>Error: Lender is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="limit" text="Loan Limit">
</kendo-label>
<input formControlName="limit" kendoTextBox #limit required />

<kendo-formhint>E.g. 8000</kendo-formhint>
<kendo-formerror>Error: Limit is required</kendo-formerror>
</kendo-formfield>

<kendo-formfield>
<kendo-label [for]="settlementDate" [optional]="false"
text="Settlement Date"></kendo-label>
<kendo-datepicker #settlementDate formControlName="settlementDate"
[min]="min" [max]="max">
</kendo-datepicker>

<kendo-formhint>Date Settled</kendo-formhint>
</kendo-formfield>

<div class="k-form-buttons">
<button class="k-button k-primary"
(click)="submitForm()">Submit</button>
<button class="k-button" (click)="clearForm()">Clear</button>
</div>
</fieldset>
</form>
</div>
</kendo-splitter-pane>

<kendo-splitter-pane [collapsible]="true">
<div class="pane-content">
<h3>Commission Splits</h3>
<kendo-grid [data]="gridData">
<kendo-grid-column field="ProductID" title="ID" width="40">
</kendo-grid-column>
<kendo-grid-column field="ProductName" title="Name" width="250">
</kendo-grid-column>
<kendo-grid-column field="Category.CategoryName" title="Category">
</kendo-grid-column>
<kendo-grid-column field="UnitPrice" title="Price" width="80">
</kendo-grid-column>
<kendo-grid-column field="UnitsInStock" title="In stock" width="80">
</kendo-grid-column>
<kendo-grid-column field="Discontinued" title="Discontinued" width="120">
<ng-template kendoGridCellTemplate let-dataItem>
<input type="checkbox" [checked]="dataItem.Discontinued" disabled />
</ng-template>
</kendo-grid-column>
</kendo-grid>
</div>
</kendo-splitter-pane>

</kendo-splitter>
</kendo-splitter-pane>

<kendo-splitter-pane [collapsible]="true" size="400px">
<div class="pane-content">
<h3>Revelant Parties</h3>
<kendo-grid [data]="gridData">
<kendo-grid-column field="ProductID" title="ID" width="40">
</kendo-grid-column>
<kendo-grid-column field="ProductName" title="Name" width="250">
</kendo-grid-column>
<kendo-grid-column field="Category.CategoryName" title="Category">
</kendo-grid-column>
<kendo-grid-column field="UnitPrice" title="Price" width="80">
</kendo-grid-column>
<kendo-grid-column field="UnitsInStock" title="In stock" width="80">
</kendo-grid-column>
<kendo-grid-column field="Discontinued" title="Discontinued" width="120">
<ng-template kendoGridCellTemplate let-dataItem>
<input type="checkbox" [checked]="dataItem.Discontinued" disabled />
</ng-template>
</kendo-grid-column>
</kendo-grid>
</div>
</kendo-splitter-pane>

</kendo-splitter>
</div>
</div>
</div>
</div>

+ 20
- 0
src/app/transaction/transaction.component.scss Wyświetl plik

@@ -0,0 +1,20 @@
.container.outer{
width:100%;
background: url('../../assets/img/body_bg.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
opacity:0.98;
}
.container.inner {
width: 99%;
min-height: calc(100vh - 48px);
/* background-color:chartreuse; */
}

.pane-content { padding: 0 10px; }

.transSplit{
min-height: calc(100vh - 48px);
}

+ 25
- 0
src/app/transaction/transaction.component.spec.ts Wyświetl plik

@@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';

import { TransactionComponent } from './transaction.component';

describe('TransactionComponent', () => {
let component: TransactionComponent;
let fixture: ComponentFixture<TransactionComponent>;

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ TransactionComponent ]
})
.compileComponents();
});

beforeEach(() => {
fixture = TestBed.createComponent(TransactionComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});

+ 51
- 0
src/app/transaction/transaction.component.ts Wyświetl plik

@@ -0,0 +1,51 @@
import { Component, OnInit } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';
import { sampleProducts } from '../models/sample_product';

@Component({
selector: 'app-transaction',
templateUrl: './transaction.component.html',
styleUrls: ['./transaction.component.scss']
})
export class TransactionComponent implements OnInit {

constructor() { }

ngOnInit(): void {
}


public min: Date = new Date(2015, 0, 1);
public max: Date = new Date(2030, 4, 31);

public registerForm: FormGroup = new FormGroup({
transID: new FormControl(),
submissionDate: new FormControl(new Date(2020, 0, 10)),
clientNames : new FormControl([1]),
brokers : new FormControl([2]),
referals : new FormControl([3]),
status: new FormControl(),
lender: new FormControl(),
limit: new FormControl(),
settlementDate: new FormControl(new Date(2020, 0, 9)),
});

public submitForm(): void {
this.registerForm.markAllAsTouched();
}

public clearForm(): void {
this.registerForm.reset();
}
public listClientNames: Array<{ text: string, value: number }> = [
{ text: 'John', value: 1 },
{ text: 'Steven', value: 2 },
{ text: 'William', value: 3 }
];

public statis: { text: string, value: number } = { text: 'Female', value: 2 };


public gridData: any[] = sampleProducts;
}

Napisz Podgląd
Ładowanie…
Anuluj
Zapisz