Jelajahi Sumber

Availability styling [wip #2]

Vijayakrishnan 4 tahun lalu
induk
melakukan
214fb858d2

+ 71 - 53
resources/views/app/practice-management/pro-availability.blade.php

@@ -94,68 +94,86 @@
                 <table class="table table-sm table-striped m-0">
                     <thead>
                         <tr>
-                            <th class="pl-3">Day</th>
-                            <th col-span="3"></th>
+                            <th class="pl-3 w-25">Day</th>
+                            <th class="w-75" col-span="3">
+                                <table class="table table-sm m-0">
+                                    <thead>
+                                    <tr>
+                                        <th class="w-25 pb-0 border-0">Start</th>
+                                        <th class="w-25 pb-0 border-0 pl-2">End</th>
+                                        <th class="pb-0 border-0"></th>
+                                    </tr>
+                                    </thead>
+                                </table>
+                            </th>
                         </tr>
                     </thead>
                     <tbody>
                         @foreach($daysOfWeek as $dow)
                         <tr>
-                            <td class="pl-3">{{$dow}}</td>
+                            <td class="pl-3 align-middle">{{$dow}}</td>
                             <td>
-                                <table class="table table-sm table-striped">
-                                    @foreach($generalAvailabilities[$dow] as $ga)
-                                    <tr>
-                                        <td>{{$ga->start_time}}</td>
-                                        <td>{{$ga->end_time}}</td>
-                                        <td>
-                                            @if(isset($generalAvailabilities[$dow]))
-                                            <div moe wide class="mr-2">
-                                                <a start show>
-                                                    update
-                                                </a>
-                                                <form url="/api/proGeneralAvailability/update">
-                                                    <input type="hidden" name="uid" value="{{$ga->uid}}">
-                                                    <input type="hidden" name="timezone" value="EASTERN">
-                                                    <div class="form-group">
-                                                        {{$ga->day_of_week}}
-                                                    </div>
-                                                    <div class="form-group">
-                                                        <label for="" class="control-label">Start Time </label>
-                                                        <input class="form-control" type="time" name="startTime" value="{{military_time($ga->start_time)}}">
-                                                    </div>
-                                                    <div class="form-group">
-                                                        <label for="" class="control-label">End Time </label>
-                                                        <input class="form-control" type="time" name="endTime" value="{{military_time($ga->end_time)}}">
-                                                    </div>
-                                                    <div class="form-group m-0">
-                                                        <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
-                                                        <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
-                                                    </div>
-                                                </form>
-                                            </div>
-                                            <span class="text text-secondary">|</span>
-                                            @endif
-                                            <div moe wide class="mr-2">
-                                                <a start show>
-                                                    cancel
-                                                </a>
-                                                <form url="/api/proGeneralAvailability/cancel">
-                                                    <input type="hidden" name="uid" value="{{$ga->uid}}">
+                                <table class="table table-sm m-0">
+                                    @if(count($generalAvailabilities[$dow]))
+                                        @foreach($generalAvailabilities[$dow] as $ga)
+                                            <tr class="bg-transparent">
+                                                <td class="border-0">{{$ga->start_time}}</td>
+                                                <td class="border-0">{{$ga->end_time}}</td>
+                                                <td class="border-0">
+                                                    @if(isset($generalAvailabilities[$dow]))
+                                                        <div moe wide class="mr-2">
+                                                            <a start show>
+                                                                update
+                                                            </a>
+                                                            <form url="/api/proGeneralAvailability/update">
+                                                                <input type="hidden" name="uid" value="{{$ga->uid}}">
+                                                                <input type="hidden" name="timezone" value="EASTERN">
+                                                                <div class="form-group">
+                                                                    {{$ga->day_of_week}}
+                                                                </div>
+                                                                <div class="form-group">
+                                                                    <label for="" class="control-label">Start Time </label>
+                                                                    <input class="form-control" type="time" name="startTime" value="{{military_time($ga->start_time)}}">
+                                                                </div>
+                                                                <div class="form-group">
+                                                                    <label for="" class="control-label">End Time </label>
+                                                                    <input class="form-control" type="time" name="endTime" value="{{military_time($ga->end_time)}}">
+                                                                </div>
+                                                                <div class="form-group m-0">
+                                                                    <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
+                                                                    <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
+                                                                </div>
+                                                            </form>
+                                                        </div>
+                                                        <span class="text text-secondary">|</span>
+                                                    @endif
+                                                    <div moe wide class="mr-2">
+                                                        <a start show>
+                                                            cancel
+                                                        </a>
+                                                        <form url="/api/proGeneralAvailability/cancel">
+                                                            <input type="hidden" name="uid" value="{{$ga->uid}}">
 
-                                                    <div class="form-group">
-                                                        Cancel record?
-                                                    </div>
+                                                            <div class="form-group">
+                                                                Cancel record?
+                                                            </div>
 
-                                                    <div class="form-group m-0">
-                                                        <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
-                                                        <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
+                                                            <div class="form-group m-0">
+                                                                <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
+                                                                <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
+                                                            </div>
+                                                        </form>
                                                     </div>
-                                                </form>
-                                            </div>
-                                        </td>
-                                    </tr>
-                                    @endforeach
+                                                </td>
+                                            </tr>
+                                        @endforeach
+                                    @else
+                                        <tbody>
+                                        <tr class="bg-transparent">
+                                            <td class="text-secondary font-italic bg-transparent border-0">None specified</td>
+                                        </tr>
+                                        </tbody>
+                                    @endif
                                 </table>
                             </td>
                         </tr>