DRCIT/snipe-it
1
0
Fork 0
mirror of https://github.com/snipe/snipe-it.git synced 2025-02-21 03:15:45 -08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

I think I have, now, full parity on the base Importer level

Browse source 
Meaning that you can upload new files, delete old files, have error
messages, have status updates - and all of them seem to work.
This commit is contained in:
Brady Wetherington 2022-09-19 21:04:46 -07:00
parent 0a085af0a0
commit 8009ee79db
3 changed files with 93 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
FIXME.txt
View file

@ -1,11 +1,15 @@
remove Ziggy
and ziggy-js too
And what is /public/js/snipeit.js ? That looks like a generated file
X - remove Ziggy
X - and ziggy-js too
X - And what is /public/js/snipeit.js ? That looks like a generated file
The 'flash' (forced refresh/fake refresh) on uploads is dumb
I'm not sure if the order on the uploaded files is right?
The Livewire.first() thing is still dumb (but Id o'nt know that we can fix it).
X - the order on the uploaded files is wrong (backwards)
X - (fixed somehow?!) The Livewire.first() thing is still dumb (but Id o'nt know that we can fix it).
Deletes need to work (I got this working before using $.ajax; it's not even hard)
X - Deletes need to work (I got this working before using $.ajax; it's not even hard)
Then mapping and so on.
Can we potentially delete whatever that this.$http thing? Or is that some side-effect of Vue.js that we don't get for free? (yes, it was that)
I suspect the Alert section is not yet wired up - but should be. Doesn't seem too hard?

37
app/Http/Livewire/Importer.php
View file

@ -5,6 +5,7 @@ namespace App\Http\Livewire;
use Livewire\Component;
use App\Models\Import;
use Storage;
use Log;
@ -14,6 +15,13 @@ class Importer extends Component
public $processDetails;
public $forcerefresh;
public $progress; //upload progress - '-1' means don't show
public $progress_message; //progress message
public $progress_bar_class;
public $message; //status/error message?
public $message_type; //success/error?
protected $rules = [
'files.*.file_path' => 'required|string',
'files.*.created_at' => 'required|string',
@ -22,13 +30,15 @@ class Importer extends Component
public function mount()
{
//$this->files = Import::all(); // this *SHOULD* be how it works, but...it doesn't?
$this->forcerefresh = 0;
//$this->files = Import::all(); // this *SHOULD* be how it works, but...it doesn't? (note orderBy/get, below)
//$this->forcerefresh = 0;
$this->progress = -1; // '-1' means 'don't show the progressbar'
$this->progress_bar_class = 'progress-bar-warning';
}
public function test()
public function hideMessages()
{
Log::error("Test Button Clicked!!!!");
$this->message='';
}
public function toggleEvent($id)
@ -37,9 +47,26 @@ class Importer extends Component
$this->processDetails = Import::find($id);
}
public function destroy($id)
{
foreach($this->files as $file) {
\Log::debug("File id is: ".$file->id);
//\Log::debug("File is: ".print_r($file,true));
if($id == $file->id) {
// FIXME - should I do a try/catch on this and use the file_delete_failure or whatever, if needed?
\Log::debug("I FOUND IT!!!!");
Storage::delete('imports/'.$file->file_path); // FIXME - last time I ran this, it *didn't* delete the file?!
$file->delete();
$this->message = trans('admin/hardware/message.import.file_delete_success');
$this->message_type = 'success'; // uhm, I mean, I guess?
}
}
}
public function render()
{
$this->files = Import::all(); //HACK - slows down renders.
$this->files = Import::orderBy('id','desc')->get(); //HACK - slows down renders.
return view('livewire.importer');
}
}

74
resources/views/livewire/importer.blade.php
View file

@ -32,16 +32,18 @@
</template>
{{-- alert --}}
<template>
<div class="col-md-12" :class="alertType">
<div class="alert" :class="alertClassName">
<button type="button" class="close" @click="hideEvent">&times;</button>
<i class="fas fa-check faa-pulse animated" aria-hidden="true" v-show="alertType == 'success'"></i>
@if($message != '')
<div class="col-md-12" class="{{ $message_type }}">
<div class="alert alert-{{ $this->message_type }} ">
<button type="button" class="close" wire:click="hideMessages">&times;</button>
@if($message_type == 'success')
<i class="fas fa-check faa-pulse animated" aria-hidden="true"></i>
@endif
<strong>{{-- title --}} </strong>
<slot></slot>
{{ $message }}
</div>
</div>
</template>
@endif
<script>
fixme = {
@ -73,14 +75,15 @@
<div class="row">
<div class="col-md-12">
<div class="col-md-9" style="padding-bottom:20px; display:none" id='progress-container'>
@if($progress != -1)
<div class="col-md-9" style="padding-bottom:20px" id='progress-container'>
<div class="progress progress-striped-active" style="margin-top: 8px"> {{-- so someof these values are in importer.vue! --}}
<div id='progress-bar' class="progress-bar" class="progress-bar-warning" role="progressbar" style="width: 0%">
<span id='progress-text'></span>
<div id='progress-bar' class="progress-bar {{ $progress_bar_class }}" role="progressbar" style="width: {{ $progress }}%">
<span id='progress-text'>{{ $progress_message }}</span>
</div>
</div>
</div>
@endif
<div class="col-md-3 text-right pull-right">
@ -103,7 +106,6 @@
</div>
<div class="row">
<div class="col-md-12 table-responsive" style="padding-top: 30px;">
<button wire:click="test">Test!</button><br />
<table data-pagination="true"
data-id-table="upload-table"
data-search="true"
@ -134,7 +136,7 @@
</button>
</td>
<td class="col-md-1 text-right">
<button class="btn btn-sm btn-danger" @click="deleteFile(currentFile)">
<button class="btn btn-sm btn-danger" wire:click="destroy({{ $currentFile->id }})">
<i class="fas fa-trash icon-white" aria-hidden="true"></i><span class="sr-only"></span></button>
</td>
</tr>
@ -167,23 +169,30 @@
<script>
document.addEventListener('livewire:load', function () {
console.log("OKAY - we are gonna dump us out some files here!")
console.dir(Livewire.first().files)
console.dir(@this.files)
console.log("after livewire load, we're going to try the this thing")
console.dir(@this)
})
$('#fileupload').fileupload({
dataType: 'json',
done: function(e, data) {
$('#progress-bar').attr("class", "progress-bar-success");
$('#progress-text').text("Success!"); // same here? TODO - internationalize!
$('#progress-bar').attr('style', 'width: 100%'); // weird, wasn't needed before....
//$('#progress-bar').attr("class", "progress-bar-success");
@this.progress_bar_class = 'progress-bar-success';
//$('#progress-text').text("Success!"); // same here? TODO - internationalize!
@this.progress_message = 'Success!'; // FIXME - we're already round-tripping to the server here - I'd love it if we could get internationalized text here
//$('#progress-bar').attr('style', 'width: 100%'); // weird, wasn't needed before....
@this.progress = 100;
console.log("Dumping livewire files!!!!!!!!!")
console.dir(Livewire.first().files)
console.dir(@this.files)
console.log("And now dumping data.result.files!!!!!")
console.dir(data.result.files)
//Livewire.first().files = data.result.files.concat(Livewire.first().files); // FIXME - how to get in and out of the Livewire.first().something.... (this doesn't work either)
// Livewire.first().files = Livewire.first().files.concat(data.result.files) //I don't quite see why this should be like this, but, well, whatever.
//@this.files = data.result.files.concat(@this.files); // FIXME - how to get in and out of the @this.something.... (this doesn't work either)
// @this.files = @this.files.concat(data.result.files) //I don't quite see why this should be like this, but, well, whatever.
//fuckit, let's just force a refresh?
Livewire.first().forcerefresh = Livewire.first().forcerefresh+1 // this is a horrible hack; please forgive me :(
// NB - even if that *did* work, I suspect it would re-flash the progressbar, which we would not like.
// perhaps a better angle would be to have a 'progress' PHP attribute, and update that dynamically, and let Livewire re-render it as appropriate?
@this.forcerefresh = @this.forcerefresh+1 // this is a horrible hack; please forgive me :(
console.log(data.result.header_row);
console.dir()
},
@ -193,20 +202,29 @@
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr('content')
};
data.process().done( function () {data.submit();});
$('#progress-container').show();
// $('#progress-container').show();
@this.progress = 0;
},
progress: function(e, data) {
var progress = parseInt((data.loaded / data.total * 100, 10));
$('#progress-bar').attr('style', 'width: '+progress+'%');
$('#progress-text').text(progress+'% Complete');
@this.progress = parseInt((data.loaded / data.total * 100, 10));
//$('#progress-bar').attr('style', 'width: '+progress+'%');
@this.progress_message = @this.progress+'% Complete'; // FIXME - this should come from server (so it can be internationalized)
//$('#progress-text').text(progress+'% Complete');
},
fail: function(e, data) {
$('#progress-bar').attr("class", "progress-bar-danger");
@this.progress_bar_class = "progress-bar-danger";
// Display any errors returned from the $.ajax()
console.dir(data.jqXHR.responseJSON.messages) // FIXME don't dupm to console
$('#progress-bar').attr('style', 'width: 100%');
$('#progress-text').text(data.jqXHR.responseJSON.messages);
//$('#progress-bar').attr('style', 'width: 100%');
@this.progress = 100;
//$('#progress-text').text(data.jqXHR.responseJSON.messages);
@this.progress_message = data.jqXHR.responseJSON.messages;
}
})
setTimeout(function () {
console.log("Test @"+"this:")
console.dir(@this)
},5000)
</script>
@endpush