dragonroll/client/src/views/windows/settings/AccountManagementWindow.vue

119 lines
3.1 KiB
Vue

<script setup>
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
import { onMounted, ref, shallowRef, toRaw } from 'vue';
import { SetupHandle, SetSize, ResetPosition } from '@/services/Windows';
import Api from '@/services/Api'
import WindowHandle from '@/views/partials/WindowHandle.vue';
import ConceptList from '@/views/partials/ConceptList.vue';
import { backendUrl } from '@/services/BackendURL';
import { ClearWindow, CreateChildWindow } from '@/services/Windows';
import FixedBottomButtons from '@/views/partials/FixedBottomButtons.vue';
const handle = ref(null);
const props = defineProps(['data']);
const data = props.data;
let id = data.id;
const elements = shallowRef([]);
onMounted(() => {
SetupHandle(id, handle);
SetSize(id, {width: 500, height: 380});
ResetPosition(id, "center");
RefreshUsers();
});
function RefreshUsers(){
Api().get('/admin/users').then(response => {
let users = response.data.users;
elements.value = [];
users.forEach(user => {
console.log(user);
if(user.setupCode){
elements.value.push({
name: t('register-account.pending-account'),
_id: user._id,
info: {
name: t('register-account.pending-account')
},
user
})
} else elements.value.push({
name: user.username,
_id: user._id,
info: {
name: user.username
},
user
})
});
}).catch((err) => console.log(err));
}
async function ElementIcon(element){
let response = await Api().get('/user/retrieve-avatar?username=' + element.name);
if(response.data.image) return backendUrl + "public/" + response.data.image;
return "public/img/def-avatar.jpg";
}
function OpenAccount(data){
if(data.user.setupCode){
CreateChildWindow(id, 'copy_pending_user_window', {
code: data.user.setupCode,
id: 'copy_pending_user_window',
close: () => ClearWindow('copy_pending_user_window')
});
} else {
CreateChildWindow(id, 'edit_profile', {
user: toRaw(data.user),
close: () => ClearWindow('edit_profile')
});
}
}
function OpenCreateAccount(){
CreateChildWindow(id, 'register_user', {
title: 'register-account.title',
id: 'register_user',
done: () => {
RefreshUsers();
ClearWindow('register_user');
},
close: () => ClearWindow('register_user')
})
}
</script>
<template>
<div class="window-wrapper" :id="'window-wrapper-' + id">
<WindowHandle :window="id" ref="handle"></WindowHandle>
<!-- Body -->
<ConceptList
:elements="elements"
:icon="ElementIcon"
:open="OpenAccount"
></ConceptList>
<FixedBottomButtons :plus="OpenCreateAccount"></FixedBottomButtons>
</div>
</template>
<style scoped>
.window-wrapper {
display: flex;
align-items: center;
}
</style>