Procházet zdrojové kódy

Export CSV Partner Profile in Partner Details

master
prahalad před 3 roky
rodič
revize
9e87538bd5
8 změnil soubory, kde provedl 625 přidání a 405 odebrání
  1. +14
    -0
      package-lock.json
  2. +2
    -0
      package.json
  3. +412
    -394
      src/app/dashboard/partner-details/partner-details.component.html
  4. +50
    -1
      src/app/dashboard/partner-details/partner-details.component.scss
  5. +82
    -2
      src/app/dashboard/partner-details/partner-details.component.ts
  6. +1
    -1
      src/app/dashboard/table/table.component.html
  7. +63
    -6
      src/app/dashboard/table/table.component.ts
  8. +1
    -1
      src/app/services/partner-profile.service.ts

+ 14
- 0
package-lock.json Zobrazit soubor

@@ -1946,6 +1946,15 @@
"integrity": "sha512-HCfJdaYqJX3BCzeihgZrD7b85Cu05OC/GVJ4kEYIflwUs4jbnUlLLWoq7hw1LBcdvUyehO+gr6P5JQ895/2ZfA==",
"dev": true
},
"@types/papaparse": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@types/papaparse/-/papaparse-5.3.2.tgz",
"integrity": "sha512-BNbCHJkTE4RwmAFkCxEalET4mDvGr/1ld7ZtQ4i/laWI/iiVt+GL07stdvufle4KfywyvloqqpIiJscXNCrKxA==",
"dev": true,
"requires": {
"@types/node": "*"
}
},
"@types/parse-json": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.0.tgz",
@@ -6258,6 +6267,11 @@
"integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==",
"dev": true
},
"papaparse": {
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/papaparse/-/papaparse-5.3.1.tgz",
"integrity": "sha512-Dbt2yjLJrCwH2sRqKFFJaN5XgIASO9YOFeFP8rIBRG2Ain8mqk5r1M6DkfvqEVozVcz3r3HaUGw253hA1nLIcA=="
},
"parent-module": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",


+ 2
- 0
package.json Zobrazit soubor

@@ -21,6 +21,7 @@
"echarts": "^5.3.0",
"echarts-gl": "^2.0.8",
"ngx-echarts": "^8.0.1",
"papaparse": "^5.3.1",
"rxjs": "~7.4.0",
"tslib": "^2.3.0",
"zone.js": "~0.11.4"
@@ -31,6 +32,7 @@
"@angular/compiler-cli": "~13.1.0",
"@types/jasmine": "~3.10.0",
"@types/node": "^12.11.1",
"@types/papaparse": "^5.3.2",
"jasmine-core": "~3.10.0",
"karma": "~6.3.0",
"karma-chrome-launcher": "~3.1.0",


+ 412
- 394
src/app/dashboard/partner-details/partner-details.component.html Zobrazit soubor

@@ -1,433 +1,451 @@
<section class="subpage">
<header class="main-header">
<h2> Partner Profile </h2>
</header>
<div class="segments">
<button class="button" [ngClass]="{'active' : selectedSegment === 1}" (click)="selectedSegment = 1"> Profile </button>
<button class="button" [ngClass]="{'active' : selectedSegment === 2}" (click)="selectedSegment = 2"> Implementation Data </button>
<button class="button" [ngClass]="{'active' : selectedSegment === 3}" (click)="selectedSegment = 3"> Training Data </button>
</div>

