Sineedge/sparqsineedge
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of https://bitbucket.org/sriramv18/sparqsineedge

Browse Source
This commit is contained in:
saravanakumarkandasami 2018-10-12 16:57:42 +05:30
commit bf7e287654
22 changed files with 908 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
ng6-seed/src/app/template/service/templates/templates.service.spec.ts Normal file
View File

@ -0,0 +1,12 @@
import { TestBed } from '@angular/core/testing';
import { TemplatesService } from './templates.service';
describe('TemplatesService', () => {
beforeEach(() => TestBed.configureTestingModule({}));
it('should be created', () => {
const service: TemplatesService = TestBed.get(TemplatesService);
expect(service).toBeTruthy();
});
});

9
ng6-seed/src/app/template/service/templates/templates.service.ts Normal file
View File

@ -0,0 +1,9 @@
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class TemplatesService {
constructor() { }
}

8
ng6-seed/src/app/template/template.module.ts
View File

@ -8,7 +8,10 @@ import {
MatRadioModule,
MatButtonModule,MatTableModule,MatPaginatorModule,
MatProgressBarModule,MatDialogModule, MatSortModule,
MatToolbarModule,MatSelectModule } from '@angular/material';
MatToolbarModule,MatSelectModule,
MatListModule, MatMenuModule,
MatCheckboxModule, MatStepperModule, MatTabsModule,
MatExpansionModule } from '@angular/material';
import {MatSlideToggleModule} from '@angular/material/slide-toggle';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { FileUploadModule } from 'ng2-file-upload/ng2-file-upload';
@ -44,6 +47,9 @@ import { MastersService } from './service/masters/masters.service';
MatButtonModule,MatTableModule,MatPaginatorModule,
MatProgressBarModule,MatDialogModule, MatSortModule,
MatToolbarModule,MatSelectModule,
MatListModule, MatMenuModule,
MatCheckboxModule, MatStepperModule, MatTabsModule,
MatExpansionModule ,
FormsModule,ReactiveFormsModule,
// HttpClientModule,
],

38
ng6-seed/src/app/template/templates/templates-list/edit/edit-category/edit-category.component.html Normal file
View File

@ -0,0 +1,38 @@
<form [formGroup]="_editTempCategoryFrom" (submit)="onSubmit()">
<div formArrayName="temp_category" class="example-full-width">
<mat-list role="list">
<mat-list-item style="margin: 2px 0;" *ngFor="let answ of _editTempCategoryFrom.controls.temp_category['controls']; let i=index ; let last = last;"
role="listitem">
<div [formGroupName]="i">
<div fxLayout="row" fxLayoutWrap fxLayoutGap="5%" fxLayoutAlign="start center">
<div fxFlex="0 1 auto" class="ml-xs">
<mat-form-field>
<mat-select placeholder="Category" formControlName="fk_category_id">
<mat-option *ngFor="let category of m_categoryList" [value]="category.fk_category_id">{{ category.name }}</mat-option>
</mat-select>
<!--<mat-error *ngIf="submitted && f.fk_category_id.hasError('required')" class="mat-text-warn">You must Select Lender Type.</mat-error>-->
</mat-form-field>
</div>
<div fxFlex="0 1 auto" class="ml-xs">
<mat-form-field style="width: 25%; text-align: center" appearance="outline">
<input matInput formControlName="weightage">
</mat-form-field> <span>%</span>
</div>
<div fxFlex="0 1 auto" class="ml-xs">
<button *ngIf="_editTempCategoryFrom.controls.temp_category.controls.length > 1" (click)="removeLanguage(i)" mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</div>
<div fxFlex="0 1 auto" class="ml-xs">
<button *ngIf="last" mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Add More" matTooltipPosition="above" (click)="addLanguage($event); false"><mat-icon>add</mat-icon></button>
</div>
</div>
</div>
</mat-list-item>
</mat-list>
</div>
<div class="row" style="text-align:right;">
<!--<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="reset"><mat-icon>settings_backup_restore</mat-icon></button>-->
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
</div>
</form>

0
ng6-seed/src/app/template/templates/templates-list/edit/edit-category/edit-category.component.scss Normal file
View File

