Initial commit: PC Builder AdonisJS project

2026-06-28 10:41:51 +02:00
commit 648d0af538
144 changed files with 18570 additions and 0 deletions
@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import { router } from '@inertiajs/vue3'
+import { useAdminMode } from '~/composables/isAdminMode'
+
+const props = defineProps({
+  computerId: Number,
+  imageSrc: String,
+  imageAlt: String,
+  title: String,
+  description: String,
+  cost: Number,
+  price: Number,
+})
+
+const { isAdminActive } = useAdminMode()
+
+function goToShow() {
+  router.get(`/computers/${props.computerId}`)
+}
+</script>
+
+<template>
+  <div
+    class="rounded-lg bg-white shadow-secondary-1 dark:bg-surface-dark h-full flex flex-col hover:cursor-pointer"
+    @click="goToShow"
+  >
+    <img class="w-full h-2/3 object-cover" :src="imageSrc" :alt="imageAlt" />
+    <div class="flex flex-col justify-between grow px-6 py-2">
+      <div class="text-xl font-bold text-gray-900 line-clamp-4">
+        {{ props.title }}
+      </div>
+      <div class="flex justify-end mt-auto">
+        <span
+          v-if="isAdminActive"
+          class="inline-block px-3 py-1 mb-2 mr-2 text-sm font-semibold text-gray-700 bg-gray-200 rounded-full"
+        >
+          {{ props.cost?.toFixed(2) }}
+        </span>
+        <span
+          class="inline-block px-3 py-1 mb-2 mr-2 text-sm font-semibold text-gray-700 bg-gray-200 rounded-full"
+        >
+          {{ props.price?.toFixed(2) }}
+        </span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.line-clamp-4 {
+  display: -webkit-box;
+  -webkit-line-clamp: 4;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+</style>