@ozdao/prometheus-framework 0.2.222 → 0.2.224

package/src/modules/events/components/pages/EditEvent.vue

@@ -21,6 +21,16 @@
       class="mn-b-semi w-100 bg-light pd-medium radius-small" 
     />
 
+    <h3 class="mn-b-small">Date</h3>
+    <VueDatePicker v-model="date"  range class="z-index-3 radius-small mn-b-semi bg-light" />
+
+   <!--    <Calendar
+        v-model:date="date"
+        :locale="$i18n.locale"
+        :allowRange="false"
+        class="radius-semi w-100 o-hidden bg-light"
+      /> -->
+
     <h3
       v-if="(auth.state.access.roles) && (auth.state.access.roles.includes('ROLE_MODERATOR') || auth.state.access.roles.includes('ROLE_ADMIN'))"
       class="mn-b-small"
@@ -28,21 +38,9 @@
       Tickets
     </h3>
 
-     <div 
-      v-if="(auth.state.access.roles) && (auth.state.access.roles.includes('ROLE_MODERATOR') || auth.state.access.roles.includes('ROLE_ADMIN'))"
-      class="mn-b-semi w-100 bg-light pd-medium radius-small"
-      @click="router.push({
-        name: 'Edit Event Tickets',
-        params: {
-          url: route.params.url
-        }
-      })"
-    >
-      Edit tickets
-    </div>
   
     <h3
-      v-if="(auth.state.access.roles) && (auth.state.access.roles.includes('ROLE_MODERATOR') || auth.state.access.roles.includes('ROLE_ADMIN'))"
+      v-if="!route.params.url && (auth.state.access.roles) && (auth.state.access.roles.includes('ROLE_MODERATOR') || auth.state.access.roles.includes('ROLE_ADMIN'))"
       class="mn-b-small"
     >
         Special Details
@@ -50,7 +48,7 @@
 
 
     <Checkbox 
-      v-if="(auth.state.access.roles) && (auth.state.access.roles.includes('ROLE_MODERATOR') || auth.state.access.roles.includes('ROLE_ADMIN'))"
+      v-if="!route.params.url && (auth.state.access.roles) && (auth.state.access.roles.includes('ROLE_MODERATOR') || auth.state.access.roles.includes('ROLE_ADMIN'))"
       :label="'Special'"
       :radio="event.special"
       @update:radio="updateEvent => event.special = !event.special"
@@ -344,25 +342,25 @@
       <Field
         v-model:field="event.specialData.previousTitle"
         placeholder="Title"
-        value="Explore our exclusive party archive"
+        :value="event.specialData.previousDescription || 'Explore our exclusive party archive'"
         class="w-100  bg-light radius-small pd-medium"
       />  
       <Field
         v-model:field="event.specialData.previousDescription"
         label="Description"
-        value="Experience the ultimate party vibe at The Commune! Elevate your evening with distinctive and exhilarating activities, ensuring an unforgettable time. Dive into the excitement and make every moment special."
+        :value="event.specialData.previousDescription || 'Experience the ultimate party vibe at The Commune! Elevate your evening with distinctive and exhilarating activities, ensuring an unforgettable time. Dive into the excitement and make every moment special.'"
         class="w-100  bg-light radius-small pd-medium"
       />  
       <Field
         v-model:field="event.specialData.previousLinkText"
         label="Button"
-        value="Check In Instagram"
+        :value="event.specialData.previousLinkText || 'Check In Instagram'"
         class="w-100  bg-light radius-small pd-medium"
       />  
       <Field
         v-model:field="event.specialData.previousLink"
         label="Link"
-        value="https://www.instagram.com/thecommune.phuket/"
+        :value="event.specialData.previousLink || 'https://www.instagram.com/thecommune.phuket/'"
         class="w-100  bg-light radius-small pd-medium"
       />
       
@@ -378,16 +376,6 @@
       />
     </div>
 
