@ozdao/prometheus-framework 0.2.129 → 0.2.132

package/src/components/Feed/Feed.vue

@@ -1,6 +1,6 @@
 <template>
 
-  <div v-if="search || date || sort" class="flex-nowrap flex gap-thin mn-b-thin">
+  <div v-if="search || date || (sort && !sort.hideButton)" class="flex-nowrap flex gap-thin">
 
     <BlockSearch 
       v-if="search"
@@ -12,7 +12,10 @@
     <template
       v-if="filter"
     >
-      <div class="flex-center flex pd-thin bg-light radius-extra aspect-1x1 h-100">
+      <div 
+        :class="filter.class || 'bg-light'"
+        class="flex-center flex pd-thin bg-light radius-extra aspect-1x1 h-100"
+      >
         <IconFilter @click="() => filter.active = !filter.active" class="w-1r h-auto"/>
       </div>
 
@@ -55,7 +58,7 @@
     </Dropdown> 
 
     <Dropdown 
-      v-if="sort"
+      v-if="sort && !sort.hideButton"
       :label="{
         component: ButtonSort,
         props: { order: sort.order },
@@ -76,21 +79,23 @@
   </div>
 
   <TransitionGroup 
-    v-if="isLoading" 
+
+    v-if="isLoading"
     tag="ul" 
     name="scaleTransition" 
-    class="o-hidden bg-light radius-big"
-   :class="$attrs.class"
   >
     <SkeletonEvent
       v-if="isLoading"
       v-for="i in currentLimit" 
       :key="'skeleton-' + i"
+      class="mn-b-small radius-big o-hidden d-block"
     />
   </TransitionGroup>
 
-  <transition 
-    name="scaleTransition"
+  <TransitionGroup 
+    tag="ul" 
+    v-if="!isLoading && itemsList.length < 1"
+    name="feed"
   >
     <EmptyState
       v-if="!isLoading && itemsList.length < 1"
@@ -100,7 +105,7 @@
       :callback="states.empty.callback"
       class="pd-medium mn-b-thin bg-light radius-big"
     />
-  </transition>
+   </TransitionGroup>
 
   <TransitionGroup 
     tag="ul" 
