mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-10-31 10:47:00 +00:00
Expand v2 layout, add user administration pages.
This commit is contained in:
James Cole
45
resources/assets/v2/api/v2/model/user-group/get.js
Normal file
45
resources/assets/v2/api/v2/model/user-group/get.js
Normal file
@@ -0,0 +1,45 @@
|
||||
/*
|
||||
* list.js
|
||||
* Copyright (c) 2022 james@firefly-iii.org
|
||||
*
|
||||
* This file is part of Firefly III (https://github.com/firefly-iii).
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Affero General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Affero General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public License
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import {api} from "../../../../boot/axios";
|
||||
import format from "date-fns/format";
|
||||
|
||||
export default class Get {
|
||||
|
||||
// /**
|
||||
// *
|
||||
// * @param identifier
|
||||
// * @param params
|
||||
// * @returns {Promise<AxiosResponse<any>>}
|
||||
// */
|
||||
// show(identifier, params) {
|
||||
// return api.get('/api/v2/accounts/' + identifier, {params: params});
|
||||
// }
|
||||
|
||||
/**
|
||||
*
|
||||
* @param params
|
||||
* @returns {Promise<AxiosResponse<any>>}
|
||||
*/
|
||||
index(params) {
|
||||
return api.get('/api/v2/user-groups', {params: params});
|
||||
}
|
||||
|
||||
}
|
||||
136
resources/assets/v2/pages/administrations/index.js
Normal file
136
resources/assets/v2/pages/administrations/index.js
Normal file
@@ -0,0 +1,136 @@
|
||||
/*
|
||||
* show.js
|
||||
* Copyright (c) 2024 james@firefly-iii.org.
|
||||
*
|
||||
* This file is part of Firefly III (https://github.com/firefly-iii).
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Affero General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Affero General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public License
|
||||
* along with this program. If not, see https://www.gnu.org/licenses/.
|
||||
*/
|
||||
|
||||
import '../../boot/bootstrap.js';
|
||||
import dates from "../shared/dates.js";
|
||||
import i18next from "i18next";
|
||||
import {format} from "date-fns";
|
||||
|
||||
import '@ag-grid-community/styles/ag-grid.css';
|
||||
import '@ag-grid-community/styles/ag-theme-alpine.css';
|
||||
import '../../css/grid-ff3-theme.css';
|
||||
import Get from "../../api/v2/model/user-group/get.js";
|
||||
|
||||
let index = function () {
|
||||
return {
|
||||
// notifications
|
||||
notifications: {
|
||||
error: {
|
||||
show: false, text: '', url: '',
|
||||
}, success: {
|
||||
show: false, text: '', url: '',
|
||||
}, wait: {
|
||||
show: false, text: '',
|
||||
|
||||
}
|
||||
},
|
||||
editors: {},
|
||||
userGroups: [],
|
||||
|
||||
format(date) {
|
||||
return format(date, i18next.t('config.date_time_fns'));
|
||||
},
|
||||
|
||||
init() {
|
||||
this.notifications.wait.show = true;
|
||||
this.notifications.wait.text = i18next.t('firefly.wait_loading_data')
|
||||
this.loadAdministrations();
|
||||
},
|
||||
|
||||
loadAdministrations() {
|
||||
this.notifications.wait.show = true;
|
||||
this.notifications.wait.text = i18next.t('firefly.wait_loading_data')
|
||||
this.accounts = [];
|
||||
(new Get()).index({page: this.page}).then(response => {
|
||||
for (let i = 0; i < response.data.data.length; i++) {
|
||||
if (response.data.data.hasOwnProperty(i)) {
|
||||
let current = response.data.data[i];
|
||||
let group = {
|
||||
id: parseInt(current.id),
|
||||
title: current.attributes.title,
|
||||
in_use: current.attributes.in_use,
|
||||
owner: '',
|
||||
you: '',
|
||||
memberCountExceptYou: 0,
|
||||
isOwner: false,
|
||||
membersVisible: current.attributes.can_see_members,
|
||||
members: [],
|
||||
};
|
||||
console.log('Processing group #' + group.id + ' (' + group.title + ')' );
|
||||
let memberships = {};
|
||||
for (let j = 0; j < current.attributes.members.length; j++) {
|
||||
let member = current.attributes.members[j];
|
||||
console.log('Found member ' + member.user_email, member.you, member.role);
|
||||
if ('owner' === member.role) {
|
||||
group.owner = i18next.t('firefly.administration_owner', {email: member.user_email});
|
||||
}
|
||||
if (true === member.you && 'owner' === member.role) {
|
||||
console.log('You are owner of group ' + group.title );
|
||||
group.isOwner = true;
|
||||
}
|
||||
if (true === member.you) {
|
||||
group.you = i18next.t('firefly.administration_you', {role: i18next.t('firefly.administration_role_' + member.role)});
|
||||
continue;
|
||||
}
|
||||
if (false === member.you) {
|
||||
group.memberCountExceptYou++;
|
||||
const userEmail = member.user_email;
|
||||
if (!memberships.hasOwnProperty(userEmail)) {
|
||||
memberships[userEmail] = {
|
||||
email: userEmail,
|
||||
roles: []
|
||||
};
|
||||
}
|
||||
memberships[userEmail].roles.push(i18next.t('firefly.administration_role_' + member.role));
|
||||
}
|
||||
}
|
||||
group.members = Object.values(memberships);
|
||||
|
||||
this.userGroups.push(group);
|
||||
}
|
||||
}
|
||||
this.notifications.wait.show = false;
|
||||
// add click trigger thing.
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
let comps = {index, dates};
|
||||
|
||||
function loadPage() {
|
||||
Object.keys(comps).forEach(comp => {
|
||||
console.log(`Loading page component "${comp}"`);
|
||||
let data = comps[comp]();
|
||||
Alpine.data(comp, () => data);
|
||||
});
|
||||
Alpine.start();
|
||||
}
|
||||
|
||||
// wait for load until bootstrapped event is received.
|
||||
document.addEventListener('firefly-iii-bootstrapped', () => {
|
||||
console.log('Loaded through event listener.');
|
||||
loadPage();
|
||||
});
|
||||
// or is bootstrapped before event is triggered.
|
||||
if (window.bootstrapped) {
|
||||
console.log('Loaded through window variable.');
|
||||
loadPage();
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
97
resources/views/v2/administrations/index.blade.php
Normal file
97
resources/views/v2/administrations/index.blade.php
Normal file
@@ -0,0 +1,97 @@
|
||||
@extends('layout.v2')
|
||||
@section('scripts')
|
||||
@vite(['resources/assets/v2/pages/administrations/index.js'])
|
||||
@endsection
|
||||
@section('content')
|
||||
<div class="app-content">
|
||||
<div class="container-fluid" x-data="index">
|
||||
<x-messages></x-messages>
|
||||
<div class="row mb-3">
|
||||
<div class="col">
|
||||
<p>
|
||||
<a href="{{route('administrations.create')}}"
|
||||
class="btn btn-primary">{{ __('firefly.create_administration') }}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<template x-for="(group, index) in userGroups" :key="index">
|
||||
<div class="col-xl-4 col-lg-4 col-sm-6 col-xs-12">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Administration "<span x-text="group.title"></span>"</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ul>
|
||||
<template x-if="'' !== group.owner">
|
||||
<li x-text="group.owner"></li>
|
||||
</template>
|
||||
<template x-if="'' !== group.you">
|
||||
<li x-text="group.you"></li>
|
||||
</template>
|
||||
</ul>
|
||||
<template x-if="group.memberCountExceptYou > 0">
|
||||
<div>
|
||||
<h5>{{ __('firefly.other_users_in_admin') }}</h5>
|
||||
<ul>
|
||||
<template x-for="(member, jndex) in group.members" :key="jndex">
|
||||
<li>
|
||||
<span x-text="member.email"></span>
|
||||
<ul>
|
||||
<template x-for="(role, kndex) in member.roles" :key="kndex">
|
||||
<li x-text="role"></li>
|
||||
</template>
|
||||
</ul>
|
||||
</li>
|
||||
</template>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
TODO Last changes: date<br>
|
||||
TODO features in use (icons)
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<div class="btn-group">
|
||||
<template x-if="false === group.in_use">
|
||||
<a href="#" class="btn btn-primary">
|
||||
<em class="fa-solid fa-coins"></em> Use
|
||||
</a>
|
||||
</template>
|
||||
<template x-if="true === group.isOwner">
|
||||
<a href="#" class="btn btn-primary">
|
||||
<em class="fa-solid fa-pencil"></em> Edit
|
||||
</a>
|
||||
</template>
|
||||
<template x-if="true === group.isOwner">
|
||||
<a href="#" class="btn btn-primary">
|
||||
<em class="fa-solid fa-users"></em> Access rights
|
||||
</a>
|
||||
</template>
|
||||
<template x-if="true === group.isOwner">
|
||||
<a href="#" class="btn btn-danger text-white">
|
||||
<em class="fa-solid fa-trash"></em> Delete
|
||||
</a>
|
||||
</template>
|
||||
<template x-if="true !== group.isOwner">
|
||||
<a href="#" class="btn btn-warning">
|
||||
<em class="fa-solid fa-person-walking-dashed-line-arrow-right"></em> Leave
|
||||
</a>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<div class="col">
|
||||
<p>
|
||||
<a href="{{route('administrations.create')}}"
|
||||
class="btn btn-primary">{{ __('firefly.create_administration') }}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@endsection
|
||||
@@ -37,9 +37,9 @@
|
||||
{{ __('firefly.preferences') }}
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a href="#" class="dropdown-item">
|
||||
<a href="{{ route('administrations.index') }}" class="dropdown-item">
|
||||
<em class="fa-solid fa-money-bill-transfer me-2"></em>
|
||||
TODO {{ __('firefly.administrations_index_menu') }}
|
||||
{{ __('firefly.administrations_index_menu') }}
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
Reference in New Issue
Block a user