-		<h3 class="mn-b-small">Date</h3>
-    <VueDatePicker v-model="date"  range class="z-index-3 mn-b-semi bg-light" />
-
- <!--    <Calendar
-      v-model:date="date"
-      :locale="$i18n.locale"
-      :allowRange="false"
-      class="radius-semi w-100 o-hidden bg-light"
-    /> -->
-
     <h3 class="mn-b-small">Description</h3>
 		<section v-if="event" class="pd-b-extra w-100 bg-light pd-big radius-big">
       <Constructor 
@@ -405,29 +393,67 @@
     </section>
 
     <Popup 
-      title="Publish" 
+      title="Final Touches" 
       @close-popup="closePublicationPopup" 
       :isPopupOpen="isPublicationPopup"
       class="w-m-33r t-left pd-big bg-white radius-big"
-    >
-      <h3 class="mn-b-small">Final Touches</h3>
-      
+    > 
       <BlockTags
         @tags-changed="newTags => event.tags = newTags"
         :tags="event.tags"
+        class="mn-b-small"
       />
 
-      <h5 class="mn-b-thin">Add to public:</h5>
-      <SelectMulti
-        v-model="selectedOrganization"
-        :options="publics"
-        :multiple="false"
-        :taggable="false"
-        placeholder="Type to search or add tag"
-        label="name"
-        track-by="_id"
-        class="mn-b-medium bg-light radius-medium pd-small"
+      <h5 class="mn-b-thin">Add to public</h5>
+      <Card
+        v-if="selectedOrganization"
+        :photo="selectedOrganization.profile?.photo"
+        :title="selectedOrganization.profile?.name"
+        @click="() => { 
+          selectedOrganization = null
+        }"
+        class="h-4r w-100 bg-light pd-thin radius-medium  mn-b-thin"
       />
+
+      <section v-else class="mn-b-thin h-25r o-x-hidden o-y-scroll bg-light radius-big pd-small ">
+        <Feed
+          :showLoadMore="false" 
+          :search="{
+            placeholder: 'Search organization...',
+            class: 'bg-white mn-b-thin'
+          }"
+          :states="{
+            empty: {
+              title: 'No organizations Found',
+              description: 'Currently, there are no such organizations available.'
+            }
+          }"
+          :store="{
+            read: (options) => organizations.actions.read(options),
+            state: null
+          }"
+          :options="{
+            user: auth.state.user._id,
+            postable: auth.state.user._id
+          }"
+          v-slot="{ 
+            items 
+          }"
+        >
+          <Card
+            v-for="(organization, index) in items" 
+            v-memo="[organization._id, organization.profile.name]"
+            :photo="organization.profile?.photo"
+            :title="organization.profile?.name"
+            @click="() => { 
+              selectedOrganization = organization
+            }"
+            class="h-4r bg-white pd-thin radius-medium w-100 mn-b-thin"
+          />
+        </Feed>
+      </section>
+
+      
       <h5 v-if="selectedOrganization" class="mn-b-thin">Options:</h5>
       <div v-if="selectedOrganization" class="mn-b-medium br-grey-transp-25 br-2px br-solid pd-small radius-big">
         <Checkbox 
@@ -456,17 +482,19 @@ import Calendar from '@pf/src/components/DatePicker/Calendar.vue'
 
 import Block from '@pf/src/components/Block/Block.vue';
 import Popup from '@pf/src/components/Popup/Popup.vue';
-import Field         from '@pf/src/components/Field/Field.vue'
+import Field from '@pf/src/components/Field/Field.vue'
 import BlockTags from '@pf/src/components/FieldTags/BlockTags.vue';
 import Checkbox from '@pf/src/components/Checkbox/Checkbox.vue';
 import SelectMulti from '@pf/src/components/SelectMulti/SelectMulti.vue';
 import Upload  from '@pf/src/components/Upload/Upload.vue';
-import UploadImage   from '@pf/src/components/UploadImage/UploadImage.vue';
-import EditImages           from '@pf/src/components/EditImages/EditImages.vue';
+import UploadImage from '@pf/src/components/UploadImage/UploadImage.vue';
+import EditImages from '@pf/src/components/EditImages/EditImages.vue';
+import Feed from '@pf/src/components/Feed/Feed.vue'
 import Button from '@pf/src/components/Button/Button.vue';   
 
