Merging develop to main

README.md

@@ -1 +1,22 @@
-# Common-UI
+# AMRIT - Common-UI
+
+As registration is a common process across multiple AMRIT modules, registration page needs to be configurable based on the service line and project. Providing a framework that makes it easier to modify and set up fields on the user interface (UI) for data collecting on service lines for MMU, HWC, and telemedicine. The system has to possess the ability to change according to certain project specifications, facilitating the easy customization of data fields to fulfil the distinct requirements of every project within these service lines. 
+
+## Features
+
+* **Registration Page**: This page allows the user to create new beneficiaries and edit the data of existing beneficiaries. User can collect and submit personal information, Location Information, Other Information of beneficiaries. User can generate/download ABHA card in registration page.
+
+
+## Building From Source
+
+This microservice is developed using Java and the Spring Boot framework, with MySQL as the database.
+
+### Prerequisites
+
+Ensure that the following prerequisites are met before building the MMU service:
+
+* JDK 17
+* Maven 
+* Nodejs v18.10.0
+* MySQL
+

src/registrar/beneficiary-details/beneficiary-details.component.css

@@ -0,0 +1,16 @@
+.profileData tr td span {
+    font-weight: bold;
+}
+
+img {
+    border-radius: 50%;
+    width: 100px;
+    height: 100px;
+}
+
+.table>tbody>tr>td, .table>tbody>tr>th {
+    padding: 4px;
+    border-top: none;
+    vertical-align: middle;
+    color: #52575C !important;
+}

src/registrar/beneficiary-details/beneficiary-details.component.html

