LEFT & RIGHT segments tables

resources/views/app/practice-management/visit-templates/visit-template-segment-templates/create.blade.php

@@ -1,8 +1,8 @@
-<div id="createVisitTemplateSegmentTemplate" class="d-inline">
-	<div moe>
+<div id="createVisitTemplateSegmentTemplate{{@$position}}" class="d-inline">
+	<div moe relative>
 		<a class="" href="" show start>+ Create</a>
-		<form url="/api/visitTemplateSegmentTemplate/create">
-			<div id="createVisitTemplateSegmentTemplateComponent" v-cloak>
+		<form url="/api/visitTemplateSegmentTemplate/create" right>
+			<div id="createVisitTemplateSegmentTemplate{{@$position}}Component{{@$position}}" v-cloak>
 				<input type="hidden" name="visitTemplateUid" value="{{ $visitTemplate->uid }}" />
 				<div class="mb-2">
 					<label>Segment Template<sup class="text-danger">*</sup></label>
@@ -11,6 +11,9 @@
 						<option v-for="t in segmentTemplates" v-bind:value="t.uid">@{{ t.default_display_title }}</option>
 					</select>
 				</div>
+				@if(@$position)
+				<input type="hidden" name="leftOrRight" value="{{ $position }}">
+				@else
 				<div class="mb-2">
 					<label>Left or Right</label>
 					<select name="leftOrRight" class="form-control" required>
@@ -19,6 +22,7 @@
 						<option value="RIGHT">Right</option>
 					</select>
 				</div>
+				@endif
 				<div class="mb-2">
 					<label>Position Index<sup class="text-danger">*</sup></label>
 					<input type="number" name="positionIndex" class="form-control" required />
@@ -50,7 +54,7 @@
 	(function() {
 		function init() {
 			visitTemplateComponent = new Vue({
-				el: '#createVisitTemplateSegmentTemplateComponent',
+				el: '#createVisitTemplateSegmentTemplate{{@$position}}Component{{@$position}}',
 				data: {
 					segmentTemplates:[]
 				},
@@ -83,6 +87,6 @@
 				}
 			});
 		}
-		addMCInitializer('createVisitTemplateSegmentTemplate', init);
+		addMCInitializer('createVisitTemplateSegmentTemplate{{@$position}}', init);
 	})();
 </script>

resources/views/app/practice-management/visit-templates/visit-template-segment-templates/index.blade.php

@@ -15,129 +15,92 @@
     <div class="card mb-3">
         <div class="card-header">
             <div class="d-flex align-items-center justify-content-between">
-            <strong>{{ $visitTemplate->title }}</strong>
-            <div>
-            @include('app.practice-management.visit-templates.update', ['template' => $visitTemplate ])
-            </div>
+                <strong>{{ $visitTemplate->title }}</strong>
+                <div>
+                    @include('app.practice-management.visit-templates.update', ['template' => $visitTemplate ])
+                </div>
             </div>
         </div>
         <div class="card-body">
-                <div class="d-flex align-items-start">
-                    <span class="mr-3"><b>Internal Name:</b> {{ $visitTemplate->internal_name }}</span>
-                    <span class="mr-3"><b>Title:</b> {{ $visitTemplate->title }}</span>
-                    <span class="mr-3"><b>Created At:</b> {{ friendly_date_time($visitTemplate->created_at) }}</span>
-                    <span class="mr-3">
-                        <b>Status:</b> 
+            <div class="d-flex align-items-start">
+                <span class="mr-3"><b>Internal Name:</b> {{ $visitTemplate->internal_name }}</span>
+                <span class="mr-3"><b>Title:</b> {{ $visitTemplate->title }}</span>
+                <span class="mr-3"><b>Created At:</b> {{ friendly_date_time($visitTemplate->created_at) }}</span>
+                <span class="mr-3">
+                    <b>Status:</b>
                     @if($visitTemplate->is_active)
-                        <span class="text-success mr-2">ACTIVE</span>
+                    <span class="text-success mr-2">ACTIVE</span>
                     @else
-                        <span class="text-danger mr-2">INACTIVE</span>
+                    <span class="text-danger mr-2">INACTIVE</span>
                     @endif
                     @include('app.practice-management.visit-templates.activate-deactivate', ['template' => $visitTemplate, 'leftPosition' => true ])
-                    </span>
+                </span>
 
-                    <div class="mr-3 d-flex align-items-start">
+                <div class="mr-3 d-flex align-items-start">
                     @if($visitTemplate->is_active)