<ng-container *ngIf="selectedSegment === 1">
<section class="card">
<header>
<h5> Primary Contact </h5>
</header>
<div class="container">
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.name">
<label> Name </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.designation">
<label> Name </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.email">
<label> Name </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.contactNumber">
<label> Contact </label>
</div>
</div>
</section>
<section class="card">
<header>
<h5> Basic Info </h5>
</header>
<div class="container">
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.name">
<label> Name </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.website">
<label> Official Website </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.type">
<label> Type </label>
</div>
<div class="input-holder">
<div class="text"> <button *ngFor="let area of partnerDetails.organizationBasicInfo.areasOfWork"> {{ area }} </button> </div>
<label> Thematic areas of work </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.source">
<label> How did you hear about us </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.referralName">
<label> Name of the organisation and person that referred </label>
</div>
<div class="checkbox-holder">
<input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.wouldLikeUpdates">
<label> I would like to receive periodic updates about CAC </label>
</div>
<div class="input-holder">
<textarea type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.reasonForBecomingMember"></textarea>
<label> I would like to become a member of CAC because </label>
</div>
</div>
</section>
<section class="card">
<header>
<h5> Alternative Contact </h5>
</header>
<div class="container">
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.designation">
<label> Name </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.email">
<label> Name </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.contactNumber">
<label> Contact </label>
</div>
</div>
</section>
<section class="card">
<header>
<h5> Detailed Profile </h5>
</header>
<div class="container">
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.partnerLocation">
<label> Partner/Organization/Network Headquarters Location </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.state">
<label> State </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.district">
<label> District </label>
</div>
<div class="checkbox-holder">
<input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.haveBranchesInOtherDistricts">
<label> Do you have Branches / Field presence in any other District? </label>
</div>
<div class="input-holder">
<div class="text">
<button *ngFor="let country of partnerDetails.detailedProfile.branchLocationCountries"> {{ country }} </button>
<section>
<div class="shadow" *ngIf="showExportOptions" (click)="showExportOptions = false"></div>

<section class="subpage">
<header class="main-header">
<h2> Partner Profile </h2>
</header>

<div class="segments">
<button class="button" [ngClass]="{'active' : selectedSegment === 1}" (click)="selectedSegment = 1"> Profile </button>
<button class="button" [ngClass]="{'active' : selectedSegment === 2}" (click)="selectedSegment = 2"> Implementation Data </button>
<button class="button" [ngClass]="{'active' : selectedSegment === 3}" (click)="selectedSegment = 3"> Training Data </button>
</div>

<ng-container *ngIf="selectedSegment === 1">
<section class="card">
<header>
<h5> Primary Contact </h5>
</header>

<div class="container">
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.name">
<label> Name </label>
</div>
<label> Branch or Field office Location (Countries) </label>
</div>
<div class="input-holder">
<div class="text">
<button *ngFor="let state of partnerDetails.detailedProfile.states"> {{ state }} </button>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.designation">
<label> Name </label>
</div>
<label> Branch or Field office Location (States) </label>
</div>
<div class="input-holder">
<div class="text">
<button *ngFor="let district of partnerDetails.detailedProfile.districts"> {{ district }} </button>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.email">
<label> Name </label>
</div>
<label> Branch or Field office Location (Districts) </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.yearOfEstablishment">
<label> Which year your organisation/partner/network was established? </label>
</div>
<div class="input-holder">
<div class="text">
<button *ngFor="let community of partnerDetails.detailedProfile.communities"> {{ community }} </button>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.contactNumber">
<label> Contact </label>
</div>
<label> Which communities do you work with? </label>
</div>
<div class="input-holder">
<div class="text">
<button *ngFor="let mode of partnerDetails.detailedProfile.preferredModeOfCommunications"> {{ mode }} </button>
</section>

<section class="card">
<header>
<h5> Basic Info </h5>
</header>

<div class="container">
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.name">
<label> Name </label>
</div>
<label> Select your preferred mode of communications with the Collab</label>
</div>
<div class="input-holder">
<div class="text">
<button *ngFor="let language of partnerDetails.detailedProfile.preferredLanguages"> {{ language }} </button>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.website">
<label> Official Website </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.type">
<label> Type </label>
</div>
<div class="input-holder">
<div class="text"> <button *ngFor="let area of partnerDetails.organizationBasicInfo.areasOfWork"> {{ area }} </button> </div>
<label> Thematic areas of work </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.source">
<label> How did you hear about us </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.referralName">
<label> Name of the organisation and person that referred </label>
</div>

<div class="checkbox-holder">
<input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.wouldLikeUpdates">
<label> I would like to receive periodic updates about CAC </label>
</div>

