@ozdao/prometheus-framework 0.2.128 → 0.2.130

package/src/modules/backoffice/components/pages/Dashboard.vue

@@ -1,17 +1,13 @@
 <template>
 	<div class="">
-		<h1 class="pd-medium radius-medium bg-light mn-b-small">Welcome to Backoffice</h1>
+		<h1 class="pd-medium radius-medium bg-light mn-b-small">Welcome to Backoffice2</h1>
 		
 		<Menu 
 			class="bg-light mn-b-semi"
 		>
 			<MenuItem 
-				v-if="hasAccess(route.params._id, 'members', 'read', auth.state.accesses)"
 		  	@click="router.push({
-		  		name: 'Organization Members', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Organization Members'
 		  	})" 
 		  	class="cursor-pointer"
 		  >
@@ -21,26 +17,19 @@
 		    </span>
 		  </MenuItem>
 
-		  <!-- <MenuItem 
+		  <MenuItem 
 		  	@click="router.push({
-		  		name: 'Backoffice Community', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Backoffice Community'
 		  	})" 
 		  	class="cursor-pointer">
 		    <span>
 		    	Community
 		    </span>
-		  </MenuItem> -->
+		  </MenuItem>
 
 		  <MenuItem 
-		  	v-if="hasAccess(route.params._id, 'products', 'read', auth.state.accesses)"
 		  	@click="router.push({
-		  		name: 'Products', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Products'
 		  	})" 
 		  	class="cursor-pointer">
 		  	<IconProducts class="i-semi" :icon="true" :fill="'rgb(var(--white))'"/> 
@@ -50,12 +39,8 @@
 		  </MenuItem>
 
 		  <MenuItem 
-		  	v-if="hasAccess(route.params._id, 'leftovers', 'read', auth.state.accesses)"
 		  	@click="router.push({
-		  		name: 'Leftovers', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Leftovers'
 		  	})" 
 		  	class="cursor-pointer">
 		  	<IconLeftovers class="i-semi" :icon="true" :fill="'rgb(var(--white))'"/> 
@@ -65,12 +50,8 @@
 		  </MenuItem>
 
 		  <MenuItem 
-		  	v-if="hasAccess(route.params._id, 'orders', 'read', auth.state.accesses)"
 		  	@click="router.push({
-		  		name: 'Backoffice Orders', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Backoffice Orders'
 		  	})" 
 		  	class="cursor-pointer">
 		  	<IconOrders class="i-semi" :icon="true" :fill="'rgb(var(--white))'"/> 
@@ -80,12 +61,8 @@
 		  </MenuItem>
 
 		  <MenuItem 
-		  	v-if="hasAccess(route.params._id, 'gallery', 'read', auth.state.accesses)"
 		  	@click="router.push({
-		  		name: 'Backoffice Gallery', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Backoffice Gallery'
 		  	})" 
 		  	class="cursor-pointer">
 		  	<IconGallery class="i-semi" :icon="true" :fill="'rgb(var(--white))'"/> 
@@ -95,12 +72,8 @@
 		  </MenuItem>
 		  
 		  <MenuItem 
-		  	v-if="hasAccess(route.params._id, 'events', 'read', auth.state.accesses)"
 		  	@click="router.push({
-		  		name: 'Backoffice Events', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Backoffice Events'
 		  	})" 
 		  	class="cursor-pointer">
 		  	<IconEvents class="i-semi" :icon="true" :fill="'rgb(var(--white))'"/> 
@@ -109,29 +82,23 @@
 		    </span>
 		  </MenuItem>
 
-		 <!--  <MenuItem 
+		  <MenuItem 
 		  	@click="router.push({
-		  		name: 'Payments', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Payments'
 		  	})" 
 		  	class="cursor-pointer">
 		    <span>
 		    	Payments
 		    </span>
-		  </MenuItem> -->
+		  </MenuItem>
 		</Menu>
 
-		<!-- <Menu 
+		<Menu 
 			class="bg-light"
 		>
 			<MenuItem 
 		  	@click="router.push({