@@ -0,0 +1,202 @@
+<div class="row">
+  <div class="col-xs-12" *ngIf="benFlowStatus">
+    <img
+      *ngIf="!beneficiary?.benImage"
+      src="assets/images/default-avatar.gif"
+      alt="Default Patient Image"
+    />
+    <img
+      *ngIf="beneficiary?.benImage"
+      [src]="beneficiary?.benImage"
+      alt="Patient Image"
+    />
+    <div class="horizontal-scroll-except-first-column">
+      <table class="table profileData" aria-describedby="benDetails">
+        <tr style="font-size: 14px; color: #000000">
+          <th id="beneficiaryName">
+            {{ current_language_set?.bendetails?.beneficiaryName }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>{{ beneficiary?.benName }}</td>
+        </tr>
+        <tr style="font-size: 14px; color: #000000">
+          <th id="gender">
+            {{ current_language_set?.bendetails?.gender }} /
+            {{ current_language_set?.bendetails?.age }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>
+            {{ beneficiary?.genderName }} / {{ beneficiary?.age }} &nbsp;{{
+              beneficiary?.ageUnit
+            }}
+          </td>
+        </tr>
+        <tr style="font-size: 14px; color: #000000">
+          <th id="beneficiaryID">
+            {{ current_language_set?.bendetails?.beneficiaryID }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>{{ beneficiary?.beneficiaryID }}</td>
+        </tr>
+        <tr
+          *ngIf="
+            healthIDValue !== undefined &&
+            healthIDValue !== null &&
+            healthIDValue !== '' &&
+            healthIDValue.length > 0
+          "
+          style="font-size: 14px; color: #000000"
+        >
+          <th id="healthId">{{ current_language_set?.aBHA }}:</th>
+        </tr>
+        <ng-container
+          *ngIf="
+            healthIDArray !== undefined &&
+            healthIDArray !== null &&
+            healthIDArray.length > 0
+          "
+        >
+          <tr
+            style="color: #595959; font-size: 14px"
+            *ngFor="let healthIDValue of healthIDArray"
+          >
+            <td>{{ healthIDValue }}</td>
+          </tr>
+        </ng-container>
+        <tr style="font-size: 14px; color: #000000">
+          <th id="registrationDate">
+            {{ current_language_set?.bendetails?.registrationDate }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>
+            {{ beneficiary?.registrationDate | date: "dd/MM/yyyy, h:mm a" }}
+          </td>
+        </tr>
+        <tr style="font-size: 14px; color: #000000">
+          <th id="visitDate">
+            {{ current_language_set?.bendetails?.visitDate }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>{{ today | date: "dd/MM/yyyy, h:mm a" }}</td>
+        </tr>
+        <tr style="font-size: 14px; color: #000000">
+          <th id="district">
+            {{ current_language_set?.bendetails?.district }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>
+            {{ beneficiary?.districtName }} / {{ beneficiary?.villageName }}
+          </td>
+        </tr>
+      </table>
+    </div>
+  </div>
+
+  <div class="col-xs-12" *ngIf="!benFlowStatus">
+    <img
+      *ngIf="!beneficiary?.benImage"
+      src="assets/images/default-avatar.gif"
+      alt="Default Patient Image"
+    />
+    <img
+      *ngIf="beneficiary?.benImage"
+      [src]="beneficiary?.benImage"
+      alt="Patient Image"
+    />
+    <div class="horizontal-scroll-except-first-column">
+      <table class="table profileData" aria-describedby="benDetails">
+        <tr style="font-size: 14px; color: #000000">
+          <th id="beneficiaryName">
+            {{ current_language_set?.bendetails?.beneficiaryName }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>{{ beneficiaryName | titlecase }}</td>
+        </tr>
+
+        <tr style="font-size: 14px; color: #000000">
+          <th id="beneficiaryName">{{ current_language_set?.familyId }}:</th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>
+            {{
+              benFamilyId !== null && benFamilyId !== undefined
+                ? benFamilyId
+                : "NA"
+            }}
+          </td>
+        </tr>
+        <tr style="font-size: 14px; color: #000000">
+          <th id="gender">
+            {{ current_language_set?.bendetails?.gender }} /
+            {{ current_language_set?.bendetails?.age }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>
+            {{ beneficiary?.m_gender?.genderName }} /
+            {{ beneficiary?.age }} &nbsp;{{ beneficiary?.ageUnit }}
+          </td>
+        </tr>
+        <tr style="font-size: 14px; color: #000000">
+          <th id="beneficiaryID">
+            {{ current_language_set?.bendetails?.beneficiaryID }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>{{ beneficiary?.beneficiaryID }}</td>
+        </tr>
+        <tr
+          *ngIf="
+            healthIDValue !== undefined &&
+            healthIDValue !== null &&
+            healthIDValue !== '' &&
+            healthIDValue.length > 0
+          "
+          style="font-size: 14px; color: #000000"
+        >
+          <th id="healthId">{{ current_language_set?.aBHA }}:</th>
+        </tr>
+        <ng-container
+          *ngIf="
+            healthIDArray !== undefined &&
+            healthIDArray !== null &&
+            healthIDArray.length > 0
+          "
+        >
+          <tr
+            style="color: #595959; font-size: 14px"
+            *ngFor="let healthIDValue of healthIDArray"
+          >
+            <td>{{ healthIDValue }}</td>
+          </tr>
+        </ng-container>
+        <tr style="font-size: 14px; color: #000000">
+          <th id="registrationDate">
+            {{ current_language_set?.bendetails?.registrationDate }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>{{ regDate }}</td>
+        </tr>
+        <tr style="font-size: 14px; color: #000000">
+          <th id="district">
+            {{ current_language_set?.bendetails?.district }}:
+          </th>
+        </tr>
+        <tr style="color: #595959; font-size: 14px">
+          <td>
+            {{ beneficiary?.i_bendemographics?.m_district?.districtName }} /
+            {{ beneficiary?.i_bendemographics?.m_districtblock?.blockName }}
+          </td>
+        </tr>
+      </table>
+    </div>
+  </div>
+</div>

src/registrar/beneficiary-details/beneficiary-details.component.spec.ts

@@ -0,0 +1,45 @@
+/*
+ * AMRIT – Accessible Medical Records via Integrated Technology
+ * Integrated EHR (Electronic Health Records) Solution
+ *
+ * Copyright (C) "Piramal Swasthya Management and Research Institute"
+ *
+ * This file is part of AMRIT.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see https://www.gnu.org/licenses/.
+ */
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BeneficiaryDetailsComponent } from './beneficiary-details.component';
+
+describe('BeneficiaryDetailsComponent', () => {
+  let component: BeneficiaryDetailsComponent;
+  let fixture: ComponentFixture<BeneficiaryDetailsComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [BeneficiaryDetailsComponent],
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BeneficiaryDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});