Bladeren bron

PMHx - inline display of item comments

Vijayakrishnan 4 jaren geleden
bovenliggende
commit
d3504c48f5
1 gewijzigde bestanden met toevoegingen van 42 en 26 verwijderingen
  1. 42 26
      resources/views/app/patient/canvas-sections/pmhx/form.blade.php

+ 42 - 26
resources/views/app/patient/canvas-sections/pmhx/form.blade.php

@@ -74,24 +74,32 @@ $formID = rand(0, 100000);
                     <div class="mb-3">
                         @for($k = 0; $k < count($values); $k++)
                             <?php $fName = $head . '_' . sanitize_field_name($values[$k]); ?>
-                            <label class="d-flex align-items-center mb-1">
+                            <label class="d-flex align-items-start mb-1">
                                 <input type="checkbox" name="{{ $fName }}" class="m-0"
                                        v-model="common['{{$fName}}']">
-                                <span class="mx-2">{{ $values[$k] }}</span>
-                                <div moe no-mask>
-                                    <a href="#" start show>
-                                        <i v-show="common['{{$fName}}']" class="fa-comment" :class="common['{{$fName}}__comments'] ? 'fas' : 'far'"></i>
-                                    </a>
-                                    <div url="/nop">
-                                        <div class="mb-2">
-                                            <textarea class="form-control form-control-sm ns-custom-comment min-width-200px"
-                                                      v-model="common['{{$fName}}__comments']"></textarea>
-                                        </div>
-                                        <div class="">
-                                            <button type="button" class="btn btn-sm btn-primary" cancel>Close
-                                            </button>
+                                <div class="ml-2">
+                                    <div>
+                                        <span class="mr-2">{{ $values[$k] }}</span>
+                                        <div moe no-mask>
+                                            <a href="#" start show>
+                                                <i v-show="common['{{$fName}}']" class="fa-comment" :class="common['{{$fName}}__comments'] ? 'fas' : 'far'"></i>
+                                            </a>
+                                            <div url="/nop">
+                                                <div class="mb-2">
+                                                    <textarea class="form-control form-control-sm ns-custom-comment min-width-200px"
+                                                              v-model="common['{{$fName}}__comments']"></textarea>
+                                                </div>
+                                                <div class="">
+                                                    <button type="button" class="btn btn-sm btn-primary" cancel>Close
+                                                    </button>
+                                                </div>
+                                            </div>
                                         </div>
                                     </div>
+                                    <span v-show="common['{{$fName}}'] && common['{{$fName}}__comments']"
+                                          v-html="common['{{$fName}}__comments']"
+                                          class="text-sm text-secondary">
+                                    </span>
                                 </div>
                             </label>
                         @endfor
@@ -127,22 +135,30 @@ $formID = rand(0, 100000);
             {{-- custom items --}}
             <div class="d-flex align-items-start flex-wrap custom-items-container">
                 <div class="w-25" v-for="item in customFields">
-                    <label class="d-flex align-items-center mb-1">
+                    <label class="d-flex align-items-start mb-1">
                         <input type="checkbox" class="m-0"
                                v-model="item.value">
-                        <span class="mx-2">@{{ item.label }}</span>
-                        <div moe no-mask>
-                            <a href="#" start show>
-                                <i v-show="item.value" class="fa-comment" :class="item.comments ? 'fas' : 'far'"></i>
-                            </a>
-                            <div url="/nop">
-                                <div class="mb-2">
-                                    <textarea class="form-control form-control-sm ns-custom-comment min-width-200px" v-model="item.comments"></textarea>
-                                </div>
-                                <div class="">
-                                    <button type="button" class="btn btn-sm btn-primary" cancel>Close</button>
+                        <div class="ml-2">
+                            <div>
+                                <span class="mr-2">@{{ item.label }}</span>
+                                <div moe no-mask>
+                                    <a href="#" start show>
+                                        <i v-show="item.value" class="fa-comment" :class="item.comments ? 'fas' : 'far'"></i>
+                                    </a>
+                                    <div url="/nop">
+                                        <div class="mb-2">
+                                            <textarea class="form-control form-control-sm ns-custom-comment min-width-200px" v-model="item.comments"></textarea>
+                                        </div>
+                                        <div class="">
+                                            <button type="button" class="btn btn-sm btn-primary" cancel>Close</button>
+                                        </div>
+                                    </div>
                                 </div>
                             </div>
+                            <span v-show="item.value && item.comments"
+                                  v-html="item.comments"
+                                  class="text-sm text-secondary">
+                            </span>
                         </div>
                     </label>
                 </div>