<div class="input-holder">
<textarea type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.reasonForBecomingMember"></textarea>
<label> I would like to become a member of CAC because </label>
</div>
<label> Preferred Language of Communication* (emails, webinars etc. Select all that apply) </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.totalReachOfOrganization">
<label> What is the total reach of your organisation in a year? </label>
</div>
<div class="input-holder">
<textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.bio"></textarea>
<label> Bio (This information will be displayed along with your logo in the members section of this website. Max:100 Characters) </label>
</div>
</div>
</section>
<section class="card">
<header>
<h5>
Strength &amp; Capability
</h5>
</header>
<div class="container">
<div class="input-holder">
<div class="text">
<button *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportRequired"> {{ support }} </button>
</div>
<label> What are the primary areas of support that you seek from #COVIDActionCollab? </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredOther">
<label> If other, please describe </label>
</div>
<div class="input-holder">
<textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredDescription"></textarea>
<label> Kindly elaborate on the option(s) selected above </label>
</div>
<div class="input-holder">
<div class="text">
<button *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportOffered"> {{ support }} </button>

</section>

<section class="card">
<header>
<h5> Alternative Contact </h5>
</header>

<div class="container">
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.designation">
<label> Name </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.email">
<label> Name </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.contactNumber">
<label> Contact </label>
</div>
</div>
<label> What are the areas in which you can support/contribute to the #COVIDActionCollab and its partners? </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedOther">
<label> If other, please describe </label>
</div>
<div class="input-holder">
<textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedDescription"></textarea>
<label> Kindly elaborate on the option(s) selected above </label>
</div>
<div class="input-holder">
<textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.otherSpecificSupportRequired"></textarea>
<label> Do you require any other specific support? </label>
</div>
</div>
</section>
</section>

<div class="card">
<div class="checkbox-holder">
<input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.didAgree">
<label> I agree to the <a href="https://covidactioncollab.org/Mou-charter/" target="_blank">MOU & Charter</a>. </label>
</div>
<div class="checkbox-holder">
<input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.didDeclare">
<label> I/We hereby declare that I/we neither support nor are associated with any act which promotes: 1. Human trafficking; 2. Smoking / Chewing tobacco; 3. Violence / terrorism 4. Child labour / Child Marriage 5. Discrimination based color, race, religion, caste, disability & sexual orientation 6. Mining 7. Terrorism 8. Abortion counselling referrals, advocate to decriminalise abortion or expand abortion services. </label>
</div>
</div>
</ng-container>

<ng-container *ngIf="selectedSegment === 2">
<section class="card">
<header>
<h5> HII Data </h5>
</header>
<section class="table" *ngFor="let package of partnerDetails.surveyCtoData.hiiData">
<div class="row">
<div class="col">
Name
</div>
<div class="col">
{{ package.name }}
</div>
<section class="card">
<header>
<h5> Detailed Profile </h5>
</header>

<div class="container">
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.partnerLocation">
<label> Partner/Organization/Network Headquarters Location </label>
</div>
<div class="row">
<div class="col">
Implementation Status
</div>
<div class="col">
{{ package.implementationStatus }}
</div>

<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.state">
<label> State </label>
</div>
<div class="row">
<div class="col">
No. of Females
</div>
<div class="col">
{{ package.noOfFemales }}
</div>

<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.district">
<label> District </label>
</div>
<div class="row">
<div class="col">
No. of Males
</div>
<div class="col">
{{ package.noOfMales }}
</div>

<div class="checkbox-holder">
<input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.haveBranchesInOtherDistricts">
<label> Do you have Branches / Field presence in any other District? </label>
</div>
<div class="row">
<div class="col">
No. of Males
</div>
<div class="col">
{{ package.noOfTransgender }}

<div class="input-holder">
<div class="text">
<button *ngFor="let country of partnerDetails.detailedProfile.branchLocationCountries"> {{ country }} </button>
</div>
<label> Branch or Field office Location (Countries) </label>
</div>
<div class="row">
<div class="col">
Health Package ID
</div>
<div class="col">
{{ package.packagesHealth }}

