jeremy/OrderCheck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement user management system and integrate AI services with Ollama and Gemini

Browse Source
This commit is contained in:
jeremy bayse
2026-06-21 00:12:37 +02:00
parent 648749a69a
commit b85c2ba5a1
17 changed files with 1074 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/Pages/Devis/CreateFromCommande.vue
+138 -2
View File
@@ -1,12 +1,106 @@
<script setup>
import { ref, computed } from 'vue';
import { Head, Link, useForm } from '@inertiajs/vue3';
import { Head, Link, useForm, usePage } from '@inertiajs/vue3';
const page = usePage();
const ollamaAvailable = computed(() => page.props.ollamaAvailable);
import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout.vue';
import axios from 'axios';
const props = defineProps({
commande: Object,
});
const isOcrLoading = ref(false);
const ocrError = ref(null);
const selectedModel = ref('gemini');
const loadPdfJs = () => {
return new Promise((resolve, reject) => {
if (window.pdfjsLib) {
resolve(window.pdfjsLib);
return;
}
const script = document.createElement('script');
script.src = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.4.120/pdf.min.js';
script.onload = () => {
window.pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.4.120/pdf.worker.min.js';
resolve(window.pdfjsLib);
};
script.onerror = reject;
document.head.appendChild(script);
});
};
const convertPdfBlobToImageFile = async (blob, fileName) => {
const pdfjsLib = await loadPdfJs();
const arrayBuffer = await blob.arrayBuffer();
const loadingTask = pdfjsLib.getDocument({ data: arrayBuffer });
const pdf = await loadingTask.promise;
const page = await pdf.getPage(1);
const viewport = page.getViewport({ scale: 2.0 });
const canvas = document.createElement('canvas');
const context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
await page.render({ canvasContext: context, viewport }).promise;
return new Promise((resolve) => {
canvas.toBlob((convertedBlob) => {
resolve(new File([convertedBlob], fileName.replace(/\.pdf$/i, '.png'), { type: 'image/png' }));
}, 'image/png');
});
};
const runOcr = async (att) => {
isOcrLoading.value = true;
ocrError.value = null;
try {
let response;
const isPdf = /\.pdf$/i.test(att.file_name);
if (selectedModel.value === 'ollama' && isPdf) {
const pdfResponse = await axios.get(route('attachments.show', att.id), { responseType: 'blob' });
const convertedFile = await convertPdfBlobToImageFile(pdfResponse.data, att.file_name);
const formData = new FormData();
formData.append('file', convertedFile);
formData.append('mode', 'ollama');
response = await axios.post(route('attachments.ocr-upload'), formData, {
headers: { 'Content-Type': 'multipart/form-data' }
});
} else {
response = await axios.post(route('attachments.ocr', att.id), {
mode: selectedModel.value
});
}
if (response.data.success && response.data.data) {
const data = response.data.data;
if (data.title) form.title = data.title;
if (data.date_devis) form.date_devis = data.date_devis;
if (data.tva_rate !== undefined) form.tva_rate = data.tva_rate;
if (data.items && data.items.length > 0) {
form.items = data.items.map(item => ({
type: item.type || 'Matériel',
designation: item.designation || '',
quantite: item.quantite || 1,
prix_unitaire: item.prix_unitaire || 0
}));
}
} else {
ocrError.value = response.data.message || "Une erreur est survenue lors de l'analyse.";
}
} catch (e) {
ocrError.value = e.response?.data?.message || "Erreur de connexion avec le serveur ou la clé API est incorrecte.";
console.error(e);
} finally {
isOcrLoading.value = false;
}
};
const itemTypes = ['Matériel', 'Licence', 'Prestation', 'Infrastructure', 'Autre'];
const form = useForm({
@@ -84,6 +178,48 @@ const submit = () => {
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<form @submit.prevent="submit" class="space-y-6">
<!-- Bannière OCR Gemini -->
<div v-if="commande.quote_attachments && commande.quote_attachments.length > 0" class="bg-gradient-to-r from-violet-50 to-indigo-50 dark:from-violet-950/20 dark:to-indigo-950/20 border border-violet-100 dark:border-violet-900/40 rounded-xl shadow-sm p-6 flex flex-col md:flex-row md:items-center justify-between gap-4">
<div class="flex items-start gap-3">
<span class="text-2xl mt-0.5">✨</span>
<div>
<h4 class="font-bold text-slate-800 dark:text-slate-200 text-sm">Remplissage automatique intelligent (OCR)</h4>
<p class="text-xs text-slate-500 dark:text-slate-400 mt-0.5">
Un devis fournisseur est joint à cette commande. Vous pouvez l'analyser pour remplir automatiquement ce formulaire.
</p>
<p v-if="ocrError" class="text-xs font-semibold text-rose-600 mt-1 flex items-center gap-1">
<svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/></svg>
{{ ocrError }}
</p>
</div>
</div>
<div class="flex flex-wrap items-center gap-3">
<!-- Sélecteur de modèle -->
<div v-if="ollamaAvailable" class="flex items-center gap-2 bg-white/80 dark:bg-slate-900/80 border border-violet-100 dark:border-violet-900/40 rounded-lg px-2.5 py-1.5 shadow-sm">
<span class="text-xs text-slate-500 dark:text-slate-400">Modèle OCR :</span>
<select v-model="selectedModel" class="text-xs font-semibold border-0 p-0 pr-6 focus:ring-0 bg-transparent text-slate-700 dark:text-slate-300">
<option value="gemini">Gemini API</option>
<option value="ollama">GLM-OCR (Ollama)</option>
</select>
</div>
<button
v-for="att in commande.quote_attachments"
:key="att.id"
type="button"
@click="runOcr(att)"
:disabled="isOcrLoading"
class="inline-flex items-center gap-2 px-4 py-2 text-xs font-semibold text-white bg-gradient-to-r from-violet-600 to-indigo-600 hover:from-violet-500 hover:to-indigo-500 rounded-lg shadow-sm focus:outline-none transition-all disabled:opacity-50"
>
<svg v-if="isOcrLoading" class="animate-spin h-3 w-3 text-white" fill="none" viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
</svg>
<span v-else>🔍</span>
{{ isOcrLoading ? 'Analyse en cours...' : 'Analyser : ' + att.file_name }}
</button>
</div>
</div>
<!-- Informations générales -->
<div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-xl shadow-sm p-6 space-y-6">
<h3 class="text-md font-bold text-slate-800 dark:text-slate-200 border-b border-slate-100 dark:border-slate-850 pb-3">
@@ -190,7 +326,7 @@ const submit = () => {
</div>
<div class="sm:col-span-2">
<label class="block text-xxs font-bold text-slate-400 uppercase tracking-wide mb-1">P.U. HT (€)</label>
<input v-model="item.prix_unitaire" type="number" min="0" step="0.01" class="w-full text-xs rounded-lg border-slate-300 shadow-sm focus:border-sky-500 focus:ring-sky-500 dark:bg-slate-900 dark:border-slate-800 dark:text-slate-200" required>
<input v-model="item.prix_unitaire" type="number" step="0.01" class="w-full text-xs rounded-lg border-slate-300 shadow-sm focus:border-sky-500 focus:ring-sky-500 dark:bg-slate-900 dark:border-slate-800 dark:text-slate-200" required>
</div>
</div>
<button type="button" @click="removeItem(index)" class="mt-5 p-1.5 text-rose-500 hover:bg-rose-50 dark:hover:bg-rose-950/40 rounded-md border border-transparent hover:border-rose-200 dark:hover:border-rose-900/60">