SmartCane/laravel_app/resources/views/components/project-manager-properties-modal.blade.php

119 lines
6 KiB
PHP

@props([
'formData',
/** @var \App\Livewire\Projects\ProjectManager */
'projectManager'
])
<x-modal wire:model.live="showProjectModal" {{ $attributes }}>
<x-form-modal submit="saveProject">
<x-slot name="title">
{{ __('Project') }}
</x-slot>
<x-slot name="description">
{{ __('Report generator for generating reports') }}
</x-slot>
<x-slot name="form">
<!-- Token Name -->
<div class="col-span-6 sm:col-span-4">
<x-label for="name" value="{{ __('Name') }}"/>
<x-input id="name" type="text" class="mt-1 block w-full" wire:model="formData.name" autofocus/>
<x-input-error for="name" class="mt-2"/>
</div>
<div class="col-span-6 sm:col-span-4">
<label for="pivot_json_path">Pivot geojson File</label>
<input type="file" id="pivot_json_path" wire:model="formData.pivot_json_path">
<x-input-error for="pivot_json_path" class="mt-2"/>
<label>{{ $projectManager->pivot_json_path }}</label>
</div>
<div class="col-span-6 sm:col-span-4">
<label for="span_json_path">Span geojson File</label>
<input type="file" id="span_json_path" wire:model="formData.span_json_path">
<x-input-error for="span_json_path" class="mt-2"/>
<label>{{ $projectManager->span_json_path }}</label>
</div>
@foreach($projectManager->formData['boundingBoxes'] as $key => $boundingBox)
{{-- <div wire:key="bounding_box_{{ $key }}">--}}
<div class="col-span-6 sm:col-span-4">
{{ __('Bounding box') }}
@if( count($projectManager->formData['boundingBoxes']) > 1)
<button
class="cursor-pointer ml-6 text-sm text-red-500"
type="button"
wire:click="deleteBoundingBox({{ $key }})"
wire:confirm="{{ __('Are you sure you want to delete this BoundingBox?') }}"
>
Delete
</button>
@endif
</div>
<div class="col-span-6 sm:col-span-4">
<x-label for="bounding_box_{{ $key }}_name" value="{{ __('Name') }}"/>
<x-input id="bounding_box_{{ $key }}_name" type="text" class="mt-1 block w-full"
wire:model="formData.boundingBoxes.{{ $key }}.name" autofocus/>
<x-input-error for="boundingBoxes.{{ $key }}.name" class="mt-2"/>
</div>
<div class="col-span-6 grid grid-cols-6 gap-1">
<div class="col-span-3">
<x-label for="bounding_box_{{ $key }}_top_left_latitude"
value="{{ __('Top left Latitude') }}"/>
<x-input id="bounding_box_{{ $key }}_top_left_latitude" type="text"
class="block w-full"
wire:model="formData.boundingBoxes.{{ $key }}.top_left_latitude"
autofocus/>
<x-input-error for="boundingBoxes.{{ $key }}.top_left_latitude" class="mt-2"/>
</div>
<div class="col-span-3">
<x-label for="bounding_box_{{ $key }}_top_left_longitude" value="{{ __('Longitude') }}"/>
<x-input id="name" type="text" class="block w-full"
wire:model="formData.boundingBoxes.{{ $key }}.top_left_longitude"
autofocus/>
<x-input-error for="boundingBoxes.{{ $key }}.top_left_longitude" class="mt-2"/>
</div>
<div class="col-span-3">
<x-label for="bounding_box_{{ $key }}_bottom_right_latitude"
value="{{ __('Bottom right Latitude') }}"/>
<x-input id="bounding_box_{{ $key }}_bottom_right_latitude" type="text"
class="block w-full"
wire:model="formData.boundingBoxes.{{ $key }}.bottom_right_latitude"
autofocus/>
<x-input-error for="boundingBoxes.{{ $key }}.bottom_right_latitude" class="mt-2"/>
</div>
<div class="col-span-3">
<x-label for="boundingBox_{{ $key }}_bottom_right_longitude" value="{{ __('Longitude') }}"/>
<x-input id="boundingBox_{{ $key }}_bottom_right_longitude" type="text"
class="block w-full"
wire:model="formData.boundingBoxes.{{ $key }}.bottom_right_longitude"
autofocus/>
<x-input-error for="boundingBoxes.{{ $key }}.bottom_right_longitude" class="mt-2"/>
</div>
</div>
{{-- </div>--}}
@endforeach
</x-slot>
<x-slot name="actions">
<x-action-message class="mr-3" on="saved">
{{ __('Saved.') }}
</x-action-message>
<x-secondary-button class="mr-3"
type="button"
wire:click="addBoundingBox"
>
{{ __('Add Bounding box') }}
</x-secondary-button>
<x-secondary-button class="mr-3"
type="button"
x-on:click="$wire.showProjectModal = false"
>
{{ __('Cancel') }}
</x-secondary-button>
<x-button>
{{ __('Save') }}
</x-button>
</x-slot>
</x-form-modal>
</x-modal>