<div class="input-holder">
<div class="text">
<button *ngFor="let state of partnerDetails.detailedProfile.states"> {{ state }} </button>
</div>
<label> Branch or Field office Location (States) </label>
</div>
<div class="row">
<div class="col">
Health Remarks
</div>
<div class="col">
{{ package.healthRemarks }}

<div class="input-holder">
<div class="text">
<button *ngFor="let district of partnerDetails.detailedProfile.districts"> {{ district }} </button>
</div>
<label> Branch or Field office Location (Districts) </label>
</div>
<div class="row">
<div class="col">
Disaggregation Note
</div>
<div class="col">
{{ package.disaggregationNote }}
</div>

<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.yearOfEstablishment">
<label> Which year your organisation/partner/network was established? </label>
</div>
<div class="row">
<div class="col">
Relevant Documents
</div>
<div class="col">
{{ package.relevantDocuments }}

<div class="input-holder">
<div class="text">
<button *ngFor="let community of partnerDetails.detailedProfile.communities"> {{ community }} </button>
</div>
<label> Which communities do you work with? </label>
</div>
</section>
</section>

<section class="card">
<header>
<h5> SP Data </h5>
</header>
<section class="table" *ngFor="let package of partnerDetails.surveyCtoData.spData">
<div class="row">
<div class="col">
Name
</div>
<div class="col">
{{ package.name }}
<div class="input-holder">
<div class="text">
<button *ngFor="let mode of partnerDetails.detailedProfile.preferredModeOfCommunications"> {{ mode }} </button>
</div>
<label> Select your preferred mode of communications with the Collab</label>
</div>
<div class="row">
<div class="col">
Implementation Status
</div>
<div class="col">
{{ package.status }}
</div>
</div>
<div class="row">
<div class="col">
Total Aggregation
</div>
<div class="col">
{{ package.totalAggregation }}

<div class="input-holder">
<div class="text">
<button *ngFor="let language of partnerDetails.detailedProfile.preferredLanguages"> {{ language }} </button>
</div>
<label> Preferred Language of Communication* (emails, webinars etc. Select all that apply) </label>
</div>
<div class="row">
<div class="col">
Other Remarks
</div>
<div class="col">
{{ package.otherRemarks }}
</div>

<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.totalReachOfOrganization">
<label> What is the total reach of your organisation in a year? </label>
</div>
<div class="row">
<div class="col">
Relevant Documents
</div>
<div class="col">
{{ package.relevantDocuments }}
</div>
</div>

<div class="input-holder">
<textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.detailedProfile.bio"></textarea>
<label> Bio (This information will be displayed along with your logo in the members section of this website. Max:100 Characters) </label>
</div>
</div>
</section>
</section>

<section class="card">
<header>
<h5> SP Scheme </h5>
</header>
<section class="table" *ngFor="let package of partnerDetails.surveyCtoData.spSchemeData">
<div class="row">
<div class="col">
Count
</div>
<div class="col">
{{ package.count }}
</div>
<section class="card">
<header>
<h5>
Strength &amp; Capability
</h5>
</header>

<div class="container">
<div class="input-holder">
<div class="text">
<button *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportRequired"> {{ support }} </button>
</div>
<div class="row">
<div class="col">
Scheme Id
</div>
<div class="col">
{{ package.schemeId }}
</div>
</div>
<label> What are the primary areas of support that you seek from #COVIDActionCollab? </label>
</div>

<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredOther">
<label> If other, please describe </label>
</div>

<div class="input-holder">
<textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredDescription"></textarea>
<label> Kindly elaborate on the option(s) selected above </label>
</div>

<div class="input-holder">
<div class="text">
<button *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportOffered"> {{ support }} </button>
</div>
<label> What are the areas in which you can support/contribute to the #COVIDActionCollab and its partners? </label>
</div>

<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedOther">
<label> If other, please describe </label>
</div>

<div class="input-holder">
<textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedDescription"></textarea>
<label> Kindly elaborate on the option(s) selected above </label>
</div>

<div class="input-holder">
<textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.otherSpecificSupportRequired"></textarea>
<label> Do you require any other specific support? </label>
</div>
</div>
</section>
</section>
</ng-container>

