Skip to content

Commit 7a95470

Browse files
ousidousid
committed
update assets
1 parent 28ed94d commit 7a95470

13 files changed

+184
-145
lines changed

‎mix-manifest.json

+1-4
Original file line numberDiff line numberDiff line change
@@ -1,4 +1 @@
1-
{
2-
"/dist/js/app.js": "/dist/js/app.js",
3-
"/dist/css/tailwind.css": "/dist/css/tailwind.css"
4-
}
1+
{}

‎resources/assets/scss/tailwind.scss renamed to ‎resources/assets/scss/csv_tailwind.scss

File renamed without changes.

‎dist/css/tailwind.css renamed to ‎resources/dist/css/tailwind.css

File renamed without changes.

‎dist/js/app.js renamed to ‎resources/dist/js/app.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎resources/views/components/button.blade.php

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<button
22
{{ $attributes }}
33
x-data
4-
x-on:click="window.livewire.emitTo('csv-importer', 'toogle')">
4+
x-on:click="window.livewire.emitTo('csv-importer', 'toggle')">
55
{{ $slot }}
66
</button>

‎resources/views/livewire/bootstrap/csv-importer.blade.php

+3-112
Original file line numberDiff line numberDiff line change
@@ -1,112 +1,3 @@
1-
<div class="relative z-10" x-data="{ open: @entangle('open') }" x-show="open" x-cloak>
2-
<div class="fixed inset-0"></div>
3-
4-
<div class="fixed inset-0 overflow-hidden">
5-
<div class="absolute inset-0 overflow-hidden">
6-
<div class="pointer-events-none fixed inset-y-0 right-0 flex max-w-full pl-10 sm:pl-16">
7-
<div class="pointer-events-auto w-screen max-w-md">
8-
<form wire:submit.prevent="import" class="flex h-full flex-col divide-y divide-gray-200 bg-white shadow-xl">
9-
<div class="py-6 px-4 sm:px-6">
10-
<div class="flex items-center justify-between">
11-
<h2 class="text-lg font-medium">{{ __('Import') }}</h2>
12-
<div class="ml-3 flex h-7 items-center">
13-
<button type="button" class="rounded-md text-indigo-200 hover:text-indigo-300 focus:outline-none focus:ring-2 focus:ring-white" wire:click="toggle">
14-
<span class="sr-only">{{ __('Close panel') }}</span>
15-
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true">
16-
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
17-
</svg>
18-
</button>
19-
</div>
20-
</div>
21-
</div>
22-
<div class="h-0 flex-1 overflow-y-auto">
23-
<div class="flex flex-1 flex-col justify-between">
24-
<div class="p-4 sm:p-6">
25-
<div>
26-
<!-- File drop -->
27-
<div class="max-w-lg flex justify-center px-6 pt-5 pb-6 border-2 border-dashed rounded-md"
28-
x-bind:class="{
29-
'border-gray-300': ! dropping,
30-
'border-gray-400': dropping,
31-
}"
32-
x-on:dragover.prevent="dropping = true"
33-
x-on:dragleave.prevent="dropping = false"
34-
x-on:drop.prevent="dropping = false"
35-
x-on:drop.prevnet="handleDrop($event)"
36-
x-data="{
37-
dropping: false,
38-
39-
handleDrop(e) {
40-
@this.upload('file', event.dataTransfer.files[0])
41-
}
42-
}"
43-
>
44-
<div class="space-y-1 text-center">
45-
<svg class="mx-auto h-12 w-12 text-gray-400" stroke="currentColor" fill="none" viewBox="0 0 24 24" aria-hidden="true">
46-
<path stroke-linecap="round" stroke-linejoin="round" d="M3 10h18M3 14h18m-9-4v8m-7 0h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z" />
47-
</svg>
48-
<div class="flex text-sm text-gray-600">
49-
<label for="file" class="relative cursor-pointer bg-white rounded-md font-medium text-indigo-600 hover:text-indigo-500 focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500">
50-
<span>Upload a file</span>
51-
<input id="file" wire:model="file" name="file" type="file" class="sr-only">
52-
</label>
53-
<p class="pl-1">or drag and drop</p>
54-
</div>
55-
<p class="text-xs text-gray-500">
56-
CSV file up to 50MB
57-
</p>
58-
</div>
59-
</div>
60-
</div>
61-
62-
@error('file')
63-
<span class="mt-2 text-red-500 font-medium text-sm">{{ $message }}</span>
64-
@enderror
65-
<!-- End file drop -->
66-
67-
<!-- Column selection -->
68-
{{-- If file uloaded --}}
69-
@if ($fileHeaders)
70-
<div class="mt-8">
71-
<h2 class="font-medium">Match columns</h2>
72-
73-
<div class="mt-4 space-y-5">
74-
@foreach ($columnsToMap as $column => $value)
75-
<div class="grid grid-cols-4 gap-4 items-start">
76-
<label for="{{ $column }}" class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2 col-span-1">
77-
{{ $columnLabels[$column] ?? ucfirst(str_replace(['_', '-'], ' ', $column)) }}*
78-
</label>
79-
<div class="mt-1 sm:mt-0 sm:col-span-3">
80-
<select wire:model.defer="columnsToMap.{{$column}}" type="text" name="{{ $column }}" id="{{ $column }}" class="max-w-lg block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:max-w-xs sm:text-sm border-gray-300 rounded-md">
81-
<option value="">{{ __('Select a column') }}</option>
82-
@foreach ($fileHeaders as $fileHeader)
83-
<option value="{{$fileHeader}}">{{ $fileHeader }}</option>
84-
@endforeach
85-
</select>
86-
87-
@error('columnsToMap.' . $column)
88-
<span class="mt-2 text-red-500 font-medium text-sm">{{ $message }}</span>
89-
@enderror
90-
</div>
91-
</div>
92-
@endforeach
93-
</div>
94-
</div>
95-
@endif
96-
{{-- Endif file uloaded --}}
97-
<!-- End columns selection -->
98-
</div>
99-
</div>
100-
</div>
101-
102-
<livewire:csv-imports :model="$model"/>
103-
104-
<div class="flex flex-shrink-0 justify-end px-4 py-4">
105-
<button type="submit" class="ml-4 inline-flex justify-center rounded-md border border-transparent bg-indigo-600 py-2 px-4 text-sm font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 disabled:opacity-50" {{ $fileRowCount === 0 ? 'disabled': ''}}>Import</button>
106-
</div>
107-
</form>
108-
</div>
109-
</div>
110-
</div>
111-
</div>
112-
</div>
1+
<div>
2+
{{-- Import CSV --}}
3+
</div>

