1  @extends('livewire.jsons.view-layout')
 2  @section('json-view')
 3  
 4  <div class="flex flex-row items-start justify-between space-x-8">
 5      <div class="flex flex-col w-2/6 space-y-8">
 6          @include('json-bodies.partials.information', ['information' => $data['information']])
 7      </div>
 8  
 9      <div class="flex flex-col w-4/6 space-y-8" x-data="{ tab: 1 }">
10          <x-card>
11              <ul class="flex text-center border-b border-gray-200">
12                  <li class="flex-1 cursor-pointer">
13                      <a x-on:click.prevent="tab=1" :class="tab == 1 ?
14                          'relative block p-4 text-sm font-medium bg-white border-t border-l border-r border-gray-200 rounded-tl ' :
15                          'block p-4 text-sm font-medium text-gray-500 bg-gray-100 ring-1 ring-inset ring-white'">
16                          <span :class="{ 'absolute inset-x-0 w-full h-px bg-white -bottom-px': tab == 1 }"></span>
17                          {{ __('jsons.panel.form.evidences.list') }}
18                      </a>
19                  </li>
20                  <li class="flex-1 cursor-pointer">
21                      <a x-on:click.prevent="tab=2" :class="tab == 2 ?
22                          'relative block p-4 text-sm font-medium bg-white border-t border-l border-r border-gray-200 rounded-tl ' :
23                          'block p-4 text-sm font-medium text-gray-500 bg-gray-100 ring-1 ring-inset ring-white'">
24                          <span :class="{ 'absolute inset-x-0 w-full h-px bg-white -bottom-px': tab == 2 }"></span>
25                          {{ __('jsons.panel.form.changelogs.list') }}
26                      </a>
27                  </li>
28                  <li class="flex-1 pl-px cursor-pointer">
29                      <a x-on:click.prevent="tab=3" :class="tab == 3 ?
30                          'relative block p-4 text-sm font-medium bg-white border-t border-l border-r border-gray-200 rounded-tl ' :
31                          'block p-4 text-sm font-medium text-gray-500 bg-gray-100 ring-1 ring-inset ring-white'">
32                          <span :class="{ 'absolute inset-x-0 w-full h-px bg-white -bottom-px': tab == 3 }"></span>
33                          {{ __('jsons.panel.form.non-conformities.list') }}
34                      </a>
35                  </li>
36                  <li class="flex-1 pl-px cursor-pointer">
37                      <a x-on:click.prevent="tab=4" :class="tab == 4 ?
38                          'relative block p-4 text-sm font-medium bg-white border-t border-l border-r border-gray-200 rounded-tl ' :
39                          'block p-4 text-sm font-medium text-gray-500 bg-gray-100 ring-1 ring-inset ring-white'">
40                          <span :class="{ 'absolute inset-x-0 w-full h-px bg-white -bottom-px': tab == 4 }"></span>
41                          {{ __('jsons.panel.form.comments.list') }}
42                      </a>
43                  </li>
44              </ul>
45  
46              <div x-show="tab === 1" x-cloak class="flex flex-col mt-8 space-y-4">
47                  <div class="diffTdNewWayEvidence">
48                      @php
49                          if($this->isDiffing)
50                              $evidenceListAux = $this->diffedEvidenceList();
51                      @endphp
52  
53                      @if($this->isDiffing)
54                          @foreach ($evidenceListAux as $evidence)
55                              {!! $evidence !!}
56                          @endforeach
57                      @else
58                          @foreach ($this->evidencesList as $evidence)
59                              <x-badge flat secondary label="{{$evidence}}" />
60                          @endforeach
61                      @endif
62                  </div>
63              </div>
64  
65              <div x-show="tab === 2" x-cloak class="flex flex-col mt-8 space-y-4">
66                  <div class="flex flex-col space-y-4">
67                      @include('json-bodies.partials.changelogs', ['changelogs' => $this->changelogs])
68                  </div>
69              </div>
70  
71              <div x-show="tab === 3" x-cloak class="flex flex-col mt-8 space-y-4">
72                  <div class="flex flex-col space-y-4">
73                      @include('json-bodies.partials.or-data', [
74                          'orData' => $this->isDiffing ? 
75                                      $this->diffedNonConformities() : $this->nonConformities
76                      ])
77                  </div>
78              </div>
79  
80              <div x-show="tab === 4" x-cloak class="flex flex-col mt-8 space-y-4">
81                  <div class="flex flex-col space-y-4">
82                      @include('json-bodies.partials.or-data', [
83                          'orData'=> $this->isDiffing ? 
84                                      $this->diffedComments() : $this->comments
85                      ])
86                  </div>
87              </div>
88          </x-card>
89      </div>
90  </div>
91  @endsection