-                        @if($visitTemplate->reactivation_memo)
-                            <span class="mr-3"><b>Reactivation Memo:</b></span>
-                            <div style="width:300px;">
-                                <small class="text-muted"><b>Memo: </b>{{ $visitTemplate->reactivation_memo }}</small>
-                                @include('app.practice-management.visit-templates.update-memo', ['template' => $visitTemplate ])
-                            </div>
-                        @endif
-                    @else
-                        @if($visitTemplate->deactivation_memo)
-                            <span class="mr-3"><b>Deactivation Memo:</b></span>
-                            <div style="width:300px;">
-                                <small class="text-muted"><b>Memo: </b>{{ $visitTemplate->deactivation_memo }}</small>
-                                @include('app.practice-management.visit-templates.update-memo', ['template' => $visitTemplate ])
-                            </div>
-                        @endif
+                    @if($visitTemplate->reactivation_memo)
+                    <span class="mr-3"><b>Reactivation Memo:</b></span>
+                    <div style="width:300px;">
+                        <small class="text-muted"><b>Memo: </b>{{ $visitTemplate->reactivation_memo }}</small>
+                        @include('app.practice-management.visit-templates.update-memo', ['template' => $visitTemplate ])
+                    </div>
                     @endif
+                    @else
+                    @if($visitTemplate->deactivation_memo)
+                    <span class="mr-3"><b>Deactivation Memo:</b></span>
+                    <div style="width:300px;">
+                        <small class="text-muted"><b>Memo: </b>{{ $visitTemplate->deactivation_memo }}</small>
+                        @include('app.practice-management.visit-templates.update-memo', ['template' => $visitTemplate ])
                     </div>
+                    @endif
+                    @endif
                 </div>
+            </div>
         </div>
     </div>
-    <div class="card">
-
+    <div class="card mb-2">
         <div class="card-header border-bottom-0 px-1 py-2 d-flex align-items-center">
             <strong class="mr-4">
                 <i class="fas fa-notes-medical"></i>
                 Visit Template Segment Templates
             </strong>
-            @include('app.practice-management.visit-templates.visit-template-segment-templates.create')
         </div>
+    </div>
 
-        <div class="card-body p-0">
-            <table class="table table-sm table-striped border-top p-0 m-0">
-                <thead class="bg-light">
-                    <tr>
-                        <th class="border-0">Display title</th>
-                        <th class="border-0">Heading</th>
-                        <th class="border-0">Sub-heading</th>
-                        <th class="border-0">Left or Right</th>
-                        <th class="border-0">Position Index</th>
-                        <th class="border-0">Segment Template</th>
-                        <th class="border-0">Created At</th>
-                        <th class="border-0">Status</th>
-                        <th class="border-0">&nbsp;</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    @foreach($visitTemplateSegmentTemplates as $template)
-                    <tr>
-                        <td>{{ $template->display_title }}</td>
-                        <td>{{ $template->heading }}</td>
-                        <td>{{ $template->subheading }}</td>
-                        <td>{{ $template->left_or_right }}</td>
-                        <td>{{ $template->position_index }}</td>
-                        <td>{{ $template->segmentTemplate ? $template->segmentTemplate->default_display_title : '---' }}</td>
-                        <td>{{ friendly_date_time($template->created_at) }}</td>
-                        <td>
-                            <div>
-                                @if($template->is_active)
-                                    <span class="text-success">ACTIVE</span>
-                                    @if($template->reactivation_memo)
-                                        <div style="width:300px;">
-                                            <small class="text-muted"><b>Memo: </b>{{ $template->reactivation_memo }}</small>
-                                            @include('app.practice-management.visit-templates.visit-template-segment-templates.update-memo')
-                                        </div>
-                                    @endif
-                                @else
-                                    <span class="text-danger">INACTIVE</span>
-                                    @if($template->deactivation_memo)
-                                        <div style="width:300px;">
-                                            <small class="text-muted"><b>Memo: </b>{{ $template->deactivation_memo }}</small>
-                                            @include('app.practice-management.visit-templates.visit-template-segment-templates.update-memo')
-                                        </div>
-                                    @endif
-                                @endif
-                            </div>
-                        </td>
-                        <td>
-                            <div class="d-flex align-items-center">
-                                <div class="mr-2">
-                                @include('app.practice-management.visit-templates.visit-template-segment-templates.update')
-                                </div>
-                                <div>
-                                @include('app.practice-management.visit-templates.visit-template-segment-templates.activate-deactivate')
-                                </div>
-                            </div>
-                        </td>                
-                    </tr>
-                    @endforeach
-
-                    @if(count($visitTemplateSegmentTemplates) === 0)
-                    <tr>
-                        <td colspan="8">No records found!</td>
-                    </tr>
-                    @endif
-                </tbody>
-
-            </table>
+    <div class="row">
+        <div class="col-md-6">
+            <div class="card">
+                <div class="card-header border-bottom-0 px-1 py-2 d-flex align-items-center">
+                    <div class="d-flex align-items-center justify-content-between w-100">
+                        <strong>Left Position</strong>
+                        @include('app.practice-management.visit-templates.visit-template-segment-templates.create', ['position' => 'LEFT'])
+                    </div>
 