25
ng6-seed/src/app/template/templates/templates-list/edit/edit-category/edit-category.component.spec.ts Normal file
View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { EditCategoryComponent } from './edit-category.component';
describe('EditCategoryComponent', () => {
let component: EditCategoryComponent;
let fixture: ComponentFixture<EditCategoryComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ EditCategoryComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(EditCategoryComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

103
ng6-seed/src/app/template/templates/templates-list/edit/edit-category/edit-category.component.ts Normal file
View File

@ -0,0 +1,103 @@
import { Component, ViewChild, OnInit, OnDestroy, Input } from '@angular/core';
import { MatPaginator, MatSort, MatTableDataSource, MatDialog, PageEvent } from '@angular/material';
import { FormGroup, FormControl, FormBuilder, Validators , FormArray} from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { DataSource } from '@angular/cdk/table';
import { Observable } from 'rxjs/Observable';
@Component({
selector: 'app-template-edit-category',
templateUrl: './edit-category.component.html',
styleUrls: ['./edit-category.component.scss']
})
export class EditCategoryComponent implements OnInit, OnDestroy {
@Input() questionId: number;
public _editTempCategoryFrom: FormGroup;
public submitted = false;
constructor(
private _formBuilder: FormBuilder,
public dialog: MatDialog) {
}
ngOnInit() {
this.initalLoadFormData();
if(this.categoryList.length > 0){
for (let val of this.categoryList) {
// alert(JSON.stringify(val));
let vals = val;
this.addLanguage(vals['fk_category_id'], vals['name'], vals['weightage'], null);
}
}
}
initalLoadFormData(){
this._editTempCategoryFrom = this._formBuilder.group({
temp_category: this._formBuilder.array([
// this.initAnswers(),
])
})
}
// convenience getter for easy access to form fields
get f() { return this._editTempCategoryFrom.controls; }
public m_categoryList = [{
fk_category_id: 1,
name: 'Category List 1',
weightage: 2,
},{
fk_category_id: 2,
name: 'Category List 2',
weightage: 5,
},{
fk_category_id: 3,
name: 'Category List 2',
weightage: 5,
}];
public categoryList = [{
fk_category_id: 1,
name: 'Category List 1',
weightage: 2,
},{
fk_category_id: 2,
name: 'Category List 2',
weightage: 5,
}];
// Dynamic Form field creation Functionality : START ===>
initAnswers(fk_cat_id, name, weightage) {
return this._formBuilder.group({
fk_category_id: [fk_cat_id, Validators.compose([Validators.required])],
name: [name, Validators.compose([Validators.required])],
weightage: [weightage, Validators.compose([Validators.required])],
});
}
addLanguage(fk_cat_id, name, weightage, e) {
const control = <FormArray>this._editTempCategoryFrom.controls['temp_category'];
control.push(this.initAnswers(fk_cat_id, name, weightage));
}
removeLanguage(i: number) {
const control = <FormArray>this._editTempCategoryFrom.controls['temp_category'];
control.removeAt(i);
}
// END ===>
/** To Save/Edited Popup Data */
onSubmit() {
this.submitted = true;
// stop here if form is invalid
}
ngOnDestroy(): void {
//Called once, before the instance is destroyed.
//Add 'implements OnDestroy' to the class.
}
}

46
ng6-seed/src/app/template/templates/templates-list/edit/edit-lender/edit-lender.component.html Normal file
View File

@ -0,0 +1,46 @@
<form [formGroup]="_editTempLenderFrom" (submit)="onSubmit()">
<div formArrayName="temp_lender" class="example-full-width">
<div *ngFor="let answ of _editTempLenderFrom.controls.temp_lender['controls']; let i=index">
<div [formGroupName]="i">
<div fxLayout="row" fxLayoutWrap fxLayoutGap="0.5%" fxLayoutAlign="start center">
<mat-form-field fxFlex="0 1 auto" class="ml-xs">
<mat-select placeholder="Lender" formControlName="fk_lender_id">
<mat-option *ngFor="let enti of entityOptions" [value]="enti.fk_lender_id">{{ enti.name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && f.fk_lender_id.hasError('required')" class="mat-text-warn">You must Select Lender Type.</mat-error>
</mat-form-field>
<mat-form-field fxFlex="0 1 auto" class="ml-xs">
<mat-select placeholder="Product" formControlName="fk_product_id">
<mat-option *ngFor="let enti of entityOptions" [value]="enti.fk_product_id">{{ enti.name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && f.fk_product_id.hasError('required')" class="mat-text-warn">You must Select Product.</mat-error>
</mat-form-field>
<mat-form-field fxFlex="0 1 auto" class="ml-xs">
<mat-select placeholder="Catergory Segment" formControlName="fk_category_segment_id">
<mat-option *ngFor="let enti of entityOptions" [value]="enti.fk_category_segment_id">{{ enti.name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && f.fk_category_segment_id.hasError('required')" class="mat-text-warn">You must Select Category Segment.</mat-error>
</mat-form-field>
<!--<mat-form-field fxFlex="0 1 auto" class="ml-xs">
<input matInput placeholder="Email" formControlName="contact_email">
</mat-form-field>
<mat-form-field fxFlex="0 1 auto" class="ml-xs">
<input matInput placeholder="Mobile Number" formControlName="contact_mobile_no">
</mat-form-field>-->
<span *ngIf="_editTempLenderFrom.controls.temp_lender.controls.length > 1" (click)="removeLanguage(i)">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</span>
</div>
</div>
</div>
<button mat-fab class="mr-1 mb-1" color="primary" matTooltip="Add More Contact Person" matTooltipPosition="above" (click)="addLanguage($event); false"><mat-icon>add</mat-icon></button>
</div>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="reset"><mat-icon>settings_backup_restore</mat-icon></button>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
</div>
</form>

0
ng6-seed/src/app/template/templates/templates-list/edit/edit-lender/edit-lender.component.scss Normal file
View File

25
ng6-seed/src/app/template/templates/templates-list/edit/edit-lender/edit-lender.component.spec.ts Normal file
View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { EditLenderComponent } from './edit-lender.component';
describe('EditLenderComponent', () => {
let component: EditLenderComponent;
let fixture: ComponentFixture<EditLenderComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ EditLenderComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(EditLenderComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

74
ng6-seed/src/app/template/templates/templates-list/edit/edit-lender/edit-lender.component.ts Normal file
View File

@ -0,0 +1,74 @@
import { Component, ViewChild, OnInit, OnDestroy, Input } from '@angular/core';
import { MatPaginator, MatSort, MatTableDataSource, MatDialog, PageEvent } from '@angular/material';
import { FormGroup, FormControl, FormBuilder, Validators , FormArray} from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { DataSource } from '@angular/cdk/table';
import { Observable } from 'rxjs/Observable';
@Component({
selector: 'app-template-edit-lender',
templateUrl: './edit-lender.component.html',
styleUrls: ['./edit-lender.component.scss']
})
export class EditLenderComponent implements OnInit {
@Input() questionId: number;
public _editTempLenderFrom: FormGroup;
public submitted = false;
constructor(
private _formBuilder: FormBuilder) {
}
ngOnInit() {
this._editTempLenderFrom = this._formBuilder.group({
temp_lender: this._formBuilder.array([
this.initAnswers(),
])
})
}
// convenience getter for easy access to form fields
get f() { return this._editTempLenderFrom.controls; }
public entityOptions = [{
fk_lender_id: 1,
name: 'Lender1'
},{
fk_lender_id: 2,
name: 'Lender2'
}];
// Dynamic Form field creation Functionality : START ===>
initAnswers() {
return this._formBuilder.group({
fk_lender_id: ['', Validators.compose([Validators.required])],
fk_product_id: ['', Validators.compose([Validators.required])],
fk_category_segment_id: ['', Validators.compose([Validators.required])],
});
}
addLanguage(e) {
const control = <FormArray>this._editTempLenderFrom.controls['temp_lender'];
control.push(this.initAnswers());
}
removeLanguage(i: number) {
const control = <FormArray>this._editTempLenderFrom.controls['temp_lender'];
control.removeAt(i);
}
// END ===>
/** To Save/Edited Popup Data */
onSubmit() {
this.submitted = true;
// stop here if form is invalid
}
ngOnDestroy(): void {
//Called once, before the instance is destroyed.
//Add 'implements OnDestroy' to the class.
}
}

100
ng6-seed/src/app/template/templates/templates-list/edit/edit-question-answer/edit-question-answer.component.html Normal file
View File

@ -0,0 +1,100 @@
<!--<form [formGroup]="_editTempCategoryFrom" (submit)="onSubmit()">
<div formArrayName="temp_category" class="example-full-width">
<mat-list role="list">
<mat-list-item style="margin: 2px 0;" *ngFor="let answ of _editTempCategoryFrom.controls.temp_category['controls']; let i=index ; let last = last;"
role="listitem">
<div [formGroupName]="i">
<div fxLayout="row" fxLayoutWrap fxLayoutGap="5%" fxLayoutAlign="start center">
<div fxFlex="0 1 auto" class="ml-xs">
<mat-form-field>
<mat-select placeholder="Category" formControlName="fk_category_id">
<mat-option *ngFor="let category of m_categoryList" [value]="category.fk_category_id">{{ category.name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div fxFlex="0 1 auto" class="ml-xs">
<mat-form-field style="width: 25%; text-align: center" appearance="outline">
<input matInput formControlName="weightage">
</mat-form-field> <span>%</span>
</div>
<div fxFlex="0 1 auto" class="ml-xs">
<button *ngIf="_editTempCategoryFrom.controls.temp_category.controls.length > 1" (click)="removeLanguage(i)" mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</div>
<div fxFlex="0 1 auto" class="ml-xs">
<button *ngIf="last" mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Add More" matTooltipPosition="above" (click)="addLanguage($event); false"><mat-icon>add</mat-icon></button>
</div>
</div>
</div>
</mat-list-item>
</mat-list>
</div>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
</div>
</form>-->
<mat-card>
<mat-accordion>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>
Category 1
</mat-panel-title>
<mat-panel-description>
50%
</mat-panel-description>
</mat-expansion-panel-header>
<!--<mat-horizontal-stepper [linear]="isLinear" #stepper>
<mat-step [stepControl]="firstFormGroup">
<form [formGroup]="firstFormGroup">
<ng-template matStepLabel>Questions</ng-template>
<mat-list role="list">
<mat-list-item role="listitem">Item 1</mat-list-item>
<hr>
<mat-list-item role="listitem">Item 2</mat-list-item>
<hr>
<mat-list-item role="listitem">Item 3</mat-list-item>
<hr>
</mat-list>
<div>
<button mat-button matStepperNext>Next</button>
</div>
</form>
</mat-step>
<mat-step [stepControl]="secondFormGroup">
<form [formGroup]="secondFormGroup">
<ng-template matStepLabel>Answers</ng-template>
<mat-form-field>
<input matInput placeholder="Address" formControlName="secondCtrl" required>
</mat-form-field>
<div>
<button mat-button matStepperPrevious>Back</button>
<button mat-button matStepperNext>Next</button>
</div>
</form>
</mat-step>
<mat-step>
<ng-template matStepLabel>Done</ng-template>
You are now done.
<div>
<button mat-button matStepperPrevious>Back</button>
<button mat-button (click)="stepper.reset()">Reset</button>
</div>
</mat-step>
</mat-horizontal-stepper>-->
</mat-expansion-panel>
<mat-expansion-panel (opened)="panelOpenState = true" (closed)="panelOpenState = false">
<mat-expansion-panel-header>
<mat-panel-title>
Category 2
</mat-panel-title>
<mat-panel-description>
50%
</mat-panel-description>
</mat-expansion-panel-header>
<p>I'm visible because I am open</p>
</mat-expansion-panel>
</mat-accordion>
</mat-card>

0
ng6-seed/src/app/template/templates/templates-list/edit/edit-question-answer/edit-question-answer.component.scss Normal file
View File

25
ng6-seed/src/app/template/templates/templates-list/edit/edit-question-answer/edit-question-answer.component.spec.ts Normal file
View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { EditQuestionAnswerComponent } from './edit-question-answer.component';
describe('EditQuestionAnswerComponent', () => {
let component: EditQuestionAnswerComponent;
let fixture: ComponentFixture<EditQuestionAnswerComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ EditQuestionAnswerComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(EditQuestionAnswerComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

104
ng6-seed/src/app/template/templates/templates-list/edit/edit-question-answer/edit-question-answer.component.ts Normal file
View File

@ -0,0 +1,104 @@
import { Component, ViewChild, OnInit, OnDestroy, Input } from '@angular/core';
import { MatPaginator, MatSort, MatTableDataSource, MatDialog, PageEvent } from '@angular/material';
import { FormGroup, FormControl, FormBuilder, Validators , FormArray} from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { DataSource } from '@angular/cdk/table';
import { Observable } from 'rxjs/Observable';
@Component({
selector: 'app-template-edit-question-answer',
templateUrl: './edit-question-answer.component.html',
styleUrls: ['./edit-question-answer.component.scss']
})
export class EditQuestionAnswerComponent implements OnInit {
@Input() questionId: number;
public _editTempCategoryFrom: FormGroup;
public submitted = false;
public panelOpenState : boolean;
constructor(
private _formBuilder: FormBuilder,
public dialog: MatDialog) {
}
ngOnInit() {
this.initalLoadFormData();
if(this.categoryList.length > 0){
for (let val of this.categoryList) {
// alert(JSON.stringify(val));
let vals = val;
this.addLanguage(vals['fk_category_id'], vals['name'], vals['weightage'], null);
}
}
}
initalLoadFormData(){
this._editTempCategoryFrom = this._formBuilder.group({
temp_category: this._formBuilder.array([
// this.initAnswers(),
])
})
}
// convenience getter for easy access to form fields
get f() { return this._editTempCategoryFrom.controls; }
public m_categoryList = [{
fk_category_id: 1,
name: 'Category List 1',
weightage: 2,
},{
fk_category_id: 2,
name: 'Category List 2',
weightage: 5,
},{
fk_category_id: 3,
name: 'Category List 2',
weightage: 5,
}];
public categoryList = [{
fk_category_id: 1,
name: 'Category List 1',
weightage: 2,
},{
fk_category_id: 2,
name: 'Category List 2',
weightage: 5,
}];
// Dynamic Form field creation Functionality : START ===>
initAnswers(fk_cat_id, name, weightage) {
return this._formBuilder.group({
fk_category_id: [fk_cat_id, Validators.compose([Validators.required])],
name: [name, Validators.compose([Validators.required])],
weightage: [weightage, Validators.compose([Validators.required])],
});
}
addLanguage(fk_cat_id, name, weightage, e) {
const control = <FormArray>this._editTempCategoryFrom.controls['temp_category'];
control.push(this.initAnswers(fk_cat_id, name, weightage));
}
removeLanguage(i: number) {
const control = <FormArray>this._editTempCategoryFrom.controls['temp_category'];
control.removeAt(i);
}
// END ===>
/** To Save/Edited Popup Data */
onSubmit() {
this.submitted = true;
// stop here if form is invalid
}
ngOnDestroy(): void {
//Called once, before the instance is destroyed.
//Add 'implements OnDestroy' to the class.
}
}

78
ng6-seed/src/app/template/templates/templates-list/edit/templates.edit.component.html
View File

@ -1,56 +1,38 @@
<mat-card style="padding: 6px;">
<div class="ml-xs mr-xs" style="width: 100%;" fxLayout="row" fxLayoutAlign="center">
<h2 mat-dialog-title style="width: 50%;">{{pageTitle}}</h2>
<div style="width: 20%;"></div>
<div style="width: 30%;text-align:right;">
<div fxLayout="row" fxLayoutAlign="end start">
<button mat-raised-button mat-icon-button color="primary" class="mr-1 mb-1 hover-icon" matTooltip="Close" matTooltipPosition="above"
(click)="backToList()"><mat-icon>close</mat-icon></button>
</div>
</div>
<form (submit)="onSubmit()">
<mat-card style="padding: 6px;">
<div fxLayout="row wrap" fxLayoutGap="32px" fxLayoutAlign="flex-start">
<h6>Template Name</h6>
<hr>
<form (submit)="onSubmit()">
<div fxLayout="row" fxLayoutWrap fxLayoutGap="0.5%" fxLayoutAlign="start center">
<mat-form-field class="ml-xs">
<input matInput placeholder="Template Name">
<mat-error *ngIf="submitted && f.pan.hasError('required')" class="mat-text-warn">You must Include Pan Number.</mat-error>
</mat-form-field>
</div>
<input matInput placeholder="Template Name">
<!--<mat-error *ngIf="submitted && f.pan.hasError('required')" class="mat-text-warn">You must Include Pan Number.</mat-error>-->
</mat-form-field>
<div>
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="reset"><mat-icon>settings_backup_restore</mat-icon></button>
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
</div>
</div>
</form>
</mat-card>
</form>
<button mat-raised-button (click)="isLinear = !isLinear" id="toggle-linear">
{{!isLinear ? 'Enable linear mode' : 'Disable linear mode'}}
</button>
<mat-vertical-stepper [linear]="isLinear" #stepper>
<mat-step [stepControl]="firstFormGroup">
<form [formGroup]="firstFormGroup">
<ng-template matStepLabel>Fill out your name</ng-template>
<mat-form-field>
<input matInput placeholder="Last name, First name" formControlName="firstCtrl" required>
</mat-form-field>
<div>
<button mat-button matStepperNext>Next</button>
</div>
</form>
</mat-step>
<mat-step [stepControl]="secondFormGroup">
<form [formGroup]="secondFormGroup">
<ng-template matStepLabel>Fill out your address</ng-template>
<mat-form-field>
<input matInput placeholder="Address" formControlName="secondCtrl" required>
</mat-form-field>
<div>
<button mat-button matStepperPrevious>Back</button>
<button mat-button matStepperNext>Next</button>
</div>
</form>
</mat-step>
<mat-step>
<ng-template matStepLabel>Done</ng-template>
You are now done.
<div>
<button mat-button matStepperPrevious>Back</button>
<button mat-button (click)="stepper.reset()">Reset</button>
</div>
</mat-step>
</mat-vertical-stepper>
<mat-card>
<mat-tab-group>
<mat-tab label="Lender Details">
<app-template-edit-lender [questionId]="question_id">
</app-template-edit-lender>
</mat-tab>
<mat-tab label="Category">
<app-template-edit-category [questionId]="question_id">
</app-template-edit-category> </mat-tab>
<mat-tab label="Questions / Answers">
<app-template-edit-question-answer [questionId]="question_id">
</app-template-edit-question-answer>
</mat-tab>
</mat-tab-group>
</mat-card>
</mat-card>

11
ng6-seed/src/app/template/templates/templates-list/edit/templates.edit.component.ts
View File

@ -16,11 +16,14 @@ import { TemplateListComponent } from './../templates.list.component';
templateUrl: './templates.edit.component.html'
})
export class TemplateEditComponent implements OnInit, OnDestroy {
public pageTitle: string = "Edit Template";
public pageTitle: string = "Edit Template";
public question_id : number;
public submitted: boolean = false;
constructor( private route: ActivatedRoute,
private router: Router,
private templateListComponent : TemplateListComponent) {
this.question_id = this.route.snapshot.params['question-id'];
}
ngOnInit() {
@ -32,6 +35,12 @@ export class TemplateEditComponent implements OnInit, OnDestroy {
this.router.navigate([ '../../' ], { relativeTo: this.route });
}
/** To Save/Edited Popup Data */
onSubmit() {
this.submitted = true;
// stop here if form is invalid
}
ngOnDestroy(): void {
//Called once, before the instance is destroyed.
//Add 'implements OnDestroy' to the class.

76
ng6-seed/src/app/template/templates/templates-list/templates.list.component.html
View File

@ -1,11 +1,73 @@
<div *ngIf="listView">
<mat-form-field fxFlex="0 1 auto" class="ml-xs">
<input matInput [(ngModel)]="names" placeholder="Contact Person">
<!--<mat-error *ngIf="submitted && f.contact_person.hasError('required')" class="mat-text-warn">You must Include Contact Person.</mat-error>-->
</mat-form-field>
<!--========================== Template List View-->
<div>
<mat-card>
<mat-card class="mat-elevation-z1">
<div style="margin: 6px; padding: 4px;">
<div class="p_title" style="font-size: 16px; font-style: bold;">Template Master</div>
<div class="sub_title" style="font-size: 11px;">List of Templates</div>
</div>
<div fxLayout="row" fxLayout.xs="column" fxLayoutWrap fxLayoutAlign="center none">
<div fxFlex="80%">
<!--<form [formGroup]="filterFormGroupCtrl">
<div fxLayout="row" fxLayout.xs="column" fxLayoutWrap fxLayoutGap="0.5px" fxLayoutAlign="start none" style="padding: 6px;">
<mat-select placeholder="Category" formControlName="category">
<mat-option *ngFor="let cat of categories" [value]="cat.question_categroy_id" (click)="getQuestionsMasters()">
{{cat.categroy_name}}
</mat-option>
</mat-select>
</div>
</form>-->
</div>
<div fxFlex="20%">
<button mat-stroked-button color="primary">Add New Template</button>
<!--<button mat-stroked-button color="primary" (click)="addNewQuestion()">Add Questions</button>-->
</div>
</div>
</mat-card>
<ng-container *ngIf="templateList.length > 0">
<div style="padding: 0 12px;">
<mat-card class="product-card" *ngFor="let template of dataSource.connect() | async">
<div fxLayout="row" fxLayoutAlign="start start" style="padding: 6px 2px;">
<div fxFlex="90%" style="padding: 12px 8px;">
<div fxLayout="row" fxLayoutWrap fxLayoutAlign="start center">
<div class="ml-xs" fxFlex="20%">
<b> {{ template.template_name }} </b>
</div>
<div class="ml-xs" fxFlex="80%">
<div *ngIf="template.lender_details.length > 0" class="text-line-limit">
<span *ngFor="let lender of template.lender_details ; let last = last"> {{lender.full_name}} - {{lender.product_name}} - {{lender.customer_segment_name}} <i *ngIf="!last">,</i></span>
</div>
</div>
</div>
</div>
<div fxFlex="10%">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Close" matTooltipPosition="above" (click)="goToEdit(template.template_id)"><mat-icon>edit</mat-icon></button>
</div>
</div>
</mat-card>
</div>
</ng-container>
<mat-card *ngIf="noQuesMasterRecrdFound">
<div class="no-record-found">No Record Found ... </div>
</mat-card>
<mat-paginator #paginator class="mat-elevation-z1" [length]="templateList.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25, 100]" (page)="pageEvent = $event; pageChange($event)">
</mat-paginator>
</mat-card>
</div>
<!--=================================== END-->
<button (click)="goToEdit()">Edit</button>
</div>
<div>
<router-outlet></router-outlet>
</div>
<router-outlet></router-outlet>
</div>
<notifier-container></notifier-container>

52
ng6-seed/src/app/template/templates/templates-list/templates.list.component.scss Normal file
View File

@ -0,0 +1,52 @@
// mat table css
.example-container {
display: flex;
flex-direction: column;
min-width: 300px;
}
.example-header {
min-height: 64px;
padding: 8px 24px 0;
}
.mat-form-field {
font-size: 14px;
// width: 100%;
}
.mat-table {
overflow: auto;
max-height: 500px;
}
.text-line-limit {
text-overflow: ellipsis;
overflow: hidden;
// white-space: nowrap;
display: -webkit-box;
line-height: 16px; /* fallback */
max-height: 32px; /* fallback */
-webkit-line-clamp: 2; /* number of lines to show */
-webkit-box-orient: vertical;
// text-overflow: ellipsis;
// overflow: hidden;
// width: 160px;
// height: 1.2em;
// white-space: nowrap;
}
.category-label {
padding: 2px 6px;
background: #629cff;
color: #fff;
box-shadow: 0 2px 3px #c8bbbb;
}
.no-record-found {
font-size: 18px;
color: #03a9f4;
padding : 12px 8px;
}

173
ng6-seed/src/app/template/templates/templates-list/templates.list.component.ts
View File

@ -11,25 +11,81 @@ import { Observable } from 'rxjs/Observable';
*/
@Component({
selector: 'app-list',
styleUrls: ['./templates.list.component.scss'],
templateUrl: './templates.list.component.html'
})
export class TemplateListComponent implements OnInit, OnDestroy {
public listView: boolean = true;
public templateList = [];
public listView: boolean;
public names: string;
public noTemplMasterRecrdFound: boolean = false;
// pagination variable details
length = 50;
pageIndex = 0;
pageSize = 10;
pageEvent: PageEvent;
// data source variable details
templateListData = null;
public dataLength: number;
public dataSource = new MatTableDataSource();
displayedColumns = ['categroy_name', 'question', 'actions'];
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
constructor(
private route: ActivatedRoute,
private router: Router) {
this.listView = true;
// this.names = 'dinesh';
}
ngOnInit() {
// alert(1);
alert();
this.listView = true;
this.getTemplateMastersListDetails();
}
// get question master list details
getTemplateMastersListDetails() {
this.templateList = this.m_templateList.records;
this.templateListData = this.m_templateList.records;
this.dataLength = this.m_templateList.records.length;
this.dataSource.data = this.templateListData;
// this.noTemplMasterRecrdFound = false;
// this.search_cid = this.filterFormGroupCtrl.controls.category.value;
// console.log(this.search_cid + ", " + this.filterFormGroupCtrl);
// this.questionsService.getQuestionMasterDetails(this.search_cid).subscribe(
// data => {
// if (data) {
// if (data.records) {
// this.templateList = data.records;
// this.templateListData = data.records;
// this.dataLength = data.records.length;
// this.dataSource.data = this.templateListData;
// } else {
// this.templateList = [];
// this.dataLength = null;
// this.noTemplMasterRecrdFound = true;
// }
// } else {
// this.templateList = [];
// this.dataLength = null;
// this.noTemplMasterRecrdFound = true;
// }
// }
// )
}
goToEdit(){
this.router.navigate([ '../list/edit', '1' ], { relativeTo: this.route });
goToEdit(template_id : number){
this.router.navigate([ '../list/edit', template_id ], { relativeTo: this.route });
this.listView = false;
}
@ -41,7 +97,112 @@ export class TemplateListComponent implements OnInit, OnDestroy {
ngOnDestroy(): void {
//Called once, before the instance is destroyed.
//Add 'implements OnDestroy' to the class.
alert();
}
public m_templateList = {
"dataStatus": true,
"status": 200,
"records":
[
{
"template_id": "1",
"template_name": "sample dev template",
"createdon": "28/09/2018",
"fk_createdby": "1",
"updatedon": null,
"fk_updatedby": null,
"isactive": "1",
"createdby": "sriram v",
"updatedby": null,
"lender_details": []
},
{
"template_id": "2",
"template_name": "two template",
"createdon": "28/09/2018",
"fk_createdby": "1",
"updatedon": null,
"fk_updatedby": null,
"isactive": "1",
"createdby": "sriram v",
"updatedby": null,
"lender_details": []
},
{
"template_id": "3",
"template_name": "ABCD template redd",
"createdon": "11/10/2018",
"fk_createdby": "1",
"updatedon": null,
"fk_updatedby": null,
"isactive": "1",
"createdby": "sriram v",
"updatedby": null,
"lender_details": [
{
"template_lender_map_id": "1",
"fk_template_id": "3",
"fk_lender_id": "1",
"full_name": "ICICIedited",
"short_name": "checkee",
"fk_product_id": "1",
"product_name": "Home Loan ",
"product_abbr": "HL",
"fk_customer_segment": "1",
"customer_segment_name": "Salaried Non Professional ",
"customer_segment_abbr": "SNP",
"createdon": "11/10/2018",
"fk_createdby": "1",
"updatedon": null,
"isactive": "1",
"fk_updatedby": null,
"createdby": "sriram v",
"updatedby": null
},
{
"template_lender_map_id": "2",
"fk_template_id": "3",
"fk_lender_id": "1",
"full_name": "ICICIedited",
"short_name": "checkee",
"fk_product_id": "2",
"product_name": "Non Residential Premises Loans",
"product_abbr": "NRPL",
"fk_customer_segment": "2",
"customer_segment_name": "Salaried Professional ",
"customer_segment_abbr": "SP",
"createdon": "11/10/2018",
"fk_createdby": "1",
"updatedon": "11/10/2018",
"isactive": "1",
"fk_updatedby": null,
"createdby": "sriram v",
"updatedby": null
},
{
"template_lender_map_id": "2",
"fk_template_id": "3",
"fk_lender_id": "1",
"full_name": "ICICIedited",
"short_name": "checkee",
"fk_product_id": "2",
"product_name": "Non Residential Premises Loans",
"product_abbr": "NRPL",
"fk_customer_segment": "2",
"customer_segment_name": "Salaried Professional ",
"customer_segment_abbr": "SP",
"createdon": "11/10/2018",
"fk_createdby": "1",
"updatedon": "11/10/2018",
"isactive": "1",
"fk_updatedby": null,
"createdby": "sriram v",
"updatedby": null
}
]
}
]
}
}

2
ng6-seed/src/app/template/templates/templates.component.ts
View File

@ -1,6 +1,6 @@
import { Component } from '@angular/core';
@Component({
template: `<h2>Templates Master Details List</h2>
template: `
<div>
<router-outlet></router-outlet>
</div>

13
ng6-seed/src/app/template/templates/templates.module.ts
View File

@ -12,7 +12,8 @@ import {
MatProgressBarModule,MatDialogModule, MatSortModule,
MatToolbarModule,MatSelectModule,
MatListModule, MatMenuModule,
MatCheckboxModule, MatStepperModule
MatCheckboxModule, MatStepperModule, MatTabsModule,
MatExpansionModule
} from '@angular/material';
import {MatSlideToggleModule} from '@angular/material/slide-toggle';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
@ -24,6 +25,9 @@ import { TemplatesRouting } from './templates.routing';
import { TemplatesComponent } from './templates.component';
import { TemplateListComponent } from './templates-list/templates.list.component';
import { TemplateEditComponent } from './templates-list/edit/templates.edit.component';
import { EditCategoryComponent } from './templates-list/edit/edit-category/edit-category.component';
import { EditLenderComponent } from './templates-list/edit/edit-lender/edit-lender.component';
import { EditQuestionAnswerComponent } from './templates-list/edit/edit-question-answer/edit-question-answer.component';
// import { QuestionsService } from './../service/questions/questions.service';
/*
@ -86,7 +90,9 @@ const customNotifierOptions: NotifierOptions = {
MatButtonModule,MatTableModule,MatPaginatorModule,
MatProgressBarModule,MatDialogModule, MatSortModule,
MatToolbarModule,MatSelectModule,MatListModule, MatMenuModule,
MatExpansionModule,
MatStepperModule,
MatTabsModule,
MatSlideToggleModule,
MatCheckboxModule,
FormsModule,
@ -96,7 +102,10 @@ const customNotifierOptions: NotifierOptions = {
declarations: [
TemplatesComponent,
TemplateListComponent,
TemplateEditComponent
TemplateEditComponent,
EditCategoryComponent,
EditLenderComponent,
EditQuestionAnswerComponent
],
entryComponents: [
],