kj
/
cac-desktop
1
0
派生 0
代码 工单 0 合并请求 0 版本发布 0 百科 动态
浏览代码

HII, SPData, SpSchema Table in Implementation Segment

master
prahalad 3 年前
父节点
7fae8722f3
当前提交
79f7370bba
共有 2 个文件被更改，包括 342 次插入 和 416 次删除
合并视图
Diff 选项
显示统计 下载 Patch 文件 下载 Diff 文件
  1. +323
    -414
      src/app/dashboard/partner-details/partner-details.component.html
  2. +19
    -2
      src/app/dashboard/partner-details/partner-details.component.scss

+ 323
- 414
src/app/dashboard/partner-details/partner-details.component.html 查看文件

@@ -11,486 +11,395 @@
</button> </button>
<button class="button" [ngClass]="{'active' : selectedSegment === 2}" (click)="selectedSegment = 2" <button class="button" [ngClass]="{'active' : selectedSegment === 2}" (click)="selectedSegment = 2"
*ngIf="partnerDetails.surveyCtoData.hiiData.length > 0 || partnerDetails.surveyCtoData.spData.length > 0 || partnerDetails.surveyCtoData.spSchemeData.length > 0"> *ngIf="partnerDetails.surveyCtoData.hiiData.length > 0 || partnerDetails.surveyCtoData.spData.length > 0 || partnerDetails.surveyCtoData.spSchemeData.length > 0">
Implementation Data </button>
Implementation Data
</button>
</div> </div>


<ng-container *ngIf="selectedSegment === 1"> <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>
<section class="card-holder">
<section class="card">
<header>
<h5> Primary Contact </h5>
</header>


<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.primaryContact.designation">
<label> Designation </label>
</div>
<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.email">
<label> Email </label>
</div>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.primaryContact.designation">
<label> Designation </label>
</div>

<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.primaryContact.email">
<label> Email </label>
</div>


<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.primaryContact.contactNumber">
<label> Contact </label>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.primaryContact.contactNumber">
<label> Contact </label>
</div>
</div> </div>
</div>
</section>
</section>


<section class="card">
<header>
<h5> Basic Info </h5>
</header>
<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="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.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">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.organizationBasicInfo.type">
<label> Type </label>
</div>


<div class="input-holder">
<ng-select [items]="areasOfWork" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select areas of work"
[(ngModel)]="partnerDetails.organizationBasicInfo.areasOfWork">
</ng-select>
<label> Thematic areas of work </label>
</div>
<div class="input-holder">
<ng-select [items]="areasOfWork" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select areas of work"
[(ngModel)]="partnerDetails.organizationBasicInfo.areasOfWork">
</ng-select>
<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.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.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="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 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>
</div>


</section>
</section>


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


<div class="container">
<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.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.email">
<label> Name </label>
</div>


<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.alternateContact.contactNumber">
<label> Contact </label>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.alternateContact.contactNumber">
<label> Contact </label>
</div>
</div> </div>
</div>
</section>
</section>


<section class="card">
<header>
<h5> Detailed Profile </h5>
</header>
<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="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.state">
<label> State </label>
</div>


<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.detailedProfile.district">
<label> District </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="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">
<ng-select [items]="countries" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" bindLabel="name" placeholder="Select countries"
[(ngModel)]="partnerDetails.detailedProfile.branchLocationCountries">
</ng-select>
<label> Branch or Field office Location (Countries) </label>
</div>
<div class="input-holder">
<ng-select [items]="countries" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" bindLabel="name" placeholder="Select countries"
[(ngModel)]="partnerDetails.detailedProfile.branchLocationCountries">
</ng-select>
<label> Branch or Field office Location (Countries) </label>
</div>

<ng-container *ngIf="hasIndiaBranchLocation()">
<div class="input-holder">
<ng-select [items]="states" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select states" (change)="updateDistricts($event)"
[(ngModel)]="partnerDetails.detailedProfile.states">
</ng-select>
<label> Branch or Field office Location (States) </label>
</div>

<div class="input-holder">
<ng-select [items]="districts" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select districts" [(ngModel)]="partnerDetails.detailedProfile.districts">
</ng-select>
<label> Branch or Field office Location (Districts) </label>
</div>
</ng-container>


<ng-container *ngIf="hasIndiaBranchLocation()">
<div class="input-holder"> <div class="input-holder">
<ng-select [items]="states" [readonly]="!isFormEditable" [multiple]="true"
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.detailedProfile.yearOfEstablishment">
<label> Which year your organisation/partner/network was established? </label>
</div>

<div class="input-holder">
<ng-select [items]="communities" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name" [closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select states" (change)="updateDistricts($event)"
[(ngModel)]="partnerDetails.detailedProfile.states">
placeholder="Select communities" [(ngModel)]="partnerDetails.detailedProfile.communities">
</ng-select> </ng-select>
<label> Branch or Field office Location (States) </label>
<label> Which communities do you work with? </label>
</div> </div>