-		  		name: 'Backoffice Organizations', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Backoffice Organizations'
 		  	})" 
 		  	class="cursor-pointer">
 		    <span>
@@ -141,17 +108,24 @@
 
 		  <MenuItem 
 		  	@click="router.push({
-		  		name: 'Backoffice Reports', 
-		  		params: {
-		  			_id: route.params._id
-		  		}
+		  		name: 'Backoffice Pages'
+		  	})" 
+		  	class="cursor-pointer">
+		    <span>
+		    	Pages
+		    </span>
+		  </MenuItem>
+
+		  <MenuItem 
+		  	@click="router.push({
+		  		name: 'Backoffice Reports'
 		  	})" 
 		  	class="cursor-pointer">
 		    <span>
 		    	Reports
 		    </span>
 		  </MenuItem>
-		</Menu> -->
+		</Menu>
 	</div>
 </template>
 
@@ -162,8 +136,8 @@
 import { ref, onMounted } from 'vue';
 
 // Mobile Module
-import Menu from '@pf/src/modules/mobile/components/Menu/Menu.vue'
-import MenuItem from '@pf/src/modules/mobile/components/Menu/MenuItem.vue'
+import Menu from '@pf/src/components/Menu/Menu.vue'
+import MenuItem from '@pf/src/components/Menu/MenuItem.vue'
 import SelectMulti    from '@pf/src/components/SelectMulti/SelectMulti.vue'
 
 import IconProducts from '@pf/src/modules/icons/entities/IconProducts.vue'
@@ -179,7 +153,6 @@ import IconLeftovers from '@pf/src/modules/icons/entities/IconLeftovers.vue'
 import { useRoute, useRouter } from 'vue-router'
 
 import * as auth  from '@pf/src/modules/auth/store/auth'
-
 import * as organizations  from '@pf/src/modules/organizations/store/organizations'
 
 const route = useRoute()

package/src/modules/backoffice/router/backoffice.js