‎resources/views/livewire/bootstrap/handle-imports.blade.php

+3-15
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,3 @@
1-
<div wire:poll.2s.visible>
2-
{{-- For each import --}}
3-
@foreach ($this->imports as $import)
4-
<div class="p-6">
5-
<div>
6-
<h2 class="font-medium">Importing {{ $import->file_name }}</h2>
7-
<span class="text-gray-700 text-sm">Imported {{ $import->processed_rows }}/{{ $import->total_rows }} rows</span>
8-
<div class="w-full bg-indigo-100 rounded">
9-
<div class="mt-2 w-full bg-indigo-500 rounded h-2" style="width: {{ $import->percentageComplete() }}%"></div>
10-
</div>
11-
</div>
12-
</div>
13-
@endforeach
14-
{{-- Endforeach import --}}
15-
</div>
1+
<div>
2+
{{-- Handle Imports --}}
3+
</div>

‎resources/views/livewire/tailwindcss/csv-importer.blade.php

+112-3
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,112 @@
1-
<div>
2-
{{-- Import CSV --}}
3-
</div>
1+
<div class="relative z-10" x-data="{ open: @entangle('open') }" x-show="open" x-cloak>
2+
<div class="fixed inset-0"></div>
3+
4+
<div class="fixed inset-0 overflow-hidden">
5+
<div class="absolute inset-0 overflow-hidden">
6+
<div class="pointer-events-none fixed inset-y-0 right-0 flex max-w-full pl-10 sm:pl-16">
7+
<div class="pointer-events-auto w-screen max-w-md">
8+
<form wire:submit.prevent="import" class="flex h-full flex-col divide-y divide-gray-200 bg-white shadow-xl">
9+
<div class="py-6 px-4 sm:px-6">
10+
<div class="flex items-center justify-between">
11+
<h2 class="text-lg font-medium">{{ __('Import') }}</h2>
12+
<div class="ml-3 flex h-7 items-center">
13+
<button type="button" class="rounded-md text-indigo-200 hover:text-indigo-300 focus:outline-none focus:ring-2 focus:ring-white" wire:click="toggle">
14+
<span class="sr-only">{{ __('Close panel') }}</span>
15+
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true">
16+
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
17+
</svg>
18+
</button>
19+
</div>
20+
</div>
21+
</div>
22+
<div class="h-0 flex-1 overflow-y-auto">
23+
<div class="flex flex-1 flex-col justify-between">
24+
<div class="p-4 sm:p-6">
25+
<div>
26+
<!-- File drop -->
27+
<div class="max-w-lg flex justify-center px-6 pt-5 pb-6 border-2 border-dashed rounded-md"
28+
x-bind:class="{
29+
'border-gray-300': ! dropping,
30+
'border-gray-400': dropping,
31+
}"
32+
x-on:dragover.prevent="dropping = true"
33+
x-on:dragleave.prevent="dropping = false"
34+
x-on:drop.prevent="dropping = false"
35+
x-on:drop.prevnet="handleDrop($event)"
36+
x-data="{
37+
dropping: false,
38+
39+
handleDrop(e) {
40+
@this.upload('file', event.dataTransfer.files[0])
41+
}
42+
}"
43+
>
44+
<div class="space-y-1 text-center">
45+
<svg class="mx-auto h-12 w-12 text-gray-400" stroke="currentColor" fill="none" viewBox="0 0 24 24" aria-hidden="true">
46+
<path stroke-linecap="round" stroke-linejoin="round" d="M3 10h18M3 14h18m-9-4v8m-7 0h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z" />
47+
</svg>
48+
<div class="flex text-sm text-gray-600">
49+
<label for="file" class="relative cursor-pointer bg-white rounded-md font-medium text-indigo-600 hover:text-indigo-500 focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500">
50+
<span>Upload a file</span>
51+
<input id="file" wire:model="file" name="file" type="file" class="sr-only">
52+
</label>
53+
<p class="pl-1">or drag and drop</p>
54+
</div>
55+
<p class="text-xs text-gray-500">
56+
CSV file up to 50MB
57+
</p>
58+
</div>
59+
</div>
60+
</div>
61+
62+
@error('file')
63+
<span class="mt-2 text-red-500 font-medium text-sm">{{ $message }}</span>
64+
@enderror
65+
<!-- End file drop -->
66+
67+
<!-- Column selection -->
68+
{{-- If file uloaded --}}
69+
@if ($fileHeaders)
70+
<div class="mt-8">
71+
<h2 class="font-medium">Match columns</h2>
72+
73+
<div class="mt-4 space-y-5">
74+
@foreach ($columnsToMap as $column => $value)
75+
<div class="grid grid-cols-4 gap-4 items-start">
76+
<label for="{{ $column }}" class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2 col-span-1">
77+
{{ $columnLabels[$column] ?? ucfirst(str_replace(['_', '-'], ' ', $column)) }}*
78+
</label>
79+
<div class="mt-1 sm:mt-0 sm:col-span-3">
80+
<select wire:model.defer="columnsToMap.{{$column}}" type="text" name="{{ $column }}" id="{{ $column }}" class="max-w-lg block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:max-w-xs sm:text-sm border-gray-300 rounded-md">
81+
<option value="">{{ __('Select a column') }}</option>
82+
@foreach ($fileHeaders as $fileHeader)
83+
<option value="{{$fileHeader}}">{{ $fileHeader }}</option>
84+
@endforeach
85+
</select>
86+
87+
@error('columnsToMap.' . $column)
88+
<span class="mt-2 text-red-500 font-medium text-sm">{{ $message }}</span>
89+
@enderror
90+
</div>
91+
</div>
92+
@endforeach
93+
</div>
94+
</div>
95+
@endif
96+
{{-- Endif file uloaded --}}
97+
<!-- End columns selection -->
98+
</div>
99+
</div>
100+
</div>
101+
102+
<livewire:handle-imports :model="$model"/>
103+
104+
<div class="flex flex-shrink-0 justify-end px-4 py-4">
105+
<button type="submit" class="ml-4 inline-flex justify-center rounded-md border border-transparent bg-indigo-600 py-2 px-4 text-sm font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 disabled:opacity-50" {{ $fileRowCount === 0 ? 'disabled': ''}}>Import</button>
106+
</div>
107+
</form>
108+
</div>
109+
</div>
110+
</div>
111+
</div>
112+
</div>

