drag and drop
This commit is contained in:
parent
59155d1ad5
commit
54367dc8d4
|
|
@ -19,6 +19,11 @@ public function run(): void
|
|||
'email' => 'martin@sobit.nl',
|
||||
'password' => '$2y$10$hZZaAaiv1KXmCqq5vZ6PEeRWzvwGbaHKcfqeEMlTn.y22EEPVtofi',
|
||||
]);
|
||||
\App\Models\User::factory()->create([
|
||||
'name' => 'Guillaume Marteau',
|
||||
'email' => 'guillaume@sobit.nl',
|
||||
'password' => '$2y$10$Y8RSnCdZp1ye/Qp6k6NGzOGcyO5VzxKUilFG6cczzTZ3d3cJp7iYC',
|
||||
]);
|
||||
|
||||
$this->createChembaProject();
|
||||
$this->createXinavaneProject();
|
||||
|
|
|
|||
10
laravel_app/package-lock.json
generated
10
laravel_app/package-lock.json
generated
|
|
@ -9,6 +9,7 @@
|
|||
"@alpinejs/focus": "^3.13.3",
|
||||
"@alpinejs/intersect": "^3.13.3",
|
||||
"@alpinejs/ui": "^3.13.3-beta.4",
|
||||
"@fortawesome/fontawesome-free": "^6.5.2",
|
||||
"@ryangjchandler/alpine-clipboard": "^2.3.0",
|
||||
"@tailwindcss/aspect-ratio": "^0.4.2",
|
||||
"alpinejs": "^3.13.3",
|
||||
|
|
@ -413,6 +414,15 @@
|
|||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/@fortawesome/fontawesome-free": {
|
||||
"version": "6.5.2",
|
||||
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.5.2.tgz",
|
||||
"integrity": "sha512-hRILoInAx8GNT5IMkrtIt9blOdrqHOnPBH+k70aWUAqPZPgopb9G5EQJFpaBx/S8zp2fC+mPW349Bziuk1o28Q==",
|
||||
"hasInstallScript": true,
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/@jridgewell/gen-mapping": {
|
||||
"version": "0.3.3",
|
||||
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@
|
|||
"@alpinejs/focus": "^3.13.3",
|
||||
"@alpinejs/intersect": "^3.13.3",
|
||||
"@alpinejs/ui": "^3.13.3-beta.4",
|
||||
"@fortawesome/fontawesome-free": "^6.5.2",
|
||||
"@ryangjchandler/alpine-clipboard": "^2.3.0",
|
||||
"@tailwindcss/aspect-ratio": "^0.4.2",
|
||||
"alpinejs": "^3.13.3",
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,11 +1,43 @@
|
|||
{
|
||||
"node_modules/@fortawesome/fontawesome-free/webfonts/fa-brands-400.ttf": {
|
||||
"file": "assets/fa-brands-400-e28096fa.ttf",
|
||||
"src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-brands-400.ttf"
|
||||
},
|
||||
"node_modules/@fortawesome/fontawesome-free/webfonts/fa-brands-400.woff2": {
|
||||
"file": "assets/fa-brands-400-232c6f6a.woff2",
|
||||
"src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-brands-400.woff2"
|
||||
},
|
||||
"node_modules/@fortawesome/fontawesome-free/webfonts/fa-regular-400.ttf": {
|
||||
"file": "assets/fa-regular-400-9174757e.ttf",
|
||||
"src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-regular-400.ttf"
|
||||
},
|
||||
"node_modules/@fortawesome/fontawesome-free/webfonts/fa-regular-400.woff2": {
|
||||
"file": "assets/fa-regular-400-c27da6f8.woff2",
|
||||
"src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-regular-400.woff2"
|
||||
},
|
||||
"node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.ttf": {
|
||||
"file": "assets/fa-solid-900-b4990d0d.ttf",
|
||||
"src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.ttf"
|
||||
},
|
||||
"node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.woff2": {
|
||||
"file": "assets/fa-solid-900-ae17c16a.woff2",
|
||||
"src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.woff2"
|
||||
},
|
||||
"node_modules/@fortawesome/fontawesome-free/webfonts/fa-v4compatibility.ttf": {
|
||||
"file": "assets/fa-v4compatibility-ff8f525f.ttf",
|
||||
"src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-v4compatibility.ttf"
|
||||
},
|
||||
"node_modules/@fortawesome/fontawesome-free/webfonts/fa-v4compatibility.woff2": {
|
||||
"file": "assets/fa-v4compatibility-c7a869fa.woff2",
|
||||
"src": "node_modules/@fortawesome/fontawesome-free/webfonts/fa-v4compatibility.woff2"
|
||||
},
|
||||
"resources/css/app.css": {
|
||||
"file": "assets/app-f1962042.css",
|
||||
"file": "assets/app-0124dd11.css",
|
||||
"isEntry": true,
|
||||
"src": "resources/css/app.css"
|
||||
},
|
||||
"resources/js/alpine.js": {
|
||||
"file": "assets/alpine-306471eb.js",
|
||||
"file": "assets/alpine-d6afa966.js",
|
||||
"isDynamicEntry": true,
|
||||
"src": "resources/js/alpine.js"
|
||||
},
|
||||
|
|
@ -13,7 +45,7 @@
|
|||
"dynamicImports": [
|
||||
"resources/js/alpine.js"
|
||||
],
|
||||
"file": "assets/app-3941bdf3.js",
|
||||
"file": "assets/app-28a1138a.js",
|
||||
"isEntry": true,
|
||||
"src": "resources/js/app.js"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
@import 'flatpickr/dist/flatpickr.css';
|
||||
@import url('https://rsms.me/inter/inter.css');
|
||||
@import '@fortawesome/fontawesome-free/css/all.css';
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
@props(['submit'])
|
||||
|
||||
<div {{ $attributes->merge(['class' => 'md:grid md:grid-cols-1 md:gap-6']) }}>
|
||||
<div {{ $attributes->merge(['class' => '']) }}>
|
||||
<div class="mt-5 px-6">
|
||||
<h2>{{ $title }}</h2>
|
||||
|
||||
|
|
@ -10,7 +10,7 @@
|
|||
<div class="mt-5 md:mt-0 md:col-span-1">
|
||||
<form wire:submit="{{ $submit }}">
|
||||
<div class="px-4 py-5 bg-white sm:p-6 shadow {{ isset($actions) ? 'sm:rounded-tl-md sm:rounded-tr-md' : 'sm:rounded-md' }}">
|
||||
<div class="grid grid-cols-6 gap-6">
|
||||
<div class="flex flex-col">
|
||||
{{ $form }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ class="max-w-sm w-full bg-white shadow-lg rounded-lg pointer-events-auto"
|
|||
</svg>
|
||||
</template>
|
||||
<template x-if="message.type == 'error'">
|
||||
<div class="fraud-detection rounded-full bg-all-red text-white flex justify-center items-center"
|
||||
<div class="rounded-full bg-red-600 text-white flex justify-center items-center"
|
||||
style="width:30px;height:30px">
|
||||
<x-icon.exclamation style="transform: scale(1.5)"/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -16,22 +16,99 @@
|
|||
|
||||
<x-slot name="form">
|
||||
<!-- Token Name -->
|
||||
<div class="col-span-6 sm:col-span-4">
|
||||
<div class="mb-2">
|
||||
<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 class="flex flex-col mb-2">
|
||||
<label for="pivot_json_path"
|
||||
class="flex flex-col items-center justify-center border-2 border-dashed border-gray-300 w-full bg-gray-50 hover:bg-gray-100 hover:border-gray-300 hover:cursor-pointer p-4 rounded"
|
||||
x-data="{pivot_file:null}">
|
||||
<div class="flex flex-col items-center justify-center text-gray-500 text-sm">
|
||||
<span>
|
||||
<i class="fa-solid fa-file-arrow-up fa-lg"></i>
|
||||
</span>
|
||||
<div class="flex flex-col items-center" id="geo_label">
|
||||
<span x-text="pivot_file?.name ?? 'Click to upload a Span GeoJSON File.'"></span>
|
||||
<span x-text="pivot_file?.name ? '': 'JSON.' " class="text-gray-400 text-xs"></span>
|
||||
</div>
|
||||
</div>
|
||||
<input type="file" id="pivot_json_path" wire:model="formData.pivot_json_path" accept=".json"
|
||||
class="hidden" @change="pivot_file = $event.target.files[0]"/>
|
||||
<x-input-error for="pivot_json_path" class="mt-2"/>
|
||||
</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 class="flex flex-col mb-2">
|
||||
<label for="span_json_path"
|
||||
class="flex flex-col items-center justify-center border-2 border-dashed border-gray-300 w-full bg-gray-50 hover:bg-gray-100 hover:border-gray-300 hover:cursor-pointer p-4 rounded"
|
||||
x-data="{span_file:null}" x-init="span_file=null">
|
||||
<div class="flex flex-col items-center justify-center text-gray-500 text-sm">
|
||||
<span><i class="fa-solid fa-file-arrow-up fa-lg"></i></span>
|
||||
<div class="flex flex-col items-center">
|
||||
<span x-text="span_file?.name ?? 'Click to upload a Span GeoJSON File.'"></span>
|
||||
<span x-text="span_file?.name ? '': 'JSON.' " class="text-gray-400 text-xs"></span>
|
||||
</div>
|
||||
</div>
|
||||
<input type="file" id="span_json_path" wire:model="formData.span_json_path" accept=".json"
|
||||
class="hidden" @change="span_file = $event.target.files[0]"/>
|
||||
<x-input-error for="span_json_path" class="mt-2"/>
|
||||
</label>
|
||||
</div>
|
||||
{{-- <div class="">--}}
|
||||
{{-- <label for="harvest_data"--}}
|
||||
{{-- class="flex flex-col items-center justify-center border-2 border-dashed border-gray-300 w-full bg-gray-50 hover:bg-gray-100 hover:border-gray-300 hover:cursor-pointer p-4 rounded"--}}
|
||||
{{-- x-data="{excel_file:null}"--}}
|
||||
{{-- >--}}
|
||||
{{-- <div class="flex flex-col items-center justify-center text-gray-500 text-sm">--}}
|
||||
{{-- <span><i class=" fa-solid fa-file-excel fa-lg"></i></span>--}}
|
||||
{{-- <div class="flex flex-col items-center">--}}
|
||||
{{-- <span x-text="excel_file?.name ?? 'Click to upload a SpreadSheet File.'"></span>--}}
|
||||
{{-- <span x-text="excel_file?.name ? '': 'XLS, XLSX or ODS.' "--}}
|
||||
{{-- class="text-gray-400 text-xs"></span>--}}
|
||||
{{-- </div>--}}
|
||||
{{-- </div>--}}
|
||||
{{-- <input type="file" id="harvest_data" wire:model="formData.harvest_data" accept=".xlsx,.xls,.ods"--}}
|
||||
{{-- class="hidden" @change="excel_file = $event.target.files[0]" @drop="excel_file = $event.dataTransfer.files[0];console.log(excel_file);"/>--}}
|
||||
{{-- <x-input-error for="harvest_data" class="mt-2"/>--}}
|
||||
{{-- </label>--}}
|
||||
{{-- </div>--}}
|
||||
<div x-data="{ fileName: '',
|
||||
isAccepted(file){
|
||||
acceptedFormats = [
|
||||
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
|
||||
];
|
||||
return acceptedFormats.includes(file.type);
|
||||
},
|
||||
handleFile(file){
|
||||
if(!this.isAccepted(file)){
|
||||
console.log('Wrong file.');
|
||||
$dispatch('notify',{message:'Wrong File',type:'error'});
|
||||
$refs.harvest_data.files=[];
|
||||
return;
|
||||
}
|
||||
console.log(file.type,file.name);
|
||||
this.fileName = file.name;
|
||||
$wire.set('formData.harvest_data',file);
|
||||
console.log(this.fileName);
|
||||
},
|
||||
|
||||
}" class=" bg-gray-50 hover:bg-gray-100 w-full relative rounded-md shadow-sm">
|
||||
<div x-ref="dnd" class="relative text-gray-500 text-sm border-2 border-gray-300 border-dashed rounded cursor-pointer">
|
||||
<input accept=".xlsx,.xls,.ods" type="file" x-ref="harvest_data" name="file" title="" @change="if($el.files) handleFile($el.files[0])" wire:model="formData.harvest_data"
|
||||
class="absolute inset-0 z-50 w-full h-full p-0 m-0 outline-none opacity-0 cursor-pointer"
|
||||
@dragover="$refs.dnd.classList.add('bg-indigo-50')"
|
||||
@dragleave="$refs.dnd.classList.remove('bg-indigo-50')"
|
||||
@drop="$refs.dnd.classList.remove('bg-indigo-50')"
|
||||
/>
|
||||
<div class="flex flex-col items-center justify-center py-10 text-center">
|
||||
<span><i class=" fa-solid fa-file-excel fa-lg"></i></span>
|
||||
<p class="mt-1">Drag or Click to upload a SpreadSheet File.</p>
|
||||
<p class="text-gray-400 text-xs"> .xlsx, .xsl or .ods</p>
|
||||
<p class="mt-2 text-gray-800" x-text="fileName"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@foreach($projectManager->formData['boundingBoxes'] as $key => $boundingBox)
|
||||
{{-- <div wire:key="bounding_box_{{ $key }}">--}}
|
||||
|
|
@ -39,10 +116,10 @@
|
|||
{{ __('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?') }}"
|
||||
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>
|
||||
|
|
|
|||
Loading…
Reference in a new issue