+import Card from '@pf/src/modules/globals/views/components/blocks/Card.vue';
 
-  import IconDelete from '@pf/src/modules/icons/navigation/IconDelete.vue';
+import IconDelete from '@pf/src/modules/icons/navigation/IconDelete.vue';
 
 import { ref, onMounted } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
@@ -528,18 +556,6 @@ onMounted(async () =>{
     name: event.value.owner.target.profile.name,
     photo: event.value.owner.target.profile.photo
   }
-
-  const dataPublics = await organizations.actions.read({
-    user: auth.state.user._id,
-    postable: auth.state.user._id,
-    limit: 100
-  })
-
-  publics.value = dataPublics.map(publicItem => ({
-    name: publicItem.profile.name,
-    _id: publicItem._id,
-    photo: publicItem.profile.photo
-  }));
 })
 
 const isPublicationPopup = ref(false)
@@ -637,6 +653,7 @@ function onDelete() {
     border: 0;
     padding: var(--medium);
     padding-left: 3rem;
-    background: rgb(var(--grey))
+    background: rgb(var(--light));
+    border-radius: var(--small);
   }
 </style>

package/src/modules/events/components/pages/Event.vue

@@ -5,21 +5,7 @@
         v-if="isLoading"
         v-for="i in 3" :key="i"
       />
-    </TransitionGroup>
-
-    <transition 
-      name="fade"
-    >
-      <EmptyState 
-        v-if="!isLoading && !event"
-        title="No Event Found"
-        description="Currently, there are no events available. Please check back later."
-        class="pd-medium mn-b-thin bg-light radius-big"
-      />
-    </transition>
-
 
-    <!-- <TransitionGroup tag="ul" name="fade" class="container"> -->
       <HeroEvent
         v-if="!isLoading && event && event.special"
         :content="{
@@ -84,6 +70,7 @@
           />
 
           <SectionLineUp
+            v-if="event.specialData.lineup.lenth > 0"
             :content="{
               title: 'Lineup',
               lineup: event.specialData.lineup
@@ -160,7 +147,7 @@
     	:owner="auth.state.user._id"
     />
       
-  <!-- </TransitionGroup>   -->
+  </TransitionGroup>  
 
   </section>
 </template>

package/src/modules/events/components/pages/Events.vue

@@ -57,7 +57,8 @@
         :user="auth.state.user._id" 
         :type="'normal'"
         class="bg-light radius-big mn-b-medium"
-      />
+      >
+      </CardEvent>
     </Feed>
   </section>
 </template>

package/src/modules/events/components/pages/EventsBackoffice.vue

