Remove warnings about 'defineProps', 'defineEmits' being compiler macros

This commit is contained in:
Jonathan Bourdon
2024-07-24 16:36:48 -04:00
parent 5ec1078705
commit 0d94d79c77
13 changed files with 104 additions and 106 deletions

View File

@@ -41,19 +41,19 @@
</div>
<div>
<div>
<div>
<h2 class="font-sans font-semibold">Commentaires</h2>
<message-list :subject-id="props.content.id" :messages="messages">
</message-list>
</div>
<div class="border-t-2 border-gray-300 mt-4 pt-4">
<post-message :subject-id="props.content.id" @message-posted="addMessage">
</post-message>
</div>
</div>
</div>
@@ -62,7 +62,7 @@
<script setup>
import {defineProps, computed, reactive} from 'vue';
import {computed, reactive} from 'vue';
import {time_ago} from "@/internal_time_ago.js";
import MessageList from "@/views/messages/MessageList.vue";
import PostMessage from "@/views/messages/PostMessage.vue";

View File

@@ -4,10 +4,10 @@
:onLoad="load">
<template v-for="content in contents">
<ContentCard :content="content"
class="w-full p-2 my-2"
>
</ContentCard>
<ContentCard :content="content"
class="w-full p-2 my-2"
>
</ContentCard>
</template>
<template v-slot:empty>
@@ -27,7 +27,7 @@
<script setup>
import {useClient} from '@/plugins/api.js';
import {defineProps, ref} from 'vue';
import {ref} from 'vue';
import ContentCard from "./ContentCard.vue";
const props = defineProps({

View File

@@ -65,7 +65,7 @@
<script setup>
import {useClient} from '@/plugins/api.js';
import {defineProps, ref} from 'vue';
import {ref} from 'vue';
import {useUserStore} from '@/stores/user.js';
const props = defineProps({

View File

@@ -58,7 +58,7 @@
// import posts from "@/views/posts/posts.json";
import {useClient} from '@/plugins/api.js';
import {defineProps, ref} from 'vue';
import {ref} from 'vue';
import PostContentMenu from "@/views/contents/PostContentMenu.vue";
const props = defineProps({

View File

@@ -86,11 +86,10 @@
</template>
<script setup>
import { ref, defineProps } from 'vue';
import MyUserModel from "@/models/myUserModel.js";
const props = defineProps({
user: { type: MyUserModel },
user: {type: MyUserModel},
});
const dateRule = value => {

View File

@@ -82,7 +82,6 @@
<script setup>
import CreatePostButton from "@/views/contents/CreatePostButton.vue";
import {defineProps} from "vue";
import SizeIndicator from "@/views/tools/SizeIndicator.vue";
import AboutYou from "@/views/creators/CreatorDescriptionBtn.vue";

View File

@@ -8,7 +8,6 @@
</template>
<script setup>
import { defineProps } from 'vue';
defineProps({
creator: {

View File

@@ -1,33 +1,33 @@
<template>
<div class="fixed z-50 bottom-6 right-6 flex flex-column">
<div
v-if="showPopup"
ref="popup"
class="z-50 shadow-md shadow-gray-500 rounded-2xl"
>
<div class="bg-fuchsia-900 p-4 rounded-t-2xl font-semibold self-center text-white text-center">
Je Soutiens!
</div>
<div class="bg-gray-100 rounded-b-2xl p-4">
<div class="mx-2">
<StripePayment :creator-id="creatorId"></StripePayment>
</div>
</div>
<template>
<div class="fixed z-50 bottom-6 right-6 flex flex-column">
<div
v-if="showPopup"
ref="popup"
class="z-50 shadow-md shadow-gray-500 rounded-2xl"
>
<div class="bg-fuchsia-900 p-4 rounded-t-2xl font-semibold self-center text-white text-center">
Je Soutiens!
</div>
<div
@click="togglePopup"
ref="popupButton"
class="bg-purple rounded-full w-16 h-16 flex justify-center items-center self-end mt-4 cursor-pointer"
style="background: radial-gradient(circle, rgba(163,14,121,1) 50%, rgba(107,0,101,1) 100%); border: 2px solid white;"
>
<v-icon class="text-2xl">mdi-gift-outline</v-icon>
<div class="bg-gray-100 rounded-b-2xl p-4">
<div class="mx-2">
<StripePayment :creator-id="creatorId"></StripePayment>
</div>
</div>
</div>
<div
@click="togglePopup"
ref="popupButton"
class="bg-purple rounded-full w-16 h-16 flex justify-center items-center self-end mt-4 cursor-pointer"
style="background: radial-gradient(circle, rgba(163,14,121,1) 50%, rgba(107,0,101,1) 100%); border: 2px solid white;"
>
<v-icon class="text-2xl">mdi-gift-outline</v-icon>
</div>
</div>
</template>
<script setup>
import {ref, onMounted, onUnmounted, defineProps} from 'vue';
import {ref, onMounted, onUnmounted} from 'vue';
import StripePayment from "@/views/StripePayment.vue";
const showPopup = ref(false);
@@ -35,7 +35,7 @@ const popup = ref(null);
const popupButton = ref(null);
const props = defineProps({
creatorId: { type: String, required: true },
creatorId: {type: String, required: true},
});

View File

@@ -1,7 +1,7 @@
<template>
<div>
<div>
<div class="px-5 py-2 bg-fuchsia-800 text-white" :style="{ backgroundColor: user.profileColors.menu }" >
<div class="px-5 py-2 bg-fuchsia-800 text-white" :style="{ backgroundColor: user.profileColors.menu }">
<div class="flex justify-center text-2xl">Photo de couverture</div>
</div>
<div>
@@ -61,7 +61,7 @@
ref="profileImageInput"
accept=".png, .jpeg, .jpg"
hint="png, jpeg or jpg"
v-model="profilePicture"
v-model="profilePicture"
label="Téléverser une nouvelle photo de profil"
@change="onProfileFileChange">
</v-file-input>
@@ -85,85 +85,85 @@
</template>
<script setup>
import {ref, defineProps, onMounted} from 'vue';
import MyUserModel from "@/models/myUserModel.js";
const emit = defineEmits(["updateProfilePicture", "updateBannerPicture"]);
const fallbackProfilePictureUrl = '/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile01.png';
const fallbackBannerPictureUrl = '/images/usersmedia/HutopyProfile/banners/banner01.png';
import {ref} from 'vue';
import MyUserModel from "@/models/myUserModel.js";
const props = defineProps({
user: { type: MyUserModel },
});
const bannerImageUrl = ref(props.user.storedDataUrls.bannerPictureUrl);
const profilePictureUrl = ref(props.user.storedDataUrls.profilePictureUrl);
const emit = defineEmits(["updateProfilePicture", "updateBannerPicture"]);
const fallbackProfilePictureUrl = '/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile01.png';
const fallbackBannerPictureUrl = '/images/usersmedia/HutopyProfile/banners/banner01.png';
const bannerImage = ref(null);
const profilePicture = ref(null);
const props = defineProps({
user: {type: MyUserModel},
});
const showColorPicker = ref(false);
const selectedColor = ref('#F4F4F4');
const colorTarget = ref('');
const handleProfileImageError = (event) => {
event.target.src = fallbackProfilePictureUrl;
}
const bannerImageUrl = ref(props.user.storedDataUrls.bannerPictureUrl);
const profilePictureUrl = ref(props.user.storedDataUrls.profilePictureUrl);
const handleBannerImageError = (event) => {
event.target.src = fallbackBannerPictureUrl;
}
const bannerImage = ref(null);
const profilePicture = ref(null);
const onBannerFileChange = (event) => {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (e) => {
const showColorPicker = ref(false);
const selectedColor = ref('#F4F4F4');
const colorTarget = ref('');
const handleProfileImageError = (event) => {
event.target.src = fallbackProfilePictureUrl;
}
const handleBannerImageError = (event) => {
event.target.src = fallbackBannerPictureUrl;
}
const onBannerFileChange = (event) => {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (e) => {
bannerImageUrl.value = e.target.result;
};
reader.readAsDataURL(file);
emit('updateBannerPicture', file);
}
}
};
const onProfileFileChange = (event) => {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (e) => {
const onProfileFileChange = (event) => {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (e) => {
profilePictureUrl.value = e.target.result;
};
reader.readAsDataURL(file);
emit('updateProfilePicture', file);
}
};
const openColorPicker = (target) => {
const openColorPicker = (target) => {
colorTarget.value = target;
showColorPicker.value = true;
};
const applyColor = () => {
const applyColor = () => {
if (colorTarget.value === 'top') {
props.user.profileColors.bannerTop = selectedColor.value;
} else if (colorTarget.value === 'bottom') {
props.user.profileColors.bannerBottom = selectedColor.value;
props.user.profileColors.bannerBottom = selectedColor.value;
} else if (colorTarget.value === 'accent') {
props.user.profileColors.accent = selectedColor.value;
props.user.profileColors.accent = selectedColor.value;
} else if (colorTarget.value === 'menu') {
props.user.profileColors.menu = selectedColor.value;
props.user.profileColors.menu = selectedColor.value;
}
showColorPicker.value = false;
};
showColorPicker.value = false;
};
/// Simple function to determine if the text should be white or black based on the background color
const getTextColor = (bgColor) => {
const color = bgColor.replace('#', '');
const r = parseInt(color.substr(0, 2), 16);
const g = parseInt(color.substr(2, 2), 16);
const b = parseInt(color.substr(4, 2), 16);
const brightness = (r * 299 + g * 587 + b * 114) / 1000;
return brightness > 155 ? '#000' : '#fff';
};
/// Simple function to determine if the text should be white or black based on the background color
const getTextColor = (bgColor) => {
const color = bgColor.replace('#', '');
const r = parseInt(color.substr(0, 2), 16);
const g = parseInt(color.substr(2, 2), 16);
const b = parseInt(color.substr(4, 2), 16);
const brightness = (r * 299 + g * 587 + b * 114) / 1000;
return brightness > 155 ? '#000' : '#fff';
};
</script>

View File

@@ -5,7 +5,8 @@
<div class="flex justify-between items-center mb-2">
<label class="text-lg">Instagram</label>
</div>
<v-text-field v-model="props.user.socialNetworks.instagramUrl" label="Instagram" variant="outlined"></v-text-field>
<v-text-field v-model="props.user.socialNetworks.instagramUrl" label="Instagram"
variant="outlined"></v-text-field>
<div class="flex justify-between items-center mb-2">
<label class="text-lg">TikTok</label>
@@ -30,16 +31,17 @@
<div class="flex justify-between items-center mb-2">
<label class="text-lg">Site Web</label>
</div>
<v-text-field v-model="props.user.socialNetworks.yourWebsiteUrl" label="Site Web" variant="outlined"></v-text-field>
<v-text-field v-model="props.user.socialNetworks.yourWebsiteUrl" label="Site Web"
variant="outlined"></v-text-field>
<div class="flex flex-col space-y-4">
<div class="flex items-center mb-2">
<label class="text-lg mr-4">Icône pour votre site web *svg</label>
<v-file-input
<v-file-input
v-model="iconFile"
accept=".png, .jpeg, .jpg"
hint="png, jpeg or jpg"
label="Téléverser une icône"
label="Téléverser une icône"
@change="onFileChange">
</v-file-input>
</div>
@@ -52,11 +54,11 @@
</template>
<script setup>
import { defineProps, ref } from 'vue';
import {ref} from 'vue';
import MyUserModel from "@/models/myUserModel.js";
const props = defineProps({
user: { type: MyUserModel },
user: {type: MyUserModel},
});
const emit = defineEmits(["updateWebsiteIcon"]);

View File

@@ -57,7 +57,6 @@
<script setup>
import {defineProps} from "vue"
import {time_ago} from "@/internal_time_ago.js";
const props = defineProps({

View File

@@ -37,7 +37,7 @@
import Message from "@/views/messages/Message.vue";
import {useClient} from '@/plugins/api.js';
import {defineProps, onBeforeMount, ref} from 'vue';
import {onBeforeMount, ref} from 'vue';
const props = defineProps({
subjectId: {

View File

@@ -5,7 +5,7 @@
<div class="flex flex-row">
<div class="mx-2 content-center">
<img :src="profileUrl"
alt="Profile Image"
class="rounded-full"
@@ -36,7 +36,7 @@
<script setup>
import {useClient} from '@/plugins/api.js';
import {defineEmits, defineProps, ref} from 'vue';
import {ref} from 'vue';
import {useUserStore} from "@/stores/user.js";
import {v7} from 'uuid'
@@ -64,7 +64,7 @@ const publish = async () => {
"subjectId": props.subjectId,
"message": value.value
})
const currentUser = user.getCurrentUser()
emit('message-posted',
{
@@ -77,7 +77,7 @@ const publish = async () => {
"value": value.value,
parentId: null,
})
value.value = ''
} catch (error) {
console.error(`post api/message : ${error}`)