Adding messaging / content
This commit is contained in:
@@ -1,80 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<button v-if="creator.id === userStore.getCurrentUser().id"
|
||||
class="flex items-center text-white transform transition-transform duration-200 hover:text-gray-300 hover:scale-125 px-4"
|
||||
@click="isDialogActive = true">
|
||||
<v-icon style="font-size: 35px; height: 35px; width: 55px;">mdi-text-box-plus-outline</v-icon>
|
||||
</button>
|
||||
|
||||
<v-dialog v-model="isDialogActive" max-width="500">
|
||||
<template v-slot:default="{ isActive }">
|
||||
<v-card class="text-center rounded-xl">
|
||||
<div class="text-white p-4 rounded-t" :style="{backgroundColor: creator.profileColors.menu || '#A30E79'}">
|
||||
<h2>Publication</h2>
|
||||
</div>
|
||||
<v-card-text class="bg">
|
||||
<v-row class="justify-center mb-4">
|
||||
<v-col class="d-flex align-center justify-end">
|
||||
<v-btn :class="{'v-btn--active': !isArticle}" @click="togglePostType(false)">QUICKY</v-btn>
|
||||
</v-col>
|
||||
<v-col class="d-flex align-center justify-start">
|
||||
<v-btn :class="{'v-btn--active': isArticle}" @click="togglePostType(true)">ARTICLE</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-textarea label="Écrivez votre message ici..." v-model="message" outlined></v-textarea>
|
||||
<v-file-input
|
||||
label="Ajoutez des fichiers"
|
||||
v-model="files"
|
||||
outlined
|
||||
multiple
|
||||
dropzone
|
||||
placeholder="Glissez et déposez des fichiers ici ou cliquez pour sélectionner des fichiers"
|
||||
></v-file-input>
|
||||
</v-card-text>
|
||||
<v-card-actions class="justify-end">
|
||||
<v-btn color="primary" @click="publishPost">Publier</v-btn>
|
||||
<v-btn color="primary" @click="cancelPost">Annuler</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</template>
|
||||
</v-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { defineProps, ref } from 'vue';
|
||||
import { useUserStore } from '@/stores/user.js';
|
||||
|
||||
const props = defineProps({
|
||||
creator: { type: Object, required: true },
|
||||
});
|
||||
|
||||
const userStore = useUserStore();
|
||||
|
||||
const isDialogActive = ref(false);
|
||||
const message = ref('');
|
||||
const files = ref([]);
|
||||
const isArticle = ref(false);
|
||||
|
||||
const publishPost = () => {
|
||||
// Logic to publish post
|
||||
console.log('Post published:', message.value, files.value);
|
||||
isDialogActive.value = false;
|
||||
resetPostForm();
|
||||
};
|
||||
|
||||
const cancelPost = () => {
|
||||
isDialogActive.value = false;
|
||||
resetPostForm();
|
||||
};
|
||||
|
||||
const resetPostForm = () => {
|
||||
message.value = '';
|
||||
files.value = [];
|
||||
};
|
||||
|
||||
const togglePostType = (article) => {
|
||||
isArticle.value = article;
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -81,7 +81,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import CreatePostButton from "@/views/creators/CreatePostButton.vue";
|
||||
import CreatePostButton from "@/views/contents/CreatePostButton.vue";
|
||||
import {defineProps, ref} from "vue";
|
||||
import SeizeIndicator from "@/views/tools/SeizeIndicator.vue";
|
||||
import AboutYou from "@/views/creators/AboutYou.vue";
|
||||
|
||||
@@ -4,38 +4,10 @@
|
||||
<creator-banner :creator="creator"></creator-banner>
|
||||
<DonationPopup :creator-id="creator.id"></DonationPopup>
|
||||
|
||||
<div class="max-w-[1000px] mx-auto flex flex-row justify-center border-l-2 border-r-2 -mt-6 ">
|
||||
<div class="w-full mt-20">
|
||||
|
||||
<v-card-text>
|
||||
<v-tabs-window v-model="tab">
|
||||
<v-tabs-window-item value="content">
|
||||
<div class="w-full h-full p-6">
|
||||
<ContentList v-if="creator.id"
|
||||
:creator-id="creator.id">
|
||||
</ContentList>
|
||||
</div>
|
||||
</v-tabs-window-item>
|
||||
|
||||
<v-tabs-window-item value="community">
|
||||
<div>
|
||||
<div class="border-b-2 p-6">
|
||||
<PostMessage v-if="creator.id"
|
||||
:content-id="creator.id">
|
||||
</PostMessage>
|
||||
</div>
|
||||
|
||||
<div class="border-b p-6">
|
||||
<h2 class="font-sans font-semibold">Commentaires</h2>
|
||||
<MessageList v-if="creator.id"
|
||||
:content-id="creator.id">
|
||||
</MessageList>
|
||||
</div>
|
||||
</div>
|
||||
</v-tabs-window-item>
|
||||
|
||||
</v-tabs-window>
|
||||
</v-card-text>
|
||||
<div class="max-w-[800px] mx-auto flex flex-row justify-center border-l-2 border-r-2 -mt-6 ">
|
||||
<div class="w-full mt-20 h-full">
|
||||
<ContentList :creator-id="creator.id">
|
||||
</ContentList>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -66,8 +38,6 @@ import MessageList from "@/views/messages/MessageList.vue";
|
||||
import ContentList from "@/views/contents/ContentList.vue";
|
||||
import PostMessage from "@/views/messages/PostMessage.vue";
|
||||
import DonationPopup from "@/views/main/DonationPopup.vue";
|
||||
import CreatorFeed from "@/views/main/CreatorFeed.vue";
|
||||
import CreatePostButton from "@/views/creators/CreatePostButton.vue";
|
||||
|
||||
const client = useClient();
|
||||
const route = useRoute();
|
||||
|
||||
Reference in New Issue
Block a user