diff options
| -rw-r--r-- | components/ModelBoxCard.vue | 30 |
1 files changed, 7 insertions, 23 deletions
diff --git a/components/ModelBoxCard.vue b/components/ModelBoxCard.vue index 6ac9f43..a6085b7 100644 --- a/components/ModelBoxCard.vue +++ b/components/ModelBoxCard.vue @@ -3,10 +3,11 @@ class="hover:ease-out hover:shadow-md" ) a(:href="'/models/'+model.id") - .image.bg-gray-900.rounded-xl.w-full.h-48 - img( - v-if="coverImage >= 0" - :src="baseAPI + '' + model.uploads[coverImage].filepath" + .image.bg-gray-900.rounded-xl.w-full.h-48.overflow-hidden + file-preview( + :path="model.uploads[0].filepath" + bg="#111827" + v-if="model.uploads" ) .space-y-3.mt-5 @@ -24,38 +25,21 @@ <script> import UserAvatar from "@/components/UserAvatar.vue"; +import FilePreview from "@/components/FilePreview.vue"; export default { name: "ModelBoxCard", props: ["model"], components: { "user-avatar": UserAvatar, + "file-preview": FilePreview, }, data() { return { - coverImage: -1, baseAPI: "", }; }, - methods: { - imageIndex(uploads) { - if (!uploads) return -1; - - for (const i in uploads) { - if ( - uploads[i].filepath.indexOf(".png") || - uploads[i].filepath.indexOf(".jpg") || - uploads[i].filepath.indexOf(".jpeg") || - uploads[i].filepath.indexOf(".webp") - ) - return i; - } - - return -1; - }, - }, created() { - this.coverImage = this.imageIndex(this.model.uploads); this.baseAPI = this.$config.api; }, }; |