Vitals - BMI based weight category indicator

public/css/style.css

@@ -38,6 +38,9 @@
 .w-70 {
   width: var(--w-70);
 }
+.text-warning-mellow {
+    color: #d8a714!important;
+}
 .stag-primary-bg {
   background-color: var(--primary-color) !important;
   color: #fff;

resources/views/app/patient/canvas-sections/vitals/form.blade.php

@@ -91,6 +91,12 @@ $formID = rand(0, 100000);
                 <input type="text" :data-index="index" v-if="index === 'bmi'" readonly
                        class="form-control form-control-sm vitals-title"
                        data-field="value" v-model="bmi">
+                <p class="py-1 m-0 px-2 font-weight-bold bg-white" v-if="index === 'bmi' && !!bmi">
+                    <span class="text-sm text-warning-mellow" v-if="+bmi < 18.5">Underweight</span>
+                    <span class="text-sm text-success" v-if="+bmi >= 18.5 && +bmi < 25">Healthy Weight</span>
+                    <span class="text-sm text-warning-mellow" v-if="+bmi >= 25 && +bmi < 30">Overweight</span>
+                    <span class="text-sm text-warning-mellow" v-if="+bmi >= 30">Obese</span>
+                </p>
             </td>
             <td>
                 <input type="date" :data-index="index" :readonly="index === 'bmi'"