<section class="footer-buttons">
<button class="button back" [routerLink]="'/dashboard/partners'">
<img src="assets/chevron-left.svg" alt="">
Back
</button>
<ng-container *ngIf="!isFormEditable">
<button class="button edit" (click)="isFormEditable=true"> <img src="assets/edit.svg" alt=""> Edit </button>
<button class="button"> <img src="assets/export.svg" alt=""> Export </button>
<button class="button delete"> <img src="assets/delete.svg" alt=""> Delete </button>

<div class="card">
<div class="checkbox-holder">
<input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.didAgree">
<label> I agree to the <a href="https://covidactioncollab.org/Mou-charter/" target="_blank">MOU & Charter</a>. </label>
</div>
<div class="checkbox-holder">
<input type="checkbox" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.didDeclare">
<label> I/We hereby declare that I/we neither support nor are associated with any act which promotes: 1. Human trafficking; 2. Smoking / Chewing tobacco; 3. Violence / terrorism 4. Child labour / Child Marriage 5. Discrimination based color, race, religion, caste, disability & sexual orientation 6. Mining 7. Terrorism 8. Abortion counselling referrals, advocate to decriminalise abortion or expand abortion services. </label>
</div>
</div>
</ng-container>

<ng-container *ngIf="isFormEditable">
<button class="button edit" (click)="isFormEditable=false"> <img src="assets/save.svg" alt=""> Save </button>
<button class="button delete" (click)="isFormEditable=false"> X Cancel </button>
<ng-container *ngIf="selectedSegment === 2">
<section class="card">
<header>
<h5> HII Data </h5>
</header>
<section class="table" *ngFor="let package of partnerDetails.surveyCtoData.hiiData">
<div class="row">
<div class="col">
Name
</div>
<div class="col">
{{ package.name }}
</div>
</div>
<div class="row">
<div class="col">
Implementation Status
</div>
<div class="col">
{{ package.implementationStatus }}
</div>
</div>
<div class="row">
<div class="col">
No. of Females
</div>
<div class="col">
{{ package.noOfFemales }}
</div>
</div>
<div class="row">
<div class="col">
No. of Males
</div>
<div class="col">
{{ package.noOfMales }}
</div>
</div>
<div class="row">
<div class="col">
No. of Males
</div>
<div class="col">
{{ package.noOfTransgender }}
</div>
</div>
<div class="row">
<div class="col">
Health Package ID
</div>
<div class="col">
{{ package.packagesHealth }}
</div>
</div>
<div class="row">
<div class="col">
Health Remarks
</div>
<div class="col">
{{ package.healthRemarks }}
</div>
</div>
<div class="row">
<div class="col">
Disaggregation Note
</div>
<div class="col">
{{ package.disaggregationNote }}
</div>
</div>
<div class="row">
<div class="col">
Relevant Documents
</div>
<div class="col">
{{ package.relevantDocuments }}
</div>
</div>
</section>
</section>

<section class="card">
<header>
<h5> SP Data </h5>
</header>
<section class="table" *ngFor="let package of partnerDetails.surveyCtoData.spData">
<div class="row">
<div class="col">
Name
</div>
<div class="col">
{{ package.name }}
</div>
</div>
<div class="row">
<div class="col">
Implementation Status
</div>
<div class="col">
{{ package.status }}
</div>
</div>
<div class="row">
<div class="col">
Total Aggregation
</div>
<div class="col">
{{ package.totalAggregation }}
</div>
</div>
<div class="row">
<div class="col">
Other Remarks
</div>
<div class="col">
{{ package.otherRemarks }}
</div>
</div>
<div class="row">
<div class="col">
Relevant Documents
</div>
<div class="col">
{{ package.relevantDocuments }}
</div>
</div>
</section>
</section>

<section class="card">
<header>
<h5> SP Scheme </h5>
</header>
<section class="table" *ngFor="let package of partnerDetails.surveyCtoData.spSchemeData">
<div class="row">
<div class="col">
Count
</div>
<div class="col">
{{ package.count }}
</div>
</div>
<div class="row">
<div class="col">
Scheme Id
</div>
<div class="col">
{{ package.schemeId }}
</div>
</div>
</section>
</section>
</ng-container>