‎resources/views/livewire/tailwindcss/handle-imports.blade.php

+15-3
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,15 @@
1-
<div>
2-
{{-- Handle Imports --}}
3-
</div>
1+
<div wire:poll.2s.visible>
2+
{{-- For each import --}}
3+
@foreach ($this->imports as $import)
4+
<div class="p-6">
5+
<div>
6+
<h2 class="font-medium">Importing {{ $import->file_name }}</h2>
7+
<span class="text-gray-700 text-sm">Imported {{ $import->processed_rows }}/{{ $import->total_rows }} rows</span>
8+
<div class="w-full bg-indigo-100 rounded">
9+
<div class="mt-2 w-full bg-indigo-500 rounded h-2" style="width: {{ $import->percentageComplete() }}%"></div>
10+
</div>
11+
</div>
12+
</div>
13+
@endforeach
14+
{{-- Endforeach import --}}
15+
</div>

‎src/Http/Livewire/CsvImporter.php

+3-3
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ class CsvImporter extends Component
2222
public $model;
2323

2424
/** @var bool */
25-
public bool $open = false;
25+
public bool $open = true;
2626

2727
/** @var object */
2828
public $file;
@@ -50,7 +50,7 @@ class CsvImporter extends Component
5050

5151
/** @var array */
5252
protected $listeners = [
53-
'toogle',
53+
'toggle',
5454
];
5555

5656
public function mount()
@@ -85,7 +85,7 @@ public function import()
8585
$this->emitTo('csv-imports', 'imports.refresh');
8686
}
8787

88-
public function toogle()
88+
public function toggle()
8989
{
9090
$this->open = ! $this->open;
9191
}

‎src/LaravelCsvDirectives.php

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<?php
2+
3+
namespace Coderflex\LaravelCsv;
4+
5+
class LaravelCsvDirectives
6+
{
7+
public static function csvStyles()
8+
{
9+
if (config('laravel_csv.layout') == 'tailwindcss') {
10+
return self::getTailwindStyle();
11+
}
12+
}
13+
14+
public static function csvScripts()
15+
{
16+
return <<<HTML
17+
<script src="{{ asset('vendor/csv/js/app.js') }}"></script>
18+
HTML;
19+
}
20+
21+
protected static function getTailwindStyle()
22+
{
23+
return <<<HTML
24+
<link href="{{ asset('vendor/csv/css/tailwind.css') }}" rel="stylesheet"></link>
25+
HTML;
26+
}
27+
}

0 commit comments

Comments
 (0)