<div class="input-holder"> <div class="input-holder">
<ng-select [items]="districts" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select districts" [(ngModel)]="partnerDetails.detailedProfile.districts">
<ng-select [items]="preferredModesOfCommunication" [readonly]="!isFormEditable"
[multiple]="true" [closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select mode of communication"
[(ngModel)]="partnerDetails.detailedProfile.preferredModeOfCommunications">
</ng-select> </ng-select>
<label> Branch or Field office Location (Districts) </label>
<label> Select your preferred mode of communications with the Collab</label>
</div> </div>
</ng-container>


<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">
<ng-select [items]="preferredLanguages" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select preferred Language"
[(ngModel)]="partnerDetails.detailedProfile.preferredLanguages">
</ng-select>
<label> Preferred Language of Communication* (emails, webinars etc. Select all that apply)
</label>
</div>


<div class="input-holder">
<ng-select [items]="communities" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select communities" [(ngModel)]="partnerDetails.detailedProfile.communities">
</ng-select>
<label> Which communities do you work with? </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">
<ng-select [items]="preferredModesOfCommunication" [readonly]="!isFormEditable"
[multiple]="true" [closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select mode of communication"
[(ngModel)]="partnerDetails.detailedProfile.preferredModeOfCommunications">
</ng-select>
<label> Select your preferred mode of communications with the Collab</label>
<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> </div>
</section>


<div class="input-holder">
<ng-select [items]="preferredLanguages" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name"
placeholder="Select preferred Language"
[(ngModel)]="partnerDetails.detailedProfile.preferredLanguages">
</ng-select>
<label> Preferred Language of Communication* (emails, webinars etc. Select all that apply)
</label>
</div>
<section class="card">
<header>
<h5>
Strength &amp; Capability
</h5>
</header>


<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="container">
<div class="input-holder">
<ng-select [items]="areasOfSupport" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name" placeholder="Select areas"
[(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequired">
</ng-select>
<label> What are the primary areas of support that you seek from #COVIDActionCollab? </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>
<div class="input-holder">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredOther">
<label> If other, please describe </label>
</div>


<section class="card">
<header>
<h5>
Strength &amp; Capability
</h5>
</header>

<div class="container">
<div class="input-holder">
<ng-select [items]="areasOfSupport" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name" placeholder="Select areas"
[(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequired">
</ng-select>
<label> What are the primary areas of support that you seek from #COVIDActionCollab? </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">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredOther">
<label> If other, please describe </label>
</div>
<div class="input-holder">
<ng-select [items]="areasOfSupport" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name" placeholder="Select areas"
[(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOffered">
</ng-select>
<label> What are the areas in which you can support/contribute to the #COVIDActionCollab and its
partners? </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">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedOther">
<label> If other, please describe </label>
</div>


<div class="input-holder">
<ng-select [items]="areasOfSupport" [readonly]="!isFormEditable" [multiple]="true"
[closeOnSelect]="false" [searchable]="false" bindLabel="name" placeholder="Select areas"
[(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOffered">
</ng-select>
<label> What are the areas in which you can support/contribute to the #COVIDActionCollab and its
partners? </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">
<input type="text" disabled="{{ !isFormEditable }}"
[(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedOther">
<label> If other, please describe </label>
<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> </div>
</section>


<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 class="card">
<div class="checkbox-holder">
<input type="checkbox" disabled [(ngModel)]="partnerDetails.didAgree">
<label> I agree to the <a href="https://covidactioncollab.org/Mou-charter/" target="_blank">MOU &
Charter</a>. </label>
</div> </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 class="checkbox-holder">
<input type="checkbox" disabled [(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>
</div> </div>
</section> </section>

<div class="card">
<div class="checkbox-holder">
<input type="checkbox" disabled [(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 [(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>



<ng-container *ngIf="selectedSegment === 2"> <ng-container *ngIf="selectedSegment === 2">
<section class="card" *ngIf="partnerDetails.surveyCtoData.hiiData.length > 0">
<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 Transgenders
</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">
<a *ngIf="package.relevantDocuments" href="{{ package.relevantDocuments }}" target="_blank"> Link </a>
<span *ngIf="!package.relevantDocuments"> - </span>
</div>
</div>
<section class="card-holder">
<section class="card" *ngIf="partnerDetails.surveyCtoData.hiiData.length > 0">
<header>
<h5> HII Data </h5>
</header>
<section class="table">
<div class="row">
<div class="col">Name</div>
<div class="col">Implementation Status</div>
<div class="col">No. of Females</div>
<div class="col">No. of Males</div>
<div class="col">No. of Transgenders</div>
<div class="col">Health Package ID</div>
<div class="col">Health Remarks</div>
<div class="col">Disaggregation Note</div>
<div class="col">Relevant Documents</div>
</div>
<div class="row" *ngFor="let package of partnerDetails.surveyCtoData.hiiData">
<div class="col">{{ package.name }}</div>
<div class="col">{{ package.implementationStatus }}</div>
<div class="col">{{ package.noOfFemales }}</div>
<div class="col">{{ package.noOfMales }}</div>
<div class="col">{{ package.noOfTransgender }}</div>
<div class="col">{{ package.packagesHealth }}</div>
<div class="col">{{ package.healthRemarks }}</div>
<div class="col">{{ package.disaggregationNote }}</div>
<div class="col">
<a *ngIf="package.relevantDocuments" href="{{ package.relevantDocuments }}" target="_blank"> Link </a>
<span *ngIf="!package.relevantDocuments"> - </span>
</div>
</div>
</section>
</section> </section>
</section>

<section class="card" *ngIf="partnerDetails.surveyCtoData.spData.length > 0">
<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">
Female Number
</div>
<div class="col">
{{ package.femaleNo }}
</div>
</div>
<div class="row">
<div class="col">
Male Number
</div>
<div class="col">
{{ package.maleNo }}
</div>
</div>
<div class="row">
<div class="col">
Transgenders Number
</div>
<div class="col">
{{ package.tgNo }}
</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">
<a *ngIf="package.relevantDocuments" href="{{ package.relevantDocuments }}" target="_blank"> Link </a>
<span *ngIf="!package.relevantDocuments"> - </span>
</div>
</div>
<section class="card" *ngIf="partnerDetails.surveyCtoData.spData.length > 0">
<header>
<h5> SP Data </h5>
</header>
<section class="table">
<div class="row">
<div class="col" >Name</div >
<div class="col" >Implementation Status</div >
<div class="col" >Female Number</div >
<div class="col" >Male Number</div >
<div class="col" >Transgenders Number</div >
<div class="col" >Total Aggregation</div >
<div class="col" >Other Remarks</div >
<div class="col" >Relevant Documents</div >
</div>
<div class="row" *ngFor="let package of partnerDetails.surveyCtoData.spData">
<div class="col">{{ package.name }}</div>
<div class="col"> {{ package.status }}</div>
<div class="col">{{ package.femaleNo }}</div>
<div class="col">{{ package.maleNo }}</div>
<div class="col">{{ package.tgNo }}</div>
<div class="col">{{ package.totalAggregation }}</div>
<div class="col">{{ package.otherRemarks }}</div>
<div class="col">
<a *ngIf="package.relevantDocuments" href="{{ package.relevantDocuments }}" target="_blank"> Link </a>
<span *ngIf="!package.relevantDocuments"> - </span>
</div>
</div>
</section>
</section> </section>
</section>


<section class="card" *ngIf="partnerDetails.surveyCtoData.spSchemeData.length > 0">
<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
<section class="card" *ngIf="partnerDetails.surveyCtoData.spSchemeData.length > 0">
<header>
<h5> SP Scheme </h5>
</header>

<section class="table">
<div class="row">
<div class="col" >Scheme Id</div >
<div class="col" >Count</div >
</div> </div>
<div class="col">
{{ package.schemeId }}
<div class="row" *ngFor="let package of partnerDetails.surveyCtoData.spSchemeData">
<div class="col">{{ package.schemeId }}</div>
<div class="col"> {{ package.count }}</div>
</div> </div>
</div>
</section>
</section> </section>
</section> </section>
</ng-container> </ng-container>
@@ -503,7 +412,7 @@
Back Back
</button> </button>


<ng-container *ngIf="!isFormEditable">
<ng-container *ngIf="!isFormEditable">
<button class="button edit" (click)="isFormEditable=true"> <img src="assets/edit.svg" alt=""> Edit <button class="button edit" (click)="isFormEditable=true"> <img src="assets/edit.svg" alt=""> Edit
</button> </button>
<button class="button" (click)="showExportOptions=true"> <img src="assets/export.svg" alt=""> Export <button class="button" (click)="showExportOptions=true"> <img src="assets/export.svg" alt=""> Export


+ 19
- 2
src/app/dashboard/partner-details/partner-details.component.scss 查看文件

@@ -40,10 +40,16 @@
} }
} }


.card-holder {
height: 80vh;
overflow: auto;
margin-top: 10px;
}

.footer-buttons { .footer-buttons {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
position: sticky;
position: absolute;
background-color: white; background-color: white;
box-shadow: 0px 0px 50px var(--input-border); box-shadow: 0px 0px 50px var(--input-border);
bottom: 0; bottom: 0;
@@ -99,21 +105,25 @@
box-shadow: 0px 0px 1px var(--input-border); box-shadow: 0px 0px 1px var(--input-border);
border-radius: var(--common-border-radius); border-radius: var(--common-border-radius);
margin-bottom: 40px; margin-bottom: 40px;
height: 30vh;
overflow: auto;


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



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


&:nth-child(2) { &:nth-child(2) {
@@ -124,6 +134,13 @@
&:nth-child(even) { &:nth-child(even) {
background-color: var(--input-background); background-color: var(--input-background);
} }

&:nth-child(1) {
background-color: var(--secondary-text);
color: white;
position: sticky;
top: 0;
}
} }
} }




撰写 预览
正在加载...
取消
保存