jbourdon/social-media
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Thumbnail - wip

Browse Source
This commit is contained in:
PascalMarchesseault
2024-11-24 01:45:25 -05:00
parent 568a1ffd6c
commit 25c6305bcc
2 changed files with 14 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/views/contents/QuickyContentEditor.vue
View File

@@ -27,7 +27,9 @@ async function publishPost() {
formData.append('creatorId', creatorProfileStore.creator.id); formData.append('creatorId', creatorProfileStore.creator.id);
formData.append('title', title.value); formData.append('title', title.value);
formData.append('description', message.value); formData.append('description', message.value);
formData.append('thumbnail', Thumbnail); if (Thumbnail.value) {
formData.append('thumbnail', Thumbnail.value);
}
files.value.forEach(file => { files.value.forEach(file => {
formData.append('files', file); formData.append('files', file);
@@ -57,7 +59,7 @@ async function publishPost() {
title.value = ''; title.value = '';
message.value = ''; message.value = '';
files.value = []; files.value = [];
Thumbnail.value = null; Thumbnail.value = '';
externalUrls.value = []; externalUrls.value = [];
} catch (error) { } catch (error) {
console.error(error); console.error(error);

13
src/views/contents/contentcards/NContentCard.vue
View File

@@ -17,6 +17,7 @@ const openDeleteConfirmationModal = ref(false);
const emits = defineEmits(['content-deleted']); const emits = defineEmits(['content-deleted']);
const contentId = computed(() => props.content.id); const contentId = computed(() => props.content.id);
const creatorId = computed(() => props.content.createdBy); const creatorId = computed(() => props.content.createdBy);
const Thumbnail = computed(() => props.content.thumbnailUrl);
const branding = useBrandingStore(); const branding = useBrandingStore();
const authStore = useAuthStore(); const authStore = useAuthStore();
const creatorIsCurrentUser = computed(() => authStore.isAuthenticated && authStore.userId === creatorId.value); const creatorIsCurrentUser = computed(() => authStore.isAuthenticated && authStore.userId === creatorId.value);
@@ -59,6 +60,8 @@ function hexToRgb(hex) {
</style> </style>
<template> <template>
<div class="shadow-md rounded-md bg-gray-50 border custom-border w-52 h-[300px]" <div class="shadow-md rounded-md bg-gray-50 border custom-border w-52 h-[300px]"
:style="{ :style="{
backgroundColor: branding.colors.surface, backgroundColor: branding.colors.surface,
@@ -67,10 +70,12 @@ function hexToRgb(hex) {
borderWidth: '1px', borderWidth: '1px',
}"> }">
<img
<img v-if="props.content.urls[0]" :src="props.content.urls[0]" class="rounded-t-md w-[260px] h-[160px] object-cover cursor-pointer" v-if="props.content.thumbnailUrl"
alt="Image Content" @click="redirectToContent" /> :src="props.content.thumbnailUrl.replace(/[{}]/g, '')"
class="rounded-t-md w-[260px] h-[160px] object-cover cursor-pointer"
alt="Image Content"
@click="redirectToContent" />
<div class="p-1"> <div class="p-1">
<div class="flex flex-row justify-between items-center"> <div class="flex flex-row justify-between items-center">