<section class="footer-buttons">
<div class="shadow" *ngIf="showExportOptions" (click)="showExportOptions = false"></div>

<button class="button back" [routerLink]="'/dashboard/partners'">
<img src="assets/chevron-left.svg" alt="">
Back
</button>
<ng-container *ngIf="!isFormEditable" >
<button class="button edit" (click)="isFormEditable=true"> <img src="assets/edit.svg" alt=""> Edit </button>
<button class="button" (click)="showExportOptions=true"> <img src="assets/export.svg" alt=""> Export </button>
<button class="button delete"> <img src="assets/delete.svg" alt=""> Delete </button>
</ng-container>

<ng-container *ngIf="showExportOptions">
<div class="export-options">
<header>
<h5> Export as </h5>
</header>
<div class="options">
<button class="button" (click)="exportCSV()"> CSV </button>
<button class="button" (click)="exportExcel()"> Excel </button>
</div>
</div>
</ng-container>

<ng-container *ngIf="isFormEditable">
<button class="button edit" (click)="isFormEditable=false"> <img src="assets/save.svg" alt=""> Save </button>
<button class="button delete" (click)="isFormEditable=false"> X Cancel </button>
</ng-container>
</section>
</section>

</section>

+ 50
- 1
src/app/dashboard/partner-details/partner-details.component.scss Zobrazit soubor

@@ -125,4 +125,53 @@
background-color: var(--input-background);
}
}
}
}

.export-options {
width: 190px;
position: absolute;
bottom: 75px;
right: 120px;
z-index: 2;
padding: 10px;
border-radius: var(--common-border-radius);
text-align: center;
background-color: white;

header {
margin-bottom: 10px;

h5 {
color: var(--secondary-text);
font-size: 16px;
}
}

.options {
display: flex;
align-items: center;
justify-content: space-between;
}

button {
border: 2px solid var(--input-border);
padding: 7px 20px;
margin: 0;
border-radius: var(--common-border-radius);
background-color: white;
color: var(--secondary-text);
font-weight: 500;
}
}

.shadow {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 2;
background-color: black;
opacity: 0.5;
display: block;
}

+ 82
- 2
src/app/dashboard/partner-details/partner-details.component.ts Zobrazit soubor

@@ -1,5 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import * as Papa from 'papaparse';


