mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-04-23 00:33:50 +02:00
refactor: app.js (#1291)
* refactor: frontend * Fix avatar gallery sort * Update .NET dependencies * Update npm dependencies electron v37.1.0 * bulkRefreshFriends * fix dark theme * Remove crowdin * Fix config.json dialog not updating * VRCX log file fixes & add Cef log * Remove SharedVariable, fix startup * Revert init theme change * Logging date not working? Fix WinformThemer designer error * Add Cef request hander, no more escaping main page * clean * fix * fix * clean * uh * Apply thememode at startup, fixes random user colours * Split database into files * Instance info remove empty lines * Open external VRC links with VRCX * Electron fixes * fix userdialog style * ohhhh * fix store * fix store * fix: load all group members after kicking a user * fix: world dialog favorite button style * fix: Clear VRCX Cache Timer input value * clean * Fix VR overlay * Fix VR overlay 2 * Fix Discord discord rich presence for RPC worlds * Clean up age verified user tags * Fix playerList being occupied after program reload * no `this` * Fix login stuck loading * writable: false * Hide dialogs on logout * add flush sync option * rm LOGIN event * rm LOGOUT event * remove duplicate event listeners * remove duplicate event listeners * clean * remove duplicate event listeners * clean * fix theme style * fix t * clearable * clean * fix ipcEvent * Small changes * Popcorn Palace support * Remove checkActiveFriends * Clean up * Fix dragEnterCef * Block API requests when not logged in * Clear state on login & logout * Fix worldDialog instances not updating * use <script setup> * Fix avatar change event, CheckGameRunning at startup * Fix image dragging * fix * Remove PWI * fix updateLoop * add webpack-dev-server to dev environment * rm unnecessary chunks * use <script setup> * webpack-dev-server changes * use <script setup> * use <script setup> * Fix UGC text size * Split login event * t * use <script setup> * fix * Update .gitignore and enable checkJs in jsconfig * fix i18n t * use <script setup> * use <script setup> * clean * global types * fix * use checkJs for debugging * Add watchState for login watchers * fix .vue template * type fixes * rm Vue.filter * Cef v138.0.170, VC++ 2022 * Settings fixes * Remove 'USER:CURRENT' * clean up 2FA callbacks * remove userApply * rm i18n import * notification handling to use notification store methods * refactor favorite handling to use favorite store methods and clean up event emissions * refactor moderation handling to use dedicated functions for player moderation events * refactor friend handling to use dedicated functions for friend events * Fix program startup, move lang init * Fix friend state * Fix status change error * Fix user notes diff * fix * rm group event * rm auth event * rm avatar event * clean * clean * getUser * getFriends * getFavoriteWorlds, getFavoriteAvatars * AvatarGalleryUpload btn style & package.json update * Fix friend requests * Apply user * Apply world * Fix note diff * Fix VR overlay * Fixes * Update build scripts * Apply avatar * Apply instance * Apply group * update hidden VRC+ badge * Fix sameInstance "private" * fix 502/504 API errors * fix 502/504 API errors * clean * Fix friend in same instance on orange showing twice in friends list * Add back in broken friend state repair methods * add types --------- Co-authored-by: Natsumi <cmcooper123@hotmail.com>
This commit is contained in:
pa
GitHub
@@ -36,7 +36,7 @@
|
||||
</el-popover>
|
||||
<div style="flex: 1; display: flex; align-items: center; margin-left: 15px">
|
||||
<div class="group-header" style="flex: 1">
|
||||
<span v-if="groupDialog.ref.ownerId === API.currentUser.id" style="margin-right: 5px">👑</span>
|
||||
<span v-if="groupDialog.ref.ownerId === currentUser.id" style="margin-right: 5px">👑</span>
|
||||
<span class="dialog-title" style="margin-right: 5px" v-text="groupDialog.ref.name"></span>
|
||||
<span
|
||||
class="group-discriminator x-grey"
|
||||
@@ -399,9 +399,9 @@
|
||||
</span>
|
||||
<div v-for="room in groupDialog.instances" :key="room.tag" style="width: 100%">
|
||||
<div style="margin: 5px 0">
|
||||
<location :location="room.tag" style="display: inline-block" />
|
||||
<Location :location="room.tag" style="display: inline-block" />
|
||||
<el-tooltip placement="top" content="Invite yourself" :disabled="hideTooltips">
|
||||
<invite-yourself :location="room.tag" style="margin-left: 5px" />
|
||||
<InviteYourself :location="room.tag" style="margin-left: 5px" />
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="top" content="Refresh player count" :disabled="hideTooltips">
|
||||
<el-button
|
||||
@@ -411,12 +411,11 @@
|
||||
circle
|
||||
@click="refreshInstancePlayerCount(room.tag)" />
|
||||
</el-tooltip>
|
||||
<last-join :location="room.tag" :currentlocation="lastLocation.location" />
|
||||
<instance-info
|
||||
<LastJoin :location="room.tag" :currentlocation="lastLocation.location" />
|
||||
<InstanceInfo
|
||||
:location="room.tag"
|
||||
:instance="room.ref"
|
||||
:friendcount="room.friendCount"
|
||||
:updateelement="updateInstanceInfo" />
|
||||
:friendcount="room.friendCount" />
|
||||
</div>
|
||||
<div
|
||||
v-if="room.users.length"
|
||||
@@ -437,10 +436,10 @@
|
||||
v-text="user.displayName" />
|
||||
<span v-if="user.location === 'traveling'" class="extra">
|
||||
<i class="el-icon-loading" style="margin-right: 5px" />
|
||||
<timer :epoch="user.$travelingToTime" />
|
||||
<Timer :epoch="user.$travelingToTime" />
|
||||
</span>
|
||||
<span v-else class="extra">
|
||||
<timer :epoch="user.$location_at" />
|
||||
<Timer :epoch="user.$location_at" />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -494,13 +493,14 @@
|
||||
<span>{{ t('dialog.group.posts.visibility') }}</span>
|
||||
<br />
|
||||
<template v-for="roleId in groupDialog.announcement.roleIds">
|
||||
<template v-for="role in groupDialog.ref.roles"
|
||||
><span
|
||||
v-if="role.id === roleId"
|
||||
:key="roleId + role.id"
|
||||
v-text="role.name"
|
||||
/></template>
|
||||
<span
|
||||
v-for="(role, rIndex) in groupDialog.ref.roles"
|
||||
v-if="role.id === roleId"
|
||||
:key="rIndex"
|
||||
v-text="role.name" />
|
||||
<span
|
||||
:key="rIndex"
|
||||
:key="roleId"
|
||||
v-if="
|
||||
groupDialog.announcement.roleIds.indexOf(roleId) <
|
||||
groupDialog.announcement.roleIds.length - 1
|
||||
@@ -511,18 +511,18 @@
|
||||
</template>
|
||||
<i class="el-icon-view" style="margin-right: 5px" />
|
||||
</el-tooltip>
|
||||
<display-name
|
||||
<DisplayName
|
||||
:userid="groupDialog.announcement.authorId"
|
||||
style="margin-right: 5px" />
|
||||
<span v-if="groupDialog.announcement.editorId" style="margin-right: 5px">
|
||||
({{ t('dialog.group.posts.edited_by') }}
|
||||
<display-name :userid="groupDialog.announcement.editorId" />)
|
||||
<DisplayName :userid="groupDialog.announcement.editorId" />)
|
||||
</span>
|
||||
<el-tooltip placement="bottom">
|
||||
<template #content>
|
||||
<span
|
||||
>{{ t('dialog.group.posts.created_at') }}
|
||||
{{ groupDialog.announcement.createdAt | formatDate('long') }}</span
|
||||
{{ formatDateFilter(groupDialog.announcement.createdAt, 'long') }}</span
|
||||
>
|
||||
<template
|
||||
v-if="
|
||||
@@ -532,11 +532,13 @@
|
||||
<br />
|
||||
<span
|
||||
>{{ t('dialog.group.posts.edited_at') }}
|
||||
{{ groupDialog.announcement.updatedAt | formatDate('long') }}</span
|
||||
{{
|
||||
formatDateFilter(groupDialog.announcement.updatedAt, 'long')
|
||||
}}</span
|
||||
>
|
||||
</template>
|
||||
</template>
|
||||
<timer :epoch="Date.parse(groupDialog.announcement.updatedAt)" />
|
||||
<Timer :epoch="Date.parse(groupDialog.announcement.updatedAt)" />
|
||||
</el-tooltip>
|
||||
<template v-if="hasGroupPermission(groupDialog.ref, 'group-announcement-manage')">
|
||||
<el-tooltip
|
||||
@@ -593,7 +595,7 @@
|
||||
<div class="x-friend-item" style="cursor: default">
|
||||
<div class="detail">
|
||||
<span class="name">{{ t('dialog.group.info.created_at') }}</span>
|
||||
<span class="extra">{{ groupDialog.ref.createdAt | formatDate('long') }}</span>
|
||||
<span class="extra">{{ formatDateFilter(groupDialog.ref.createdAt, 'long') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="x-friend-item" style="cursor: default">
|
||||
@@ -667,7 +669,7 @@
|
||||
<div class="detail">
|
||||
<span class="name">{{ t('dialog.group.info.joined_at') }}</span>
|
||||
<span class="extra">{{
|
||||
groupDialog.ref.myMember.joinedAt | formatDate('long')
|
||||
formatDateFilter(groupDialog.ref.myMember.joinedAt, 'long')
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -688,18 +690,18 @@
|
||||
<br />
|
||||
<span v-if="role.updatedAt"
|
||||
>{{ t('dialog.group.info.role_updated_at') }}
|
||||
{{ role.updatedAt | formatDate('long') }}</span
|
||||
{{ formatDateFilter(role.updatedAt, 'long') }}</span
|
||||
>
|
||||
<span v-else
|
||||
>{{ t('dialog.group.info.role_created_at') }}
|
||||
{{ role.createdAt | formatDate('long') }}</span
|
||||
{{ formatDateFilter(role.createdAt, 'long') }}</span
|
||||
>
|
||||
<br />
|
||||
<span>{{ t('dialog.group.info.role_permissions') }}</span>
|
||||
<br />
|
||||
<template v-for="(permission, pIndex) in role.permissions">
|
||||
<span :key="pIndex">{{ permission }}</span>
|
||||
<br />
|
||||
<br :key="pIndex + permission" />
|
||||
</template>
|
||||
</template>
|
||||
<span
|
||||
@@ -776,38 +778,40 @@
|
||||
<span>{{ t('dialog.group.posts.visibility') }}</span>
|
||||
<br />
|
||||
<template v-for="roleId in post.roleIds">
|
||||
<span
|
||||
v-for="(role, rIndex) in groupDialog.ref.roles"
|
||||
v-if="role.id === roleId"
|
||||
:key="rIndex"
|
||||
v-text="role.name" />
|
||||
<span v-if="post.roleIds.indexOf(roleId) < post.roleIds.length - 1"
|
||||
>, </span
|
||||
<template v-for="role in groupDialog.ref.roles"
|
||||
><span
|
||||
v-if="role.id === roleId"
|
||||
:key="role.id + roleId"
|
||||
v-text="role.name" />
|
||||
</template>
|
||||
<template
|
||||
v-if="post.roleIds.indexOf(roleId) < post.roleIds.length - 1"
|
||||
><span :key="roleId">, </span></template
|
||||
>
|
||||
</template>
|
||||
</template>
|
||||
<i class="el-icon-view" style="margin-right: 5px" />
|
||||
</el-tooltip>
|
||||
<display-name :userid="post.authorId" style="margin-right: 5px" />
|
||||
<DisplayName :userid="post.authorId" style="margin-right: 5px" />
|
||||
<span v-if="post.editorId" style="margin-right: 5px"
|
||||
>({{ t('dialog.group.posts.edited_by') }}
|
||||
<display-name :userid="post.editorId" />)</span
|
||||
<DisplayName :userid="post.editorId" />)</span
|
||||
>
|
||||
<el-tooltip placement="bottom">
|
||||
<template slot="content">
|
||||
<span
|
||||
>{{ t('dialog.group.posts.created_at') }}
|
||||
{{ post.createdAt | formatDate('long') }}</span
|
||||
{{ formatDateFilter(post.createdAt, 'long') }}</span
|
||||
>
|
||||
<template v-if="post.updatedAt !== post.createdAt">
|
||||
<br />
|
||||
<span
|
||||
>{{ t('dialog.group.posts.edited_at') }}
|
||||
{{ post.updatedAt | formatDate('long') }}</span
|
||||
{{ formatDateFilter(post.updatedAt, 'long') }}</span
|
||||
>
|
||||
</template>
|
||||
</template>
|
||||
<timer :epoch="Date.parse(post.updatedAt)" />
|
||||
<Timer :epoch="Date.parse(post.updatedAt)" />
|
||||
</el-tooltip>
|
||||
<template
|
||||
v-if="hasGroupPermission(groupDialog.ref, 'group-announcement-manage')">
|
||||
@@ -885,7 +889,7 @@
|
||||
@click.native.stop>
|
||||
<el-button size="mini">
|
||||
<span
|
||||
>{{ groupDialog.memberSortOrder.name }}
|
||||
>{{ t(groupDialog.memberSortOrder.name) }}
|
||||
<i class="el-icon-arrow-down el-icon--right"
|
||||
/></span>
|
||||
</el-button>
|
||||
@@ -894,7 +898,7 @@
|
||||
v-for="item in groupDialogSortingOptions"
|
||||
:key="item.name"
|
||||
@click.native="setGroupMemberSortOrder(item)"
|
||||
v-text="item.name" />
|
||||
v-text="t(item.name)" />
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<span style="margin-right: 5px">{{ t('dialog.group.members.filter') }}</span>
|
||||
@@ -906,7 +910,7 @@
|
||||
@click.native.stop>
|
||||
<el-button size="mini">
|
||||
<span
|
||||
>{{ groupDialog.memberFilter.name }}
|
||||
>{{ t(groupDialog.memberFilter.name) }}
|
||||
<i class="el-icon-arrow-down el-icon--right"
|
||||
/></span>
|
||||
</el-button>
|
||||
@@ -915,7 +919,7 @@
|
||||
v-for="item in groupDialogFilterOptions"
|
||||
:key="item.name"
|
||||
@click.native="setGroupMemberFilter(item)"
|
||||
v-text="item.name" />
|
||||
v-text="t(item.name)" />
|
||||
<el-dropdown-item
|
||||
v-for="item in groupDialog.ref.roles"
|
||||
v-if="!item.defaultRole"
|
||||
@@ -984,13 +988,13 @@
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<template v-for="roleId in user.roleIds">
|
||||
<span
|
||||
v-for="(role, rIndex) in groupDialog.ref.roles"
|
||||
v-if="role.id === roleId"
|
||||
:key="rIndex"
|
||||
v-text="role.name" />
|
||||
<span v-if="user.roleIds.indexOf(roleId) < user.roleIds.length - 1"
|
||||
>, </span
|
||||
<template v-for="role in groupDialog.ref.roles"
|
||||
><span
|
||||
v-if="role.id === roleId"
|
||||
:key="role.id + roleId"
|
||||
v-text="role.name" /></template
|
||||
><template v-if="user.roleIds.indexOf(roleId) < user.roleIds.length - 1"
|
||||
><span :key="roleId">, </span></template
|
||||
>
|
||||
</template>
|
||||
</span>
|
||||
@@ -1048,19 +1052,18 @@
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<template v-for="roleId in user.roleIds">
|
||||
<span
|
||||
v-for="(role, rIndex) in groupDialog.ref.roles"
|
||||
v-if="role.id === roleId"
|
||||
:key="rIndex"
|
||||
v-text="role.name" />
|
||||
<span v-if="user.roleIds.indexOf(roleId) < user.roleIds.length - 1"
|
||||
>, </span
|
||||
<template v-for="role in groupDialog.ref.roles"
|
||||
><span
|
||||
v-if="role.id === roleId"
|
||||
:key="roleId + role"
|
||||
v-text="role.name" /></template
|
||||
><template v-if="user.roleIds.indexOf(roleId) < user.roleIds.length - 1"
|
||||
><span :key="roleId"> </span></template
|
||||
>
|
||||
</template>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
<!--FIXME: div in ul-->
|
||||
<div
|
||||
v-if="!isGroupMembersDone"
|
||||
v-loading="isGroupMembersLoading"
|
||||
@@ -1150,108 +1153,75 @@
|
||||
<!--Nested-->
|
||||
<GroupPostEditDialog :dialog-data.sync="groupPostEditDialog" :selected-gallery-file="selectedGalleryFile" />
|
||||
<GroupMemberModerationDialog
|
||||
:group-dialog="groupDialog"
|
||||
:is-group-members-loading.sync="isGroupMembersLoading"
|
||||
:group-dialog-filter-options="groupDialogFilterOptions"
|
||||
:group-dialog-sorting-options="groupDialogSortingOptions"
|
||||
:random-user-colours="randomUserColours"
|
||||
:group-member-moderation="groupMemberModeration"
|
||||
@close-dialog="closeMemberModerationDialog"
|
||||
@group-members-search="groupMembersSearch"
|
||||
@load-all-group-members="loadAllGroupMembers"
|
||||
@set-group-member-filter="setGroupMemberFilter"
|
||||
@set-group-member-sort-order="setGroupMemberSortOrder" />
|
||||
<InviteGroupDialog
|
||||
:dialog-data.sync="inviteGroupDialog"
|
||||
:vip-friends="vipFriends"
|
||||
:online-friends="onlineFriends"
|
||||
:offline-friends="offlineFriends"
|
||||
:active-friends="activeFriends" />
|
||||
<InviteGroupDialog />
|
||||
</safe-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { getCurrentInstance, inject, nextTick, reactive, ref, watch } from 'vue';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { getCurrentInstance, nextTick, reactive, ref, watch } from 'vue';
|
||||
import { useI18n } from 'vue-i18n-bridge';
|
||||
import * as workerTimers from 'worker-timers';
|
||||
import { groupRequest } from '../../../api';
|
||||
import utils from '../../../classes/utils';
|
||||
import { hasGroupPermission } from '../../../composables/group/utils';
|
||||
import { refreshInstancePlayerCount } from '../../../composables/instance/utils';
|
||||
import { copyToClipboard, downloadAndSaveJson, getFaviconUrl } from '../../../composables/shared/utils';
|
||||
import { languageClass } from '../../../composables/user/utils';
|
||||
import Location from '../../Location.vue';
|
||||
import { $app } from '../../../app';
|
||||
import { groupDialogFilterOptions, groupDialogSortingOptions } from '../../../shared/constants';
|
||||
import {
|
||||
adjustDialogZ,
|
||||
buildTreeData,
|
||||
copyToClipboard,
|
||||
downloadAndSaveJson,
|
||||
getFaviconUrl,
|
||||
hasGroupPermission,
|
||||
languageClass,
|
||||
openExternalLink,
|
||||
refreshInstancePlayerCount,
|
||||
removeFromArray,
|
||||
userImage,
|
||||
userStatusClass,
|
||||
formatDateFilter
|
||||
} from '../../../shared/utils';
|
||||
import {
|
||||
useAppearanceSettingsStore,
|
||||
useGalleryStore,
|
||||
useGroupStore,
|
||||
useLocationStore,
|
||||
useUserStore
|
||||
} from '../../../stores';
|
||||
import InviteGroupDialog from '../InviteGroupDialog.vue';
|
||||
import GroupMemberModerationDialog from './GroupMemberModerationDialog.vue';
|
||||
import GroupPostEditDialog from './GroupPostEditDialog.vue';
|
||||
|
||||
const API = inject('API');
|
||||
const showFullscreenImageDialog = inject('showFullscreenImageDialog');
|
||||
const showUserDialog = inject('showUserDialog');
|
||||
const userStatusClass = inject('userStatusClass');
|
||||
const userImage = inject('userImage');
|
||||
const openExternalLink = inject('openExternalLink');
|
||||
const adjustDialogZ = inject('adjustDialogZ');
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const { hideTooltips } = storeToRefs(useAppearanceSettingsStore());
|
||||
const { showUserDialog } = useUserStore();
|
||||
const { currentUser } = storeToRefs(useUserStore());
|
||||
const { groupDialog, inviteGroupDialog } = storeToRefs(useGroupStore());
|
||||
const {
|
||||
getGroupDialogGroup,
|
||||
updateGroupPostSearch,
|
||||
showGroupDialog,
|
||||
leaveGroupPrompt,
|
||||
setGroupVisibility,
|
||||
applyGroupMember,
|
||||
handleGroupMember,
|
||||
handleGroupMemberProps
|
||||
} = useGroupStore();
|
||||
|
||||
const { lastLocation } = storeToRefs(useLocationStore());
|
||||
const { showFullscreenImageDialog } = useGalleryStore();
|
||||
|
||||
const instance = getCurrentInstance();
|
||||
const $confirm = instance.proxy.$confirm;
|
||||
const $message = instance.proxy.$message;
|
||||
|
||||
const props = defineProps({
|
||||
groupDialog: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
hideTooltips: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
lastLocation: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
updateInstanceInfo: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
groupDialogSortingOptions: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
groupDialogFilterOptions: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
randomUserColours: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
vipFriends: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
onlineFriends: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
offlineFriends: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
activeFriends: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
});
|
||||
|
||||
const emit = defineEmits([
|
||||
'update:group-dialog',
|
||||
'groupDialogCommand',
|
||||
'getGroupDialogGroup',
|
||||
'updateGroupPostSearch'
|
||||
]);
|
||||
|
||||
const groupDialogRef = ref(null);
|
||||
const isGroupMembersDone = ref(false);
|
||||
const isGroupMembersLoading = ref(false);
|
||||
@@ -1283,20 +1253,10 @@
|
||||
auditLogTypes: []
|
||||
});
|
||||
|
||||
const inviteGroupDialog = ref({
|
||||
visible: false,
|
||||
loading: false,
|
||||
groupId: '',
|
||||
groupName: '',
|
||||
userId: '',
|
||||
userIds: [],
|
||||
userObject: {}
|
||||
});
|
||||
|
||||
let loadMoreGroupMembersParams = {};
|
||||
|
||||
watch(
|
||||
() => props.groupDialog.loading,
|
||||
() => groupDialog.value.loading,
|
||||
(val) => {
|
||||
if (val) {
|
||||
nextTick(() => adjustDialogZ(groupDialogRef.value.$el));
|
||||
@@ -1305,7 +1265,7 @@
|
||||
);
|
||||
|
||||
watch(
|
||||
() => props.groupDialog.isGetGroupDialogGroupLoading,
|
||||
() => groupDialog.value.isGetGroupDialogGroupLoading,
|
||||
(val) => {
|
||||
if (val) {
|
||||
getCurrentTabData();
|
||||
@@ -1314,14 +1274,9 @@
|
||||
);
|
||||
|
||||
function showInviteGroupDialog(groupId, userId) {
|
||||
const D = inviteGroupDialog.value;
|
||||
D.userIds = '';
|
||||
D.groups = [];
|
||||
D.groupId = groupId;
|
||||
D.groupName = groupId;
|
||||
D.userId = userId;
|
||||
D.userObject = {};
|
||||
D.visible = true;
|
||||
inviteGroupDialog.value.groupId = groupId;
|
||||
inviteGroupDialog.value.userId = userId;
|
||||
inviteGroupDialog.value.visible = true;
|
||||
}
|
||||
|
||||
function setGroupRepresentation(groupId) {
|
||||
@@ -1360,7 +1315,7 @@
|
||||
}
|
||||
|
||||
function groupMembersSearchDebounce() {
|
||||
const D = props.groupDialog;
|
||||
const D = groupDialog.value;
|
||||
const search = D.memberSearch;
|
||||
D.memberSearchResults = [];
|
||||
if (!search || search.length < 3) {
|
||||
@@ -1375,16 +1330,14 @@
|
||||
offset: 0
|
||||
})
|
||||
.then((args) => {
|
||||
// API.$on('GROUP:MEMBERS:SEARCH', function (args) {
|
||||
for (const json of args.json.results) {
|
||||
API.$emit('GROUP:MEMBER', {
|
||||
handleGroupMember({
|
||||
json,
|
||||
params: {
|
||||
groupId: args.params.groupId
|
||||
}
|
||||
});
|
||||
}
|
||||
// });
|
||||
if (D.id === args.params.groupId) {
|
||||
D.memberSearchResults = args.json.results;
|
||||
}
|
||||
@@ -1400,11 +1353,10 @@
|
||||
isRepresenting: isSet
|
||||
})
|
||||
.then((args) => {
|
||||
// API.$on('GROUP:SETREPRESENTATION', function (args) {
|
||||
if (props.groupDialog.visible && props.groupDialog.id === groupId) {
|
||||
if (groupDialog.value.visible && groupDialog.value.id === args.groupId) {
|
||||
updateGroupDialogData({
|
||||
...props.groupDialog,
|
||||
ref: { ...props.groupDialog.ref, isRepresenting: args.params.isRepresenting }
|
||||
...groupDialog.value,
|
||||
ref: { ...groupDialog.value.ref, isRepresenting: args.params.isRepresenting }
|
||||
});
|
||||
getGroupDialogGroup(groupId);
|
||||
}
|
||||
@@ -1417,11 +1369,9 @@
|
||||
groupId: id
|
||||
})
|
||||
.then((args) => {
|
||||
// API.$on('GROUP:CANCELJOINREQUEST', function (args) {
|
||||
if (props.groupDialog.visible && props.groupDialog.id === id) {
|
||||
if (groupDialog.value.visible && groupDialog.value.id === id) {
|
||||
getGroupDialogGroup(id);
|
||||
}
|
||||
// });
|
||||
});
|
||||
}
|
||||
function confirmDeleteGroupPost(post) {
|
||||
@@ -1437,8 +1387,7 @@
|
||||
postId: post.id
|
||||
})
|
||||
.then((args) => {
|
||||
// API.$on('GROUP:POST:DELETE', function (args) {
|
||||
const D = props.groupDialog;
|
||||
const D = groupDialog.value;
|
||||
if (D.id !== args.params.groupId) {
|
||||
return;
|
||||
}
|
||||
@@ -1447,7 +1396,7 @@
|
||||
// remove existing post
|
||||
for (const item of D.posts) {
|
||||
if (item.id === postId) {
|
||||
utils.removeFromArray(D.posts, item);
|
||||
removeFromArray(D.posts, item);
|
||||
break;
|
||||
}
|
||||
}
|
||||
@@ -1460,7 +1409,6 @@
|
||||
}
|
||||
}
|
||||
updateGroupPostSearch();
|
||||
// });
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -1480,30 +1428,113 @@
|
||||
}
|
||||
|
||||
function groupDialogCommand(command) {
|
||||
const D = props.groupDialog;
|
||||
const D = groupDialog.value;
|
||||
if (D.visible === false) {
|
||||
return;
|
||||
}
|
||||
switch (command) {
|
||||
case 'Share':
|
||||
copyToClipboard(props.groupDialog.ref.$url);
|
||||
copyToClipboard(groupDialog.value.ref.$url);
|
||||
break;
|
||||
case 'Create Post':
|
||||
showGroupPostEditDialog(props.groupDialog.id, null);
|
||||
showGroupPostEditDialog(groupDialog.value.id, null);
|
||||
break;
|
||||
case 'Moderation Tools':
|
||||
showGroupMemberModerationDialog(props.groupDialog.id);
|
||||
showGroupMemberModerationDialog(groupDialog.value.id);
|
||||
break;
|
||||
case 'Invite To Group':
|
||||
showInviteGroupDialog(D.id, '');
|
||||
break;
|
||||
default:
|
||||
emit('groupDialogCommand', command);
|
||||
case 'Refresh':
|
||||
showGroupDialog(D.id);
|
||||
break;
|
||||
case 'Leave Group':
|
||||
leaveGroupPrompt(D.id);
|
||||
break;
|
||||
case 'Block Group':
|
||||
blockGroup(D.id);
|
||||
break;
|
||||
case 'Unblock Group':
|
||||
unblockGroup(D.id);
|
||||
break;
|
||||
case 'Visibility Everyone':
|
||||
setGroupVisibility(D.id, 'visible');
|
||||
break;
|
||||
case 'Visibility Friends':
|
||||
setGroupVisibility(D.id, 'friends');
|
||||
break;
|
||||
case 'Visibility Hidden':
|
||||
setGroupVisibility(D.id, 'hidden');
|
||||
break;
|
||||
case 'Subscribe To Announcements':
|
||||
setGroupSubscription(D.id, true);
|
||||
break;
|
||||
case 'Unsubscribe To Announcements':
|
||||
setGroupSubscription(D.id, false);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function setGroupSubscription(groupId, subscribe) {
|
||||
return groupRequest
|
||||
.setGroupMemberProps(currentUser.value.id, groupId, {
|
||||
isSubscribedToAnnouncements: subscribe
|
||||
})
|
||||
.then((args) => {
|
||||
handleGroupMemberProps(args);
|
||||
$app.$message({
|
||||
message: 'Group subscription updated',
|
||||
type: 'success'
|
||||
});
|
||||
return args;
|
||||
});
|
||||
}
|
||||
|
||||
function blockGroup(groupId) {
|
||||
$app.$confirm('Are you sure you want to block this group?', 'Confirm', {
|
||||
confirmButtonText: 'Confirm',
|
||||
cancelButtonText: 'Cancel',
|
||||
type: 'info',
|
||||
callback: (action) => {
|
||||
if (action === 'confirm') {
|
||||
groupRequest
|
||||
.blockGroup({
|
||||
groupId
|
||||
})
|
||||
.then((args) => {
|
||||
if (groupDialog.value.visible && groupDialog.value.id === args.params.groupId) {
|
||||
showGroupDialog(args.params.groupId);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function unblockGroup(groupId) {
|
||||
$app.$confirm('Are you sure you want to unblock this group?', 'Confirm', {
|
||||
confirmButtonText: 'Confirm',
|
||||
cancelButtonText: 'Cancel',
|
||||
type: 'info',
|
||||
callback: (action) => {
|
||||
if (action === 'confirm') {
|
||||
groupRequest
|
||||
.unblockGroup({
|
||||
groupId,
|
||||
userId: currentUser.value.id
|
||||
})
|
||||
.then((args) => {
|
||||
if (groupDialog.value.visible && groupDialog.value.id === args.params.groupId) {
|
||||
showGroupDialog(args.params.groupId);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function showGroupMemberModerationDialog(groupId) {
|
||||
if (groupId !== props.groupDialog.id) {
|
||||
if (groupId !== groupDialog.value.id) {
|
||||
return;
|
||||
}
|
||||
const D = groupMemberModeration;
|
||||
@@ -1511,16 +1542,14 @@
|
||||
|
||||
D.groupRef = {};
|
||||
D.auditLogTypes = [];
|
||||
API.getCachedGroup({ groupId }).then((args) => {
|
||||
groupRequest.getCachedGroup({ groupId }).then((args) => {
|
||||
D.groupRef = args.ref;
|
||||
if (hasGroupPermission(D.groupRef, 'group-audit-view')) {
|
||||
groupRequest.getGroupAuditLogTypes({ groupId }).then((args) => {
|
||||
// API.$on('GROUP:AUDITLOGTYPES', function (args) {
|
||||
if (groupMemberModeration.id !== args.params.groupId) {
|
||||
return;
|
||||
}
|
||||
groupMemberModeration.auditLogTypes = args.json;
|
||||
// });
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -1535,16 +1564,14 @@
|
||||
groupId: id
|
||||
})
|
||||
.then((args) => {
|
||||
// API.$on('GROUP:JOIN', function (args) {
|
||||
if (props.groupDialog.visible && props.groupDialog.id === id) {
|
||||
if (groupDialog.value.visible && groupDialog.value.id === id) {
|
||||
updateGroupDialogData({
|
||||
...props.groupDialog,
|
||||
...groupDialog.value,
|
||||
inGroup: args.json.membershipStatus === 'member'
|
||||
});
|
||||
// props.groupDialog.inGroup = args.json.membershipStatus === 'member';
|
||||
// groupDialog.value.inGroup = json.membershipStatus === 'member';
|
||||
getGroupDialogGroup(id);
|
||||
}
|
||||
// });
|
||||
if (args.json.membershipStatus === 'member') {
|
||||
$message({
|
||||
message: 'Group joined',
|
||||
@@ -1595,14 +1622,14 @@
|
||||
selectedImageUrl: post.imageUrl
|
||||
};
|
||||
}
|
||||
API.getCachedGroup({ groupId }).then((args) => {
|
||||
groupRequest.getCachedGroup({ groupId }).then((args) => {
|
||||
D.groupRef = args.ref;
|
||||
});
|
||||
D.visible = true;
|
||||
}
|
||||
|
||||
async function getGroupDialogGroupMembers() {
|
||||
const D = props.groupDialog;
|
||||
const D = groupDialog.value;
|
||||
D.members = [];
|
||||
isGroupMembersDone.value = false;
|
||||
loadMoreGroupMembersParams = {
|
||||
@@ -1620,12 +1647,12 @@
|
||||
await groupRequest
|
||||
.getGroupMember({
|
||||
groupId: D.id,
|
||||
userId: API.currentUser.id
|
||||
userId: currentUser.value.id
|
||||
})
|
||||
.then((args) => {
|
||||
args.ref = API.applyGroupMember(args.json);
|
||||
args.ref = applyGroupMember(args.json);
|
||||
if (args.json) {
|
||||
args.json.user = API.currentUser;
|
||||
args.json.user = currentUser.value;
|
||||
if (D.memberFilter.id === null) {
|
||||
// when flitered by role don't include self
|
||||
D.members.push(args.json);
|
||||
@@ -1641,7 +1668,7 @@
|
||||
if (isGroupMembersDone.value || isGroupMembersLoading.value) {
|
||||
return;
|
||||
}
|
||||
const D = props.groupDialog;
|
||||
const D = groupDialog.value;
|
||||
const params = loadMoreGroupMembersParams;
|
||||
D.memberSearch = '';
|
||||
isGroupMembersLoading.value = true;
|
||||
@@ -1651,10 +1678,18 @@
|
||||
isGroupMembersLoading.value = false;
|
||||
})
|
||||
.then((args) => {
|
||||
for (const json of args.json) {
|
||||
handleGroupMember({
|
||||
json,
|
||||
params: {
|
||||
groupId: args.params.groupId
|
||||
}
|
||||
});
|
||||
}
|
||||
for (let i = 0; i < args.json.length; i++) {
|
||||
const member = args.json[i];
|
||||
if (member.userId === API.currentUser.id) {
|
||||
if (D.members.length > 0 && D.members[0].userId === API.currentUser.id) {
|
||||
if (member.userId === currentUser.value.id) {
|
||||
if (D.members.length > 0 && D.members[0].userId === currentUser.value.id) {
|
||||
// remove duplicate and keep sort order
|
||||
D.members.splice(0, 1);
|
||||
}
|
||||
@@ -1685,12 +1720,12 @@
|
||||
}
|
||||
|
||||
async function getGroupGalleries() {
|
||||
updateGroupDialogData({ ...props.groupDialog, galleries: {} });
|
||||
updateGroupDialogData({ ...groupDialog.value, galleries: {} });
|
||||
groupDialogGalleryCurrentName.value = '0';
|
||||
isGroupGalleryLoading.value = true;
|
||||
for (let i = 0; i < props.groupDialog.ref.galleries.length; i++) {
|
||||
const gallery = props.groupDialog.ref.galleries[i];
|
||||
await getGroupGallery(props.groupDialog.id, gallery.id);
|
||||
for (let i = 0; i < groupDialog.value.ref.galleries.length; i++) {
|
||||
const gallery = groupDialog.value.ref.galleries[i];
|
||||
await getGroupGallery(groupDialog.value.id, gallery.id);
|
||||
}
|
||||
isGroupGalleryLoading.value = false;
|
||||
}
|
||||
@@ -1707,16 +1742,14 @@
|
||||
for (let i = 0; i < count; i++) {
|
||||
const args = await groupRequest.getGroupGallery(params);
|
||||
if (args) {
|
||||
// API.$on('GROUP:GALLERY', function (args) {
|
||||
for (const json of args.json) {
|
||||
if (props.groupDialog.id === json.groupId) {
|
||||
if (!props.groupDialog.galleries[json.galleryId]) {
|
||||
props.groupDialog.galleries[json.galleryId] = [];
|
||||
if (groupDialog.value.id === json.groupId) {
|
||||
if (!groupDialog.value.galleries[json.galleryId]) {
|
||||
groupDialog.value.galleries[json.galleryId] = [];
|
||||
}
|
||||
props.groupDialog.galleries[json.galleryId].push(json);
|
||||
groupDialog.value.galleries[json.galleryId].push(json);
|
||||
}
|
||||
}
|
||||
// });
|
||||
}
|
||||
params.offset += 100;
|
||||
if (args.json.length < 100) {
|
||||
@@ -1729,8 +1762,8 @@
|
||||
}
|
||||
|
||||
function refreshGroupDialogTreeData() {
|
||||
const D = props.groupDialog;
|
||||
const treeData = utils.buildTreeData({
|
||||
const D = groupDialog.value;
|
||||
const treeData = buildTreeData({
|
||||
group: D.ref,
|
||||
posts: D.posts,
|
||||
instances: D.instances,
|
||||
@@ -1738,7 +1771,7 @@
|
||||
galleries: D.galleries
|
||||
});
|
||||
updateGroupDialogData({
|
||||
...props.groupDialog,
|
||||
...groupDialog.value,
|
||||
treeData
|
||||
});
|
||||
}
|
||||
@@ -1748,19 +1781,19 @@
|
||||
return;
|
||||
}
|
||||
await getGroupDialogGroupMembers();
|
||||
while (props.groupDialog.visible && !isGroupMembersDone.value) {
|
||||
while (groupDialog.value.visible && !isGroupMembersDone.value) {
|
||||
isGroupMembersLoading.value = true;
|
||||
await new Promise((resolve) => {
|
||||
workerTimers.setTimeout(resolve, 1000);
|
||||
});
|
||||
isGroupMembersLoading.value = false;
|
||||
await this.loadMoreGroupMembers();
|
||||
await loadMoreGroupMembers();
|
||||
}
|
||||
}
|
||||
|
||||
async function setGroupMemberSortOrder(sortOrder) {
|
||||
const D = props.groupDialog;
|
||||
if (D.memberSortOrder === sortOrder) {
|
||||
const D = groupDialog.value;
|
||||
if (D.memberSortOrder.value === sortOrder) {
|
||||
return;
|
||||
}
|
||||
D.memberSortOrder = sortOrder;
|
||||
@@ -1768,8 +1801,8 @@
|
||||
}
|
||||
|
||||
async function setGroupMemberFilter(filter) {
|
||||
const D = props.groupDialog;
|
||||
if (D.memberFilter === filter) {
|
||||
const D = groupDialog.value;
|
||||
if (D.memberFilter.value === filter) {
|
||||
return;
|
||||
}
|
||||
D.memberFilter = filter;
|
||||
@@ -1777,13 +1810,9 @@
|
||||
}
|
||||
|
||||
function updateGroupDialogData(obj) {
|
||||
// Be careful with the deep merge
|
||||
emit('update:group-dialog', obj);
|
||||
}
|
||||
function getGroupDialogGroup(groupId) {
|
||||
emit('getGroupDialogGroup', groupId);
|
||||
}
|
||||
function updateGroupPostSearch() {
|
||||
emit('updateGroupPostSearch');
|
||||
groupDialog.value = {
|
||||
...groupDialog.value,
|
||||
...obj
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user