Files
project/resources/views/incoming/upload.blade.php

78 lines
3.0 KiB
PHP

<x-app-layout>
<x-slot name="header">
<div class="flex flex-row w-full">
<h2 class="grow font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
{{ __('incoming.Upload new invoice') }}
</h2>
</div>
</x-slot>
<div class="py-12" x-data="uploadForm">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8 space-y-6">
<div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
<div class="max-w ">
<section>
<header>
<h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
{{ __('incoming.Upload new invoice') }}
</h2>
<p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
{{ __("incoming.Upload new xml invoice by clicking upload") }}
</p>
</header>
</section>
<form class="mt-6 space-y-2" @submit.prevent="">
<p class="text-red-600 font-bold" x-text="message" x-show="error"></p>
<div class="flex flex-row items-start">
<x-input-label class="w-1/4" for="upload_file"
:value="__('incoming.Invoice file')"/>
<x-text-input id="upload_file" name="upload_file" type="file" accept=".xml"
class="mt-1 block w-full"
@change="checkUpload()"/>
</div>
<x-primary-button x-show="may_upload"
@click="submit()">{{ __('form.Upload') }}</x-primary-button>
</form>
</div>
</div>
</div>
</div>
</x-app-layout>
<script>
function uploadForm() {
return {
error: false,
message: '',
may_upload: false,
upload_file: null,
checkUpload() {
let reader, files = document.getElementById('upload_file').files;
reader = new FileReader();
reader.onload = e => {
this.may_upload = true;
this.upload_file = e.target.result;
};
reader.readAsDataURL(files[0]);
},
submit() {
let vm = this;
axios.post('incoming-upload', {uploadFile: this.upload_file})
.then(function (response) {
window.location.href = '/incoming/' + response.data.id + '/edit';
})
.catch(function (error) {
vm.error = true;
vm.may_upload = false;
vm.message = error.response.data.message;
})
}
}
}
</script>