|
|
@ -2,7 +2,7 @@ |
|
|
|
<div id="social-wall-container"> |
|
|
|
<div id="social-wall-container"> |
|
|
|
<div class="flex justify-center mb-6 space-x-4"> |
|
|
|
<div class="flex justify-center mb-6 space-x-4"> |
|
|
|
<button |
|
|
|
<button |
|
|
|
:class="['tab', { 'tab-active': filterType === null }]" |
|
|
|
:class="['tab', { 'tab-active': !filterType }]" |
|
|
|
@click="filterMessages(null)" |
|
|
|
@click="filterMessages(null)" |
|
|
|
> |
|
|
|
> |
|
|
|
{{ t('All Messages') }} |
|
|
|
{{ t('All Messages') }} |
|
|
@ -15,7 +15,7 @@ |
|
|
|
</button> |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<SocialWallPostForm v-if="!hidePostForm && isCurrentUser" @post-created="refreshPosts" class="mb-6" /> |
|
|
|
<SocialWallPostForm v-if="!hidePostForm && isCurrentUser && (!filterType || isAdmin)" @post-created="refreshPosts" class="mb-6" /> |
|
|
|
<SocialWallPostList ref="postListRef" class="mb-6" /> |
|
|
|
<SocialWallPostList ref="postListRef" class="mb-6" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</template> |
|
|
@ -23,9 +23,10 @@ |
|
|
|
<script setup> |
|
|
|
<script setup> |
|
|
|
import { inject, ref, watch } from "vue"; |
|
|
|
import { inject, ref, watch } from "vue"; |
|
|
|
import { useRoute, useRouter } from "vue-router"; |
|
|
|
import { useRoute, useRouter } from "vue-router"; |
|
|
|
|
|
|
|
import { useI18n } from "vue-i18n"; |
|
|
|
import SocialWallPostForm from "../../components/social/SocialWallPostForm.vue"; |
|
|
|
import SocialWallPostForm from "../../components/social/SocialWallPostForm.vue"; |
|
|
|
import SocialWallPostList from "../../components/social/SocialWallPostList.vue"; |
|
|
|
import SocialWallPostList from "../../components/social/SocialWallPostList.vue"; |
|
|
|
import { useI18n } from "vue-i18n"; |
|
|
|
import { useSecurityStore } from "../../store/securityStore" |
|
|
|
|
|
|
|
|
|
|
|
const { t } = useI18n(); |
|
|
|
const { t } = useI18n(); |
|
|
|
|
|
|
|
|
|
|
@ -41,6 +42,8 @@ const isCurrentUser = inject('is-current-user'); |
|
|
|
const route = useRoute(); |
|
|
|
const route = useRoute(); |
|
|
|
const router = useRouter(); |
|
|
|
const router = useRouter(); |
|
|
|
const filterType = ref(route.query.filterType || null); |
|
|
|
const filterType = ref(route.query.filterType || null); |
|
|
|
|
|
|
|
const securityStore = useSecurityStore(); |
|
|
|
|
|
|
|
const isAdmin = securityStore.isAdmin; |
|
|
|
|
|
|
|
|
|
|
|
watch( |
|
|
|
watch( |
|
|
|
() => route.query.filterType, |
|
|
|
() => route.query.filterType, |
|
|
@ -57,10 +60,10 @@ function refreshPosts() { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function filterMessages(type) { |
|
|
|
function filterMessages(type) { |
|
|
|
router.push({ path: '/social', query: { filterType: type } }); |
|
|
|
if (type === null) { |
|
|
|
|
|
|
|
router.push({ path: '/social' }); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
router.push({ path: '/social', query: { filterType: type } }); |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
<style scoped> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</style> |
|
|
|
|
|
|
|