Bladeren bron

Implementation data integration

master
kj1352 3 jaren geleden
bovenliggende
commit
d25e2561dc
4 gewijzigde bestanden met toevoegingen van 405 en 220 verwijderingen
  1. +365
    -209
      src/app/dashboard/partner-details/partner-details.component.html
  2. +33
    -0
      src/app/dashboard/partner-details/partner-details.component.scss
  3. +1
    -1
      src/app/dashboard/partner-details/partner-details.component.ts
  4. +6
    -10
      src/app/services/auth.service.ts

+ 365
- 209
src/app/dashboard/partner-details/partner-details.component.html Bestand weergeven

@@ -8,253 +8,409 @@
<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>
<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>
<ng-container *ngIf="selectedSegment === 1">
<section class="card">
<header>
<h5> Primary Contact </h5>
</header>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.primaryContact.designation">
<label> Name </label>
<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>
<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>
<section class="card">
<header>
<h5> Basic Info </h5>
</header>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.website">
<label> Official Website </label>
</div>
<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="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.type">
<label> Type </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">
<div class="text"> <button *ngFor="let area of partnerDetails.organizationBasicInfo.areasOfWork"> {{ area }} </button> </div>
<label> Thematic areas of work </label>
<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>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.organizationBasicInfo.source">
<label> How did you hear about us </label>
</div>
</section>
<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">
<section class="card">
<header>
<h5> Alternative Contact </h5>
</header>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.alternateContact.designation">
<label> Name </label>
<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>
<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 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>
<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.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>
</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>
<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>
<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>
<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>
</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>
<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>
<label> Branch or Field office Location (States) </label>
</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 district of partnerDetails.detailedProfile.districts"> {{ district }} </button>
<button *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportRequired"> {{ support }} </button>
</div>
<label> Branch or Field office Location (Districts) </label>
<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.detailedProfile.yearOfEstablishment">
<label> Which year your organisation/partner/network was established? </label>
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredOther">
<label> If other, please describe </label>
</div>

<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>
<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 mode of partnerDetails.detailedProfile.preferredModeOfCommunications"> {{ mode }} </button>
<button *ngFor="let support of partnerDetails.strengthAndCapability.primaryAreasOfSupportOffered"> {{ support }} </button>
</div>
<label> Select your preferred mode of communications with the Collab</label>
<label> What are the areas in which you can support/contribute to the #COVIDActionCollab and its partners? </label>
</div>

<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>
<input type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedOther">
<label> If other, please describe </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>
<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.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>
<textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}" [(ngModel)]="partnerDetails.strengthAndCapability.otherSpecificSupportRequired"></textarea>
<label> Do you require any other specific support? </label>
</div>
</div>
</section>
</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 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>
<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 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>
<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>

<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>
</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">
<button class="button back" [routerLink]="'/dashboard/partners'">


+ 33
- 0
src/app/dashboard/partner-details/partner-details.component.scss Bestand weergeven

@@ -92,4 +92,37 @@
padding-top: 20px;
padding-left: 20px;
}
}

.table {
display: block;
box-shadow: 0px 0px 1px var(--input-border);
border-radius: var(--common-border-radius);
margin-bottom: 40px;

.row {
color: var(--secondary-text);
background-color: white;
border-radius: var(--common-border-radius);
transition: border-color 0.3s, box-shadow 0.3s;
height: 50px;
border: 2px solid transparent;
box-shadow: none;
display: flex;
align-items: center;

.col {
font-style: 14px;
width: 50%;
padding-left: 20px;

&:nth-child(2) {
font-weight: 500;
}
}

&:nth-child(even) {
background-color: var(--input-background);
}
}
}

+ 1
- 1
src/app/dashboard/partner-details/partner-details.component.ts Bestand weergeven

@@ -9,7 +9,7 @@ import { ActivatedRoute } from '@angular/router';
export class PartnerDetailsComponent implements OnInit {
partnerDetails: any;
isFormEditable: boolean = false;
selectedSegment: 1 | 2 | 3 = 1;
selectedSegment: 1 | 2 | 3 = 2;

constructor(
private activateRouter:ActivatedRoute


+ 6
- 10
src/app/services/auth.service.ts Bestand weergeven

@@ -3,6 +3,11 @@ import { HttpClient, HttpHeaders } from '@angular/common/http';
import { lastValueFrom } from 'rxjs';
import { BASE_URL } from './partner-profile.service';

interface LoginData {
id: string;
token: string;
}

@Injectable({
providedIn: 'root'
})
@@ -16,15 +21,6 @@ export class AuthService {
username: string,
password: string,
}) {
const body = `&username=${encodeURIComponent(credentials.username)}&password=${encodeURIComponent(credentials.password)}`;
const headers = new HttpHeaders({
Accept: 'text/html, application/xhtml+xml, */*',
'Content-Type': 'application/x-www-form-urlencoded',
});
const httpOptions = {
headers,
responseType: 'text' as 'json',
};
return lastValueFrom(this.http.post(BASE_URL + '/api-auth/', body, httpOptions));
return lastValueFrom(this.http.post<LoginData>(BASE_URL + '/api-auth/', credentials));
}
}

Laden…
Annuleren
Opslaan