@@ -297,7 +302,7 @@ watch(() => sort.value?.order, (newVal, oldVal) => {
      currentSkip.value = 0
     fetchItems();
   }
-}, { deep: true });
+});
 
 watch(() => sort.value?.param, (newVal, oldVal) => {
 
@@ -305,7 +310,7 @@ watch(() => sort.value?.param, (newVal, oldVal) => {
      currentSkip.value = 0
     fetchItems();
   }
-}, { deep: true });
+});
 
 
 watch(() => props.options, (newVal, oldVal) => {
@@ -318,7 +323,8 @@ watch(() => props.options, (newVal, oldVal) => {
     newVal.status !== oldVal.status ||
     newVal.hidden !== oldVal.hidden ||
     newVal.type !== oldVal.type ||
-    newVal.tags !== oldVal.tags
+    newVal.tags !== oldVal.tags || 
+    newVal.following !== oldVal.following
   ) {
     currentSkip.value = 0
     fetchItems();

package/src/components/FieldBig/FieldBig.vue

@@ -9,13 +9,23 @@
       @blur="checkInput"
       class="w-100 p-medium t-regular uppercase pd-small"
     />
-    <button v-if="action" @click="emitAction" class="t-nowrap t-medium radius-big uppercase cursor-pointer pd-l-semi pd-r-semi w-max hover-bg-fifth t-semi transition-linear transition-timing-1 t-black bg-main" v-html="action"/>
+    <button
+      v-if="action" 
+      @click="emitAction" 
+      class="t-nowrap t-medium radius-big uppercase cursor-pointer flex flex-v-center pd-r-small pd-l-small w-max hover-bg-fifth t-semi transition-linear transition-timing-1 t-black bg-main" 
+    >
+      <span>{{action}}</span>
+      <IconArrow class="mn-l-thin radius-extra bg-white i-medium"/>
+    
+  
+    </button>
   </div>
 </template>
 
 <script setup="props">
   import { ref, watchEffect, onMounted } from 'vue'
   import Field from '@pf/src/components/Field/Field.vue'
+  import IconArrow from '@pf/src/modules/icons/navigation/IconArrow.vue'
   import { useI18n } from 'vue-i18n'
 
   const props = defineProps({

package/src/components/FieldPhone/FieldPhone.vue

@@ -608,7 +608,7 @@
   }
 </script>
 
-<style scoped>
+<style lang="scss">
   .vue3-reactive-tel-input{
     display:flex
   }

package/src/components/FieldTags/FieldTags.vue

@@ -190,4 +190,5 @@
 
 <!-- js and scss resources → I separated it into different files, because they became huge -->
 <script src="./vue-tags-input.js"></script>
-<style lang="scss" src="./vue-tags-input.scss" scoped></style>
+
+<style lang="scss" src="./vue-tags-input.scss" ></style>

package/src/components/FieldTags/tag-input.vue

@@ -27,7 +27,7 @@ export default {
 
 </script>
 
-<style lang="css" scoped>
+<style lang="css" >
 .ti-tag-input {
   background-color: transparent;
   color: inherit;

package/src/components/LocationMarker/LocationMarker.vue

@@ -154,7 +154,7 @@ async function setUserLocation() {
 </script>
 
 
-<style scoped>
+<style >
 .my-location-button {
   position: absolute;
   right: 10px;

package/src/components/PhotoViewer/PhotoViewer.vue

@@ -96,7 +96,7 @@ const initialize = () => {
 };
 </script>
 
-<style scoped>
+<style>
 .photo-container {
   width: 100%;
   height: 100%;

package/src/components/Shader/Shader.vue

@@ -165,8 +165,8 @@
   });
 </script>
 
-<style scoped>
-  canvas {
+<style >
+  #glcanvas {
     width: 100%;
     height: 100%;
   }

package/src/components/Slider/Slider.vue

@@ -14,11 +14,7 @@
   </div>
 </template>
 
-<style scoped>
-
-</style>
-
-<script setup scoped>
+<script setup >
 import { ref, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'

package/src/components/Spoiler/Spoiler.vue

@@ -5,7 +5,7 @@
     </div>
 
     <transition name="collapse">
-      <div v-if="showSpoiler" class="spoiler">
+      <div v-show="showSpoiler" class="spoiler">
         <slot name="content"></slot>
       </div>
     </transition>

package/src/components/Text/Text.vue

@@ -38,7 +38,4 @@ const isTruncated = computed(() => props.text.length > props.maxLen);
 // Вычисляем текст для кнопки "Показать больше/Скрыть"
 const showMoreText = computed(() => showFull.value ? 'Hide' : 'Show more');
 
-</script>
-
-<style scoped>
-</style>
+</script>

package/src/components/Tooltip/Tooltip.vue

@@ -44,7 +44,7 @@ function hideTooltip() {
 }
 </script>
 
-<style scoped>
+<style >
 .tooltip-container {
   position: relative;
   display: inline-block;

package/src/components/Upload/Upload.vue

@@ -48,7 +48,10 @@ const emit = defineEmits(['update:field', 'focus', 'blur', 'file-change']);
 const props = defineProps({
   field: String,
   label: null,
-  type: 'file',
+  type: {
+    type: String,
+    default: 'file'
+  },
   placeholder: 'Upload a file',
   validation: false,
   uploadPath: {
@@ -80,13 +83,12 @@ async function onFileChange(e) {
   try {
     const $axios = axios.create({baseURL: process.env.API_URL, withCredentials: true}) 
 
-    let response = await $axios.post(`/api/upload/file?folderName=${encodeURIComponent(props.uploadPath)}`, formData, {
+    let response = await $axios.post(`/api/upload/${props.type}?folderName=${encodeURIComponent(props.uploadPath)}`, formData, {
       headers: {
         "Content-Type": "multipart/form-data"
       }
     });
 
-    console.log(response.data)
     fileURL.value = response.data[0].filepath;
     emit('file-change', fileURL.value);
   } catch (error) {

package/src/main.js

@@ -1,6 +1,3 @@
-// Define Styles
-// ------------------------------------- //
-import '@pf/src/styles/theme.scss';
 // Define components
 // ------------------------------------- //
 import { 

package/src/modules/auth/controllers/auth.controller.js

@@ -241,8 +241,6 @@ const controllerFactory = (db) => {
 
         const defaultAccesses = new Department
 
-        console.log(defaultAccesses)
-
         const accessData = isOwner ? defaultAccesses.accesses : (depts.find(dept => dept.organization.toString() === orgId) || {}).accesses;
        
         Object.keys(accessData).forEach(key => {

package/src/modules/auth/store/auth.js

@@ -231,7 +231,7 @@
   // Cookies
   const optionsDefault = {
     development: { secure: false, expires: 7, sameSite: 'Lax'  },
-    production: { expires: 7, path: '/', domain: process.env.API_URL, sameSite: 'none', secure: true }
+    production: { expires: 7, path: '/', domain: process.env.DOMAIN_URL, sameSite: 'none', secure: true }
   };
 
   async function getCookie(name) {
@@ -263,7 +263,7 @@
       Preferences.remove({ key: name });
     } else {
       // Для веб-версии
-      const options = env === 'production' ? { domain: process.env.API_URL } : {};
+      const options = env === 'production' ? { domain: process.env.DOMAIN_URL } : {};
       Cookies.remove(name, options);
     }
   }

package/src/modules/community/DOCUMENTATION.MD

@@ -0,0 +1,4 @@
+# Дефолтное состояние
+Дефолтное состояние определяется через query указанное в роуте, которое передается в стор модуля. Механизм считывания query находится в lifecycle onMounted компонента Blog.vue. Если query нет, то он берет дефолтное значение из стора. Period и tags назначаются на null и [] в lifecycle onMounted компонента Blog.vue.
+
+Для блока с периодом (Topic for $period) используется route.query.period, если он не указан - то Period назначаются на null в lifecycle onMounted компонента Blog.vue

package/src/modules/community/community.client.js

@@ -6,7 +6,6 @@ import Blog from './components/pages/Blog.vue';
 import FooterBlogpost from './components/blocks/FooterBlogpost.vue';
 import Activity from './components/blocks/Activity.vue';
 import CardBlogpost from './components/blocks/CardBlogpost.vue';
-import Feed from './components/sections/Feed.vue';
 import JoinUs from './components/sections/JoinUs.vue';
 import Comments from './components/sections/Comments.vue';
 import HotPosts from './components/sections/HotPosts.vue';
@@ -28,7 +27,6 @@ export {
   FooterBlogpost,
   Activity,
   CardBlogpost,
-  Feed,
   JoinUs,
   Comments,
   HotPosts,

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

@@ -3,7 +3,7 @@
 		class="pos-relative bg-light radius-big flex-column flex"
 	>
 
-		<router-link 
+		<!-- <router-link 
 			v-if="user && user === blogpost.creator.target._id"
 			:to="{
 				name: 'Edit BlogPost', 
@@ -11,6 +11,7 @@
 					url: blogpost.url
 				}
 			}" 
+
 			class="
 				cursor-pointer 
 				pos-absolute pos-t-regular pos-r-regular
@@ -21,7 +22,7 @@
 				class="i-regular"
 				classes="fill-white"
 			/>
-		</router-link>
+		</router-link> -->
 
 		<CardHeader 
 	    :class="{
@@ -34,6 +35,9 @@
 	    :owner="blogpost.owner" 
     	:creator="blogpost.creator"
     	:date="blogpost.createdAt"
+    	:actions="user && user === blogpost.creator.target._id ? [
+        { to: { name: 'Edit BlogPost', params: {url: blogpost.url } }, label: 'Edit' }
+       ]: null"
 		/>
 
 	

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

@@ -1,8 +1,16 @@
 <template>
   <footer class="t-semi br-top-dark flex-nowrap flex-nojustify flex">
-    👁️ {{blogpost.views}}
-    <span class="mn-r-small mn-l-small d-block">·</span>
-    <div class="cursor-pointer">
+    <router-link :to="{
+      name: 'BlogPost', 
+      params: { 
+        url: blogpost.url 
+      }
+    }" 
+    class="font-second cursor-pointer hover-bg-white pd-l-thin pd-r-thin radius-big">
+      👁️ {{blogpost.views}}
+    </router-link>
+    
+    <div class="hover-bg-white pd-l-thin pd-r-thin radius-big cursor-pointer">
       <div class="cursor-pointer" @click="addReaction('like')" v-if="!isReacted">
         👍 {{reactionsCount }}
       </div>
@@ -10,8 +18,16 @@
         👍 {{reactionsCount }}
       </div>
     </div>
-    <span class="mn-r-small mn-l-small d-block">·</span>
-    💬 {{blogpost.numberOfComments }}
+    <router-link :to="{
+      name: 'BlogPost', 
+      hash: '#comments',
+      params: { 
+        url: blogpost.url 
+      }
+    }" 
+    class="font-second cursor-pointer hover-bg-white pd-l-thin pd-r-thin radius-big">
+      💬 {{ blogpost.numberOfComments }}
+    </router-link>
   </footer>
 </template>
 

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

@@ -4,7 +4,7 @@
 		<ul class="align-self-start pos-sticky pos-t-0 w-100 bg-light radius-big pd-medium p-medium gap-thin flex-column flex-nowrap flex">
 			<li  	
 				:class="{'t-black bg-white': route.params.category === 'featured' }" 					
-				@click="router.push({name: 'Blog', params: { category: 'featured' } })" 
+				@click="() => { blog.state.sort.param = 'createdAt'; router.push({name: 'Blog', params: { category: 'featured' } })}" 
 				class="cursor-pointer flex-v-center flex t-medium  pd-thin radius-extra"
 			>
 				<IconFeatured class="i-medium mn-r-thin t-transp"/>
@@ -12,7 +12,7 @@
 			</li>
 			<li  	
 				:class="{'t-black bg-white': route.params.category === 'popular' }"					 				
-				@click="router.push({name: 'Blog', params: { category: 'popular' } })" 
+				@click="() => { blog.state.sort.param = 'views'; router.push({name: 'Blog', params: { category: 'popular' } }) }" 
 				class="cursor-pointer t-medium flex-v-center flex  pd-thin radius-extra"
 			>	
 				<IconPopular class="i-medium mn-r-thin t-transp"/>
@@ -20,16 +20,16 @@
 			</li>
 			<li  	
 				:class="{'t-black bg-white': route.params.category === 'new'}" 					
-				@click="router.push({name: 'Blog', params: { category: 'new' } })" 
+				@click="() => { blog.state.sort.param = 'createdAt'; router.push({name: 'Blog', params: { category: 'new' } })}" 
 				class="cursor-pointer t-medium flex-v-center flex  pd-thin radius-extra"
 			>
 				<IconRecent class="i-medium mn-r-thin t-transp"/>
 				Recent
-		</li>
+			</li>
 			<li 	
 				v-if="auth.state.user._id"
 				:class="{'t-black bg-white': route.params.category === 'following'}" 		
-				@click="router.push({name: 'Blog', params: { category: 'following' } })" 
+				@click="() => { blog.state.sort.param = 'createdAt'; router.push({name: 'Blog', params: { category: 'following' } })}" 
 				class="cursor-pointer t-medium flex-v-center flex pd-thin radius-extra"
 			>
 				<IconFollowing class="i-medium mn-r-thin t-transp"/>
@@ -49,13 +49,13 @@
 		<section class="pos-relative">
 
 			<header class="bg-main t-black radius-big pd-medium pos-relative  mn-b-thin flex-v-center t-left flex-nowrap flex">
-	    	<h2 class="pos-relative flex-v-center flex-nowrap flex">
-	    		<span class="mn-r-small">Topics for </span>
+	    	<h3 class="pos-relative flex-v-center flex-nowrap flex">
+	    		<span class="mn-r-thin">Topics for </span>
 
 	    		<Select 
-		        :options="['today','week','month','year']"
+		        :options="['today','week','month','year','all time']"
 		        v-model:select="blog.state.filter.period" 
-		        placeholder="Select type"
+		        placeholder="all time"
 		        class="
 		        	t-semi
 		        	pos-relative 
@@ -63,14 +63,14 @@
 		        	bg-main t-black
 		        	pd-thin
 		        	radius-medium
-		          h2
+		          h3
 		         	t-center
 		         	br-solid
 		         	br-2px
 		         	br-black-transp-10
 		        "
 		      />
-	    	</h2>
+	    	</h3>
 			</header>
 
 			<router-view  v-slot="{ Component, route }">
@@ -160,6 +160,10 @@
 	const route = useRoute();
 	const router = useRouter();
 
+	if (route.params.category === 'popular') blog.state.sort.param = 'views'; 
+	if (route.params.category === 'new') blog.state.sort.param = 'createdAt'; 
+
+
 	const handleMembershipUpdate = ({ membership, status, target }, statusName, statusNumber) => {
 	  memberships.mutations.handleMembershipUpdate(organizations.state.current, membership, status, target, statusName, statusNumber)
 	};

package/src/modules/community/components/pages/Blog.vue

@@ -1,58 +1,50 @@
 <template>
-  <section>
-
-
-      
-   <!--  <Feed
+  <section class="bg-white">
+    <Feed
+      v-model:sort="blog.state.sort"
       :showLoadMore="false"
       :states="{
         empty: {
-          title: 'No Blogposts Found',
-          description: 'Currently, there are no blogposts available.'
-        }
+          title: 'No Blog Posts Found',
+          description: 'Currently, there are no posts available in this blog. Please check back later.'
+        },
       }"
       :store="{
-        read: (options) => blog.read(options),
-        state: blog.state.all
+        read: (options) => blog.read(options)
       }"
       :options="{
-        skip: 0,
-        limit: 8,
+        limit: 15,
+        category: route.params.category,
+        period: route.query.period,
+        status: 'published',
         user: auth.state.user._id,
-        period: 'year'
+        following: route.params.category === 'following' ? auth.state.user._id : null,
       }"
       v-slot="{ 
         items 
       }"
-      class="cols-4 gap-thin"
+      class="mobile:w-50 desktop:w-100 tablet:w-75 row-1 gap-thin"
     >
       <CardBlogpost 
-        v-for="(blogpost,index) in items" 
-        :key="blogpost._id" 
-        :blogpost="blogpost" 
-        :user="user" 
-        class="mn-b-medium"
-        :class="`div${index}`"
+        v-for="item in items" 
+        :key="item._id" 
+        :blogpost="item" 
+        :user="auth.state.user._id" 
+        class="h-max-40r mn-b-medium"
       />
     </Feed>
-
- -->
-    <Feed 
-      :category="route.params.category" 
-      :user="auth.state.user._id"
-      :period="route.query.period"
-      :following="route.params.category === 'following' ? auth.state.user._id : null"
-    />
   </section>
 </template>
 
 
 <script setup="props">
-  import { computed, onMounted, watch } from 'vue';
+  import { ref, computed, onMounted, watch } from 'vue';
   import { useRoute, useRouter } from 'vue-router';
 
   import Breadcrumbs from '@pf/src/components/Breadcrumbs/Breadcrumbs.vue';
-  import Feed from '@pf/src/modules/community/components/sections/Feed.vue'; 
+  import Feed from '@pf/src/components/Feed/Feed.vue'
+
+  import CardBlogpost from '@pf/src/modules/community/components/blocks/CardBlogpost.vue';
 
   // Import state
   import * as blog from '@pf/src/modules/community/store/blogposts.js';
@@ -65,7 +57,7 @@
   // if (!route.params.category) {
   //   route.params.category = 'popular'
   // }
-
+ 
   onMounted(() => {
 
     if (route.query) {
@@ -73,7 +65,7 @@
 
       const newFilterValue = {
         tags: query.tags ? query.tags.split(',') : [],
-        period: query.period ? query.period : 'week',
+        period: query.period ? query.period : null,
       };
 
       // проверяем наличие категории в route.params и добавляем ее в фильтр
@@ -83,6 +75,7 @@
 
       blog.state.filter = newFilterValue;
     }
+    
   });
 
   watch(() => blog.state.filter, (newFilterValue, oldFilterValue) => {

package/src/modules/community/components/pages/CreateBlogPost.vue

@@ -10,18 +10,18 @@
       <div 
         class="w-full h-full"
       >
-        <Textarea 
+        <!-- <Textarea 
           v-if="post" 
           :prop="post" 
-           :setFocus="true"
+          :setFocus="true"
           content="name" 
           placeholder="Enter post title" 
           class="h2"
-        />
+        /> -->
       </div>
 
       <Constructor 
-         v-if="post" 
+        v-if="post" 
         :content="post.content"
         @update="update => post.content = update"
       />
@@ -38,8 +38,7 @@
     </section>
     </transition>
 
-    <Popup 
-      title="Добавить участника" 
+    <Popup  
       @close-popup="closePublicationPopup" 
       :isPopupOpen="isPublicationPopup"
       class="w-m-33r t-left pd-big bg-white radius-big"
@@ -49,6 +48,7 @@
       <BlockTags
         @tags-changed="newTags => post.tags = newTags"
         :tags="post.tags"
+        class="mn-b-small"
       />
 
       <h5 class="mn-b-thin">Add source:</h5>
@@ -154,13 +154,6 @@ onMounted(async () =>{
     name: post.value.owner.target.profile.name,
     photo: post.value.owner.target.profile.photo
   }
-
-  
-
-  console.log(dataPublics)
-
-
-
 })
 // /////////////////////////////////////////
 // Publication Form
@@ -206,6 +199,7 @@ function onDrafts() {
   if (selectedTags.value.length > 0) selectedTags.value.map(tag => (tag.text))
 
   post.value.status = "draft"
+  post.value.name = post.value.content[0].content
 
   if (route.params.url) {
     blog.update(post.value)
@@ -237,8 +231,7 @@ function onSubmit() {
   if (!selectedOrganization.value) post.value.organization = post.value.creator
 
   post.value.status = "published"
-
-  console.log(post.value)
+  post.value.name = post.value.content[0].content
 
   if (route.params.url) {
     blog.update(post.value)