kj
/
cac-desktop
1
0
Bifurcation 0
Code Tickets 0 Demandes d'ajout 0 Versions 0 Wiki Activité
Angular app for CAC desktop
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.
33 Révisions
1 Branche
1.4 MiB
 
 
 
 
Aborescence: f1e516db35
Branches Tags
${ item.name }
Créer la branche ${ searchTerm }
de 'f1e516db35'
${ noResults }
cac-desktop/src/app/dashboard/partner-details/partner-details.component.html

556 lignes
26 KiB
Brut Annotations Historique 

  1. <section *ngIf="partnerDetails">

  2.     <div class="shadow" *ngIf="showExportOptions" (click)="showExportOptions = false"></div>

  3. 

  4.     <section class="subpage">

  5.         <header class="main-header">

  6.             <h2> Partner Profile </h2>

  7.         </header>

  8. 

  9.         <div class="segments">

  10.             <button class="button" [ngClass]="{'active' : selectedSegment === 1}" (click)="selectedSegment = 1"> Profile

  11.             </button>

  12.             <button class="button" [ngClass]="{'active' : selectedSegment === 2}" (click)="selectedSegment = 2"

  13.                 *ngIf="partnerDetails.surveyCtoData.hiiData.length > 0 || partnerDetails.surveyCtoData.spData.length > 0 || partnerDetails.surveyCtoData.spSchemeData.length > 0">

  14.                 Implementation Data </button>

  15.         </div>

  16. 

  17.         <ng-container *ngIf="selectedSegment === 1">

  18.             <section class="card">

  19.                 <header>

  20.                     <h5> Primary Contact </h5>

  21.                 </header>

  22. 

  23.                 <div class="container">

  24.                     <div class="input-holder">

  25.                         <input type="text" disabled="{{ !isFormEditable }}"

  26.                             [(ngModel)]="partnerDetails.primaryContact.name">

  27.                         <label> Name </label>

  28.                     </div>

  29. 

  30.                     <div class="input-holder">

  31.                         <input type="text" disabled="{{ !isFormEditable }}"

  32.                             [(ngModel)]="partnerDetails.primaryContact.designation">

  33.                         <label> Designation </label>

  34.                     </div>

  35. 

  36.                     <div class="input-holder">

  37.                         <input type="text" disabled="{{ !isFormEditable }}"

  38.                             [(ngModel)]="partnerDetails.primaryContact.email">

  39.                         <label> Email </label>

  40.                     </div>

  41. 

  42.                     <div class="input-holder">

  43.                         <input type="text" disabled="{{ !isFormEditable }}"

  44.                             [(ngModel)]="partnerDetails.primaryContact.contactNumber">

  45.                         <label> Contact </label>

  46.                     </div>

  47.                 </div>

  48.             </section>

  49. 

  50.             <section class="card">

  51.                 <header>

  52.                     <h5> Basic Info </h5>

  53.                 </header>

  54. 

  55.                 <div class="container">

  56.                     <div class="input-holder">

  57.                         <input type="text" disabled="{{ !isFormEditable }}"

  58.                             [(ngModel)]="partnerDetails.organizationBasicInfo.name">

  59.                         <label> Name </label>

  60.                     </div>

  61. 

  62.                     <div class="input-holder">

  63.                         <input type="text" disabled="{{ !isFormEditable }}"

  64.                             [(ngModel)]="partnerDetails.organizationBasicInfo.website">

  65.                         <label> Official Website </label>

  66.                     </div>

  67. 

  68.                     <div class="input-holder">

  69.                         <input type="text" disabled="{{ !isFormEditable }}"

  70.                             [(ngModel)]="partnerDetails.organizationBasicInfo.type">

  71.                         <label> Type </label>

  72.                     </div>

  73. 

  74.                     <div class="input-holder">

  75.                         <ng-select [items]="areasOfWork" [readonly]="!isFormEditable" [multiple]="true"

  76.                             [closeOnSelect]="false" [searchable]="false" bindLabel="name"

  77.                             placeholder="Select areas of work"

  78.                             [(ngModel)]="partnerDetails.organizationBasicInfo.areasOfWork">

  79.                         </ng-select>

  80.                         <label> Thematic areas of work </label>

  81.                     </div>

  82. 

  83.                     <div class="input-holder">

  84.                         <input type="text" disabled="{{ !isFormEditable }}"

  85.                             [(ngModel)]="partnerDetails.organizationBasicInfo.source">

  86.                         <label> How did you hear about us </label>

  87.                     </div>

  88. 

  89.                     <div class="input-holder">

  90.                         <input type="text" disabled="{{ !isFormEditable }}"

  91.                             [(ngModel)]="partnerDetails.organizationBasicInfo.referralName">

  92.                         <label> Name of the organisation and person that referred </label>

  93.                     </div>

  94. 

  95.                     <div class="checkbox-holder">

  96.                         <input type="checkbox" disabled="{{ !isFormEditable }}"

  97.                             [(ngModel)]="partnerDetails.organizationBasicInfo.wouldLikeUpdates">

  98.                         <label> I would like to receive periodic updates about CAC </label>

  99.                     </div>

  100. 

  101.                     <div class="input-holder">

  102.                         <textarea type="text" disabled="{{ !isFormEditable }}"

  103.                             [(ngModel)]="partnerDetails.organizationBasicInfo.reasonForBecomingMember"></textarea>

  104.                         <label> I would like to become a member of CAC because </label>

  105.                     </div>

  106.                 </div>

  107. 

  108.             </section>

  109. 

  110.             <section class="card">

  111.                 <header>

  112.                     <h5> Alternative Contact </h5>

  113.                 </header>

  114. 

  115.                 <div class="container">

  116. 

  117. 

  118.                     <div class="input-holder">

  119.                         <input type="text" disabled="{{ !isFormEditable }}"

  120.                             [(ngModel)]="partnerDetails.alternateContact.designation">

  121.                         <label> Name </label>

  122.                     </div>

  123. 

  124.                     <div class="input-holder">

  125.                         <input type="text" disabled="{{ !isFormEditable }}"

  126.                             [(ngModel)]="partnerDetails.alternateContact.email">

  127.                         <label> Name </label>

  128.                     </div>

  129. 

  130.                     <div class="input-holder">

  131.                         <input type="text" disabled="{{ !isFormEditable }}"

  132.                             [(ngModel)]="partnerDetails.alternateContact.contactNumber">

  133.                         <label> Contact </label>

  134.                     </div>

  135.                 </div>

  136.             </section>

  137. 

  138.             <section class="card">

  139.                 <header>

  140.                     <h5> Detailed Profile </h5>

  141.                 </header>

  142. 

  143.                 <div class="container">

  144.                     <div class="input-holder">

  145.                         <input type="text" disabled="{{ !isFormEditable }}"

  146.                             [(ngModel)]="partnerDetails.detailedProfile.partnerLocation">

  147.                         <label> Partner/Organization/Network Headquarters Location </label>

  148.                     </div>

  149. 

  150.                     <div class="input-holder">

  151.                         <input type="text" disabled="{{ !isFormEditable }}"

  152.                             [(ngModel)]="partnerDetails.detailedProfile.state">

  153.                         <label> State </label>

  154.                     </div>

  155. 

  156.                     <div class="input-holder">

  157.                         <input type="text" disabled="{{ !isFormEditable }}"

  158.                             [(ngModel)]="partnerDetails.detailedProfile.district">

  159.                         <label> District </label>

  160.                     </div>

  161. 

  162.                     <div class="checkbox-holder">

  163.                         <input type="checkbox" disabled="{{ !isFormEditable }}"

  164.                             [(ngModel)]="partnerDetails.detailedProfile.haveBranchesInOtherDistricts">

  165.                         <label> Do you have Branches / Field presence in any other District? </label>

  166.                     </div>

  167. 

  168.                     <div class="input-holder">

  169.                         <ng-select [items]="countries" [readonly]="!isFormEditable" [multiple]="true"

  170.                             [closeOnSelect]="false" bindLabel="name" placeholder="Select countries"

  171.                             [(ngModel)]="partnerDetails.detailedProfile.branchLocationCountries">

  172.                         </ng-select>

  173.                         <label> Branch or Field office Location (Countries) </label>

  174.                     </div>

  175. 

  176.                     <ng-container *ngIf="hasIndiaBranchLocation()">

  177.                         <div class="input-holder">

  178.                             <ng-select [items]="states" [readonly]="!isFormEditable" [multiple]="true"

  179.                                 [closeOnSelect]="false" [searchable]="false" bindLabel="name"

  180.                                 placeholder="Select states" (change)="updateDistricts($event)"

  181.                                 [(ngModel)]="partnerDetails.detailedProfile.states">

  182.                             </ng-select>

  183.                             <label> Branch or Field office Location (States) </label>

  184.                         </div>

  185. 

  186.                         <div class="input-holder">

  187.                             <ng-select [items]="districts" [readonly]="!isFormEditable" [multiple]="true"

  188.                                 [closeOnSelect]="false" [searchable]="false" bindLabel="name"

  189.                                 placeholder="Select districts" [(ngModel)]="partnerDetails.detailedProfile.districts">

  190.                             </ng-select>

  191.                             <label> Branch or Field office Location (Districts) </label>

  192.                         </div>

  193.                     </ng-container>

  194. 

  195.                     <div class="input-holder">

  196.                         <input type="text" disabled="{{ !isFormEditable }}"

  197.                             [(ngModel)]="partnerDetails.detailedProfile.yearOfEstablishment">

  198.                         <label> Which year your organisation/partner/network was established? </label>

  199.                     </div>

  200. 

  201.                     <div class="input-holder">

  202.                         <ng-select [items]="communities" [readonly]="!isFormEditable" [multiple]="true"

  203.                             [closeOnSelect]="false" [searchable]="false" bindLabel="name"

  204.                             placeholder="Select communities" [(ngModel)]="partnerDetails.detailedProfile.communities">

  205.                         </ng-select>

  206.                         <label> Which communities do you work with? </label>

  207.                     </div>

  208. 

  209.                     <div class="input-holder">

  210.                         <ng-select [items]="preferredModesOfCommunication" [readonly]="!isFormEditable"

  211.                             [multiple]="true" [closeOnSelect]="false" [searchable]="false" bindLabel="name"

  212.                             placeholder="Select mode of communication"

  213.                             [(ngModel)]="partnerDetails.detailedProfile.preferredModeOfCommunications">

  214.                         </ng-select>

  215.                         <label> Select your preferred mode of communications with the Collab</label>

  216.                     </div>

  217. 

  218.                     <div class="input-holder">

  219.                         <ng-select [items]="preferredLanguages" [readonly]="!isFormEditable" [multiple]="true"

  220.                             [closeOnSelect]="false" [searchable]="false" bindLabel="name"

  221.                             placeholder="Select preferred Language"

  222.                             [(ngModel)]="partnerDetails.detailedProfile.preferredLanguages">

  223.                         </ng-select>

  224.                         <label> Preferred Language of Communication* (emails, webinars etc. Select all that apply)

  225.                         </label>

  226.                     </div>

  227. 

  228.                     <div class="input-holder">

  229.                         <input type="text" disabled="{{ !isFormEditable }}"

  230.                             [(ngModel)]="partnerDetails.detailedProfile.totalReachOfOrganization">

  231.                         <label> What is the total reach of your organisation in a year? </label>

  232.                     </div>

  233. 

  234.                     <div class="input-holder">

  235.                         <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}"

  236.                             [(ngModel)]="partnerDetails.detailedProfile.bio"></textarea>

  237.                         <label> Bio (This information will be displayed along with your logo in the members section of

  238.                             this website. Max:100 Characters) </label>

  239.                     </div>

  240.                 </div>

  241.             </section>

  242. 

  243.             <section class="card">

  244.                 <header>

  245.                     <h5>

  246.                         Strength &amp; Capability

  247.                     </h5>

  248.                 </header>

  249. 

  250.                 <div class="container">

  251.                     <div class="input-holder">

  252.                         <ng-select [items]="areasOfSupport" [readonly]="!isFormEditable" [multiple]="true"

  253.                             [closeOnSelect]="false" [searchable]="false" bindLabel="name" placeholder="Select areas"

  254.                             [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequired">

  255.                         </ng-select>

  256.                         <label> What are the primary areas of support that you seek from #COVIDActionCollab? </label>

  257.                     </div>

  258. 

  259.                     <div class="input-holder">

  260.                         <input type="text" disabled="{{ !isFormEditable }}"

  261.                             [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredOther">

  262.                         <label> If other, please describe </label>

  263.                     </div>

  264. 

  265.                     <div class="input-holder">

  266.                         <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}"

  267.                             [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportRequiredDescription"></textarea>

  268.                         <label> Kindly elaborate on the option(s) selected above </label>

  269.                     </div>

  270. 

  271.                     <div class="input-holder">

  272.                         <ng-select [items]="areasOfSupport" [readonly]="!isFormEditable" [multiple]="true"

  273.                             [closeOnSelect]="false" [searchable]="false" bindLabel="name" placeholder="Select areas"

  274.                             [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOffered">

  275.                         </ng-select>

  276.                         <label> What are the areas in which you can support/contribute to the #COVIDActionCollab and its

  277.                             partners? </label>

  278.                     </div>

  279. 

  280.                     <div class="input-holder">

  281.                         <input type="text" disabled="{{ !isFormEditable }}"

  282.                             [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedOther">

  283.                         <label> If other, please describe </label>

  284.                     </div>

  285. 

  286.                     <div class="input-holder">

  287.                         <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}"

  288.                             [(ngModel)]="partnerDetails.strengthAndCapability.primaryAreasOfSupportOfferedDescription"></textarea>

  289.                         <label> Kindly elaborate on the option(s) selected above </label>

  290.                     </div>

  291. 

  292.                     <div class="input-holder">

  293.                         <textarea maxlength="100" type="text" disabled="{{ !isFormEditable }}"

  294.                             [(ngModel)]="partnerDetails.strengthAndCapability.otherSpecificSupportRequired"></textarea>

  295.                         <label> Do you require any other specific support? </label>

  296.                     </div>

  297.                 </div>

  298.             </section>

  299. 

  300.             <div class="card">

  301.                 <div class="checkbox-holder">

  302.                     <input type="checkbox" disabled [(ngModel)]="partnerDetails.didAgree">

  303.                     <label> I agree to the <a href="https://covidactioncollab.org/Mou-charter/" target="_blank">MOU &

  304.                             Charter</a>. </label>

  305.                 </div>

  306.                 <div class="checkbox-holder">

  307.                     <input type="checkbox" disabled [(ngModel)]="partnerDetails.didDeclare">

  308.                     <label> I/We hereby declare that I/we neither support nor are associated with any act which

  309.                         promotes: 1. Human trafficking; 2. Smoking / Chewing tobacco; 3. Violence / terrorism 4. Child

  310.                         labour / Child Marriage 5. Discrimination based color, race, religion, caste, disability &

  311.                         sexual orientation 6. Mining 7. Terrorism 8. Abortion counselling referrals, advocate to

  312.                         decriminalise abortion or expand abortion services. </label>

  313.                 </div>

  314.             </div>

  315.         </ng-container>

  316. 

  317.         <ng-container *ngIf="selectedSegment === 2">

  318.             <section class="card" *ngIf="partnerDetails.surveyCtoData.hiiData.length > 0">

  319.                 <header>

  320.                     <h5> HII Data </h5>

  321.                 </header>

  322.                 <section class="table" *ngFor="let package of partnerDetails.surveyCtoData.hiiData">

  323.                     <div class="row">

  324.                         <div class="col">

  325.                             Name

  326.                         </div>

  327.                         <div class="col">

  328.                             {{ package.name }}

  329.                         </div>

  330.                     </div>

  331.                     <div class="row">

  332.                         <div class="col">

  333.                             Implementation Status

  334.                         </div>

  335.                         <div class="col">

  336.                             {{ package.implementationStatus }}

  337.                         </div>

  338.                     </div>

  339.                     <div class="row">

  340.                         <div class="col">

  341.                             No. of Females

  342.                         </div>

  343.                         <div class="col">

  344.                             {{ package.noOfFemales }}

  345.                         </div>

  346.                     </div>

  347.                     <div class="row">

  348.                         <div class="col">

  349.                             No. of Males

  350.                         </div>

  351.                         <div class="col">

  352.                             {{ package.noOfMales }}

  353.                         </div>

  354.                     </div>

  355.                     <div class="row">

  356.                         <div class="col">

  357.                             No. of Transgenders

  358.                         </div>

  359.                         <div class="col">

  360.                             {{ package.noOfTransgender }}

  361.                         </div>

  362.                     </div>

  363.                     <div class="row">

  364.                         <div class="col">

  365.                             Health Package ID

  366.                         </div>

  367.                         <div class="col">

  368.                             {{ package.packagesHealth }}

  369.                         </div>

  370.                     </div>

  371.                     <div class="row">

  372.                         <div class="col">

  373.                             Health Remarks

  374.                         </div>

  375.                         <div class="col">

  376.                             {{ package.healthRemarks }}

  377.                         </div>

  378.                     </div>

  379.                     <div class="row">

  380.                         <div class="col">

  381.                             Disaggregation Note

  382.                         </div>

  383.                         <div class="col">

  384.                             {{ package.disaggregationNote }}

  385.                         </div>

  386.                     </div>

  387.                     <div class="row">

  388.                         <div class="col">

  389.                             Relevant Documents

  390.                         </div>

  391.                         <div class="col">

  392.                             <a *ngIf="package.relevantDocuments" href="{{ package.relevantDocuments }}" target="_blank"> Link </a>

  393.                             <span *ngIf="!package.relevantDocuments"> - </span>

  394.                         </div>

  395.                     </div>

  396.                 </section>

  397.             </section>

  398. 

  399.             <section class="card" *ngIf="partnerDetails.surveyCtoData.spData.length > 0">

  400.                 <header>

  401.                     <h5> SP Data </h5>

  402.                 </header>

  403.                 <section class="table" *ngFor="let package of partnerDetails.surveyCtoData.spData">

  404.                     <div class="row">

  405.                         <div class="col">

  406.                             Name

  407.                         </div>

  408.                         <div class="col">

  409.                             {{ package.name }}

  410.                         </div>

  411.                     </div>

  412.                     <div class="row">

  413.                         <div class="col">

  414.                             Implementation Status

  415.                         </div>

  416.                         <div class="col">

  417.                             {{ package.status }}

  418.                         </div>

  419.                     </div>

  420.                     <div class="row">

  421.                         <div class="col">

  422.                             Female Number

  423.                         </div>

  424.                         <div class="col">

  425.                             {{ package.femaleNo }}

  426.                         </div>

  427.                     </div>

  428.                     <div class="row">

  429.                         <div class="col">

  430.                             Male Number

  431.                         </div>

  432.                         <div class="col">

  433.                             {{ package.maleNo }}

  434.                         </div>

  435.                     </div>

  436.                     <div class="row">

  437.                         <div class="col">

  438.                             Transgenders Number

  439.                         </div>

  440.                         <div class="col">

  441.                             {{ package.tgNo }}

  442.                         </div>

  443.                     </div>

  444. 

  445.                     <div class="row">

  446.                         <div class="col">

  447.                             Total Aggregation

  448.                         </div>

  449.                         <div class="col">

  450.                             {{ package.totalAggregation }}

  451.                         </div>

  452.                     </div>

  453.                     <div class="row">

  454.                         <div class="col">

  455.                             Other Remarks

  456.                         </div>

  457.                         <div class="col">

  458.                             {{ package.otherRemarks }}

  459.                         </div>

  460.                     </div>

  461.                     <div class="row">

  462.                         <div class="col">

  463.                             Relevant Documents

  464.                         </div>

  465.                         <div class="col">

  466.                             <a *ngIf="package.relevantDocuments" href="{{ package.relevantDocuments }}" target="_blank"> Link </a>

  467.                             <span *ngIf="!package.relevantDocuments"> - </span>

  468.                         </div>

  469.                     </div>

  470.                 </section>

  471.             </section>

  472. 

  473.             <section class="card" *ngIf="partnerDetails.surveyCtoData.spSchemeData.length > 0">

  474.                 <header>

  475.                     <h5> SP Scheme </h5>

  476.                 </header>

  477.                 <section class="table" *ngFor="let package of partnerDetails.surveyCtoData.spSchemeData">

  478.                     <div class="row">

  479.                         <div class="col">

  480.                             Count

  481.                         </div>

  482.                         <div class="col">

  483.                             {{ package.count }}

  484.                         </div>

  485.                     </div>

  486.                     <div class="row">

  487.                         <div class="col">

  488.                             Scheme Id

  489.                         </div>

  490.                         <div class="col">

  491.                             {{ package.schemeId }}

  492.                         </div>

  493.                     </div>

  494.                 </section>

  495.             </section>

  496.         </ng-container>

  497. 

  498.         <section class="footer-buttons">

  499.             <div class="shadow" *ngIf="showExportOptions" (click)="showExportOptions = false"></div>

  500. 

  501.             <button class="button back" [routerLink]="'/dashboard/partners'">

  502.                 <img src="assets/chevron-left.svg" alt="">

  503.                 Back

  504.             </button>

  505. 

  506.             <ng-container *ngIf="!isFormEditable">

  507.                 <button class="button edit" (click)="isFormEditable=true"> <img src="assets/edit.svg" alt=""> Edit

  508.                 </button>

  509.                 <button class="button" (click)="showExportOptions=true"> <img src="assets/export.svg" alt=""> Export

  510.                 </button>

  511.                 <button class="button delete"> <img src="assets/delete.svg" alt=""> Delete </button>

  512.             </ng-container>

  513. 

  514.             <ng-container *ngIf="showExportOptions">

  515.                 <div class="export-options">

  516. 

  517.                     <div class="sub-options">

  518.                         <header>

  519.                             <h5>Select Data Type</h5>

  520.                         </header>

  521.                         <div>

  522.                             <span>Profile Data</span>

  523.                             <div class="radioButton" [ngClass]="{'active' : isProfileData}"

  524.                                 (click)="isProfileData = true; isImplementationData=false; isBothData=false"></div>

  525.                         </div>

  526.                         <div>

  527.                             <span>Implementation Data</span>

  528.                             <div class="radioButton" [ngClass]="{'active' : isImplementationData}"

  529.                                 (click)="isImplementationData= true; isProfileData=false; isBothData=false"></div>

  530.                         </div>

  531.                         <div>

  532.                             <span>Both</span>

  533.                             <div class="radioButton" [ngClass]="{'active' : isBothData}"

  534.                                 (click)="isBothData = true; isProfileData = false; isImplementationData=false"></div>

  535.                         </div>

  536.                     </div>

  537. 

  538.                     <header>

  539.                         <h5> Export as </h5>

  540.                     </header>

  541.                     <div class="options">

  542.                         <button class="button" (click)="exportProfileData('CSV')"> CSV </button>

  543.                         <button class="button" (click)="exportProfileData('XLSX')"> Excel </button>

  544.                     </div>

  545.                 </div>

  546.             </ng-container>

  547. 

  548.             <ng-container *ngIf="isFormEditable">

  549.                 <button class="button edit" (click)="save()"> <img src="assets/save.svg" alt=""> Save

  550.                 </button>

  551.                 <button class="button delete" (click)="isFormEditable=false"> X Cancel </button>

  552.             </ng-container>

  553.         </section>

  554.     </section>

  555. 

  556. </section>