Compare commits
3 Commits
596731a8a7
...
9ee45463a8
| Author | SHA1 | Date | |
|---|---|---|---|
| 9ee45463a8 | |||
| 8f88548a59 | |||
| 012b72527b |
@ -6,7 +6,19 @@ from submissions.schemas import UserInfoOut
|
|||||||
api = NinjaAPI(
|
api = NinjaAPI(
|
||||||
title="Opus Magnum Submission API",
|
title="Opus Magnum Submission API",
|
||||||
version="1.0.0",
|
version="1.0.0",
|
||||||
description="API for managing Opus Magnum puzzle submissions",
|
description="""API for managing Opus Magnum puzzle submissions.
|
||||||
|
|
||||||
|
The Opus Magnum Submission API allows clients to upload, manage, validate, and review puzzle solution submissions for the Opus Magnum puzzle game community.
|
||||||
|
It provides features for user authentication, puzzle listing, submission uploads, automated and manual OCR validation, and administrative workflows.
|
||||||
|
""",
|
||||||
|
openapi_extra={
|
||||||
|
"info": {
|
||||||
|
"contact": {
|
||||||
|
"name": "Legrems",
|
||||||
|
"email": "loic.gremaud@polylan.ch",
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
)
|
)
|
||||||
|
|
||||||
# Add authentication for protected endpoints
|
# Add authentication for protected endpoints
|
||||||
@ -33,8 +45,7 @@ def api_info(request):
|
|||||||
"description": "API for managing puzzle submissions with OCR validation",
|
"description": "API for managing puzzle submissions with OCR validation",
|
||||||
"features": [
|
"features": [
|
||||||
"Multi-puzzle submissions",
|
"Multi-puzzle submissions",
|
||||||
"File upload to S3",
|
"OCR validation",
|
||||||
"OCR validation tracking",
|
|
||||||
"Manual validation workflow",
|
"Manual validation workflow",
|
||||||
"Admin validation tools",
|
"Admin validation tools",
|
||||||
],
|
],
|
||||||
|
|||||||
@ -1,151 +1,112 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, computed, defineProps } from 'vue'
|
import { ref, onMounted, computed } from "vue";
|
||||||
import PuzzleCard from '@/components/PuzzleCard.vue'
|
import PuzzleCard from "@/components/PuzzleCard.vue";
|
||||||
import SubmissionForm from '@/components/SubmissionForm.vue'
|
import SubmissionForm from "@/components/SubmissionForm.vue";
|
||||||
import AdminPanel from '@/components/AdminPanel.vue'
|
import AdminPanel from "@/components/AdminPanel.vue";
|
||||||
import { apiService, errorHelpers } from '@/services/apiService'
|
import { apiService, errorHelpers } from "@/services/apiService";
|
||||||
import { usePuzzlesStore } from '@/stores/puzzles'
|
import { usePuzzlesStore } from "@/stores/puzzles";
|
||||||
import { useSubmissionsStore } from '@/stores/submissions'
|
import { useSubmissionsStore } from "@/stores/submissions";
|
||||||
import type { SteamCollection, PuzzleResponse, UserInfo } from '@/types'
|
import type { PuzzleResponse, UserInfo } from "@/types";
|
||||||
import { useCountdown } from '@vueuse/core'
|
import { useCountdown } from "@vueuse/core";
|
||||||
|
import { storeToRefs } from "pinia";
|
||||||
|
|
||||||
const props = defineProps<{collectionTitle: string, collectionUrl: string, collectionDescription: string}>()
|
const props = defineProps<{
|
||||||
|
collectionTitle: string;
|
||||||
|
collectionUrl: string;
|
||||||
|
collectionDescription: string;
|
||||||
|
}>();
|
||||||
|
|
||||||
// Pinia stores
|
const puzzlesStore = usePuzzlesStore();
|
||||||
const puzzlesStore = usePuzzlesStore()
|
const submissionsStore = useSubmissionsStore();
|
||||||
const submissionsStore = useSubmissionsStore()
|
|
||||||
|
const { submissions, isSubmissionModalOpen } = storeToRefs(submissionsStore);
|
||||||
|
const { openSubmissionModal, loadSubmissions, closeSubmissionModal } =
|
||||||
|
submissionsStore;
|
||||||
|
|
||||||
// Local state
|
// Local state
|
||||||
const userInfo = ref<UserInfo | null>(null)
|
const userInfo = ref<UserInfo | null>(null);
|
||||||
const isLoading = ref(true)
|
const isLoading = ref(true);
|
||||||
const error = ref<string>('')
|
const error = ref<string>("");
|
||||||
|
|
||||||
// Computed properties
|
// Computed properties
|
||||||
const isSuperuser = computed(() => {
|
const isSuperuser = computed(() => {
|
||||||
return userInfo.value?.is_superuser || false
|
return userInfo.value?.is_superuser || false;
|
||||||
})
|
});
|
||||||
|
|
||||||
// Computed property to get responses grouped by puzzle
|
// Computed property to get responses grouped by puzzle
|
||||||
const responsesByPuzzle = computed(() => {
|
const responsesByPuzzle = computed(() => {
|
||||||
const grouped: Record<number, PuzzleResponse[]> = {}
|
const grouped: Record<number, PuzzleResponse[]> = {};
|
||||||
submissionsStore.submissions.forEach(submission => {
|
submissions.value.forEach((submission) => {
|
||||||
submission.responses.forEach(response => {
|
submission.responses.forEach((response) => {
|
||||||
// Handle both number and object types for puzzle field
|
// Handle both number and object types for puzzle field
|
||||||
const puzzleId = typeof response.puzzle === 'number' ? response.puzzle : response.puzzle.id
|
if (!grouped[response.puzzle]) {
|
||||||
if (!grouped[puzzleId]) {
|
grouped[response.puzzle] = [];
|
||||||
grouped[puzzleId] = []
|
|
||||||
}
|
}
|
||||||
grouped[puzzleId].push(response)
|
grouped[response.puzzle].push(response);
|
||||||
})
|
});
|
||||||
})
|
});
|
||||||
return grouped
|
return grouped;
|
||||||
})
|
});
|
||||||
|
|
||||||
async function initialize() {
|
async function initialize() {
|
||||||
try {
|
try {
|
||||||
isLoading.value = true
|
isLoading.value = true;
|
||||||
error.value = ''
|
error.value = "";
|
||||||
|
|
||||||
console.log('Starting data load...')
|
console.log("Starting data load...");
|
||||||
|
|
||||||
// Load user info
|
// Load user info
|
||||||
console.log('Loading user info...')
|
console.log("Loading user info...");
|
||||||
const userResponse = await apiService.getUserInfo()
|
const userResponse = await apiService.getUserInfo();
|
||||||
if (userResponse.data) {
|
if (userResponse.data) {
|
||||||
userInfo.value = userResponse.data
|
userInfo.value = userResponse.data;
|
||||||
console.log('User info loaded:', userResponse.data)
|
console.log("User info loaded:", userResponse.data);
|
||||||
} else if (userResponse.error) {
|
} else if (userResponse.error) {
|
||||||
console.warn('User info error:', userResponse.error)
|
console.warn("User info error:", userResponse.error);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Load puzzles from API using store
|
// Load puzzles from API using store
|
||||||
console.log('Loading puzzles...')
|
console.log("Loading puzzles...");
|
||||||
await puzzlesStore.loadPuzzles()
|
await puzzlesStore.loadPuzzles();
|
||||||
console.log('Puzzles loaded:', puzzlesStore.puzzles.length)
|
console.log("Puzzles loaded:", puzzlesStore.puzzles.length);
|
||||||
|
|
||||||
// Load existing submissions using store
|
// Load existing submissions using store
|
||||||
console.log('Loading submissions...')
|
console.log("Loading submissions...");
|
||||||
await submissionsStore.loadSubmissions()
|
await loadSubmissions();
|
||||||
console.log('Submissions loaded:', submissionsStore.submissions.length)
|
console.log("Submissions loaded:", submissions.value.length);
|
||||||
|
|
||||||
console.log('Data load complete!')
|
|
||||||
|
|
||||||
|
console.log("Data load complete!");
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
error.value = errorHelpers.getErrorMessage(err)
|
error.value = errorHelpers.getErrorMessage(err);
|
||||||
console.error('Failed to load data:', err)
|
console.error("Failed to load data:", err);
|
||||||
} finally {
|
} finally {
|
||||||
isLoading.value = false
|
isLoading.value = false;
|
||||||
console.log('Loading state set to false')
|
console.log("Loading state set to false");
|
||||||
}
|
}
|
||||||
|
|
||||||
if (userInfo.value.is_superuser) {
|
if (userInfo.value?.is_superuser) {
|
||||||
start()
|
start();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const { remaining, start } = useCountdown(60, {
|
const { remaining, start } = useCountdown(60, {
|
||||||
onComplete() {
|
onComplete() {
|
||||||
initialize()
|
initialize();
|
||||||
}
|
},
|
||||||
})
|
});
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await initialize()
|
await initialize();
|
||||||
})
|
});
|
||||||
|
|
||||||
const handleSubmission = async (submissionData: {
|
|
||||||
files: any[],
|
|
||||||
notes?: string,
|
|
||||||
manualValidationRequested?: boolean
|
|
||||||
}) => {
|
|
||||||
try {
|
|
||||||
isLoading.value = true
|
|
||||||
error.value = ''
|
|
||||||
|
|
||||||
// Create submission via store
|
|
||||||
const submission = await submissionsStore.createSubmission(
|
|
||||||
submissionData.files,
|
|
||||||
submissionData.notes,
|
|
||||||
submissionData.manualValidationRequested
|
|
||||||
)
|
|
||||||
|
|
||||||
// Show success message
|
|
||||||
if (submission) {
|
|
||||||
const puzzleNames = submission.responses.map(r => r.puzzle_name).join(', ')
|
|
||||||
alert(`Solutions submitted successfully for puzzles: ${puzzleNames}`)
|
|
||||||
} else {
|
|
||||||
alert('Submission created successfully!')
|
|
||||||
}
|
|
||||||
|
|
||||||
// Close modal
|
|
||||||
submissionsStore.closeSubmissionModal()
|
|
||||||
|
|
||||||
} catch (err) {
|
|
||||||
const errorMessage = errorHelpers.getErrorMessage(err)
|
|
||||||
error.value = errorMessage
|
|
||||||
alert(`Submission failed: ${errorMessage}`)
|
|
||||||
console.error('Submission error:', err)
|
|
||||||
} finally {
|
|
||||||
isLoading.value = false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const openSubmissionModal = () => {
|
|
||||||
submissionsStore.openSubmissionModal()
|
|
||||||
}
|
|
||||||
|
|
||||||
const closeSubmissionModal = () => {
|
|
||||||
submissionsStore.closeSubmissionModal()
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to match puzzle name from OCR to actual puzzle
|
// Function to match puzzle name from OCR to actual puzzle
|
||||||
const findPuzzleByName = (ocrPuzzleName: string) => {
|
const findPuzzleByName = (ocrPuzzleName: string) => {
|
||||||
return puzzlesStore.findPuzzleByName(ocrPuzzleName)
|
return puzzlesStore.findPuzzleByName(ocrPuzzleName);
|
||||||
}
|
};
|
||||||
|
|
||||||
const reloadPage = () => {
|
const reloadPage = () => {
|
||||||
window.location.reload()
|
window.location.reload();
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -157,19 +118,25 @@ const reloadPage = () => {
|
|||||||
<h1 class="text-xl font-bold">Opus Magnum Puzzle Submitter</h1>
|
<h1 class="text-xl font-bold">Opus Magnum Puzzle Submitter</h1>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex items-start justify-between">
|
<div class="flex items-start justify-between">
|
||||||
<div v-if="userInfo?.is_authenticated" class="flex items-center gap-2">
|
<div
|
||||||
|
v-if="userInfo?.is_authenticated"
|
||||||
|
class="flex items-center gap-2"
|
||||||
|
>
|
||||||
<div class="text-sm">
|
<div class="text-sm">
|
||||||
<span class="font-medium">{{ userInfo.username }}</span>
|
<span class="font-medium">{{ userInfo.username }}</span>
|
||||||
<span v-if="userInfo.is_superuser" class="badge badge-warning badge-xs ml-1">Admin</span>
|
<span
|
||||||
|
v-if="userInfo.is_superuser"
|
||||||
|
class="badge badge-warning badge-xs ml-1"
|
||||||
|
>Admin</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="text-sm text-base-content/70">
|
<div v-else class="text-sm text-base-content/70">Not logged in</div>
|
||||||
Not logged in
|
<div class="flex flex-col items-end gap-2">
|
||||||
|
<a href="/api/docs" class="btn btn-xs">API docs</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col items-end gap-2">
|
<div class="flex flex-col items-end gap-2">
|
||||||
<a href="/admin" class="btn btn-xs btn-warning">
|
<a href="/admin" class="btn btn-xs btn-warning">Admin panel</a>
|
||||||
Admin django
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -187,7 +154,10 @@ const reloadPage = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="isLoading" class="flex justify-center items-center min-h-[400px]">
|
<div
|
||||||
|
v-if="isLoading"
|
||||||
|
class="flex justify-center items-center min-h-[400px]"
|
||||||
|
>
|
||||||
<div class="text-center">
|
<div class="text-center">
|
||||||
<span class="loading loading-spinner loading-lg"></span>
|
<span class="loading loading-spinner loading-lg"></span>
|
||||||
<p class="mt-4 text-base-content/70">Loading puzzles...</p>
|
<p class="mt-4 text-base-content/70">Loading puzzles...</p>
|
||||||
@ -214,12 +184,11 @@ const reloadPage = () => {
|
|||||||
<div class="card bg-base-100 shadow-lg">
|
<div class="card bg-base-100 shadow-lg">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<h2 class="card-title text-2xl">{{ props.collectionTitle }}</h2>
|
<h2 class="card-title text-2xl">{{ props.collectionTitle }}</h2>
|
||||||
<p class="text-base-content/70">{{ props.collectionDescription }}</p>
|
<p class="text-base-content/70">
|
||||||
|
{{ props.collectionDescription }}
|
||||||
|
</p>
|
||||||
<div class="flex flex-wrap gap-4 mt-4">
|
<div class="flex flex-wrap gap-4 mt-4">
|
||||||
<button
|
<button @click="openSubmissionModal" class="btn btn-primary">
|
||||||
@click="openSubmissionModal"
|
|
||||||
class="btn btn-primary"
|
|
||||||
>
|
|
||||||
<i class="mdi mdi-plus mr-2"></i>
|
<i class="mdi mdi-plus mr-2"></i>
|
||||||
Submit Solution
|
Submit Solution
|
||||||
</button>
|
</button>
|
||||||
@ -247,14 +216,16 @@ const reloadPage = () => {
|
|||||||
<div v-if="puzzlesStore.puzzles.length === 0" class="text-center py-12">
|
<div v-if="puzzlesStore.puzzles.length === 0" class="text-center py-12">
|
||||||
<div class="text-6xl mb-4">🧩</div>
|
<div class="text-6xl mb-4">🧩</div>
|
||||||
<h3 class="text-xl font-bold mb-2">No Puzzles Available</h3>
|
<h3 class="text-xl font-bold mb-2">No Puzzles Available</h3>
|
||||||
<p class="text-base-content/70">Check back later for new puzzle collections!</p>
|
<p class="text-base-content/70">
|
||||||
|
Check back later for new puzzle collections!
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Submission Modal -->
|
<!-- Submission Modal -->
|
||||||
<div v-if="submissionsStore.isSubmissionModalOpen" class="modal modal-open">
|
<div v-if="isSubmissionModalOpen" class="modal modal-open">
|
||||||
<div class="modal-box max-w-4xl">
|
<div class="modal-box max-w-6xl">
|
||||||
<div class="flex justify-between items-center mb-4">
|
<div class="flex justify-between items-center mb-4">
|
||||||
<h3 class="font-bold text-lg">Submit Solution</h3>
|
<h3 class="font-bold text-lg">Submit Solution</h3>
|
||||||
<button
|
<button
|
||||||
@ -268,7 +239,6 @@ const reloadPage = () => {
|
|||||||
<SubmissionForm
|
<SubmissionForm
|
||||||
:puzzles="puzzlesStore.puzzles"
|
:puzzles="puzzlesStore.puzzles"
|
||||||
:find-puzzle-by-name="findPuzzleByName"
|
:find-puzzle-by-name="findPuzzleByName"
|
||||||
@submit="handleSubmission"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-backdrop" @click="closeSubmissionModal"></div>
|
<div class="modal-backdrop" @click="closeSubmissionModal"></div>
|
||||||
|
|||||||
@ -10,19 +10,27 @@
|
|||||||
<div class="stats stats-vertical lg:stats-horizontal shadow mb-6">
|
<div class="stats stats-vertical lg:stats-horizontal shadow mb-6">
|
||||||
<div class="stat">
|
<div class="stat">
|
||||||
<div class="stat-title">Total Submissions</div>
|
<div class="stat-title">Total Submissions</div>
|
||||||
<div class="stat-value text-primary">{{ stats.total_submissions }}</div>
|
<div class="stat-value text-primary">
|
||||||
|
{{ stats.total_submissions }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat">
|
<div class="stat">
|
||||||
<div class="stat-title">Total Responses</div>
|
<div class="stat-title">Total Responses</div>
|
||||||
<div class="stat-value text-secondary">{{ stats.total_responses }}</div>
|
<div class="stat-value text-secondary">
|
||||||
|
{{ stats.total_responses }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat">
|
<div class="stat">
|
||||||
<div class="stat-title">Need Validation</div>
|
<div class="stat-title">Need Validation</div>
|
||||||
<div class="stat-value text-warning">{{ stats.needs_validation }}</div>
|
<div class="stat-value text-warning">
|
||||||
|
{{ stats.needs_validation }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat">
|
<div class="stat">
|
||||||
<div class="stat-title">Validation Rate</div>
|
<div class="stat-title">Validation Rate</div>
|
||||||
<div class="stat-value text-success">{{ Math.round(stats.validation_rate * 100) }}%</div>
|
<div class="stat-value text-success">
|
||||||
|
{{ Math.round(stats.validation_rate * 100) }}%
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -46,39 +54,50 @@
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr v-for="response in responsesNeedingValidation" :key="response.id">
|
<tr
|
||||||
|
v-for="response in responsesNeedingValidation"
|
||||||
|
:key="response.id"
|
||||||
|
>
|
||||||
<td>
|
<td>
|
||||||
<div class="font-bold">{{ response.puzzle_title }}</div>
|
<div class="font-bold">{{ response.puzzle_name }}</div>
|
||||||
<div class="text-sm opacity-50">ID: {{ response.id }}</div>
|
<div class="text-sm opacity-50">ID: {{ response.id }}</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<div class="text-sm space-y-1">
|
<div class="text-sm space-y-1">
|
||||||
<div class="flex justify-between items-center">
|
<div class="flex justify-between items-center">
|
||||||
<span>Cost: {{ response.cost || '-' }}</span>
|
<span>Cost: {{ response.cost || "-" }}</span>
|
||||||
<span
|
<span
|
||||||
v-if="response.ocr_confidence_cost"
|
v-if="response.ocr_confidence_cost"
|
||||||
class="badge badge-xs"
|
class="badge badge-xs"
|
||||||
:class="getConfidenceBadgeClass(response.ocr_confidence_cost)"
|
:class="
|
||||||
|
getConfidenceBadgeClass(response.ocr_confidence_cost)
|
||||||
|
"
|
||||||
>
|
>
|
||||||
{{ Math.round(response.ocr_confidence_cost * 100) }}%
|
{{ Math.round(response.ocr_confidence_cost * 100) }}%
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex justify-between items-center">
|
<div class="flex justify-between items-center">
|
||||||
<span>Cycles: {{ response.cycles || '-' }}</span>
|
<span>Cycles: {{ response.cycles || "-" }}</span>
|
||||||
<span
|
<span
|
||||||
v-if="response.ocr_confidence_cycles"
|
v-if="response.ocr_confidence_cycles"
|
||||||
class="badge badge-xs"
|
class="badge badge-xs"
|
||||||
:class="getConfidenceBadgeClass(response.ocr_confidence_cycles)"
|
:class="
|
||||||
|
getConfidenceBadgeClass(
|
||||||
|
response.ocr_confidence_cycles,
|
||||||
|
)
|
||||||
|
"
|
||||||
>
|
>
|
||||||
{{ Math.round(response.ocr_confidence_cycles * 100) }}%
|
{{ Math.round(response.ocr_confidence_cycles * 100) }}%
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex justify-between items-center">
|
<div class="flex justify-between items-center">
|
||||||
<span>Area: {{ response.area || '-' }}</span>
|
<span>Area: {{ response.area || "-" }}</span>
|
||||||
<span
|
<span
|
||||||
v-if="response.ocr_confidence_area"
|
v-if="response.ocr_confidence_area"
|
||||||
class="badge badge-xs"
|
class="badge badge-xs"
|
||||||
:class="getConfidenceBadgeClass(response.ocr_confidence_area)"
|
:class="
|
||||||
|
getConfidenceBadgeClass(response.ocr_confidence_area)
|
||||||
|
"
|
||||||
>
|
>
|
||||||
{{ Math.round(response.ocr_confidence_area * 100) }}%
|
{{ Math.round(response.ocr_confidence_area * 100) }}%
|
||||||
</span>
|
</span>
|
||||||
@ -93,11 +112,19 @@
|
|||||||
<td>
|
<td>
|
||||||
<button
|
<button
|
||||||
@click="openValidationModal(response)"
|
@click="openValidationModal(response)"
|
||||||
class="btn btn-sm btn-primary"
|
class="btn btn-sm btn-primary mr-2"
|
||||||
>
|
>
|
||||||
<i class="mdi mdi-check-circle mr-1"></i>
|
<i class="mdi mdi-check-circle mr-1"></i>
|
||||||
Validate
|
Validate
|
||||||
</button>
|
</button>
|
||||||
|
<button
|
||||||
|
v-if="response.id"
|
||||||
|
@click="autoValidation(response.id)"
|
||||||
|
class="btn btn-sm btn-warning"
|
||||||
|
>
|
||||||
|
<i class="mdi mdi-check-circle mr-1"></i>
|
||||||
|
Auto Validation
|
||||||
|
</button>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
@ -108,7 +135,9 @@
|
|||||||
<div v-else class="text-center py-8">
|
<div v-else class="text-center py-8">
|
||||||
<i class="mdi mdi-check-all text-6xl text-success opacity-50"></i>
|
<i class="mdi mdi-check-all text-6xl text-success opacity-50"></i>
|
||||||
<p class="text-lg font-medium mt-2">All responses validated!</p>
|
<p class="text-lg font-medium mt-2">All responses validated!</p>
|
||||||
<p class="text-sm opacity-70">No responses currently need manual validation.</p>
|
<p class="text-sm opacity-70">
|
||||||
|
No responses currently need manual validation.
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -118,21 +147,26 @@
|
|||||||
<div class="modal-box w-11/12 max-w-5xl">
|
<div class="modal-box w-11/12 max-w-5xl">
|
||||||
<h3 class="font-bold text-lg mb-4">Validate Response</h3>
|
<h3 class="font-bold text-lg mb-4">Validate Response</h3>
|
||||||
|
|
||||||
<div v-for="file in validationModal.response.files">
|
<div v-for="file in validationModal.response?.files ?? []">
|
||||||
<img :src="file.file_url">
|
<img :src="file.file_url" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mockup-code w-full">
|
||||||
|
<pre><code>{{ validationModal}}</code></pre>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="validationModal.response" class="space-y-4">
|
<div v-if="validationModal.response" class="space-y-4">
|
||||||
<div class="alert alert-info">
|
<div class="alert alert-info">
|
||||||
<i class="mdi mdi-information-outline"></i>
|
<i class="mdi mdi-information-outline"></i>
|
||||||
<div>
|
<div>
|
||||||
<div class="font-bold">{{ validationModal.response.puzzle_title }}</div>
|
<div class="font-bold">
|
||||||
|
{{ validationModal.response.puzzle_name }}
|
||||||
|
</div>
|
||||||
<div class="text-sm">Review and correct the OCR data below</div>
|
<div class="text-sm">Review and correct the OCR data below</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="grid grid-cols-4 gap-4">
|
<div class="grid grid-cols-4 gap-4">
|
||||||
|
|
||||||
<div class="form-control">
|
<div class="form-control">
|
||||||
<label class="label">
|
<label class="label">
|
||||||
<span class="label-text">Puzzle</span>
|
<span class="label-text">Puzzle</span>
|
||||||
@ -161,7 +195,7 @@
|
|||||||
type="text"
|
type="text"
|
||||||
class="input input-bordered input-sm"
|
class="input input-bordered input-sm"
|
||||||
:placeholder="validationModal.response.cost || 'Enter cost'"
|
:placeholder="validationModal.response.cost || 'Enter cost'"
|
||||||
>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form-control">
|
<div class="form-control">
|
||||||
@ -173,7 +207,7 @@
|
|||||||
type="text"
|
type="text"
|
||||||
class="input input-bordered input-sm"
|
class="input input-bordered input-sm"
|
||||||
:placeholder="validationModal.response.cycles || 'Enter cycles'"
|
:placeholder="validationModal.response.cycles || 'Enter cycles'"
|
||||||
>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form-control">
|
<div class="form-control">
|
||||||
@ -185,19 +219,24 @@
|
|||||||
type="text"
|
type="text"
|
||||||
class="input input-bordered input-sm"
|
class="input input-bordered input-sm"
|
||||||
:placeholder="validationModal.response.area || 'Enter area'"
|
:placeholder="validationModal.response.area || 'Enter area'"
|
||||||
>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="modal-action">
|
<div class="modal-action">
|
||||||
<button @click="closeValidationModal" class="btn btn-ghost">Cancel</button>
|
<button @click="closeValidationModal" class="btn btn-ghost">
|
||||||
|
Cancel
|
||||||
|
</button>
|
||||||
<button
|
<button
|
||||||
@click="submitValidation"
|
@click="submitValidation"
|
||||||
class="btn btn-primary"
|
class="btn btn-primary"
|
||||||
:disabled="isValidating"
|
:disabled="isValidating"
|
||||||
>
|
>
|
||||||
<span v-if="isValidating" class="loading loading-spinner loading-sm"></span>
|
<span
|
||||||
{{ isValidating ? 'Validating...' : 'Validate' }}
|
v-if="isValidating"
|
||||||
|
class="loading loading-spinner loading-sm"
|
||||||
|
></span>
|
||||||
|
{{ isValidating ? "Validating..." : "Validate" }}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -207,11 +246,11 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from 'vue'
|
import { ref, onMounted } from "vue";
|
||||||
import { apiService } from '@/services/apiService'
|
import { apiService } from "@/services/apiService";
|
||||||
import type { PuzzleResponse } from '@/types'
|
import type { PuzzleResponse } from "@/types";
|
||||||
import {usePuzzlesStore} from '@/stores/puzzles'
|
import { usePuzzlesStore } from "@/stores/puzzles";
|
||||||
const puzzlesStore = usePuzzlesStore()
|
const puzzlesStore = usePuzzlesStore();
|
||||||
|
|
||||||
// Reactive data
|
// Reactive data
|
||||||
const stats = ref({
|
const stats = ref({
|
||||||
@ -219,160 +258,178 @@ const stats = ref({
|
|||||||
total_responses: 0,
|
total_responses: 0,
|
||||||
needs_validation: 0,
|
needs_validation: 0,
|
||||||
validated_submissions: 0,
|
validated_submissions: 0,
|
||||||
validation_rate: 0
|
validation_rate: 0,
|
||||||
})
|
});
|
||||||
|
|
||||||
const responsesNeedingValidation = ref<PuzzleResponse[]>([])
|
const responsesNeedingValidation = ref<PuzzleResponse[]>([]);
|
||||||
const isLoading = ref(false)
|
const isLoading = ref(false);
|
||||||
const isValidating = ref(false)
|
const isValidating = ref(false);
|
||||||
|
|
||||||
const validationModal = ref({
|
const validationModal = ref({
|
||||||
show: false,
|
show: false,
|
||||||
response: null as PuzzleResponse | null,
|
response: null as PuzzleResponse | null,
|
||||||
data: {
|
data: {
|
||||||
puzzle_title: '',
|
puzzle: -1,
|
||||||
validated_cost: '',
|
validated_cost: "",
|
||||||
validated_cycles: '',
|
validated_cycles: "",
|
||||||
validated_area: ''
|
validated_area: "",
|
||||||
}
|
},
|
||||||
})
|
});
|
||||||
|
|
||||||
// Methods
|
// Methods
|
||||||
const loadData = async () => {
|
const loadData = async () => {
|
||||||
try {
|
try {
|
||||||
isLoading.value = true
|
isLoading.value = true;
|
||||||
|
|
||||||
// Load stats (skip if endpoint doesn't exist)
|
// Load stats (skip if endpoint doesn't exist)
|
||||||
try {
|
try {
|
||||||
const statsResponse = await apiService.getStats()
|
const statsResponse = await apiService.getStats();
|
||||||
if (statsResponse.data) {
|
if (statsResponse.data) {
|
||||||
stats.value = statsResponse.data
|
stats.value = statsResponse.data;
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.warn('Stats endpoint not available:', error)
|
console.warn("Stats endpoint not available:", error);
|
||||||
// Set default stats
|
// Set default stats
|
||||||
stats.value = {
|
stats.value = {
|
||||||
total_submissions: 0,
|
total_submissions: 0,
|
||||||
total_responses: 0,
|
total_responses: 0,
|
||||||
needs_validation: 0,
|
needs_validation: 0,
|
||||||
validated_submissions: 0,
|
validated_submissions: 0,
|
||||||
validation_rate: 0
|
validation_rate: 0,
|
||||||
}
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
// Load responses needing validation
|
// Load responses needing validation
|
||||||
const responsesResponse = await apiService.getResponsesNeedingValidation()
|
const responsesResponse = await apiService.getResponsesNeedingValidation();
|
||||||
if (responsesResponse.data) {
|
if (responsesResponse.data) {
|
||||||
responsesNeedingValidation.value = responsesResponse.data
|
responsesNeedingValidation.value = responsesResponse.data;
|
||||||
}
|
}
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Failed to load admin data:', error)
|
console.error("Failed to load admin data:", error);
|
||||||
} finally {
|
} finally {
|
||||||
isLoading.value = false
|
isLoading.value = false;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const autoValidationResponse = async () => {
|
const autoValidationResponse = async () => {
|
||||||
for (const response of Array.from(responsesNeedingValidation.value)) {
|
for (const response of Array.from(responsesNeedingValidation.value)) {
|
||||||
const {data, error} = await apiService.autoValidateResponses(response.id)
|
if (!response.id) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
const { data, error } = await apiService.autoValidateResponses(response.id);
|
||||||
|
|
||||||
|
if (data && !data.needs_manual_validation) {
|
||||||
|
// Remove from validation list
|
||||||
|
responsesNeedingValidation.value =
|
||||||
|
responsesNeedingValidation.value.filter((r) => r.id !== response.id);
|
||||||
|
stats.value.needs_validation -= 1;
|
||||||
|
} else if (error) {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const openValidationModal = (response: PuzzleResponse) => {
|
||||||
|
validationModal.value.response = response;
|
||||||
|
validationModal.value.data = {
|
||||||
|
puzzle: response.puzzle || -1,
|
||||||
|
validated_cost: response.cost || "",
|
||||||
|
validated_cycles: response.cycles || "",
|
||||||
|
validated_area: response.area || "",
|
||||||
|
};
|
||||||
|
validationModal.value.show = true;
|
||||||
|
};
|
||||||
|
|
||||||
|
const closeValidationModal = () => {
|
||||||
|
validationModal.value.show = false;
|
||||||
|
validationModal.value.response = null;
|
||||||
|
validationModal.value.data = {
|
||||||
|
puzzle: -1,
|
||||||
|
validated_cost: "",
|
||||||
|
validated_cycles: "",
|
||||||
|
validated_area: "",
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
const autoValidation = async (id: number) => {
|
||||||
|
const { data } = await apiService.autoValidateResponses(id);
|
||||||
|
console.log(data);
|
||||||
|
|
||||||
if (data && !data.needs_manual_validation) {
|
if (data && !data.needs_manual_validation) {
|
||||||
// Remove from validation list
|
// Remove from validation list
|
||||||
responsesNeedingValidation.value = responsesNeedingValidation.value.filter(
|
responsesNeedingValidation.value = responsesNeedingValidation.value.filter(
|
||||||
r => r.id !== response.id
|
(r) => r.id !== id,
|
||||||
)
|
);
|
||||||
stats.value.needs_validation -= 1
|
console.log(stats.value);
|
||||||
|
stats.value.needs_validation -= 1;
|
||||||
} else if (error) {
|
console.log(stats.value);
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const openValidationModal = (response: PuzzleResponse) => {
|
|
||||||
validationModal.value.response = response
|
|
||||||
validationModal.value.data = {
|
|
||||||
puzzle: response.puzzle || '',
|
|
||||||
validated_cost: response.cost || '',
|
|
||||||
validated_cycles: response.cycles || '',
|
|
||||||
validated_area: response.area || ''
|
|
||||||
}
|
|
||||||
validationModal.value.show = true
|
|
||||||
}
|
|
||||||
|
|
||||||
const closeValidationModal = () => {
|
|
||||||
validationModal.value.show = false
|
|
||||||
validationModal.value.response = null
|
|
||||||
validationModal.value.data = {
|
|
||||||
puzzle: '',
|
|
||||||
validated_cost: '',
|
|
||||||
validated_cycles: '',
|
|
||||||
validated_area: ''
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const submitValidation = async () => {
|
const submitValidation = async () => {
|
||||||
if (!validationModal.value.response?.id) return
|
if (!validationModal.value.response?.id) return;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
isValidating.value = true
|
isValidating.value = true;
|
||||||
|
|
||||||
const response = await apiService.validateResponse(
|
const response = await apiService.validateResponse(
|
||||||
validationModal.value.response.id,
|
validationModal.value.response.id,
|
||||||
validationModal.value.data
|
validationModal.value.data,
|
||||||
)
|
);
|
||||||
|
|
||||||
if (response.error) {
|
if (response.error) {
|
||||||
alert(`Validation failed: ${response.error}`)
|
alert(`Validation failed: ${response.error}`);
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Remove from validation list
|
// Remove from validation list
|
||||||
responsesNeedingValidation.value = responsesNeedingValidation.value.filter(
|
responsesNeedingValidation.value = responsesNeedingValidation.value.filter(
|
||||||
r => r.id !== validationModal.value.response?.id
|
(r) => r.id !== validationModal.value.response?.id,
|
||||||
)
|
);
|
||||||
|
|
||||||
// Update stats
|
// Update stats
|
||||||
stats.value.needs_validation = Math.max(0, stats.value.needs_validation - 1)
|
stats.value.needs_validation = Math.max(
|
||||||
|
0,
|
||||||
closeValidationModal()
|
stats.value.needs_validation - 1,
|
||||||
|
);
|
||||||
|
|
||||||
|
closeValidationModal();
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Validation error:', error)
|
console.error("Validation error:", error);
|
||||||
alert('Validation failed')
|
alert("Validation failed");
|
||||||
} finally {
|
} finally {
|
||||||
isValidating.value = false
|
isValidating.value = false;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
// Lifecycle
|
// Lifecycle
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
loadData()
|
loadData();
|
||||||
})
|
});
|
||||||
|
|
||||||
// Helper functions for confidence display
|
// Helper functions for confidence display
|
||||||
const getConfidenceBadgeClass = (confidence: number): string => {
|
const getConfidenceBadgeClass = (confidence: number): string => {
|
||||||
if (confidence >= 0.8) return 'badge-success'
|
if (confidence >= 0.8) return "badge-success";
|
||||||
if (confidence >= 0.6) return 'badge-warning'
|
if (confidence >= 0.6) return "badge-warning";
|
||||||
return 'badge-error'
|
return "badge-error";
|
||||||
}
|
};
|
||||||
|
|
||||||
const getOverallConfidence = (response: PuzzleResponse): number => {
|
const getOverallConfidence = (response: PuzzleResponse): number => {
|
||||||
const confidences = [
|
const confidences = [
|
||||||
response.ocr_confidence_cost,
|
response.ocr_confidence_cost,
|
||||||
response.ocr_confidence_cycles,
|
response.ocr_confidence_cycles,
|
||||||
response.ocr_confidence_area
|
response.ocr_confidence_area,
|
||||||
].filter(conf => conf !== undefined && conf !== null) as number[]
|
].filter((conf) => conf !== undefined && conf !== null) as number[];
|
||||||
|
|
||||||
if (confidences.length === 0) return 0
|
if (confidences.length === 0) return 0;
|
||||||
|
|
||||||
const average = confidences.reduce((sum, conf) => sum + conf, 0) / confidences.length
|
const average =
|
||||||
return Math.round(average * 100)
|
confidences.reduce((sum, conf) => sum + conf, 0) / confidences.length;
|
||||||
}
|
return Math.round(average * 100);
|
||||||
|
};
|
||||||
|
|
||||||
// Expose refresh method
|
// Expose refresh method
|
||||||
defineExpose({
|
defineExpose({
|
||||||
refresh: loadData
|
refresh: loadData,
|
||||||
})
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -20,10 +20,12 @@
|
|||||||
accept="image/*,.gif"
|
accept="image/*,.gif"
|
||||||
class="hidden"
|
class="hidden"
|
||||||
@change="handleFileSelect"
|
@change="handleFileSelect"
|
||||||
>
|
/>
|
||||||
|
|
||||||
<div v-if="files.length === 0" class="space-y-4">
|
<div v-if="submissionFiles.length === 0" class="space-y-4">
|
||||||
<div class="mx-auto w-12 h-12 text-base-content/40 flex items-center justify-center">
|
<div
|
||||||
|
class="mx-auto w-12 h-12 text-base-content/40 flex items-center justify-center"
|
||||||
|
>
|
||||||
<i class="mdi mdi-cloud-upload text-5xl"></i>
|
<i class="mdi mdi-cloud-upload text-5xl"></i>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
@ -42,9 +44,9 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else class="space-y-4">
|
<div v-else class="space-y-4">
|
||||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
|
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2 gap-4">
|
||||||
<div
|
<div
|
||||||
v-for="(file, index) in files"
|
v-for="(file, index) in submissionFiles"
|
||||||
:key="index"
|
:key="index"
|
||||||
class="relative group"
|
class="relative group"
|
||||||
>
|
>
|
||||||
@ -53,13 +55,15 @@
|
|||||||
:src="file.preview"
|
:src="file.preview"
|
||||||
:alt="file.file.name"
|
:alt="file.file.name"
|
||||||
class="w-full h-full object-cover"
|
class="w-full h-full object-cover"
|
||||||
>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="absolute inset-0 bg-black/50 opacity-0 group-hover:opacity-100 transition-opacity duration-200 rounded-lg flex items-center justify-center">
|
<div
|
||||||
|
class="absolute inset-0 bg-black/80 opacity-0 group-hover:opacity-100 transition-opacity duration-200 rounded-lg flex items-center justify-center"
|
||||||
|
>
|
||||||
<button
|
<button
|
||||||
@click="removeFile(index)"
|
@click="removeFile(index)"
|
||||||
class="btn btn-error btn-sm btn-circle"
|
class="btn btn-error btn-lg btn-circle"
|
||||||
>
|
>
|
||||||
<i class="mdi mdi-close"></i>
|
<i class="mdi mdi-close"></i>
|
||||||
</button>
|
</button>
|
||||||
@ -68,11 +72,15 @@
|
|||||||
<div class="mt-2">
|
<div class="mt-2">
|
||||||
<p class="text-xs font-medium truncate">{{ file.file.name }}</p>
|
<p class="text-xs font-medium truncate">{{ file.file.name }}</p>
|
||||||
<p class="text-xs text-base-content/60">
|
<p class="text-xs text-base-content/60">
|
||||||
{{ formatFileSize(file.file.size) }} • {{ file.type.toUpperCase() }}
|
{{ formatFileSize(file.file.size) }} •
|
||||||
|
{{ file.type.toUpperCase() }}
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<!-- OCR Status and Results -->
|
<!-- OCR Status and Results -->
|
||||||
<div v-if="file.ocrProcessing" class="mt-1 flex items-center gap-1">
|
<div
|
||||||
|
v-if="file.ocrProcessing"
|
||||||
|
class="mt-1 flex items-center gap-1"
|
||||||
|
>
|
||||||
<span class="loading loading-spinner loading-xs"></span>
|
<span class="loading loading-spinner loading-xs"></span>
|
||||||
<span class="text-xs text-info">Extracting puzzle data...</span>
|
<span class="text-xs text-info">Extracting puzzle data...</span>
|
||||||
</div>
|
</div>
|
||||||
@ -88,14 +96,16 @@
|
|||||||
<span
|
<span
|
||||||
v-if="file.ocrData.confidence"
|
v-if="file.ocrData.confidence"
|
||||||
class="badge badge-xs"
|
class="badge badge-xs"
|
||||||
:class="getConfidenceBadgeClass(file.ocrData.confidence.overall)"
|
:class="
|
||||||
|
getConfidenceBadgeClass(file.ocrData.confidence.overall)
|
||||||
|
"
|
||||||
:title="`Overall confidence: ${Math.round(file.ocrData.confidence.overall * 100)}%`"
|
:title="`Overall confidence: ${Math.round(file.ocrData.confidence.overall * 100)}%`"
|
||||||
>
|
>
|
||||||
{{ Math.round(file.ocrData.confidence.overall * 100) }}%
|
{{ Math.round(file.ocrData.confidence.overall * 100) }}%
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<button
|
<button
|
||||||
@click="retryOCR(file)"
|
@click="processOCR(file)"
|
||||||
class="btn btn-xs btn-ghost"
|
class="btn btn-xs btn-ghost"
|
||||||
title="Retry OCR"
|
title="Retry OCR"
|
||||||
>
|
>
|
||||||
@ -152,7 +162,9 @@
|
|||||||
<i class="mdi mdi-alert-circle text-lg"></i>
|
<i class="mdi mdi-alert-circle text-lg"></i>
|
||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<div class="font-medium">Low OCR Confidence</div>
|
<div class="font-medium">Low OCR Confidence</div>
|
||||||
<div class="text-xs">Please select the correct puzzle manually</div>
|
<div class="text-xs">
|
||||||
|
Please select the correct puzzle manually
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-2">
|
<div class="mt-2">
|
||||||
@ -174,7 +186,12 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Manual OCR trigger for non-auto detected files -->
|
<!-- Manual OCR trigger for non-auto detected files -->
|
||||||
<div v-else-if="!file.ocrProcessing && !file.ocrError && !file.ocrData" class="mt-1">
|
<div
|
||||||
|
v-else-if="
|
||||||
|
!file.ocrProcessing && !file.ocrError && !file.ocrData
|
||||||
|
"
|
||||||
|
class="mt-1"
|
||||||
|
>
|
||||||
<button
|
<button
|
||||||
@click="processOCR(file)"
|
@click="processOCR(file)"
|
||||||
class="btn btn-xs btn-outline"
|
class="btn btn-xs btn-outline"
|
||||||
@ -206,199 +223,146 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, watch, nextTick } from 'vue'
|
import { ref, watch, nextTick } from "vue";
|
||||||
import { ocrService } from '@/services/ocrService'
|
import { ocrService } from "@/services/ocrService";
|
||||||
import { usePuzzlesStore } from '@/stores/puzzles'
|
import { usePuzzlesStore } from "@/stores/puzzles";
|
||||||
import type { SubmissionFile, SteamCollectionItem } from '@/types'
|
import { useUploadsStore } from "@/stores/uploads";
|
||||||
|
import type { SubmissionFile } from "@/types";
|
||||||
interface Props {
|
|
||||||
modelValue: SubmissionFile[]
|
|
||||||
puzzles?: SteamCollectionItem[]
|
|
||||||
}
|
|
||||||
|
|
||||||
interface Emits {
|
|
||||||
'update:modelValue': [files: SubmissionFile[]]
|
|
||||||
}
|
|
||||||
|
|
||||||
const props = defineProps<Props>()
|
|
||||||
const emit = defineEmits<Emits>()
|
|
||||||
|
|
||||||
// Pinia store
|
// Pinia store
|
||||||
const puzzlesStore = usePuzzlesStore()
|
const puzzlesStore = usePuzzlesStore();
|
||||||
|
const { submissionFiles, processOCR } = useUploadsStore();
|
||||||
|
|
||||||
const fileInput = ref<HTMLInputElement>()
|
const fileInput = ref<HTMLInputElement>();
|
||||||
const isDragOver = ref(false)
|
const isDragOver = ref(false);
|
||||||
const error = ref('')
|
const error = ref("");
|
||||||
const files = ref<SubmissionFile[]>([])
|
|
||||||
|
|
||||||
// Watch for external changes to modelValue
|
|
||||||
watch(() => props.modelValue, (newFiles) => {
|
|
||||||
files.value = newFiles
|
|
||||||
}, { immediate: true })
|
|
||||||
|
|
||||||
// Watch for internal changes and emit
|
|
||||||
watch(files, (newFiles) => {
|
|
||||||
emit('update:modelValue', newFiles)
|
|
||||||
}, { deep: true })
|
|
||||||
|
|
||||||
// Watch for puzzle changes and update OCR service
|
// Watch for puzzle changes and update OCR service
|
||||||
watch(() => puzzlesStore.puzzles, (newPuzzles) => {
|
watch(
|
||||||
|
() => puzzlesStore.puzzles,
|
||||||
|
(newPuzzles) => {
|
||||||
if (newPuzzles && newPuzzles.length > 0) {
|
if (newPuzzles && newPuzzles.length > 0) {
|
||||||
ocrService.setAvailablePuzzleNames(puzzlesStore.puzzleNames)
|
ocrService.setAvailablePuzzleNames(puzzlesStore.puzzleNames);
|
||||||
}
|
}
|
||||||
}, { immediate: true })
|
},
|
||||||
|
{ immediate: true },
|
||||||
|
);
|
||||||
|
|
||||||
const handleFileSelect = (event: Event) => {
|
const handleFileSelect = (event: Event) => {
|
||||||
const target = event.target as HTMLInputElement
|
const target = event.target as HTMLInputElement;
|
||||||
if (target.files) {
|
if (target.files) {
|
||||||
processFiles(Array.from(target.files))
|
processFiles(Array.from(target.files));
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const handleDrop = (event: DragEvent) => {
|
const handleDrop = (event: DragEvent) => {
|
||||||
event.preventDefault()
|
event.preventDefault();
|
||||||
isDragOver.value = false
|
isDragOver.value = false;
|
||||||
|
|
||||||
if (event.dataTransfer?.files) {
|
if (event.dataTransfer?.files) {
|
||||||
processFiles(Array.from(event.dataTransfer.files))
|
processFiles(Array.from(event.dataTransfer.files));
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const processFiles = async (newFiles: File[]) => {
|
const processFiles = async (newFiles: File[]) => {
|
||||||
error.value = ''
|
error.value = "";
|
||||||
|
|
||||||
for (const file of newFiles) {
|
for (const file of newFiles) {
|
||||||
if (!isValidFile(file)) {
|
if (!isValidFile(file)) {
|
||||||
continue
|
continue;
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const preview = await createPreview(file)
|
const preview = await createPreview(file);
|
||||||
const fileType = file.type.startsWith('image/gif') ? 'gif' : 'image'
|
const fileType = file.type.startsWith("image/gif") ? "gif" : "image";
|
||||||
|
|
||||||
const submissionFile: SubmissionFile = {
|
const submissionFile: SubmissionFile = {
|
||||||
file,
|
file,
|
||||||
|
file_url: "",
|
||||||
preview,
|
preview,
|
||||||
type: fileType,
|
type: fileType,
|
||||||
ocrProcessing: false,
|
ocrProcessing: false,
|
||||||
ocrError: undefined,
|
ocrError: undefined,
|
||||||
ocrData: undefined
|
ocrData: undefined,
|
||||||
}
|
};
|
||||||
|
|
||||||
files.value.push(submissionFile)
|
submissionFiles.push(submissionFile);
|
||||||
|
|
||||||
// Start OCR processing for Opus Magnum images (with delay to ensure reactivity)
|
// Start OCR processing for Opus Magnum images (with delay to ensure reactivity)
|
||||||
if (isOpusMagnumImage(file)) {
|
if (isOpusMagnumImage(file)) {
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
processOCR(submissionFile)
|
processOCR(submissionFile);
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
error.value = `Failed to process ${file.name}`
|
error.value = `Failed to process ${file.name}`;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const isValidFile = (file: File): boolean => {
|
const isValidFile = (file: File): boolean => {
|
||||||
// Check file type
|
// Check file type
|
||||||
if (!file.type.startsWith('image/')) {
|
if (!file.type.startsWith("image/")) {
|
||||||
error.value = `${file.name} is not a valid image file`
|
error.value = `${file.name} is not a valid image file`;
|
||||||
return false
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Check file size (256MB limit)
|
// Check file size (256MB limit)
|
||||||
if (file.size > 256 * 1024 * 1024) {
|
if (file.size > 256 * 1024 * 1024) {
|
||||||
error.value = `${file.name} is too large (max 256MB)`
|
error.value = `${file.name} is too large (max 256MB)`;
|
||||||
return false
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
return true
|
return true;
|
||||||
}
|
};
|
||||||
|
|
||||||
const createPreview = (file: File): Promise<string> => {
|
const createPreview = (file: File): Promise<string> => {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
const reader = new FileReader()
|
const reader = new FileReader();
|
||||||
reader.onload = (e) => resolve(e.target?.result as string)
|
reader.onload = (e) => resolve(e.target?.result as string);
|
||||||
reader.onerror = reject
|
reader.onerror = reject;
|
||||||
reader.readAsDataURL(file)
|
reader.readAsDataURL(file);
|
||||||
})
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
const removeFile = (index: number) => {
|
const removeFile = (index: number) => {
|
||||||
files.value.splice(index, 1)
|
submissionFiles.splice(index, 1);
|
||||||
}
|
};
|
||||||
|
|
||||||
const formatFileSize = (bytes: number): string => {
|
const formatFileSize = (bytes: number): string => {
|
||||||
if (bytes === 0) return '0 Bytes'
|
if (bytes === 0) return "0 Bytes";
|
||||||
|
|
||||||
const k = 1024
|
const k = 1024;
|
||||||
const sizes = ['Bytes', 'KB', 'MB', 'GB']
|
const sizes = ["Bytes", "KB", "MB", "GB"];
|
||||||
const i = Math.floor(Math.log(bytes) / Math.log(k))
|
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||||
|
|
||||||
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]
|
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
|
||||||
}
|
};
|
||||||
|
|
||||||
const isOpusMagnumImage = (file: File): boolean => {
|
const isOpusMagnumImage = (file: File): boolean => {
|
||||||
// Basic heuristic - could be enhanced with actual image analysis
|
// Basic heuristic - could be enhanced with actual image analysis
|
||||||
return file.type.startsWith('image/') && file.size > 50000 // > 50KB likely screenshot
|
return file.type.startsWith("image/") && file.size > 50000; // > 50KB likely screenshot
|
||||||
}
|
};
|
||||||
|
|
||||||
const processOCR = async (submissionFile: SubmissionFile) => {
|
|
||||||
// Find the file in the reactive array to ensure proper reactivity
|
|
||||||
const fileIndex = files.value.findIndex(f => f.file === submissionFile.file)
|
|
||||||
if (fileIndex === -1) return
|
|
||||||
|
|
||||||
// Update the reactive array directly
|
|
||||||
files.value[fileIndex].ocrProcessing = true
|
|
||||||
files.value[fileIndex].ocrError = undefined
|
|
||||||
files.value[fileIndex].ocrData = undefined
|
|
||||||
|
|
||||||
try {
|
|
||||||
console.log('Starting OCR processing for:', submissionFile.file.name)
|
|
||||||
await ocrService.initialize()
|
|
||||||
const ocrData = await ocrService.extractOpusMagnumData(submissionFile.file)
|
|
||||||
console.log('OCR completed:', ocrData)
|
|
||||||
|
|
||||||
// Force reactivity update
|
|
||||||
await nextTick()
|
|
||||||
files.value[fileIndex].ocrData = ocrData
|
|
||||||
|
|
||||||
// Check if puzzle confidence is below 80% and needs manual selection
|
|
||||||
if (ocrData.confidence.puzzle < 0.8) {
|
|
||||||
files.value[fileIndex].needsManualPuzzleSelection = true
|
|
||||||
console.log(`Low puzzle confidence (${Math.round(ocrData.confidence.puzzle * 100)}%) for ${submissionFile.file.name}, requiring manual selection`)
|
|
||||||
} else {
|
|
||||||
files.value[fileIndex].needsManualPuzzleSelection = false
|
|
||||||
}
|
|
||||||
|
|
||||||
await nextTick()
|
|
||||||
} catch (error) {
|
|
||||||
console.error('OCR processing failed:', error)
|
|
||||||
files.value[fileIndex].ocrError = 'Failed to extract puzzle data'
|
|
||||||
} finally {
|
|
||||||
files.value[fileIndex].ocrProcessing = false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const retryOCR = (submissionFile: SubmissionFile) => {
|
|
||||||
processOCR(submissionFile)
|
|
||||||
}
|
|
||||||
|
|
||||||
const getConfidenceBadgeClass = (confidence: number): string => {
|
const getConfidenceBadgeClass = (confidence: number): string => {
|
||||||
if (confidence >= 0.8) return 'badge-success'
|
if (confidence >= 0.8) return "badge-success";
|
||||||
if (confidence >= 0.6) return 'badge-warning'
|
if (confidence >= 0.6) return "badge-warning";
|
||||||
return 'badge-error'
|
return "badge-error";
|
||||||
}
|
};
|
||||||
|
|
||||||
const onManualPuzzleSelection = (submissionFile: SubmissionFile) => {
|
const onManualPuzzleSelection = (submissionFile: SubmissionFile) => {
|
||||||
// Find the file in the reactive array
|
// Find the file in the reactive array
|
||||||
const fileIndex = files.value.findIndex(f => f.file === submissionFile.file)
|
const fileIndex = submissionFiles.findIndex(
|
||||||
if (fileIndex === -1) return
|
(f) => f.file === submissionFile.file,
|
||||||
|
);
|
||||||
|
if (fileIndex === -1) return;
|
||||||
|
|
||||||
// Clear the manual selection requirement once user has selected
|
// Clear the manual selection requirement once user has selected
|
||||||
if (files.value[fileIndex].manualPuzzleSelection) {
|
if (submissionFiles[fileIndex].manualPuzzleSelection) {
|
||||||
files.value[fileIndex].needsManualPuzzleSelection = false
|
submissionFiles[fileIndex].needsManualPuzzleSelection = false;
|
||||||
console.log(`Manual puzzle selection: ${submissionFile.file.name} -> ${files.value[fileIndex].manualPuzzleSelection}`)
|
console.log(
|
||||||
}
|
`Manual puzzle selection: ${submissionFile.file.name} -> ${submissionFiles[fileIndex].manualPuzzleSelection}`,
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -1,21 +1,35 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="card bg-base-100 shadow-xl hover:shadow-2xl transition-shadow duration-300">
|
<div
|
||||||
|
class="card bg-base-100 shadow-xl hover:shadow-2xl transition-shadow duration-300"
|
||||||
|
>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="flex items-start justify-between">
|
<div class="flex items-start justify-between">
|
||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<h3 class="card-title text-lg font-bold">{{ puzzle.title }}</h3>
|
<h3 class="card-title text-lg font-bold">{{ puzzle.title }}</h3>
|
||||||
<p class="text-sm text-base-content/70 mb-2">by {{ puzzle.author_name }}</p>
|
<p class="text-sm text-base-content/70 mb-2">
|
||||||
|
by {{ puzzle.author_name }}
|
||||||
|
</p>
|
||||||
|
|
||||||
<div class="flex items-center gap-2 mb-3">
|
<div class="flex items-center gap-2 mb-3">
|
||||||
<div class="badge badge-primary badge-sm">{{ puzzle.steam_item_id }}</div>
|
<div class="badge badge-primary badge-sm">
|
||||||
<div class="badge badge-ghost badge-sm">Order: {{ puzzle.order_index + 1 }}</div>
|
{{ puzzle.steam_item_id }}
|
||||||
|
</div>
|
||||||
|
<div class="badge badge-ghost badge-sm">
|
||||||
|
Order: {{ puzzle.order_index + 1 }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p v-if="puzzle.description" class="text-sm text-base-content/80 mb-4 line-clamp-2">
|
<p
|
||||||
|
v-if="puzzle.description"
|
||||||
|
class="text-sm text-base-content/80 mb-4"
|
||||||
|
>
|
||||||
{{ puzzle.description }}
|
{{ puzzle.description }}
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<div v-if="puzzle.tags && puzzle.tags.length > 0" class="flex flex-wrap gap-1 mb-4">
|
<div
|
||||||
|
v-if="puzzle.tags && puzzle.tags.length > 0"
|
||||||
|
class="flex flex-wrap gap-1 mb-4"
|
||||||
|
>
|
||||||
<span
|
<span
|
||||||
v-for="tag in puzzle.tags.slice(0, 3)"
|
v-for="tag in puzzle.tags.slice(0, 3)"
|
||||||
:key="tag"
|
:key="tag"
|
||||||
@ -23,7 +37,10 @@
|
|||||||
>
|
>
|
||||||
{{ tag }}
|
{{ tag }}
|
||||||
</span>
|
</span>
|
||||||
<span v-if="puzzle.tags.length > 3" class="badge badge-outline badge-xs">
|
<span
|
||||||
|
v-if="puzzle.tags.length > 3"
|
||||||
|
class="badge badge-outline badge-xs"
|
||||||
|
>
|
||||||
+{{ puzzle.tags.length - 3 }} more
|
+{{ puzzle.tags.length - 3 }} more
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
@ -45,7 +62,9 @@
|
|||||||
<!-- Responses Table -->
|
<!-- Responses Table -->
|
||||||
<div v-if="responses && responses.length > 0" class="mt-6">
|
<div v-if="responses && responses.length > 0" class="mt-6">
|
||||||
<div class="divider">
|
<div class="divider">
|
||||||
<span class="text-sm font-medium">Solutions ({{ responses.length }})</span>
|
<span class="text-sm font-medium"
|
||||||
|
>Solutions ({{ responses.length }})</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
@ -59,32 +78,59 @@
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr v-for="response in responses" :key="response.id" class="hover">
|
<tr
|
||||||
|
v-for="response in responses"
|
||||||
|
:key="response.id"
|
||||||
|
class="hover"
|
||||||
|
>
|
||||||
<td>
|
<td>
|
||||||
<span v-if="response.final_cost || response.cost" class="badge badge-success badge-xs">
|
<span
|
||||||
|
v-if="response.final_cost || response.cost"
|
||||||
|
class="badge badge-success badge-xs"
|
||||||
|
>
|
||||||
{{ response.final_cost || response.cost }}
|
{{ response.final_cost || response.cost }}
|
||||||
</span>
|
</span>
|
||||||
<span v-else class="text-base-content/50">-</span>
|
<span v-else class="text-base-content/50">-</span>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<span v-if="response.final_cycles || response.cycles" class="badge badge-info badge-xs">
|
<span
|
||||||
|
v-if="response.final_cycles || response.cycles"
|
||||||
|
class="badge badge-info badge-xs"
|
||||||
|
>
|
||||||
{{ response.final_cycles || response.cycles }}
|
{{ response.final_cycles || response.cycles }}
|
||||||
</span>
|
</span>
|
||||||
<span v-else class="text-base-content/50">-</span>
|
<span v-else class="text-base-content/50">-</span>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<span v-if="response.final_area || response.area" class="badge badge-warning badge-xs">
|
<span
|
||||||
|
v-if="response.final_area || response.area"
|
||||||
|
class="badge badge-warning badge-xs"
|
||||||
|
>
|
||||||
{{ response.final_area || response.area }}
|
{{ response.final_area || response.area }}
|
||||||
</span>
|
</span>
|
||||||
<span v-else class="text-base-content/50">-</span>
|
<span v-else class="text-base-content/50">-</span>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<div class="flex items-center gap-1">
|
<div class="flex items-center gap-1">
|
||||||
<span class="badge badge-ghost badge-xs">{{ response.files?.length || 0 }}</span>
|
<span class="badge badge-ghost badge-xs">{{
|
||||||
<div v-if="response.files?.length" class="tooltip" :data-tip="response.files.map(f => f.original_filename || f.file?.name).join(', ')">
|
response.files?.length || 0
|
||||||
|
}}</span>
|
||||||
|
<div
|
||||||
|
v-if="response.files?.length"
|
||||||
|
class="tooltip"
|
||||||
|
:data-tip="
|
||||||
|
response.files
|
||||||
|
.map((f) => f.original_filename || f.file?.name)
|
||||||
|
.join(', ')
|
||||||
|
"
|
||||||
|
>
|
||||||
<i class="mdi mdi-information-outline text-xs"></i>
|
<i class="mdi mdi-information-outline text-xs"></i>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="response.needs_manual_validation" class="tooltip" data-tip="Needs manual validation">
|
<div
|
||||||
|
v-if="response.needs_manual_validation"
|
||||||
|
class="tooltip"
|
||||||
|
data-tip="Needs manual validation"
|
||||||
|
>
|
||||||
<i class="mdi mdi-alert-circle text-xs text-warning"></i>
|
<i class="mdi mdi-alert-circle text-xs text-warning"></i>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -96,33 +142,31 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- No responses state -->
|
<!-- No responses state -->
|
||||||
<div v-else class="mt-6 text-center py-4 border-2 border-dashed border-base-300 rounded-lg">
|
<div
|
||||||
|
v-else
|
||||||
|
class="mt-6 text-center py-4 border-2 border-dashed border-base-300 rounded-lg hover:border-primary transition-colors duration-300 cursor-pointer"
|
||||||
|
@click="openSubmissionModal"
|
||||||
|
>
|
||||||
<i class="mdi mdi-upload text-2xl text-base-content/40"></i>
|
<i class="mdi mdi-upload text-2xl text-base-content/40"></i>
|
||||||
<p class="text-sm text-base-content/60 mt-2">No solutions yet</p>
|
<p class="text-sm text-base-content/60 mt-2">No solutions yet</p>
|
||||||
<p class="text-xs text-base-content/40">Upload solutions using the submit button</p>
|
<p class="text-xs text-base-content/40">
|
||||||
|
Upload solutions using the submit button
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import type { SteamCollectionItem, PuzzleResponse } from '@/types'
|
import type { SteamCollectionItem, PuzzleResponse } from "@/types";
|
||||||
|
import { useSubmissionsStore } from "@/stores/submissions";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
puzzle: SteamCollectionItem
|
puzzle: SteamCollectionItem;
|
||||||
responses?: PuzzleResponse[]
|
responses?: PuzzleResponse[];
|
||||||
}
|
}
|
||||||
|
|
||||||
defineProps<Props>()
|
defineProps<Props>();
|
||||||
|
|
||||||
// Utility functions removed - not used in template
|
const { openSubmissionModal } = useSubmissionsStore();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.line-clamp-2 {
|
|
||||||
display: -webkit-box;
|
|
||||||
-webkit-line-clamp: 2;
|
|
||||||
-webkit-box-orient: vertical;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|||||||
@ -8,31 +8,54 @@
|
|||||||
|
|
||||||
<form @submit.prevent="handleSubmit" class="space-y-6">
|
<form @submit.prevent="handleSubmit" class="space-y-6">
|
||||||
<!-- Detected Puzzles Summary -->
|
<!-- Detected Puzzles Summary -->
|
||||||
<div v-if="Object.keys(responsesByPuzzle).length > 0" class="alert alert-info">
|
<div
|
||||||
|
v-if="Object.keys(responsesByPuzzle).length > 0"
|
||||||
|
class="alert alert-info"
|
||||||
|
>
|
||||||
<i class="mdi mdi-information-outline text-xl"></i>
|
<i class="mdi mdi-information-outline text-xl"></i>
|
||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<h4 class="font-bold">Detected Puzzles ({{ Object.keys(responsesByPuzzle).length }})</h4>
|
<h4 class="font-bold">
|
||||||
|
Detected Puzzles ({{ Object.keys(responsesByPuzzle).length }})
|
||||||
|
</h4>
|
||||||
<div class="text-sm space-y-1 mt-1">
|
<div class="text-sm space-y-1 mt-1">
|
||||||
<div v-for="(data, puzzleName) in responsesByPuzzle" :key="puzzleName" class="flex justify-between">
|
<div
|
||||||
|
v-for="(data, puzzleName) in responsesByPuzzle"
|
||||||
|
:key="puzzleName"
|
||||||
|
class="flex justify-between"
|
||||||
|
>
|
||||||
<span>{{ puzzleName }}</span>
|
<span>{{ puzzleName }}</span>
|
||||||
<span class="badge badge-ghost badge-sm ml-2">{{ data.files.length }} file(s)</span>
|
<span class="badge badge-ghost badge-sm ml-2"
|
||||||
|
>{{ data.files.length }} file(s)</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- File Upload -->
|
<!-- File Upload -->
|
||||||
<FileUpload v-model="submissionFiles" :puzzles="puzzles" />
|
<FileUpload />
|
||||||
|
|
||||||
<!-- Manual Selection Warning -->
|
<!-- Manual Selection Warning -->
|
||||||
<div v-if="filesNeedingManualSelection.length > 0" class="alert alert-warning">
|
<div
|
||||||
|
v-if="submissionFilesNeedingManualSelection.length > 0"
|
||||||
|
class="alert alert-warning"
|
||||||
|
>
|
||||||
<i class="mdi mdi-alert-circle text-xl"></i>
|
<i class="mdi mdi-alert-circle text-xl"></i>
|
||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<div class="font-bold">Manual Puzzle Selection Required</div>
|
<div class="font-bold">Manual Puzzle Selection Required</div>
|
||||||
<div class="text-sm">
|
<div class="text-sm">
|
||||||
{{ filesNeedingManualSelection.length }} file(s) have low OCR confidence for puzzle names.
|
{{ submissionFilesNeedingManualSelection.length }} file(s) have
|
||||||
Please select the correct puzzle for each file before submitting.
|
low OCR confidence for puzzle names. Please select the correct
|
||||||
|
puzzle for each file before submitting.
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<button
|
||||||
|
class="btn mt-3 w-full"
|
||||||
|
@click="processLowConfidenceOCRFiles"
|
||||||
|
>
|
||||||
|
<span class="mdi mdi-reload text-2xl"></span>
|
||||||
|
Retry OCR on low confidence puzzle
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -59,13 +82,20 @@
|
|||||||
type="checkbox"
|
type="checkbox"
|
||||||
v-model="manualValidationRequested"
|
v-model="manualValidationRequested"
|
||||||
class="checkbox checkbox-primary"
|
class="checkbox checkbox-primary"
|
||||||
|
:disabled="hasLowConfidence"
|
||||||
/>
|
/>
|
||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<span class="label-text font-medium">Request manual validation</span>
|
<span class="label-text font-medium"
|
||||||
|
>Request manual validation</span
|
||||||
|
>
|
||||||
<div class="label-text-alt text-xs opacity-70 mt-1">
|
<div class="label-text-alt text-xs opacity-70 mt-1">
|
||||||
Check this if you want an admin to manually review your submission, even if OCR confidence is high.
|
Check this if you want an admin to manually review your
|
||||||
<br>
|
submission, even if OCR confidence is high.
|
||||||
<em>Note: This will be automatically checked if any OCR confidence is below 50%.</em>
|
<br />
|
||||||
|
<em
|
||||||
|
>Note: This will be automatically checked if any OCR
|
||||||
|
confidence is below 80%.</em
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</label>
|
</label>
|
||||||
@ -73,15 +103,15 @@
|
|||||||
|
|
||||||
<!-- Submit Button -->
|
<!-- Submit Button -->
|
||||||
<div class="card-actions justify-end">
|
<div class="card-actions justify-end">
|
||||||
<button
|
<button type="submit" class="btn btn-primary" :disabled="!canSubmit">
|
||||||
type="submit"
|
<span
|
||||||
class="btn btn-primary"
|
v-if="isSubmitting"
|
||||||
:disabled="!canSubmit"
|
class="loading loading-spinner loading-sm"
|
||||||
>
|
></span>
|
||||||
<span v-if="isSubmitting" class="loading loading-spinner loading-sm"></span>
|
|
||||||
<span v-if="isSubmitting">Submitting...</span>
|
<span v-if="isSubmitting">Submitting...</span>
|
||||||
<span v-else-if="filesNeedingManualSelection.length > 0">
|
<span v-else-if="submissionFilesNeedingManualSelection.length > 0">
|
||||||
Select Puzzles ({{ filesNeedingManualSelection.length }} remaining)
|
Select Puzzles ({{ submissionFilesNeedingManualSelection.length }}
|
||||||
|
remaining)
|
||||||
</span>
|
</span>
|
||||||
<span v-else>Submit Solution</span>
|
<span v-else>Submit Solution</span>
|
||||||
</button>
|
</button>
|
||||||
@ -92,104 +122,97 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, watch } from 'vue'
|
import { ref, computed, watch } from "vue";
|
||||||
import FileUpload from '@/components/FileUpload.vue'
|
import FileUpload from "@/components/FileUpload.vue";
|
||||||
import type { SteamCollectionItem, SubmissionFile } from '@/types'
|
import type { SteamCollectionItem, SubmissionFile } from "@/types";
|
||||||
|
import { useUploadsStore } from "@/stores/uploads";
|
||||||
|
import { useSubmissionsStore } from "@/stores/submissions";
|
||||||
|
import { storeToRefs } from "pinia";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
puzzles: SteamCollectionItem[]
|
puzzles: SteamCollectionItem[];
|
||||||
findPuzzleByName: (name: string) => SteamCollectionItem | null
|
findPuzzleByName: (name: string) => SteamCollectionItem | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Emits {
|
const props = defineProps<Props>();
|
||||||
submit: [submissionData: { files: SubmissionFile[], notes?: string, manualValidationRequested?: boolean }]
|
|
||||||
}
|
|
||||||
|
|
||||||
const props = defineProps<Props>()
|
const uploadsStore = useUploadsStore();
|
||||||
const emit = defineEmits<Emits>()
|
const {
|
||||||
|
submissionFiles,
|
||||||
|
hasLowConfidence,
|
||||||
|
submissionFilesNeedingManualSelection,
|
||||||
|
} = storeToRefs(uploadsStore);
|
||||||
|
const { clearFiles, processLowConfidenceOCRFiles } = uploadsStore;
|
||||||
|
const { handleSubmission } = useSubmissionsStore();
|
||||||
|
|
||||||
const submissionFiles = ref<SubmissionFile[]>([])
|
const notes = ref("");
|
||||||
const notes = ref('')
|
const manualValidationRequested = ref(false);
|
||||||
const manualValidationRequested = ref(false)
|
const isSubmitting = ref(false);
|
||||||
const isSubmitting = ref(false)
|
|
||||||
|
|
||||||
const notesLength = computed(() => notes.value.length)
|
const notesLength = computed(() => notes.value.length);
|
||||||
|
|
||||||
const canSubmit = computed(() => {
|
const canSubmit = computed(() => {
|
||||||
const hasFiles = submissionFiles.value.length > 0
|
const hasFiles = submissionFiles.value.length > 0;
|
||||||
const noManualSelectionNeeded = !submissionFiles.value.some(file => file.needsManualPuzzleSelection)
|
const noManualSelectionNeeded = !submissionFiles.value.some(
|
||||||
|
(file) => file.needsManualPuzzleSelection,
|
||||||
|
);
|
||||||
|
|
||||||
return hasFiles &&
|
return hasFiles && !isSubmitting.value && noManualSelectionNeeded;
|
||||||
!isSubmitting.value &&
|
});
|
||||||
noManualSelectionNeeded
|
|
||||||
})
|
watch(hasLowConfidence, (newValue) => {
|
||||||
|
if (newValue) {
|
||||||
|
manualValidationRequested.value = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// Group files by detected puzzle
|
// Group files by detected puzzle
|
||||||
const responsesByPuzzle = computed(() => {
|
const responsesByPuzzle = computed(() => {
|
||||||
const grouped: Record<string, { puzzle: SteamCollectionItem | null, files: SubmissionFile[] }> = {}
|
const grouped: Record<
|
||||||
|
string,
|
||||||
|
{ puzzle: SteamCollectionItem | null; files: SubmissionFile[] }
|
||||||
|
> = {};
|
||||||
|
|
||||||
submissionFiles.value.forEach(file => {
|
submissionFiles.value.forEach((file) => {
|
||||||
// Use manual puzzle selection if available, otherwise fall back to OCR
|
// Use manual puzzle selection if available, otherwise fall back to OCR
|
||||||
const puzzleName = file.manualPuzzleSelection || file.ocrData?.puzzle
|
const puzzleName = file.manualPuzzleSelection || file.ocrData?.puzzle;
|
||||||
|
|
||||||
if (puzzleName) {
|
if (puzzleName) {
|
||||||
if (!grouped[puzzleName]) {
|
if (!grouped[puzzleName]) {
|
||||||
grouped[puzzleName] = {
|
grouped[puzzleName] = {
|
||||||
puzzle: props.findPuzzleByName(puzzleName),
|
puzzle: props.findPuzzleByName(puzzleName),
|
||||||
files: []
|
files: [],
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
grouped[puzzleName].files.push(file);
|
||||||
}
|
}
|
||||||
grouped[puzzleName].files.push(file)
|
});
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
return grouped
|
return grouped;
|
||||||
})
|
});
|
||||||
|
|
||||||
// Count files that need manual puzzle selection
|
|
||||||
const filesNeedingManualSelection = computed(() => {
|
|
||||||
return submissionFiles.value.filter(file => file.needsManualPuzzleSelection)
|
|
||||||
})
|
|
||||||
|
|
||||||
// Check if any OCR confidence is below 50%
|
|
||||||
const hasLowConfidence = computed(() => {
|
|
||||||
return submissionFiles.value.some(file => {
|
|
||||||
if (!file.ocrData?.confidence) return false
|
|
||||||
return file.ocrData.confidence.cost < 0.5 ||
|
|
||||||
file.ocrData.confidence.cycles < 0.5 ||
|
|
||||||
file.ocrData.confidence.area < 0.5
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
// Auto-check manual validation when confidence is low
|
|
||||||
watch(hasLowConfidence, (newValue) => {
|
|
||||||
if (newValue && !manualValidationRequested.value) {
|
|
||||||
manualValidationRequested.value = true
|
|
||||||
}
|
|
||||||
}, { immediate: true })
|
|
||||||
|
|
||||||
const handleSubmit = async () => {
|
const handleSubmit = async () => {
|
||||||
if (!canSubmit.value) return
|
if (!canSubmit.value) return;
|
||||||
|
|
||||||
isSubmitting.value = true
|
isSubmitting.value = true;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
// Emit the files and notes for the parent to handle API submission
|
// Emit the files and notes for the store to handle API submission
|
||||||
emit('submit', {
|
handleSubmission({
|
||||||
files: submissionFiles.value,
|
files: submissionFiles.value,
|
||||||
notes: notes.value.trim() || undefined,
|
notes: notes.value.trim() || undefined,
|
||||||
manualValidationRequested: manualValidationRequested.value
|
manualValidationRequested:
|
||||||
})
|
hasLowConfidence.value || manualValidationRequested.value,
|
||||||
|
});
|
||||||
|
|
||||||
// Reset form
|
// Reset form
|
||||||
submissionFiles.value = []
|
clearFiles();
|
||||||
notes.value = ''
|
notes.value = "";
|
||||||
manualValidationRequested.value = false
|
manualValidationRequested.value = false;
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Submission error:', error)
|
console.error("Submission error:", error);
|
||||||
} finally {
|
} finally {
|
||||||
isSubmitting.value = false
|
isSubmitting.value = false;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -235,7 +235,7 @@ export class OpusMagnumOCRService {
|
|||||||
cost: confidenceScores.cost || 0,
|
cost: confidenceScores.cost || 0,
|
||||||
cycles: confidenceScores.cycles || 0,
|
cycles: confidenceScores.cycles || 0,
|
||||||
area: confidenceScores.area || 0,
|
area: confidenceScores.area || 0,
|
||||||
overall: overallConfidence
|
overall: overallConfidence,
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
|
|||||||
@ -3,6 +3,7 @@ import { ref } from 'vue'
|
|||||||
import type { Submission, SubmissionFile } from '@/types'
|
import type { Submission, SubmissionFile } from '@/types'
|
||||||
import { submissionHelpers } from '@/services/apiService'
|
import { submissionHelpers } from '@/services/apiService'
|
||||||
import { usePuzzlesStore } from '@/stores/puzzles'
|
import { usePuzzlesStore } from '@/stores/puzzles'
|
||||||
|
import { errorHelpers } from "@/services/apiService";
|
||||||
|
|
||||||
export const useSubmissionsStore = defineStore('submissions', () => {
|
export const useSubmissionsStore = defineStore('submissions', () => {
|
||||||
// State
|
// State
|
||||||
@ -83,6 +84,49 @@ export const useSubmissionsStore = defineStore('submissions', () => {
|
|||||||
await loadSubmissions()
|
await loadSubmissions()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleSubmission = async (submissionData: {
|
||||||
|
files: any[];
|
||||||
|
notes?: string;
|
||||||
|
manualValidationRequested?: boolean;
|
||||||
|
}) => {
|
||||||
|
try {
|
||||||
|
isLoading.value = true;
|
||||||
|
error.value = "";
|
||||||
|
|
||||||
|
// Create submission via store
|
||||||
|
const submission = await createSubmission(
|
||||||
|
submissionData.files,
|
||||||
|
submissionData.notes,
|
||||||
|
submissionData.manualValidationRequested,
|
||||||
|
);
|
||||||
|
|
||||||
|
// Show success message
|
||||||
|
if (submission) {
|
||||||
|
const puzzleNames = submission.responses
|
||||||
|
.map((r) => r.puzzle_name)
|
||||||
|
.join(", ");
|
||||||
|
|
||||||
|
alert(`Solutions submitted successfully for puzzles: ${puzzleNames}`);
|
||||||
|
|
||||||
|
} else {
|
||||||
|
alert("Submission created successfully!");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Close modal
|
||||||
|
closeSubmissionModal();
|
||||||
|
|
||||||
|
} catch (err) {
|
||||||
|
|
||||||
|
const errorMessage = errorHelpers.getErrorMessage(err);
|
||||||
|
error.value = errorMessage;
|
||||||
|
alert(`Submission failed: ${errorMessage}`);
|
||||||
|
|
||||||
|
console.error("Submission error:", err);
|
||||||
|
} finally {
|
||||||
|
isLoading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
// State
|
// State
|
||||||
submissions,
|
submissions,
|
||||||
@ -95,6 +139,7 @@ export const useSubmissionsStore = defineStore('submissions', () => {
|
|||||||
createSubmission,
|
createSubmission,
|
||||||
openSubmissionModal,
|
openSubmissionModal,
|
||||||
closeSubmissionModal,
|
closeSubmissionModal,
|
||||||
refreshSubmissions
|
refreshSubmissions,
|
||||||
|
handleSubmission
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
103
opus_submitter/src/stores/uploads.ts
Normal file
103
opus_submitter/src/stores/uploads.ts
Normal file
@ -0,0 +1,103 @@
|
|||||||
|
import { SubmissionFile } from '@/types'
|
||||||
|
import { defineStore } from 'pinia'
|
||||||
|
import { ref, nextTick, computed } from "vue";
|
||||||
|
import { ocrService } from "@/services/ocrService";
|
||||||
|
|
||||||
|
const CONFIDENCE_VALUE = 0.8;
|
||||||
|
|
||||||
|
export const useUploadsStore = defineStore('uploads', () => {
|
||||||
|
const submissionFiles = ref<SubmissionFile[]>([])
|
||||||
|
|
||||||
|
const isProcessingOCR = computed(() =>
|
||||||
|
submissionFiles.value.some(item => item.ocrProcessing)
|
||||||
|
);
|
||||||
|
|
||||||
|
const hasLowConfidence = computed(() =>
|
||||||
|
submissionFiles.value.some(file => {
|
||||||
|
return isLowConfidence(file)
|
||||||
|
})
|
||||||
|
)
|
||||||
|
|
||||||
|
const submissionFilesNeedingManualSelection = computed(() => {
|
||||||
|
return submissionFiles.value.filter(file => file.needsManualPuzzleSelection)
|
||||||
|
})
|
||||||
|
|
||||||
|
const isLowConfidence = (file: SubmissionFile) => {
|
||||||
|
if (!file.ocrData?.confidence) return false;
|
||||||
|
return (
|
||||||
|
file.ocrData.confidence.cost < CONFIDENCE_VALUE ||
|
||||||
|
file.ocrData.confidence.cycles < CONFIDENCE_VALUE ||
|
||||||
|
file.ocrData.confidence.area < CONFIDENCE_VALUE
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const processOCR = async (submissionFile: SubmissionFile) => {
|
||||||
|
while (isProcessingOCR.value) {
|
||||||
|
const waitingTimeMs = Math.floor(Math.random() * 400) + 100;
|
||||||
|
console.log(`OCR is already processing, waiting ${waitingTimeMs}ms...`);
|
||||||
|
await new Promise((res) => setTimeout(res, waitingTimeMs));
|
||||||
|
}
|
||||||
|
|
||||||
|
const index = submissionFiles.value.indexOf(submissionFile)
|
||||||
|
|
||||||
|
// Update the reactive array directly
|
||||||
|
submissionFiles.value[index].ocrProcessing = true;
|
||||||
|
submissionFiles.value[index].ocrError = undefined;
|
||||||
|
submissionFiles.value[index].ocrData = undefined;
|
||||||
|
|
||||||
|
try {
|
||||||
|
console.log("Starting OCR processing for:", submissionFile.file.name);
|
||||||
|
await ocrService.initialize();
|
||||||
|
const ocrData = await ocrService.extractOpusMagnumData(submissionFile.file);
|
||||||
|
console.log("OCR completed:", ocrData);
|
||||||
|
|
||||||
|
// Force reactivity update
|
||||||
|
await nextTick();
|
||||||
|
submissionFiles.value[index].ocrData = ocrData;
|
||||||
|
|
||||||
|
// Check if puzzle confidence is below CONFIDENCE_VALUE and needs manual selection
|
||||||
|
if (ocrData.confidence.puzzle < CONFIDENCE_VALUE) {
|
||||||
|
submissionFiles.value[index].needsManualPuzzleSelection = true;
|
||||||
|
console.log(
|
||||||
|
`Low puzzle confidence (${Math.round(ocrData.confidence.puzzle * 100)}%) for ${submissionFile.file.name}, requiring manual selection`,
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
submissionFiles.value[index].needsManualPuzzleSelection = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
await nextTick();
|
||||||
|
} catch (error) {
|
||||||
|
console.error("OCR processing failed:", error);
|
||||||
|
submissionFiles.value[index].ocrError = "Failed to extract puzzle data";
|
||||||
|
|
||||||
|
} finally {
|
||||||
|
submissionFiles.value[index].ocrProcessing = false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const processLowConfidenceOCRFiles = async () => {
|
||||||
|
const files = submissionFiles.value.filter(file => isLowConfidence(file))
|
||||||
|
|
||||||
|
for (const file of files) {
|
||||||
|
processOCR(file)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const clearFiles = () => {
|
||||||
|
submissionFiles.value = []
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
submissionFiles,
|
||||||
|
submissionFilesNeedingManualSelection,
|
||||||
|
processOCR,
|
||||||
|
processLowConfidenceOCRFiles,
|
||||||
|
clearFiles,
|
||||||
|
|
||||||
|
// computed
|
||||||
|
isProcessingOCR,
|
||||||
|
hasLowConfidence,
|
||||||
|
|
||||||
|
CONFIDENCE_VALUE
|
||||||
|
}
|
||||||
|
})
|
||||||
@ -40,6 +40,7 @@ export interface OpusMagnumData {
|
|||||||
|
|
||||||
export interface SubmissionFile {
|
export interface SubmissionFile {
|
||||||
file: File
|
file: File
|
||||||
|
file_url: string
|
||||||
preview: string
|
preview: string
|
||||||
type: 'image' | 'gif'
|
type: 'image' | 'gif'
|
||||||
ocrData?: OpusMagnumData
|
ocrData?: OpusMagnumData
|
||||||
@ -52,7 +53,8 @@ export interface SubmissionFile {
|
|||||||
|
|
||||||
export interface PuzzleResponse {
|
export interface PuzzleResponse {
|
||||||
id?: number
|
id?: number
|
||||||
puzzle: number | SteamCollectionItem
|
// puzzle: number | SteamCollectionItem
|
||||||
|
puzzle: number
|
||||||
puzzle_name: string
|
puzzle_name: string
|
||||||
cost?: string
|
cost?: string
|
||||||
cycles?: string
|
cycles?: string
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
21
opus_submitter/static_source/vite/assets/main-NIi3b_aN.js
Normal file
21
opus_submitter/static_source/vite/assets/main-NIi3b_aN.js
Normal file
File diff suppressed because one or more lines are too long
@ -16,12 +16,12 @@
|
|||||||
"src": "node_modules/.pnpm/@mdi+font@7.4.47/node_modules/@mdi/font/fonts/materialdesignicons-webfont.woff2"
|
"src": "node_modules/.pnpm/@mdi+font@7.4.47/node_modules/@mdi/font/fonts/materialdesignicons-webfont.woff2"
|
||||||
},
|
},
|
||||||
"src/main.ts": {
|
"src/main.ts": {
|
||||||
"file": "assets/main-B14l8Jy0.js",
|
"file": "assets/main-NIi3b_aN.js",
|
||||||
"name": "main",
|
"name": "main",
|
||||||
"src": "src/main.ts",
|
"src": "src/main.ts",
|
||||||
"isEntry": true,
|
"isEntry": true,
|
||||||
"css": [
|
"css": [
|
||||||
"assets/main-COx9N9qO.css"
|
"assets/main-CYuvChoP.css"
|
||||||
],
|
],
|
||||||
"assets": [
|
"assets": [
|
||||||
"assets/materialdesignicons-webfont-CSr8KVlo.eot",
|
"assets/materialdesignicons-webfont-CSr8KVlo.eot",
|
||||||
|
|||||||
@ -33,11 +33,9 @@ def list_puzzles(request):
|
|||||||
@paginate
|
@paginate
|
||||||
def list_submissions(request):
|
def list_submissions(request):
|
||||||
"""Get paginated list of submissions"""
|
"""Get paginated list of submissions"""
|
||||||
return (
|
return Submission.objects.prefetch_related(
|
||||||
Submission.objects.prefetch_related("responses__files", "responses__puzzle")
|
"responses__files", "responses__puzzle"
|
||||||
.filter(user=request.user)
|
).filter(user=request.user)
|
||||||
.filter()
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
@router.get("/submissions/{submission_id}", response=SubmissionOut)
|
@router.get("/submissions/{submission_id}", response=SubmissionOut)
|
||||||
@ -70,19 +68,19 @@ def create_submission(
|
|||||||
|
|
||||||
try:
|
try:
|
||||||
with transaction.atomic():
|
with transaction.atomic():
|
||||||
# Check if any confidence score is below 50% to auto-request validation
|
# Check if any confidence score is below 80% to auto-request validation
|
||||||
auto_request_validation = any(
|
auto_request_validation = any(
|
||||||
(
|
(
|
||||||
response_data.ocr_confidence_cost is not None
|
response_data.ocr_confidence_cost is not None
|
||||||
and response_data.ocr_confidence_cost < 0.5
|
and response_data.ocr_confidence_cost < 0.8
|
||||||
)
|
)
|
||||||
or (
|
or (
|
||||||
response_data.ocr_confidence_cycles is not None
|
response_data.ocr_confidence_cycles is not None
|
||||||
and response_data.ocr_confidence_cycles < 0.5
|
and response_data.ocr_confidence_cycles < 0.8
|
||||||
)
|
)
|
||||||
or (
|
or (
|
||||||
response_data.ocr_confidence_area is not None
|
response_data.ocr_confidence_area is not None
|
||||||
and response_data.ocr_confidence_area < 0.5
|
and response_data.ocr_confidence_area < 0.8
|
||||||
)
|
)
|
||||||
for response_data in data.responses
|
for response_data in data.responses
|
||||||
)
|
)
|
||||||
|
|||||||
@ -4,7 +4,7 @@ Django management command to fetch Steam Workshop collections
|
|||||||
|
|
||||||
from django.core.management.base import BaseCommand, CommandError
|
from django.core.management.base import BaseCommand, CommandError
|
||||||
from submissions.utils import create_or_update_collection
|
from submissions.utils import create_or_update_collection
|
||||||
from submissions.models import SteamCollection
|
from submissions.models import SteamAPIKey, SteamCollection
|
||||||
|
|
||||||
|
|
||||||
class Command(BaseCommand):
|
class Command(BaseCommand):
|
||||||
@ -12,11 +12,6 @@ class Command(BaseCommand):
|
|||||||
|
|
||||||
def add_arguments(self, parser):
|
def add_arguments(self, parser):
|
||||||
parser.add_argument("url", type=str, help="Steam Workshop collection URL")
|
parser.add_argument("url", type=str, help="Steam Workshop collection URL")
|
||||||
parser.add_argument(
|
|
||||||
"--api-key",
|
|
||||||
type=str,
|
|
||||||
help="Steam API key (optional, can also be set via STEAM_API_KEY environment variable)",
|
|
||||||
)
|
|
||||||
parser.add_argument(
|
parser.add_argument(
|
||||||
"--force",
|
"--force",
|
||||||
action="store_true",
|
action="store_true",
|
||||||
@ -25,16 +20,23 @@ class Command(BaseCommand):
|
|||||||
|
|
||||||
def handle(self, *args, **options):
|
def handle(self, *args, **options):
|
||||||
url = options["url"]
|
url = options["url"]
|
||||||
api_key = options.get("api_key")
|
|
||||||
force = options["force"]
|
force = options["force"]
|
||||||
|
|
||||||
self.stdout.write(f"Fetching Steam collection from: {url}")
|
self.stdout.write(f"Fetching Steam collection from: {url}")
|
||||||
|
|
||||||
|
api_key = SteamAPIKey.objects.filter(is_active=True).first()
|
||||||
|
|
||||||
|
if not api_key:
|
||||||
|
self.stderr.write(f"No API key defined! Aborting...")
|
||||||
|
return
|
||||||
|
|
||||||
|
self.stdout.write(f"Using api key: {api_key}")
|
||||||
|
|
||||||
try:
|
try:
|
||||||
# Check if collection already exists
|
# Check if collection already exists
|
||||||
from submissions.utils import SteamCollectionFetcher
|
from submissions.utils import SteamCollectionFetcher
|
||||||
|
|
||||||
fetcher = SteamCollectionFetcher(api_key)
|
fetcher = SteamCollectionFetcher(api_key.api_key)
|
||||||
collection_id = fetcher.extract_collection_id(url)
|
collection_id = fetcher.extract_collection_id(url)
|
||||||
|
|
||||||
if collection_id and not force:
|
if collection_id and not force:
|
||||||
|
|||||||
@ -497,20 +497,15 @@ def verify_and_validate_ocr_date_for_submission(file: SubmissionFile):
|
|||||||
)
|
)
|
||||||
|
|
||||||
valid_count = 0
|
valid_count = 0
|
||||||
if r.cost == ocr_data[1]:
|
for index, field in enumerate(["cost", "cycles", "area"]):
|
||||||
r.validated_cost = r.cost
|
value = getattr(r, field, -1)
|
||||||
|
|
||||||
|
if value == ocr_data[index + 1]:
|
||||||
|
setattr(r, f"validated_{field}", value)
|
||||||
valid_count += 1
|
valid_count += 1
|
||||||
|
|
||||||
if r.cycles == ocr_data[2]:
|
else:
|
||||||
r.validated_cycles = r.cycles
|
setattr(r, field, ocr_data[index + 1])
|
||||||
valid_count += 1
|
|
||||||
|
|
||||||
if r.area == ocr_data[3]:
|
r.needs_manual_validation = valid_count != 3
|
||||||
r.validated_area = r.area
|
|
||||||
valid_count += 1
|
|
||||||
|
|
||||||
if valid_count == 3:
|
|
||||||
r.needs_manual_validation = False
|
|
||||||
|
|
||||||
if valid_count:
|
|
||||||
r.save()
|
r.save()
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
@ -6,7 +6,10 @@ import tailwindcss from '@tailwindcss/vite';
|
|||||||
// https://vitejs.dev/config/
|
// https://vitejs.dev/config/
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
base: '/static/',
|
base: '/static/',
|
||||||
plugins: [vue(), tailwindcss()],
|
plugins: [
|
||||||
|
vue(),
|
||||||
|
tailwindcss(),
|
||||||
|
],
|
||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
||||||
@ -18,5 +21,5 @@ export default defineConfig({
|
|||||||
rollupOptions: {
|
rollupOptions: {
|
||||||
input: { main: resolve('./src/main.ts') }
|
input: { main: resolve('./src/main.ts') }
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@ -7,7 +7,10 @@ import tailwindcss from '@tailwindcss/vite'
|
|||||||
// https://vitejs.dev/config/
|
// https://vitejs.dev/config/
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
base: '/static/',
|
base: '/static/',
|
||||||
plugins: [vue(), tailwindcss()],
|
plugins: [
|
||||||
|
vue(),
|
||||||
|
tailwindcss(),
|
||||||
|
],
|
||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
||||||
@ -20,6 +23,5 @@ export default defineConfig({
|
|||||||
input:
|
input:
|
||||||
{ main: resolve('./src/main.ts') }
|
{ main: resolve('./src/main.ts') }
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
@ -21,6 +21,7 @@ build-backend = "setuptools.build_meta"
|
|||||||
|
|
||||||
[dependency-groups]
|
[dependency-groups]
|
||||||
dev = [
|
dev = [
|
||||||
|
"django-extensions>=4.1",
|
||||||
"django-stubs>=5.2.7",
|
"django-stubs>=5.2.7",
|
||||||
"django-stubs-ext>=5.2.7",
|
"django-stubs-ext>=5.2.7",
|
||||||
"django-types>=0.22.0",
|
"django-types>=0.22.0",
|
||||||
|
|||||||
14
uv.lock
14
uv.lock
@ -185,6 +185,18 @@ wheels = [
|
|||||||
{ url = "https://files.pythonhosted.org/packages/8f/ef/81f3372b5dd35d8d354321155d1a38894b2b766f576d0abffac4d8ae78d9/django-5.2.7-py3-none-any.whl", hash = "sha256:59a13a6515f787dec9d97a0438cd2efac78c8aca1c80025244b0fe507fe0754b", size = 8307145, upload-time = "2025-10-01T14:22:49.476Z" },
|
{ url = "https://files.pythonhosted.org/packages/8f/ef/81f3372b5dd35d8d354321155d1a38894b2b766f576d0abffac4d8ae78d9/django-5.2.7-py3-none-any.whl", hash = "sha256:59a13a6515f787dec9d97a0438cd2efac78c8aca1c80025244b0fe507fe0754b", size = 8307145, upload-time = "2025-10-01T14:22:49.476Z" },
|
||||||
]
|
]
|
||||||
|
|
||||||
|
[[package]]
|
||||||
|
name = "django-extensions"
|
||||||
|
version = "4.1"
|
||||||
|
source = { registry = "https://pypi.org/simple" }
|
||||||
|
dependencies = [
|
||||||
|
{ name = "django" },
|
||||||
|
]
|
||||||
|
sdist = { url = "https://files.pythonhosted.org/packages/6d/b3/ed0f54ed706ec0b54fd251cc0364a249c6cd6c6ec97f04dc34be5e929eac/django_extensions-4.1.tar.gz", hash = "sha256:7b70a4d28e9b840f44694e3f7feb54f55d495f8b3fa6c5c0e5e12bcb2aa3cdeb", size = 283078, upload-time = "2025-04-11T01:15:39.617Z" }
|
||||||
|
wheels = [
|
||||||
|
{ url = "https://files.pythonhosted.org/packages/64/96/d967ca440d6a8e3861120f51985d8e5aec79b9a8bdda16041206adfe7adc/django_extensions-4.1-py3-none-any.whl", hash = "sha256:0699a7af28f2523bf8db309a80278519362cd4b6e1fd0a8cd4bf063e1e023336", size = 232980, upload-time = "2025-04-11T01:15:37.701Z" },
|
||||||
|
]
|
||||||
|
|
||||||
[[package]]
|
[[package]]
|
||||||
name = "django-ninja"
|
name = "django-ninja"
|
||||||
version = "1.4.5"
|
version = "1.4.5"
|
||||||
@ -504,6 +516,7 @@ dependencies = [
|
|||||||
|
|
||||||
[package.dev-dependencies]
|
[package.dev-dependencies]
|
||||||
dev = [
|
dev = [
|
||||||
|
{ name = "django-extensions" },
|
||||||
{ name = "django-stubs" },
|
{ name = "django-stubs" },
|
||||||
{ name = "django-stubs-ext" },
|
{ name = "django-stubs-ext" },
|
||||||
{ name = "django-types" },
|
{ name = "django-types" },
|
||||||
@ -530,6 +543,7 @@ requires-dist = [
|
|||||||
|
|
||||||
[package.metadata.requires-dev]
|
[package.metadata.requires-dev]
|
||||||
dev = [
|
dev = [
|
||||||
|
{ name = "django-extensions", specifier = ">=4.1" },
|
||||||
{ name = "django-stubs", specifier = ">=5.2.7" },
|
{ name = "django-stubs", specifier = ">=5.2.7" },
|
||||||
{ name = "django-stubs-ext", specifier = ">=5.2.7" },
|
{ name = "django-stubs-ext", specifier = ">=5.2.7" },
|
||||||
{ name = "django-types", specifier = ">=0.22.0" },
|
{ name = "django-types", specifier = ">=0.22.0" },
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user