+                </div>
+                <div class="card-body p-0">
+                    <div class="table-responsive">
+                        @include('app.practice-management.visit-templates.visit-template-segment-templates.segment-templates-list', ['position' => 'LEFT'])
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="col-md-6">
+            <div class="card">
+                <div class="card-header border-bottom-0 px-1 py-2 d-flex align-items-center">
+                    <div class="d-flex align-items-center justify-content-between w-100">
+                        <strong>Left Position</strong>
+                        @include('app.practice-management.visit-templates.visit-template-segment-templates.create', ['position' => 'RIGHT'])
+                    </div>
+                </div>
+                <div class="card-body p-0">
+                    <div class="table-responsive">
+                        @include('app.practice-management.visit-templates.visit-template-segment-templates.segment-templates-list', ['position' => 'RIGHT'])
+                    </div>
+                </div>
+            </div>
         </div>
     </div>
+
     <div class="mt-3">
         {{ $visitTemplateSegmentTemplates->appends(request()->input())->links() }}
     </div>

resources/views/app/practice-management/visit-templates/visit-template-segment-templates/segment-templates-list.blade.php

@@ -0,0 +1,67 @@
+<table class="table table-sm table-striped border-top p-0 m-0">
+	<thead class="bg-light">
+		<tr>
+			<th class="border-0">Display title</th>
+			<th class="border-0">Heading</th>
+			<th class="border-0">Sub-heading</th>
+			<th class="border-0">Position Index</th>
+			<th class="border-0">Segment Template</th>
+			<th class="border-0">Created At</th>
+			<th class="border-0">Status</th>
+			<th class="border-0">&nbsp;</th>
+		</tr>
+	</thead>
+	<tbody>
+		<?php $rowsCount = 0; ?>
+		@foreach($visitTemplateSegmentTemplates as $template)
+			@if(@$position === $template->left_or_right)
+				<?php $rowsCount++; ?>
+				<tr>
+					<td>{{ $template->display_title }}</td>
+					<td>{{ $template->heading }}</td>
+					<td>{{ $template->subheading }}</td>
+					<td>{{ $template->position_index }}</td>
+					<td>{{ $template->segmentTemplate ? $template->segmentTemplate->default_display_title : '---' }}</td>
+					<td>{{ friendly_date_time($template->created_at) }}</td>
+					<td>
+						<div>
+							@if($template->is_active)
+							<span class="text-success">ACTIVE</span>
+							@if($template->reactivation_memo)
+							<div style="width:300px;">
+								<small class="text-muted"><b>Memo: </b>{{ $template->reactivation_memo }}</small>
+								@include('app.practice-management.visit-templates.visit-template-segment-templates.update-memo')
+							</div>
+							@endif
+							@else
+							<span class="text-danger">INACTIVE</span>
+							@if($template->deactivation_memo)
+							<div style="width:300px;">
+								<small class="text-muted"><b>Memo: </b>{{ $template->deactivation_memo }}</small>
+								@include('app.practice-management.visit-templates.visit-template-segment-templates.update-memo')
+							</div>
+							@endif
+							@endif
+						</div>
+					</td>
+					<td>
+						<div class="d-flex align-items-center">
+							<div class="mr-2">
+								@include('app.practice-management.visit-templates.visit-template-segment-templates.update', ['position' => @$position])
+							</div>
+							<div>
+								@include('app.practice-management.visit-templates.visit-template-segment-templates.activate-deactivate')
+							</div>
+						</div>
+					</td>
+				</tr>
+			@endif
+		@endforeach
+		@if(!$rowsCount)
+		<tr>
+			<td colspan="8">No records found!</td>
+		</tr>
+		@endif
+	</tbody>
+
+</table>

resources/views/app/practice-management/visit-templates/visit-template-segment-templates/update.blade.php

@@ -1,8 +1,11 @@
-<div moe>
+<div moe relative>
 	<a class="" href="" show start><i class="far fa-edit"></i></a>
 	<form url="/api/visitTemplateSegmentTemplate/updateBasic" right>
 		<div>
 			<input type="hidden" name="uid" value="{{ $template->uid }}" />
+			@if(@$position)
+			<input type="hidden" name="leftOrRight" value="{{ $position }}">
+			@else
 			<div class="mb-2">
 				<label>Left or Right</label>
 				<select name="leftOrRight" class="form-control" required>
@@ -11,6 +14,7 @@
 					<option {{$template->left_or_right == 'RIGHT' ? 'selected': ''}} value="RIGHT">Right</option>
 				</select>
 			</div>
+			@endif
 			<div class="mb-2">
 				<label>Position Index<sup class="text-danger">*</sup></label>
 				<input type="number" name="positionIndex" class="form-control" value="{{ $template->position_index }}" required />