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

Advance Filter Added in Sales PD

Browse Source
This commit is contained in:
sriram-at-840620226347 2020-03-06 17:03:05 +05:30
parent 5487037927
commit 5a72b8aab1
10 changed files with 386 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/app/app.module.ts
View File

@ -85,6 +85,7 @@ import { PdfViewerModule } from 'ng2-pdf-viewer';
import { BrowserModule, HAMMER_GESTURE_CONFIG, HammerGestureConfig } from '@angular/platform-browser'; //--> import the HAMMER_GESTURE_CONFIG
import { ReportViewer } from '../pages/sales_pd/pages/report-pdf-viewer/pdf-modal';
import { AndroidPermissions } from '@ionic-native/android-permissions';
import { AdvanceFilterPage } from '../pages/sales_pd/pages/advance-filter/advance-filter';
// need the hammerConnfig
export class HammerConfig extends HammerGestureConfig {
overrides = {
@ -112,7 +113,8 @@ export class HammerConfig extends HammerGestureConfig {
PdAllocationPage,
InputPage,
SalesPDlistPage,
ReportViewer
ReportViewer,
AdvanceFilterPage
],
imports: [
BrowserModule,ReactiveFormsModule,FormsModule,
@ -167,7 +169,8 @@ export class HammerConfig extends HammerGestureConfig {
PdAllocationPage,
InputPage,
SalesPDlistPage,
ReportViewer
ReportViewer,
AdvanceFilterPage
],
providers: [

2
src/app/app.scss
View File

@ -256,5 +256,7 @@ ion-content {
border:1px solid green;
border-radius: 10px;
}
}
@import "theme/filter-modal";

83
src/pages/sales_pd/pages/advance-filter/advance-filter.html Normal file
View File

@ -0,0 +1,83 @@
<!--
Generated template for the AdvanceFilterPage page.
See http://ionicframework.com/docs/components/#navigation for more info on
Ionic pages and navigation.
-->
<ion-header>
<ion-navbar>
<ion-title><ion-icon style="font-size: 18px;" ios="ios-options" md="md-options"></ion-icon> &nbsp;Advance Filter</ion-title>
<ion-buttons end>
<button ion-button icon-only (click)="closeModal()">
<ion-icon item-right name="ios-close-outline"></ion-icon>
</button>
</ion-buttons>
</ion-navbar>
</ion-header>
<ion-content padding>
<mat-list class="m-gap p-gap" >
<div [formGroup]="searchForm" fxLayout="row wrap" fxFlex="100%" fxLayoutGap="35px" fxLayoutAlign="flex-start stretch">
<mat-form-field style="width: 100%">
<mat-select multiple formControlName="pd_status" placeholder="PD Status">
<mat-option *ngFor="let status of pdStatus" [value]="status">{{status}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:100%">
<input matInput [matDatepicker]="picker" [max]="todaydate"
formControlName="pd_from_date" placeholder="Choose a From date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
<mat-form-field style="width:100%">
<input matInput [matDatepicker]="picker1" [min]="searchForm.get('pd_from_date').value" [max]="todaydate"
formControlName="pd_to_date" placeholder="Choose a To date">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</mat-form-field>
<mat-form-field style="width:100%">
<mat-select multiple formControlName="pd_products" placeholder="Products">
<mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.abbr}}</mat-option>
</mat-select>
</mat-form-field>
<!-- <mat-form-field style="width:100%">
<mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp; -->
<!-- <mat-form-field style="width:100%">
<mat-select multiple formControlName="pd_lender" placeholder="Lender Name">
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select>
</mat-form-field> -->
<mat-form-field style="width:100%">
<input matInput type="text" formControlName="pd_applicant_name" placeholder="Company/Firm Name">
</mat-form-field>
<!-- <mat-form-field style="width: 100%">
<input matInput type="text" formControlName="pd_officer" placeholder="PD Officer Name">
</mat-form-field> -->
<!-- <div fxLayout="row wrap">
<div fxFlex.xs="100%" fxFlex.sm="100%" fxFlex="45%">
<mat-checkbox class="example-margin" color="primary" formControlName="is_include_archived">Include Archived</mat-checkbox>
</div>
</div> --> </div>
</mat-list>
</ion-content>
<ion-footer>
<div align="right" fxLayout="row" fxLayoutAlign="flex-end" style="margin-top: 10px;margin-right: 10px;">
<button style="margin: 5px 20px 5px 0px;" mat-raised-button mat-icon-button (click)="onReset()">
<ion-icon style="color: #fff;" ios="ios-refresh" md="md-refresh"></ion-icon>
</button>
<button style="margin: 5px 0px 5px 0px;" mat-raised-button mat-icon-button (click)="searchItem()">
<ion-icon style="color: #fff;margin: 5px 0px 5px 0px;" ios="ios-search" md="md-search"></ion-icon>
</button>
</div>
</ion-footer>

8
src/pages/sales_pd/pages/advance-filter/advance-filter.scss Normal file
View File

@ -0,0 +1,8 @@
page-advance-filter {
.scroll-content {
background-color: #fff;
}
.mat-raised-button{
background-color: #e2412f;
}
}

140
src/pages/sales_pd/pages/advance-filter/advance-filter.ts Normal file
View File

@ -0,0 +1,140 @@
import { Component, Input, EventEmitter, Output } from '@angular/core';
import { IonicPage, NavController, NavParams, ActionSheetController, ViewController } from 'ionic-angular';
import { FormGroup, FormBuilder } from '@angular/forms';
import { DatePipe } from '@angular/common';
import { SalesPdProvider } from '../../providers/sales-pd/sales-pd';
import { ToastProvider } from '../../../../providers/common-provider/toast';
import { LoadingProvider } from '../../../../providers/common-provider/loading';
/**
* Generated class for the AdvanceFilterPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
// @IonicPage()
@Component({
selector: 'page-advance-filter',
templateUrl: 'advance-filter.html',
})
export class AdvanceFilterPage {
searchForm:FormGroup;
todaydate: any;
pdStatus: any=[];
// pdStatus_all: any=[];
ENTITY: any =[];
@Input()drop_down_datas
@Output() filteredlistData = new EventEmitter();
@Output() resetFilter = new EventEmitter();
PRODUCTS: any =[];
xpandStatus:boolean=false;
pipe=new DatePipe('en-US');
constructor(private _fb:FormBuilder,public navCtrl: NavController, public navParams: NavParams,public actionSheetCtrl: ActionSheetController,private salesPDService:SalesPdProvider,private toastProvider:ToastProvider,private loaderProvider:LoadingProvider,private viewCtrl:ViewController ) {
this.todaydate = new Date();
this.getDropdown();
}
ionViewDidLoad() {
console.log('ionViewDidLoad AdvanceFilterPage');
}
ngOnInit() {
let local:any = localStorage.getItem('user_details')
this.drop_down_datas = this.navParams.get('drop_down_datas');
this.setDropDownDatas()
console.log(this.drop_down_datas);
this.searchForm=this._fb.group({
pd_status:[''],
pd_from_date:[''],
pd_to_date:[''],
pd_products:[''],
pd_lender:[local.fk_entity_id],
pd_applicant_name:[''],
pd_officer:[''],
})
console.log(this.drop_down_datas)
}
getDropdown(){
// this.salesPDService.getAllMasterDatas('PDSTATUS').subscribe(res=>
// {
// if(res.dataStatus==true)
// {
// this.pdStatus_all = res.records.filter(status=>status.isactive==1);
// }
// });
this.salesPDService.getAllMasterDatas('ENTITY').subscribe(res=>
{
if(res.dataStatus==true)
{
this.ENTITY = res.records.filter(ent=>ent.isactive==1);
}
});
this.salesPDService.getAllMasterDatas('PRODUCTS').subscribe(res=>
{
if(res.dataStatus==true)
{
this.PRODUCTS = res.records.filter(pro=>pro.isactive==1);
}
});
}
setDropDownDatas(){
console.log(this.drop_down_datas)
if(this.drop_down_datas != undefined){
this.pdStatus=this.drop_down_datas.pd_status
if(this.ENTITY.length != 0) {
this.entityCheck()
}
else{
setTimeout(()=>{this.entityCheck()},500)
}
if(this.PRODUCTS.length != 0) {
this.productCheck()
}
else{
setTimeout(()=>{this.productCheck()},500)
}
}
}
productCheck(){
this.PRODUCTS=this.PRODUCTS.filter(val=>{
if(this.drop_down_datas.product_ids.filter(dp=>dp == val.product_id).length > 0){
return val
}
})
}
entityCheck(){
this.ENTITY=this.ENTITY.filter(val=>{
if(this.drop_down_datas.lender_ids.filter(dp=>dp == val.entity_id).length > 0){
return val
}
})
}
searchItem(){
this.searchForm.value.pd_from_date = this.pipe.transform(this.searchForm.value.pd_from_date,'yyyy-MM-dd');
this.searchForm.value.pd_to_date = this.pipe.transform(this.searchForm.value.pd_to_date,'yyyy-MM-dd');
// console.log(JSON.stringifythis.searchForm.value);
this.xpandStatus=true;
this.salesPDService.advancedFilter(this.searchForm.value).subscribe(res=>{
if(res.dataStatus){
console.log(res);
// this.filteredlistData.emit(res);
// this.xpandStatus=false
this.viewCtrl.dismiss(res['records'])
}
else{
// this.filteredlistData.emit(res)
this.toastProvider.lenderappmessage('No Records Found...!')
}
})
}
onReset(){
this.searchForm.reset();
this.xpandStatus=false
this.resetFilter.emit(true);
}
closeModal() {
this.viewCtrl.dismiss();
}
}

14
src/pages/sales_pd/pages/sales-p-dlist/sales-p-dlist.html
View File

@ -10,13 +10,19 @@
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Sales PD List</ion-title>
<ion-title>Sales PD List</ion-title>
<ion-buttons end>
<button ion-button clear (click)="advancefilter()">
<ion-icon style="font-size: 23px;" ios="ios-options" md="md-options"></ion-icon>
</button>
</ion-buttons>
</ion-navbar>
</ion-header>
</ion-header>
<ion-content padding>
<ion-refresher slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content></ion-refresher-content>
</ion-refresher>
<div class="pdf_source">
<pdf-viewer [src]="reportSrc"
[render-text]="true" [original-size]="false" [autoresize]="true"

61
src/pages/sales_pd/pages/sales-p-dlist/sales-p-dlist.ts
View File

@ -1,11 +1,13 @@
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, ActionSheetController, ModalController } from 'ionic-angular';
import { IonicPage, NavController, NavParams, ActionSheetController, ModalController, ModalOptions } from 'ionic-angular';
import { SalesPdProvider } from '../../providers/sales-pd/sales-pd';
import { HomePage, Section1 } from '../home/home';
import { ToastProvider } from '../../../../providers/common-provider/toast';
import { LoadingProvider } from '../../../../providers/common-provider/loading';
import { ReportViewer } from '../report-pdf-viewer/pdf-modal';
import { SectionListPage } from '../section-list/section-list';
import { AdvanceFilterPage } from '../advance-filter/advance-filter';
/**
* Generated class for the SalesPDlistPage page.
@ -23,6 +25,7 @@ export class SalesPDlistPage {
sales_displayValue: any=[];
loader_access:any=true
reportSrc: any;
filter_drop_down_data: { product_ids: any[]; lender_ids: any[]; pd_status: any[]; };
constructor(public actionSheetCtrl: ActionSheetController,public navCtrl: NavController, public navParams: NavParams,private salesPDService:SalesPdProvider,private toastProvider:ToastProvider,private loaderProvider:LoadingProvider,private modalCtrl:ModalController) {
}
@ -35,11 +38,52 @@ export class SalesPDlistPage {
ionViewDidEnter(){
this.getListofPD()
}
doRefresh(event) {
console.log('refresh',event);
this.getListofPD();
setTimeout(() => {
// console.log('Async operation has ended');
event.complete();
}, 1000);
}
getListofPD(){
this.salesPDService.getSalesPDList().subscribe(res=>{
if(res['dataStatus']){
this.sales_displayValue=res['records']
this.loader_access=false
if(this.sales_displayValue.length > 0){
let products=[]
let lenders=[]
let pd_status=[]
this.sales_displayValue.map(val=>{
if(products.length > 0 ){
if(products.filter(pro=>pro == val.product_id).length == 0 ){
products.push(val.product_id)
}
}
else{
products.push(val.product_id)
}
if(lenders.length > 0 ){
if(lenders.filter(pro=>pro == val.lender_id).length == 0 ){
lenders.push(val.lender_id)
}
}
else{
lenders.push(val.lender_id)
}
if(pd_status.length > 0 ){
if(pd_status.filter(pro=>pro == val.status).length == 0 ){
pd_status.push(val.status)
}
}
else{
pd_status.push(val.status)
}
})
this.filter_drop_down_data={product_ids:products,lender_ids:lenders,pd_status:pd_status}
// console.log(this.filter_drop_down_data);
}
}
else{
this.loader_access=false
@ -113,7 +157,20 @@ export class SalesPDlistPage {
})
}
advancefilter(){
const modalOption:ModalOptions={
cssClass:'filterModal'
}
const modalCtrl=this.modalCtrl.create(AdvanceFilterPage,{'drop_down_datas':this.filter_drop_down_data},modalOption)
modalCtrl.present();
modalCtrl.onDidDismiss((data)=>{
console.log(data)
if(data){
this.sales_displayValue = data;
}
})
}
presentActionSheet(value_obj) {
let actionSheet = this.actionSheetCtrl.create({
title: 'Select Option',

10
src/pages/sales_pd/providers/sales-pd/sales-pd.ts
View File

@ -160,4 +160,14 @@ current_section:any;
clear_local_key(key){
return this.storage.remove(key)
}
getAllMasterDatas(TableName: string): Observable<any> {
return this.http.post(this.apiUrl + 'getListOfMaster', { "master_name": TableName })
.pipe(
// catchError(this.handleError('role', []))
)
}
advancedFilter(params): Observable<any>{
return this.http.post(this.apiUrl+'filterSalesPDList',{"records":params})
}
}

2
src/providers/constants/constants.ts
View File

@ -51,7 +51,7 @@ export class ConstantsProvider {
lenUserPoolId: "ap-south-1_hFiGyr1Gw", // Username
lenClientId: "38v9rpp1495v60e1gd14mj6rjr", // ClientName for Mobile
}
return production;
return testing;
}

68
src/theme/filter-modal.scss Normal file
View File

@ -0,0 +1,68 @@
.filterModal{
padding: 6.4%;
// padding: 30px;
background-color: rgba(0, 0, 0, 0.56);
// padding: 30px;
color:red;
// filter:blur(5px);
//color:lightcyan;
// background-color:gray;
.modal-wrapper {
// border-radius: 7px;
// background: rgba(0, 0, 0, 0.5);
// color: gray;
height: 80% !important;
width:100% !important;
// margin-top: 13.5%;
border-radius: 10px;
margin-top:10%;
mat-card{
// background-color:rgb(252, 252, 161);
background-color:white;
box-shadow: 2px 2px lavender;
border-radius: 5px;
min-height: 13em;
// height: 16.5em;
max-height: 16.5em;
border:1px solid lavender;
}
.mat-card-title{
font-weight: bold;
font-size: 16px;
color:#e2412f;
}
mat-card-content{
margin-left: 4%;
}
ion-item{
// background-color:rgb(252, 252, 161);
background-color: lightcyan;
}
// margin-right: 15%;
button{
font-size: 12px;
// height: 40px;
color:#e2412f;
// margin-bottom: 10px;
position: relative;
bottom:0.5em;
}
// input{
// // border:1px solid blueviolet;
// }
mat-form-field{
width: 100%;
margin-top: 3%;
}
mat-radio-button{
margin-top: 2%;
}
}
}