@Component({
selector: 'app-partner-details',
@@ -9,10 +11,12 @@ import { ActivatedRoute } from '@angular/router';
export class PartnerDetailsComponent implements OnInit {
partnerDetails: any;
isFormEditable: boolean = false;
selectedSegment: 1 | 2 | 3 = 2;
selectedSegment: 1 | 2 | 3 = 1;
showExportOptions: boolean = false;


constructor(
private activateRouter:ActivatedRoute
private activateRouter: ActivatedRoute
) { }

ngOnInit(): void {
@@ -22,4 +26,80 @@ export class PartnerDetailsComponent implements OnInit {
}).unsubscribe();
}


loadCSVData(partnerData: any) {
JSON.stringify(partnerData).split

let csvArray = [{
"PortalID": partnerData.portalId ? partnerData.portalId : '-',

// Primary Contact

"Primary Name": partnerData.primaryContact.contactNumber,
"Primary Contact Number": partnerData.primaryContact.contactNumber,
"Primary Email": partnerData.primaryContact.contactNumber,
"Primary Designation": partnerData.primaryContact.contactNumber,

// Basic Info

"areasOfWork": (partnerData.organizationBasicInfo.areasOfWork).toString(),
"name": partnerData.organizationBasicInfo.name,
"reasonForBecomingMember": partnerData.organizationBasicInfo.reasonForBecomingMember,
"referralName": partnerData.organizationBasicInfo.referralName,
"source": partnerData.organizationBasicInfo.source,
"type": partnerData.organizationBasicInfo.type,
"website": partnerData.organizationBasicInfo.website,
"wouldLikeUpdates": partnerData.organizationBasicInfo.wouldLikeUpdates,

// Alternative Contact

'Alternative Name': partnerData.alternateContact.name,
'Alternative ContactNumber': partnerData.alternateContact.contactNumber,
'Alternative Email': partnerData.alternateContact.email,
'Alternative Designation': partnerData.alternateContact.designation,

// Detailed Profile

'Bio': partnerData.detailedProfile.bio,
'Branch Location Countries': (partnerData.detailedProfile.branchLocationCountries).toString(),
"Communities": (partnerData.detailedProfile.communities).toString(),
"District": partnerData.detailedProfile.district,
"Districts": (partnerData.detailedProfile.districts).toString(),
"Files": partnerData.detailedProfile.files,
"Have Branches In Other Districts": partnerData.detailedProfile.haveBranchesInOtherDistricts,
"Logo": partnerData.detailedProfile.logo,
"Partner Location": partnerData.detailedProfile.partnerLocation,
"Preferred Languages": (partnerData.detailedProfile.preferredLanguages).toString(),
"Preferred Mode Of Communications": (partnerData.detailedProfile.preferredModeOfCommunications).toString(),
"State": partnerData.detailedProfile.state,
"States": (partnerData.detailedProfile.states).toString(),
"Total Reach Of Organization": partnerData.detailedProfile.totalReachOfOrganization,
"Year Of Establishment": partnerData.detailedProfile.yearOfEstablishment,

// Strength

"Other Specific Support Required": partnerData.strengthAndCapability.otherSpecificSupportRequired,
"Primary Areas Of Support Offered": (partnerData.strengthAndCapability.otherSpecificSupportRequired).toString(),
"Primary Areas Of Support Offered Description": partnerData.strengthAndCapability.primaryAreasOfSupportOffered,
"Primary Areas Of Support Offered Other": partnerData.strengthAndCapability.primaryAreasOfSupportOfferedDescription,
"Primary Areas Of Support Required": (partnerData.strengthAndCapability.primaryAreasOfSupportOfferedOther).toString(),
"Primary Areas Of Support Required Description": partnerData.strengthAndCapability.primaryAreasOfSupportRequired,
"Primary Areas Of Support Required Other": partnerData.strengthAndCapability.primaryAreasOfSupportRequiredOther,
}]
return csvArray;
}

exportCSV() {
let csvData = Papa.unparse(this.loadCSVData(this.partnerDetails))
let element = document.createElement('a');
let blob = new Blob([csvData], { type: 'text/csv;charset=utf-8;' });
let url = URL.createObjectURL(blob);
element.href = url;
element.setAttribute('download', 'PartnerProfile.csv');
element.click();
}

exportExcel() {

}
}

+ 1
- 1
src/app/dashboard/table/table.component.html Zobrazit soubor

@@ -29,7 +29,7 @@
<h5> Export as </h5>
</header>
<div class="options">
<button class="button"> CSV </button>
<button (click) ="exportCSV()" class="button"> CSV </button>
<button class="button"> Excel </button>
</div>
</div>


+ 63
- 6
src/app/dashboard/table/table.component.ts Zobrazit soubor

@@ -1,12 +1,14 @@
import { Component, OnInit } from '@angular/core';
import { PartnerProfileService } from '../../services/partner-profile.service';
import { Router } from '@angular/router';
import * as Papa from 'papaparse';

@Component({
selector: 'app-table',
templateUrl: './table.component.html',
styleUrls: ['./table.component.scss']
})

export class TableComponent implements OnInit {
userData: Array<any> = [];
tempUserData: Array<any> = [];
@@ -25,13 +27,13 @@ export class TableComponent implements OnInit {

getFilteredData() {
this.partnerProfileService.getPartnersData().then((data: any) => {
this.userData = data;
this.userData = data;

if (this.shouldHaveImplementationData) {
this.userData = this.userData.filter(user => {
return (user.surveyCtoData.hiiData && user.surveyCtoData.hiiData.length > 0) ||
(user.surveyCtoData.spData && user.surveyCtoData.spData.length > 0) ||
(user.surveyCtoData.spSchemeData && user.surveyCtoData.spSchemeData.length > 0)
return (user.surveyCtoData.hiiData && user.surveyCtoData.hiiData.length > 0) ||
(user.surveyCtoData.spData && user.surveyCtoData.spData.length > 0) ||
(user.surveyCtoData.spSchemeData && user.surveyCtoData.spSchemeData.length > 0)
});
}

@@ -42,7 +44,7 @@ export class TableComponent implements OnInit {
}

this.partialLoad(this.userData.slice(0, 10))
console.log(this.userData);
}, (e) => console.log(e));
}
@@ -57,7 +59,62 @@ export class TableComponent implements OnInit {
}

showPartnerDetails(partner: any) {
this.router.navigate(['dashboard/partners/partner-details'], { queryParams : { data: JSON.stringify(partner) } });
this.router.navigate(['dashboard/partners/partner-details'], { queryParams: { data: JSON.stringify(partner) } });
}

loadCSVData(partnerData: any) {
JSON.stringify(partnerData).split

let csvArray = [{
"PortalID": partnerData.portalId ? partnerData.portalId : '-',

// TODO: DetailedProfile

'Bio': partnerData.detailedProfile.bio,
'Branch Location Countries': (partnerData.detailedProfile.branchLocationCountries).toString(),
"Communities": (partnerData.detailedProfile.communities).toString(),
"District": partnerData.detailedProfile.district,
"Districts": (partnerData.detailedProfile.districts).toString(),
"Files": partnerData.detailedProfile.files,
"Have Branches In Other Districts": partnerData.detailedProfile.haveBranchesInOtherDistricts,
"Logo": partnerData.detailedProfile.logo,
"Partner Location": partnerData.detailedProfile.partnerLocation,
"Preferred Languages": (partnerData.detailedProfile.preferredLanguages).toString(),
"Preferred Mode Of Communications": (partnerData.detailedProfile.preferredModeOfCommunications).toString(),
"State": partnerData.detailedProfile.state,
"States": (partnerData.detailedProfile.states).toString(),
"Total Reach Of Organization": partnerData.detailedProfile.totalReachOfOrganization,
"Year Of Establishment": partnerData.detailedProfile.yearOfEstablishment,

// Primary Contact

"Primary Name": partnerData.primaryContact.contactNumber,
"Primary Contact Number": partnerData.primaryContact.contactNumber,
"Primary Email": partnerData.primaryContact.contactNumber,
"Primary Designation": partnerData.primaryContact.contactNumber,

// Alternative Contact

'Alternative Name': partnerData.alternateContact.name,
'Alternative ContactNumber': partnerData.alternateContact.contactNumber,
'Alternative Email': partnerData.alternateContact.email,
'Alternative Designation': partnerData.alternateContact.designation,

// Strength

"Other Specific Support Required": partnerData.strengthAndCapability.otherSpecificSupportRequired,
"Primary Areas Of Support Offered": (partnerData.strengthAndCapability.otherSpecificSupportRequired).toString(),
"Primary Areas Of Support Offered Description": partnerData.strengthAndCapability.primaryAreasOfSupportOffered,
"Primary Areas Of Support Offered Other": partnerData.strengthAndCapability.primaryAreasOfSupportOfferedDescription,
"Primary Areas Of Support Required": (partnerData.strengthAndCapability.primaryAreasOfSupportOfferedOther).toString(),
"Primary Areas Of Support Required Description": partnerData.strengthAndCapability.primaryAreasOfSupportRequired,
"Primary Areas Of Support Required Other": partnerData.strengthAndCapability.primaryAreasOfSupportRequiredOther,
}]
return csvArray;
}

exportCSV() {
console.log(this.tempUserData)
}

}

+ 1
- 1
src/app/services/partner-profile.service.ts Zobrazit soubor

@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { lastValueFrom } from 'rxjs';

export const BASE_URL = 'http://localhost:8001';
export const BASE_URL = 'http://143.110.247.94';
// http://localhost:8001
// http://143.110.247.94



Načítá se…
Zrušit
Uložit