@@ -0,0 +1,122 @@
+<template>
+	<div 
+		class="pd-thin"
+	>
+		<header 
+			class="mn-b-medium flex-v-center flex-nowrap flex"
+		>
+	      	<h2
+	      		class="mn-r-medium"
+	      	>
+	      		Events
+	      	</h2>
+	      	
+	      	<button 
+	      		v-if="auth.state.user._id === route.params.user || route.params._id"
+	      		@click="router.push({name: 'Create Event'})" 
+	      		class="radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second"
+	      	>
+	      		+
+	      	</button>
+		</header>
+
+		<Tab 
+			v-if="route.params._id"
+			v-model:selected="tabOrganization"
+			:tabs="[
+				{ name: 'My', 	value: 'owner' },
+				{ name: 'Participant', 	value: 'participant' },	
+			]"
+			class="mn-b-small o-hidden h5 radius-big bg-light"
+		/>
+
+		
+
+		<Feed
+      :states="{
+        empty: {
+          title: 'No Events Found',
+          description: 'Currently, there are no events available.'
+        }
+      }"
+      :store="{
+        read: (options) => events.read(options),
+      }"
+      :options="{
+        user: auth.state.user._id,
+        owner: route.params._id || route.params.user,
+        creator: route.params.user
+      }"
+      v-slot="{ 
+        items 
+      }"
+    >
+       <CardEvent 
+        @click="$router.push({name: 'Event', params: {url: event.url}})" 
+        v-for="(event,index) in items" 
+        :key="event._id" 
+        :event="event" 
+        :user="auth.state.user._id" 
+        :type="'normal'"
+        class="bg-light radius-big mn-b-medium"
+      >
+
+		     <div 
+		      v-if="route.params._id && hasAccess(route.params._id, 'gallery', 'read', auth.state.accesses)"
+		      class="mn-b-semi w-100 bg-second button t-white uppercase"
+		      @click.stop="router.push({
+		        name: 'Edit Event Tickets',
+		        params: {
+		          url: event.url
+		        }
+		      })"
+		    >
+		      Check tickets
+		    </div>
+      </CardEvent>
+    </Feed>
+
+   <!--  <Feed 
+			v-if="tabOrganization ==='owner'"
+	  	:user="auth.state.user._id"
+			:creator="route.params.user"
+			:owner="route.params._id"
+			:sortOrder="'asc'"
+		/> -->
+
+
+		<!-- <Feed 
+			v-if="tabOrganization ==='participant'"
+  		:user="auth.state.user._id"
+  		:participant="route.params.user"
+  		:owner="route.params._id"
+			:sortOrder="'desc'"
+		/> -->
+	</div>
+</template>
+
+<script setup>
+	import { watch, ref } from 'vue'
+	import { useRoute, useRouter } from 'vue-router'
+	// Components
+	import Tab  		from '@pf/src/components/Tab/Tab.vue'
+  import Feed from '@pf/src/components/Feed/Feed.vue'
+
+  import CardEvent from '@pf/src/modules/events/components/blocks/CardEvent.vue';
+
+	import * as auth from '@pf/src/modules/auth/views/store/auth';
+	import * as events from '@pf/src/modules/events/store/events.js'; 
+	// Accessing router
+	const route = useRoute()
+	const router = useRouter()
+	// State
+	let tab = route.query.tab ? route.query.tab : 'owner';
+
+	const tabOrganization = ref(tab)
+
+	route.query.tab = tabOrganization.value
+
+	watch(tabOrganization, (newValue) => {
+	  router.replace({ query: { ...route.query, tab: newValue } });
+	});
+</script>

package/src/modules/events/components/sections/HeroEvent.vue

@@ -11,6 +11,7 @@
 	  "
 	 >
    	<div 
+   		v-if="content.cover || content.video"
    		style="min-height: 20rem;"
    		class="desktop-only radius-big o-hidden bg-black  pos-relative"
    	>
@@ -37,12 +38,11 @@
 	  	o-hidden 
 	  	bg-black  
 	  	pd-big mn-r-auto mn-l-auto t-white flex-h-center flex-column o-hidden flex-v-start t-left flex w-100 h-100 gap-zero">
-    	<!-- <img loading="lazy" src="/logo/jungle-stereo-cosmonaut.png"  class="h-8r mn-b-small z-index-1"/> -->
-    	<div class="mn-b-big z-index-1 flex-nowrap flex gap-small">
+    	<div v-if="content.logos.length > 0" class="mn-b-big z-index-1 flex-nowrap flex gap-small">
 	    	<img loading="lazy" v-for="logo in content.logos" class="radius-thin object-fit-contain i-big" :src="logo">
 	    </div>
 
-    	<h3 class="pd-thin z-index-1  w-max br-solid br-2px br-white radius-extra 	mn-b-thin">
+    	<h3 v-if="content?.subtitle" class="pd-thin z-index-1  w-max br-solid br-2px br-white radius-extra 	mn-b-thin">
 					{{content?.subtitle}}
 	    </h3>
 
@@ -54,9 +54,9 @@
 	    		{{content?.description}}
 	    </p>
 	  	
-	  	<p class="z-index-1 t-transp p-small mn-b-thin">
+	  	<p v-if="timeDifference >= 0" class="z-index-1 t-transp p-small mn-b-thin">
 				<span>
