(fix) Fix lab orders UI

openmrs · Mar 4, 2024 · e9720d2 · e9720d2
1 parent c04fb7f
commit e9720d2
Show file tree

Hide file tree

Showing 6 changed files with 30 additions and 49 deletions.
diff --git a/package.json b/package.json
@@ -10,7 +10,7 @@
     "test": "ng test ngx-formentry --watch=false",
     "test:watch": "ng test ngx-formentry",
     "lint": "TIMING=1 ng lint",
-    "prettier": "prettier --config .prettierrc --write \"projects/**/*.{html,js,ts,css,scss}\" \"src/**/*.{html,js,ts,css,scss}\" --ignore-unknown",
+    "prettier": "prettier --config .prettierrc --write \"projects/**/*.{html,js,ts,css,scss}\" \"src/**/*.{html,js,ts,css,scss}\" --ignore-unknown --list-different",
     "e2e": "ng e2e"
   },
   "peerDependencies": {

diff --git a/projects/ngx-formentry/src/form-entry/form-renderer/form-renderer.component.html b/projects/ngx-formentry/src/form-entry/form-renderer/form-renderer.component.html
@@ -502,7 +502,7 @@
 >
   <!--ARRAY CONTROL-->
   <div [ngSwitch]="node.question.renderingType">
-    <div class="well" style="padding: 2px" *ngSwitchCase="'repeating'">
+    <div class="well" *ngSwitchCase="'repeating'">
       <h4 style="margin: 2px; font-weight: bold">
         {{ node.question.label | translate }}
       </h4>
@@ -519,15 +519,7 @@ <h4 style="margin: 2px; font-weight: bold">
           >max: {{ node.question.extras.questionOptions.max }}</label
         >
       </div>
-      <hr
-        style="
-          margin-left: -2px;
-          margin-right: -2px;
-          margin-bottom: 4px;
-          margin-top: 8px;
-          border-width: 2px;
-        "
-      />
+      <hr class="divider" />
       <div [ngSwitch]="node.question.extras.type">
         <div *ngSwitchCase="'testOrder'">
           <div *ngFor="let child of node.children; let i = index">
@@ -539,8 +531,11 @@ <h4 style="margin: 2px; font-weight: bold">
               [labelMap]="labelMap"
             >
             </ofe-form-renderer>
-
-            <div>{{ child.orderNumber }}</div>
+            <div *ngIf="child.orderNumber" class="order-number">
+              <span
+                >{{ 'orderNumber' | translate }}: {{ child.orderNumber }}
+              </span>
+            </div>
             <div class="cds--layout">
               <button
                 type="button "
@@ -551,15 +546,7 @@ <h4 style="margin: 2px; font-weight: bold">
               </button>
             </div>
             <br />
-            <hr
-              style="
-                margin-left: -2px;
-                margin-right: -2px;
-                margin-bottom: 4px;
-                margin-top: 8px;
-                border-width: 1px;
-              "
-            />
+            <hr class="divider" />
           </div>
         </div>
 
@@ -581,15 +568,7 @@ <h4 style="margin: 2px; font-weight: bold">
               {{ 'remove' | translate }}
             </button>
             <br />
-            <hr
-              style="
-                margin-left: -2px;
-                margin-right: -2px;
-                margin-bottom: 4px;
-                margin-top: 8px;
-                border-width: 1px;
-              "
-            />
+            <hr class="divider" />
           </div>
         </div>
 
@@ -613,15 +592,7 @@ <h4 style="margin: 2px; font-weight: bold">
               {{ 'remove' | translate }}
             </button>
             <br />
-            <hr
-              style="
-                margin-left: -2px;
-                margin-right: -2px;
-                margin-bottom: 4px;
-                margin-top: 8px;
-                border-width: 1px;
-              "
-            />
+            <hr class="divider" />
           </div>
         </div>
         <div *ngSwitchCase="'diagnosisGroup'" style="margin-bottom: 20px">
@@ -644,15 +615,7 @@ <h4 style="margin: 2px; font-weight: bold">
               {{ 'remove' | translate }}
             </button>
             <br />
-            <hr
-              style="
-                margin-left: -2px;
-                margin-right: -2px;
-                margin-bottom: 4px;
-                margin-top: 8px;
-                border-width: 1px;
-              "
-            />
+            <hr class="divider" />
           </div>
         </div>
       </div>

diff --git a/projects/ngx-formentry/src/form-entry/form-renderer/form-renderer.component.scss b/projects/ngx-formentry/src/form-entry/form-renderer/form-renderer.component.scss
@@ -238,3 +238,18 @@ ng-select.form-control {
     border-width: 1px 1px 0 0;
   }
 }
+
+.divider {
+  border-color: #e0e0e0;
+  border-style: solid;
+  border-bottom: none;
+  margin: 0.75rem 0rem;
+}
+
+.order-number {
+  margin: 1rem 0;
+}
+
+.well {
+  margin-bottom: 1rem;
+}
diff --git a/src/translations/en.json b/src/translations/en.json
@@ -40,6 +40,7 @@
   "nextMonth": "Next month",
   "nextYear": "Next year",
   "notFoundMsg": "Match not found",
+  "orderNumber": "Order number",
   "previous": "Previous",
   "previous21Years": "Previous 21 years",
   "previousMonth": "Previous month",

diff --git a/src/translations/fr.json b/src/translations/fr.json
@@ -40,6 +40,7 @@
   "nextMonth": "Mois suivant",
   "nextYear": "Année suivante",
   "notFoundMsg": "Match non trouvé",
+  "orderNumber": "Numéro de commande",
   "previous": "Précédent",
   "previous21Years": "21 dernières années",
   "previousMonth": "Mois précédent",

diff --git a/src/translations/km.json b/src/translations/km.json
@@ -48,6 +48,7 @@
   "nextMonth": "ខែក្រោយ",
   "nextYear": "ឆ្នាំក្រោយ",
   "notFoundMsg": "រកមិនឃើញផ្គូផ្គង",
+  "orderNumber": "លេខលំដាប់",
   "patientIdentifierDuplication": "ស្ទួនលេខកូដអត្តសញ្ញាណអ្នកជំងឺ",
   "patientIdentifierDuplicationDescription": "លេខកូដអត្តសញ្ញាណដែលបានបញ្ចូល សម្រាប់អ្នកជំងឺមានរួចហើយ។ សូមពិនិត្យមើលលេខកូដអត្តសញ្ញាណ ហើយព្យាយាមម្តងទៀត",
   "previous": "មុន",