@@ -6,12 +6,12 @@ import * as validationAuth from '@pf/src/modules/middlewares/client/auth.validat
 const backofficeRoutes = [{
   path: 'backoffice',
   component: layoutEmpty,
-  // beforeEnter: [
-  //   validationAuth.requiresAdmin,
-  // ],
+  beforeEnter: [
+    validationAuth.requiresAdmin,
+  ],
   children: [{
     path: '',
-    name: 'Backoffice',
+    name: 'Backoffice Admin',
     meta: {
       title: {
         en: 'Backoffice',
@@ -20,17 +20,6 @@ const backofficeRoutes = [{
       authorize: []
     },
     component: () => import(/* webpackChunkName: 'BackofficeGallery' */ '../components/pages/Dashboard.vue'),
-  },{
-    path: 'gallery',
-    name: 'Backoffice Gallery',
-    meta: {
-      title: {
-        en: 'Backoffice Gallery',
-        ru: 'Управление Галерей'
-      },
-      authorize: []
-    },
-    component: () => import(/* webpackChunkName: 'BackofficeGallery' */ '@pf/src/modules/gallery/components/sections/BackofficeGallery.vue'),
   },{
     path: 'reports',
     name: 'Backoffice Reports',

package/src/modules/community/components/blocks/CardBlogpost.vue

@@ -36,31 +36,9 @@
     	:date="blogpost.createdAt"
 		/>
 
-		<!-- <Image :prop="{content:firstImage.content}" class="h-100"/> -->
-
-		<template
-			v-if="firstImage && firstImage.content && type !== 'blogpostPage'"
-		>
-			<img 
-				:src="(FILE_SERVER_URL || '') + firstImage.content" 
-				alt="Blog post image" 
-				class="mn-b-medium object-fit-cover w-100 h-min-10r  h-100"
-			/>
-		</template>
-
-		<template
-			v-if="!firstImage?.content && firstVideo && firstVideo.content && type !== 'blogpostPage'"
-		>
-			<div class="flex-center flex">
-	      <video controls class="mn-b-medium object-fit-cover w-100 h-min-10r h-max-20r">
-	        <source :src="firstVideo.content" type="video/mp4">
-	        Your browser does not support the video tag.
-	      </video>
-	    </div>
-		</template>
-
+	
 		<section
-			class="pd-t-zero pd-medium"
+			class="pd-t-zero pd-b-zero pd-medium"
 		>
 			
 			<div v-if="type !== 'blogpostPage'" class="cursor-pointer mn-b-thin flex-nowrap flex w-100">
@@ -102,12 +80,36 @@
 
 			<slot></slot>
 
-			<Chips 
+			<!-- <Chips 
       	v-if="type !== 'short' && blogpost.tags?.length > 0" 
       	:chips="blogpost.tags"
-     	/>
+     	/> -->
 
 		</section>
+
+			<!-- <Image :prop="{content:firstImage.content}" class="h-100"/> -->
+
+		<template
+			v-if="firstImage && firstImage.content && type !== 'blogpostPage'"
+		>
+			<img 
+				:src="(FILE_SERVER_URL || '') + firstImage.content" 
+				alt="Blog post image" 
+				class="mn-b-medium object-fit-cover w-100 h-min-10r  h-100"
+			/>
+		</template>
+
+		<template
+			v-if="!firstImage?.content && firstVideo && firstVideo.content && type !== 'blogpostPage'"
+		>
+			<!-- <div class="flex-center flex"> -->
+	      <video controls class="mn-b-medium object-fit-cover w-100 h-max-20r">
+	        <source :src="firstVideo.content" type="video/mp4">
+	        Your browser does not support the video tag.
+	      </video>
+	    <!-- </div> -->
+		</template>
+
 		
 		<FooterBlogpost 
 			class="pd-t-zero pd-medium" 

package/src/modules/community/components/layouts/Community.vue

@@ -28,7 +28,7 @@
 		</li>
 			<li 	
 				v-if="auth.state.user._id"
-				:class="{'t-white bg-black': route.params.category === 'following'}" 		
+				:class="{'t-black bg-white': route.params.category === 'following'}" 		
 				@click="router.push({name: 'Blog', params: { category: 'following' } })" 
 				class="cursor-pointer t-medium flex-v-center flex pd-thin radius-extra"
 			>

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

@@ -1,5 +1,5 @@
 <template>
-  <article v-if="event" class="h-100 pd-thin">
+  <article v-if="event" class="h-min-100 pd-thin">
   	<div class="mn-b-thin radius-small w-100 h-10r bg-light flex-center flex-column flex">
      	<UploadImage 
         v-model:photo="event.cover"

package/src/modules/gallery/components/pages/Gallery.vue

@@ -66,11 +66,10 @@
 
 	import Feed from '@pf/src/components/Feed/Feed.vue'
 	import Popup from '@pf/src/components/Popup/Popup.vue'
+	import PhotoViewer from '@pf/src/components/PhotoViewer/PhotoViewer.vue'
 
 	import SectionPageTitle from '@pf/src/modules/globals/components/sections/SectionPageTitle.vue'
 
-	import PhotoViewer from '@pf/src/modules/gallery/components/blocks/PhotoViewer.vue'
-
 	import gallery from '@pf/src/modules/gallery/store/gallery';
 
 	const photos = ref([])

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

@@ -155,6 +155,7 @@ import Checkbox from '@pf/src/components/Checkbox/Checkbox.vue';
 import SelectMulti from '@pf/src/components/SelectMulti/SelectMulti.vue';
 import Popup from '@pf/src/components/Popup/Popup.vue'
 import Feed from '@pf/src/components/Feed/Feed.vue'
+import PhotoViewer from '@pf/src/components/PhotoViewer/PhotoViewer.vue'
 
 import * as auth from '@pf/src/modules/auth/store/auth';
 import * as organizations from '@pf/src/modules/organizations/store/organizations';
@@ -164,7 +165,7 @@ import gallery from '@pf/src/modules/gallery/store/gallery';
 import CardHeader  from '@pf/src/modules/globals/components/blocks/CardHeader.vue'
 import SectionPageTitle from '@pf/src/modules/globals/components/sections/SectionPageTitle.vue'
 
-import PhotoViewer from '@pf/src/modules/gallery/components/blocks/PhotoViewer.vue'
+
 
 import EditImages from '@pf/src/components/EditImages/EditImages.vue';
 import BlockTags from '@pf/src/components/FieldTags/BlockTags.vue';

package/src/modules/gallery/router/gallery.backoffice.router.js

@@ -0,0 +1,14 @@
+const gallery = [{
+  path: 'gallery',
+  name: 'Backoffice Gallery',
+  meta: {
+    title: {
+      en: 'Backoffice Gallery',
+      ru: 'Управление Галерей'
+    },
+    authorize: []
+  },
+  component: () => import(/* webpackChunkName: 'BackofficeGallery' */ '@pf/src/modules/gallery/components/sections/BackofficeGallery.vue'),
+}];
+
+export default gallery;

package/src/modules/globals/components/blocks/BlockFilter.vue

@@ -0,0 +1,44 @@
+<script setup>
+import { ref } from 'vue';
+
+import Checkbox from "@pf/src/components/Checkbox/Checkbox.vue";
+import Spoiler from "@pf/src/components/Spoiler/Spoiler.vue"
+
+const props = defineProps({
+  title: {
+    type: String,
+    default: 'Sorting Options'
+  },
+  options: {
+    type: Array
+  }
+});
+
+const filter = defineModel('filter')
+</script>
+
+<template>
+  <div class="w-100 o-hidden">
+    <Spoiler 
+      v-for="filterOption in options"
+      class="radius-small o-hidden mn-b-small"
+      :status="true"
+    >
+      <template #header>
+        <p class="cursor-pointer mn-r-auto t-medium p-big">{{ filterOption.title }}</p>
+      </template>
+
+      <template #content>
+        <Checkbox 
+          v-for="(checkbox, index) in  filterOption.options"
+          :key="index"
+          :label="checkbox.label"
+          :value="checkbox.value"
+          class="w-100 mn-t-small mn-b-small bg-white radius-small pd-small"
+          :radio="filter[filterOption.value]"
+          @update:radio="event => filter[filterOption.value] = event"
+        />
+      </template>
+    </Spoiler>
+  </div>
+</template>

package/src/modules/globals/components/blocks/CardHeader.vue

@@ -62,10 +62,12 @@
 						· by {{creator.target?.profile?.name || creator.target?.username || 'Anonymous'}}
 					</span>
 
+					<span v-if="date" class="mn-l-micro mn-r-micro ">·</span> 
+
 					<span v-if="date" class="pos-relative">
-							<Tooltip v-if="date" :text="formatDate(date)">
-						· {{getTimeElapsed(date)}}
-						 	</Tooltip>
+						<Tooltip v-if="date" :text="formatDate(date)">
+					 		{{getTimeElapsed(date)}}
+					 	</Tooltip>
 					</span>
 
 					<span v-if="dateFormatted">

package/src/modules/globals/components/layouts/Client.vue

@@ -4,16 +4,29 @@
 			<Loader v-if="!page" class="pos-fixed"/>
 		</transition>
 
+		<transition 
+	    name="scaleTransition" 
+	    mode="out-in"
+	  >
+	    <section 
+	      v-if="MOBILE_APP && FirstUse"
+	      class="w-100" 
+	     >
+	      <Walkthrough 
+	        @updateFirstUse="updateFirstUse" 
+	        :slides="[1,2,3]"
+	      />
+	    </section>
+	  </transition>
+
 		<transition name="moveFromTop" mode="out-in" appear>
 			<Header 
 				ref="header" 
-				class="transition-ease-in-out br-b br-solid br-grey-transp-10 pos-t-0" 
-				:theme="route.name === 'Home' ? 'dark' : 'light'"
+				class="transition-ease-in-out pos-relative br-b br-solid br-grey-transp-10 pos-t-0" 
+				:theme="headerTheme"
 				:class="{
 					'pos-l-70': store.globals.state.isOpenSidebar,
 					'pos-l-0': !store.globals.state.isOpenSidebar,
-					'pos-fixed': route.name === 'Home',
-					'bg-white ': route.name !== 'Home'
 				}"
 			/>
 		</transition>
@@ -25,21 +38,23 @@
 		  />
 		</transition>
 
-		<Sidebar 
-			v-if="show" 
-			:stateSidebar="store.globals.state.isOpenSidebar" 
-			@closeSidebar="() => { 
-				store.globals.state.isOpenSidebar = !store.globals.state.isOpenSidebar 
-			}"
+		<transition name="moveFromTop" mode="out-in" appear>
+			<Sidebar 
+				v-if="show && store.globals.state.isOpenSidebar" 
+				:stateSidebar="store.globals.state.isOpenSidebar" 
+				@closeSidebar="() => { 
+					store.globals.state.isOpenSidebar = !store.globals.state.isOpenSidebar 
+				}"
 
-			class="transition-ease-in-out pos-absolute w-70 z-index-0  bg-light"
-			:class="{
-				'pos-l-70-negative': !store.globals.state.isOpenSidebar,
-				'pos-l-0': store.globals.state.isOpenSidebar
-			}"
-		>
-			<Navigation class="h3 pd-big cols-1" />
-		</Sidebar>
+				class="transition-ease-in-out pos-absolute w-70 z-index-0  bg-light"
+				:class="{
+					'pos-l-70-negative': !store.globals.state.isOpenSidebar,
+					'pos-l-0': store.globals.state.isOpenSidebar
+				}"
+			>
+				<Navigation class="h3 pd-big cols-1" />
+			</Sidebar>
+		</transition>
 
 	  <Popup 
 	  	@close-popup="closeLocationPopup" 
@@ -50,7 +65,7 @@
 	  </Popup>
 
 		<section 
-			v-if="show"
+			v-if="((!FirstUse && MOBILE_APP) || !MOBILE_APP) && show" 
 			id="screen" 
 			ref="screen"
 			@scroll="handleScroll"
@@ -73,15 +88,17 @@
 				class="z-index-7" 
 			/>
 			
-			<router-view  v-slot="{ Component, route }">
-				<transition @before-enter="scrollTop" name="scaleIn" mode="out-in" appear>
-	      	<component 
-	      		ref="page"  
-	      		:is="Component" 
-	      		:key="route.path"
-	      	/>
-	      </transition>
-			</router-view>
+			<!-- <div class="pos-relative w-100 h-100"> -->
+				<router-view  v-slot="{ Component, route }">
+					<transition @before-enter="scrollTop" name="scaleIn" mode="out-in" appear>
+		      	<component 
+		      		ref="page"  
+		      		:is="Component" 
+		      		:key="route.path"
+		      	/>
+		      </transition>
+				</router-view>
+			<!-- </div> -->
 			
       <Footer />
 		</section>
@@ -95,7 +112,7 @@
 
 
 <script setup>
-	import { computed, ref, onMounted,provide, inject, onUnmounted } from 'vue'
+	import { computed, ref, onMounted, provide, inject, onUnmounted } from 'vue'
 	// Router
 	import { useRoute, useRouter } from 'vue-router'
 	// Store
@@ -110,10 +127,35 @@
 	import Header	from '@pf/src/modules/globals/components/partials/Header.vue'
 	import Navigation from '@pf/src/modules/globals/components/partials/Navigation.vue'
 	import Footer from '@pf/src/modules/globals/components/partials/Footer.vue'
+  import NavigationBar from '@pf/src/modules/globals/components/partials/NavigationBar.vue';
+  import BottomNavigation from '@pf/src/modules/globals/components/partials/BottomNavigation.vue';
 
-  import NavigationBar from '@pf/src/modules/mobile/components/NavigationBar/NavigationBar.vue';
-  import BottomNavigation from '@pf/src/modules/mobile/components/BottomNavigation/BottomNavigation.vue';
 	import ShopCart from '@pf/src/modules/orders/components/partials/ShopCart.vue'
+	// Walkthrough
+  let Walkthrough;
+  
+  if (__MOBILE_APP__) {
+    Walkthrough = () => defineAsyncComponent(() =>
+      import('@pf/src/modules/globals/components/sections/Walkthrough.vue')
+    );
+  } else {
+    Walkthrough = null;
+  }
+  /////////////////////////////
+  // FIRST USE
+  /////////////////////////////
+  const FirstUse = ref(false);
+
+  import { Preferences } from '@capacitor/preferences';
+
+  async function getFirstUse() {
+    const ret = await Preferences.get({ key: 'first-use' });
+    FirstUse.value = ret.value ? JSON.parse(ret.value) : true;
+  }
+
+  const updateFirstUse = (value) => {
+    FirstUse.value = value;
+  }
 	/////////////////////////////
 	// CREATED
 	/////////////////////////////
@@ -131,6 +173,14 @@
 	const scrollOffset = ref(0)
 	let isScrolled = false
 	const header = ref(null)
+
+	const headerTheme = computed(() => {
+		if (scrollOffset.value > 50) {
+			return 'light'
+		} else {
+			return route.meta.header_theme || 'light'
+		}
+	})
 	/////////////////////////////
 	// Methods
 	/////////////////////////////
@@ -141,26 +191,26 @@
 		document.getElementById('app').scrollIntoView();
 	}
 	const handleScroll = () => {
-	  const currentScroll = event.target.scrollTop
+	  scrollOffset.value = event.target.scrollTop
 
-	  if (currentScroll > 150 && !isScrolled) {
+	  if (scrollOffset.value > 50 && !isScrolled) {
 	    isScrolled = true;
-	    // header.value.props.theme = "light"
+
 	    header.value.$el.classList.add('scrolled');
-	    header.value.$el.style.transition = 'background 0.3s ease-in-out';
 
 	    const firstRect = header.value.$el.getBoundingClientRect();
 	    const invert = -firstRect.top;
 
 	    header.value.$el.style.transform = `translateY(${invert}px)`;
 
+	    // headerTheme.value - light
+
 	    setTimeout(() => {
 	      header.value.$el.style.transform = 'translateY(0)';
 	    }, 0);
-	  } else if (currentScroll <= 150 && isScrolled) {
+	  } else if (scrollOffset.value <= 75 && isScrolled) {
 	    isScrolled = false;
 	    header.value.$el.classList.remove('scrolled');
-	    header.value.$el.style.transition = 'background 0.3s ease-in-out';
 
 	    const firstRect = header.value.$el.getBoundingClientRect();
 	    const invert = firstRect.top;
@@ -176,7 +226,18 @@
 	// MOUNTED
 	/////////////////////////////
 	onMounted(async () => {
-		console.log('header is', header.value.$el.$el)
+		await getFirstUse()
+		 
+		if ('serviceWorker' in navigator) {
+	   	window.addEventListener('load', () => {
+	     	navigator.serviceWorker.register('/service-worker.js').then(registration => {
+	       	console.log('SW registered: ', registration);
+	     	}).catch(registrationError => {
+	       	console.log('SW registration failed: ', registrationError);
+	     	});
+	   });
+	 	}
+	 	
 		if (page) show.value = true
 		
 		const savedPosition = localStorage.getItem('position');
@@ -194,10 +255,6 @@
 </script>
 
 <style lang="scss">;	
-.scrolled {
-	background: black !important;
-} 
-
 	.scaleIn-enter-active,
 	.scaleIn-leave-active {
 		transform: scale(1);  
@@ -236,7 +293,6 @@
 		transform: translateY(-1rem);
 		opacity: 0;
 		transition: all 0.5s ease;
-		
 	}
 	.ScaleOut-enter-active,
 	.ScaleOut-leave-active {

package/src/modules/globals/components/pages/401.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="">
+    401 Unauthorized
+  </div>
+</template>

package/src/modules/globals/components/pages/404.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="">
+    404 Not Found
+  </div>
+</template>