-					{{content?.ticketText }}
+					{{content?.ticketText || 'Buy ticket online with special price' }}
 				</span>
 
 				<span v-if="options?.price" class="mn-l-micro bg-white t-black pd-t-nano pd-b-nano pd-r-micro pd-l-micro radius-extra">
@@ -72,7 +72,7 @@
 	    	:date="options.date"
 	    />
 
-	    <div v-if="content?.ticketLinkStripe" class="z-index-1  mn-t-medium mn-b-small 	flex-nowrap flex gap-thin">
+	    <div v-if="content?.ticketLinkStripe && timeDifference >= 0" class="z-index-1  mn-t-medium mn-b-small 	flex-nowrap flex gap-thin">
 	    	<a href="#" @click="clickBuyTicket()" class="pd-l-medium pd-r-medium pd-t-small pd-b-small radius-extra uppercase t-medium t-black bg-white  ">
 	    			{{content?.ticketTextButton || 'Buy Ticket' }}
 	    	</a>
@@ -104,7 +104,6 @@
 
 	import Countdown from "@pf/src/components/Countdown/Countdown.vue"
 
-
 	const props = defineProps({
 		content: {
 			type: Object
@@ -119,14 +118,13 @@
 
 	var isPlaying = false;
 
-	function	checkAndPlayVideo() {
-		videoElement.value.onplaying = function() {
-		  isPlaying = true;
-		};
+	const targetDate = new Date(props.options.date).getTime();
+	const currentDate = ref(new Date().getTime());
+	const timeDifference = targetDate - currentDate.value;
 
-		videoElement.value.onpause = function() {
-		  isPlaying = false;
-		};	
+	function checkAndPlayVideo() {
+		if (videoElement.value) videoElement.value.onplaying = function() { isPlaying = true; };
+		if (videoElement.value) videoElement.value.onpause = function() { isPlaying = false; };	
   }
 
   function getVideoType(videoUrl) {
@@ -139,14 +137,14 @@
   }
 
 	async function playVid() {      
-    if (videoElement.value.paused && !isPlaying) {
+    if (videoElement.value?.paused && !isPlaying) {
       return videoElement.value.play();
     }
 	} 
 
 	onMounted(() => {
-		checkAndPlayVideo()
-		playVid()
+			checkAndPlayVideo()
+			playVid()
 	})
 	
 	function clickBuyTicket () {

package/src/modules/events/components/sections/SectionPreviousEvents.vue

@@ -85,23 +85,14 @@
 
 	var isPlaying = false;
 
-	function	checkAndPlayVideo() {
-    // Initializing values
-
-		// On video playing toggle values
-		videoElement.value.onplaying = function() {
-		  isPlaying = true;
-		};
-
-		// On video pause toggle values
-		videoElement.value.onpause = function() {
-		  isPlaying = false;
-		};	
+	function checkAndPlayVideo() {
+		if (videoElement.value) videoElement.value.onplaying = function() { isPlaying = true; };
+		if (videoElement.value) videoElement.value.onpause = function() { isPlaying = false; };	
   }
 
   // Play video function
 	async function playVid() {      
-    if (videoElement.value.paused && !isPlaying) {
+    if (videoElement.value?.paused && !isPlaying) {
       return videoElement.value.play();
     }
 	} 

package/src/modules/events/router/events.js

@@ -24,6 +24,17 @@ const eventsRoutes = [
       },
       component: () => import(/* webpackChunkName: 'EventList' */ '../components/pages/Events.vue')
     }]
+  },{
+    path: 'events/backoffice',
+    name: 'Events Backoffice',
+    meta: {
+      title: {
+        en: 'Manage Events',
+        ru: 'Управление Событиями'
+      },
+      authorize: []
+    },
+    component: () => import(/* webpackChunkName: 'CreateEvent' */ '../components/pages/EventsBackoffice.vue')
   },{
     path: 'events/create',
     name: 'Create Event',
@@ -53,10 +64,6 @@ const eventsRoutes = [
   },{
     path: 'events/:url/edit/tickets',
     name: 'Edit Event Tickets',
-    meta: { authorize: [] },
-    beforeEnter: [
-      validationAuth.requiresAdmin,
-    ],
     component: () => import(/* webpackChunkName: 'EditEvent' */ '../components/pages/EditEventTickets.vue')
   }
 ];

package/src/modules/events/store/events.js

@@ -1,9 +1,7 @@
-// Dependencies
-import axios from 'axios';
-// Setup Axios
-const $axios = axios.create({baseURL: process.env.API_URL, withCredentials: true}) 
 // Vue modules
 import { reactive, ref, computed, toRefs, watch  } from "vue";
+// Setup Axios
+import $axios from '@pf/src/modules/globals/views/utils/axios-instance.js';
 // Globals
 import { setError }   from '@pf/src/modules/globals/views/store/globals'
 // State

package/src/modules/gallery/components/sections/BackofficeGallery.vue

@@ -12,7 +12,7 @@
         { name: 'Archived', value: 'archived' }
       ]"
       :actions="[
-        { method: () => openPhotoPopup(null), label: 'Add Photo' }
+        ...(hasAccess(route.params._id, 'gallery', 'create', auth.state.accesses) ? [{ method: () => openPhotoPopup(null), label: 'Add Photo' }] : [])
       ]"
       class="mn-b-small bg-light bg-light radius-big"
     />
@@ -50,11 +50,12 @@
           :creator="item.creator"
           :date="item.createdAt"
           :actions="[
-            { method: () => deletePhoto(item), label: 'Delete' },
-            { method: () => changeStatus(item,'archived'), label: 'Archive' },
-            item.status === 'draft' ? 
-              { method: () => changeStatus(item,'published'), label: 'Publish' } : 
-              { method: () => changeStatus(item,'draft'), label: 'Draft' }
+            ...(hasAccess(route.params._id, 'gallery', 'delete', auth.state.accesses) ? [{ method: () => deletePhoto(item), label: 'Delete' }] : []),
+            ...(hasAccess(route.params._id, 'gallery', 'edit', auth.state.accesses) ? [
+                ...(item.status !== 'archived' ? [{ method: () => changeStatus(item, 'archived'), label: 'Archive' }] : []),
+                ...(item.status !== 'published' ? [{ method: () => changeStatus(item, 'published'), label: 'Publish' }] : []),
+                ...(item.status !== 'draft' ? [{ method: () => changeStatus(item, 'draft'), label: 'Draft' }] : [])
+            ] : [])
           ]"
           class="pd-small mn-b-small"
         />
@@ -165,8 +166,6 @@ import gallery from '@pf/src/modules/gallery/store/gallery';
 import CardHeader  from '@pf/src/modules/globals/views/components/blocks/CardHeader.vue'
 import SectionPageTitle from '@pf/src/modules/globals/views/components/sections/SectionPageTitle.vue'
 
-
-
 import EditImages from '@pf/src/components/EditImages/EditImages.vue';
 import BlockTags from '@pf/src/components/FieldTags/BlockTags.vue';
 
@@ -232,14 +231,26 @@ const onUpdatedImages = (newImages) => {
 const photos = ref([])
 
 const deletePhoto = async (item) => {
-  await gallery.delete(item._id);
-  gallery.removeItem(item, photos.value)
+  let deletedPhoto = JSON.parse(JSON.stringify(item));
+
+  deletedPhoto.owner.target = deletedPhoto.owner.target._id
+  deletedPhoto.creator.target = deletedPhoto.creator.target._id
+
+  await gallery.delete(deletedPhoto);
+
+  gallery.removeItem(deletedPhoto, photos.value)
 };
 
 const changeStatus = async (item, status) => {
-  item.status = status
-  await gallery.update(item)
-  gallery.updateItem(item, photos.value)
+  let updatedPhoto = JSON.parse(JSON.stringify(item));
+
+  updatedPhoto.status = status
+
+  updatedPhoto.owner.target = updatedPhoto.owner.target._id
+  updatedPhoto.creator.target = updatedPhoto.creator.target._id
+
+  updatedPhoto = await gallery.update(updatedPhoto)
+  gallery.updateItem(updatedPhoto, photos.value)
 }
 
 const createPhoto = async (status) => {