Compare commits
No commits in common. "4ab77c5557bc1ad2db4aa117c9910f51e4c9ab35" and "87926e69dbd5b93b2c98cd68fb31913259e3cc00" have entirely different histories.
4ab77c5557
...
87926e69db
17
CHANGELOG.md
17
CHANGELOG.md
@ -2,28 +2,11 @@
|
|||||||
|
|
||||||
All notable changes to this project will be documented in this file. Dates are displayed in UTC.
|
All notable changes to this project will be documented in this file. Dates are displayed in UTC.
|
||||||
|
|
||||||
#### [0.2.1](https://git.odit.services/lfk/frontend/compare/0.2.0...0.2.1)
|
|
||||||
|
|
||||||
- 🔒 UserDetail - WIP on Permissions [`36a084e`](https://git.odit.services/lfk/frontend/commit/36a084eab6bd0c922da29ebb2d260ba803bf9675)
|
|
||||||
- 👪 UserDetail - group edit support [`a9e319e`](https://git.odit.services/lfk/frontend/commit/a9e319e0c0f2bfaba42bc3af875462e394489dc2)
|
|
||||||
- 🙋♂️ UserDetails - group updating [`041c24a`](https://git.odit.services/lfk/frontend/commit/041c24a837d58ff46362699b54e8088f22ba2daa)
|
|
||||||
- ⚡ shared state reactivity - AddUserModal-Users-UsersOverview [`f7acbb1`](https://git.odit.services/lfk/frontend/commit/f7acbb1eaa14ddf41e29ff1db631520123218289)
|
|
||||||
- ✨ AddUserModal + UserDetail - optional username field [`7df76f9`](https://git.odit.services/lfk/frontend/commit/7df76f9642b528586fd654f27148b5502400ffdf)
|
|
||||||
- UserDetail - fixed group updating [`e6fbf7a`](https://git.odit.services/lfk/frontend/commit/e6fbf7aa5b230733ffd92fdfe851b9f86001c859)
|
|
||||||
- 💬 UserDetail - info Toasts [`ea23b97`](https://git.odit.services/lfk/frontend/commit/ea23b972315db39e1f800366d52e3bacf9eaf58b)
|
|
||||||
- 🔨 optimized release script [`23c3cd6`](https://git.odit.services/lfk/frontend/commit/23c3cd605db950a5620ea709748216f7ea034385)
|
|
||||||
- 🐞 fix package release script: locales directory [`722a20e`](https://git.odit.services/lfk/frontend/commit/722a20e141079302da8876be1ccc55026c588048)
|
|
||||||
- ⏫ bump @odit/lfk-client-js to 0.0.11 [`f6db117`](https://git.odit.services/lfk/frontend/commit/f6db117a5eca5c9692a4c5d83159917a712a0e63)
|
|
||||||
- 🐞 UserDetail - fix permission reactivity by assignments [`39a3baa`](https://git.odit.services/lfk/frontend/commit/39a3baa00b0575ee3150c7ae26f32995e2e857d9)
|
|
||||||
|
|
||||||
#### [0.2.0](https://git.odit.services/lfk/frontend/compare/0.1.6...0.2.0)
|
#### [0.2.0](https://git.odit.services/lfk/frontend/compare/0.1.6...0.2.0)
|
||||||
|
|
||||||
> 11 January 2021
|
|
||||||
|
|
||||||
- 🔒 added rendering based on permission level [`5937a0d`](https://git.odit.services/lfk/frontend/commit/5937a0d7ce970d38ddb0e4c6a02d11f8c8b53e9b)
|
- 🔒 added rendering based on permission level [`5937a0d`](https://git.odit.services/lfk/frontend/commit/5937a0d7ce970d38ddb0e4c6a02d11f8c8b53e9b)
|
||||||
- ❌ UserDetail - delete [`4512272`](https://git.odit.services/lfk/frontend/commit/4512272c1c2a5c861d8ac4c9908244df125dc3d9)
|
- ❌ UserDetail - delete [`4512272`](https://git.odit.services/lfk/frontend/commit/4512272c1c2a5c861d8ac4c9908244df125dc3d9)
|
||||||
- 🖊 UserDetail - reactivity on edit + update functionality [`ce1f384`](https://git.odit.services/lfk/frontend/commit/ce1f3842e0f581d9e94ea6079cf223d945f7465d)
|
- 🖊 UserDetail - reactivity on edit + update functionality [`ce1f384`](https://git.odit.services/lfk/frontend/commit/ce1f3842e0f581d9e94ea6079cf223d945f7465d)
|
||||||
- 🚀RELEASE v0.2.0 [`7769070`](https://git.odit.services/lfk/frontend/commit/77690702c0461b71ff1b65a44bfdc331d5a42c3e)
|
|
||||||
- [tmp] - disable darkmode + re-enable sw [`c7679b7`](https://git.odit.services/lfk/frontend/commit/c7679b7a67b362a7fbf796f612892bdfac50731c)
|
- [tmp] - disable darkmode + re-enable sw [`c7679b7`](https://git.odit.services/lfk/frontend/commit/c7679b7a67b362a7fbf796f612892bdfac50731c)
|
||||||
- 🕕 set manual refresh time to 2min [`be629e5`](https://git.odit.services/lfk/frontend/commit/be629e5c6b076bf9a28dcc953e97478d244d8413)
|
- 🕕 set manual refresh time to 2min [`be629e5`](https://git.odit.services/lfk/frontend/commit/be629e5c6b076bf9a28dcc953e97478d244d8413)
|
||||||
- 🐞 [tmp] - nginx.conf - disable .js file caching [`e6ac34b`](https://git.odit.services/lfk/frontend/commit/e6ac34bde8d288a45e83fc6723a2bbe952f2622a)
|
- 🐞 [tmp] - nginx.conf - disable .js file caching [`e6ac34b`](https://git.odit.services/lfk/frontend/commit/e6ac34bde8d288a45e83fc6723a2bbe952f2622a)
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@odit/lfk-frontend",
|
"name": "@odit/lfk-frontend",
|
||||||
"version": "0.2.1",
|
"version": "0.2.0",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"i18n-order": "node order.js",
|
"i18n-order": "node order.js",
|
||||||
"dev": "snowpack dev",
|
"dev": "snowpack dev",
|
||||||
@ -50,7 +50,7 @@
|
|||||||
"publish": false
|
"publish": false
|
||||||
},
|
},
|
||||||
"hooks": {
|
"hooks": {
|
||||||
"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node versionbuilder.js && git add public/index.html && node order.js && git add src/locales"
|
"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node versionbuilder.js && git add public/index.html && node order.js && git add public/locales"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -13,7 +13,7 @@
|
|||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-0.2.1-RELEASE_INFO</span>
|
<span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-0.2.0-RELEASE_INFO</span>
|
||||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||||
<script src="/env.js"></script>
|
<script src="/env.js"></script>
|
||||||
<script defer type="module" src="/_dist_/index.js"></script>
|
<script defer type="module" src="/_dist_/index.js"></script>
|
||||||
|
|||||||
@ -2,21 +2,20 @@
|
|||||||
import { _ } from "svelte-i18n";
|
import { _ } from "svelte-i18n";
|
||||||
import { clickOutside } from "./outsideclick";
|
import { clickOutside } from "./outsideclick";
|
||||||
import { focusTrap } from "svelte-focus-trap";
|
import { focusTrap } from "svelte-focus-trap";
|
||||||
|
import { tracks as usersstore } from "../store.js";
|
||||||
import { UserService } from "@odit/lfk-client-js";
|
import { UserService } from "@odit/lfk-client-js";
|
||||||
import isEmail from "validator/es/lib/isEmail";
|
import isEmail from "validator/es/lib/isEmail";
|
||||||
import Toastify from "toastify-js";
|
import Toastify from "toastify-js";
|
||||||
|
import "toastify-js/src/toastify.css";
|
||||||
export let modal_open;
|
export let modal_open;
|
||||||
export let current_users;
|
|
||||||
let firstname_input;
|
let firstname_input;
|
||||||
let lastname_input;
|
let lastname_input;
|
||||||
let middlename_input;
|
let middlename_input;
|
||||||
let username_input;
|
|
||||||
let password_input;
|
let password_input;
|
||||||
let email_input;
|
let email_input;
|
||||||
function focus(el) {
|
function focus(el) {
|
||||||
el.focus();
|
el.focus();
|
||||||
}
|
}
|
||||||
$: username_input_value = "";
|
|
||||||
$: middlename_input_value = "";
|
$: middlename_input_value = "";
|
||||||
$: password_input_value = "";
|
$: password_input_value = "";
|
||||||
$: email_input_value = "";
|
$: email_input_value = "";
|
||||||
@ -50,25 +49,17 @@
|
|||||||
text: "User is being added...",
|
text: "User is being added...",
|
||||||
duration: -1,
|
duration: -1,
|
||||||
}).showToast();
|
}).showToast();
|
||||||
let postdata={
|
UserService.userControllerPost({
|
||||||
firstname: firstname_input_value,
|
firstname: firstname_input_value,
|
||||||
lastname: lastname_input_value,
|
lastname: lastname_input_value,
|
||||||
middlename: middlename_input_value,
|
middlename: middlename_input_value,
|
||||||
password: password_input_value
|
email: email_input_value,
|
||||||
};
|
password: password_input_value,
|
||||||
if(email_input_value!==""){
|
})
|
||||||
postdata.email=email_input_value;
|
|
||||||
}
|
|
||||||
if(username_input_value!==""){
|
|
||||||
postdata.username=username_input_value;
|
|
||||||
}
|
|
||||||
UserService.userControllerPost(postdata)
|
|
||||||
.then((result) => {
|
.then((result) => {
|
||||||
firstname_input_value = "";
|
firstname_input_value = "";
|
||||||
lastname_input_value = "";
|
lastname_input_value = "";
|
||||||
middlename_input_value = "";
|
middlename_input_value = "";
|
||||||
email_input_value = "";
|
|
||||||
username_input_value = "";
|
|
||||||
modal_open = false;
|
modal_open = false;
|
||||||
//
|
//
|
||||||
Toastify({
|
Toastify({
|
||||||
@ -76,8 +67,12 @@
|
|||||||
duration: 500,
|
duration: 500,
|
||||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||||
}).showToast();
|
}).showToast();
|
||||||
current_users.push(result);
|
let storeval = [];
|
||||||
current_users=current_users;
|
usersstore.subscribe((val) => {
|
||||||
|
storeval = val;
|
||||||
|
});
|
||||||
|
storeval.push(result);
|
||||||
|
usersstore.set(storeval);
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
//
|
//
|
||||||
@ -218,19 +213,6 @@
|
|||||||
</span>
|
</span>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
<div class="col-span-6">
|
|
||||||
<label
|
|
||||||
for="trackname"
|
|
||||||
class="block text-sm font-medium text-gray-700">{$_('username')}</label>
|
|
||||||
<input
|
|
||||||
autocomplete="off"
|
|
||||||
placeholder={$_('username')}
|
|
||||||
bind:value={username_input_value}
|
|
||||||
bind:this={username_input}
|
|
||||||
type="text"
|
|
||||||
name="trackname"
|
|
||||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
|
||||||
</div>
|
|
||||||
<div class="col-span-6">
|
<div class="col-span-6">
|
||||||
<label
|
<label
|
||||||
for="email"
|
for="email"
|
||||||
|
|||||||
@ -2,90 +2,47 @@
|
|||||||
import { _ } from "svelte-i18n";
|
import { _ } from "svelte-i18n";
|
||||||
import lodashIsEqual from "lodash.isequal";
|
import lodashIsEqual from "lodash.isequal";
|
||||||
import store from "../store";
|
import store from "../store";
|
||||||
import {
|
import { UserService } from "@odit/lfk-client-js";
|
||||||
UserService,
|
|
||||||
UserGroupService,
|
|
||||||
PermissionService,
|
|
||||||
} from "@odit/lfk-client-js";
|
|
||||||
import "gridjs/dist/theme/mermaid.css";
|
import "gridjs/dist/theme/mermaid.css";
|
||||||
import Toastify from "toastify-js";
|
|
||||||
import PromiseError from "./PromiseError.svelte";
|
import PromiseError from "./PromiseError.svelte";
|
||||||
export let params;
|
export let params;
|
||||||
const user_promise = UserService.userControllerGetOne(params.userid);
|
const user_promise = UserService.userControllerGetOne(params.userid);
|
||||||
let data_loaded = false;
|
let data_loaded = false;
|
||||||
$: delete_triggered = false;
|
$: delete_triggered = false;
|
||||||
$: original_data = {};
|
$: original_data = {};
|
||||||
$: editable_userdata = {};
|
$: editable_userdata = undefined;
|
||||||
$: allpermissions = [];
|
|
||||||
$: allgroups = [];
|
|
||||||
$: allgroups_ids = [];
|
|
||||||
$: usergroups_array_objects = [];
|
|
||||||
$: usergroups_array = [];
|
|
||||||
let usergroups_array_original = [];
|
|
||||||
user_promise.then((data) => {
|
user_promise.then((data) => {
|
||||||
data_loaded = true;
|
data_loaded = true;
|
||||||
original_data = Object.assign(original_data, data);
|
original_data = Object.assign(original_data, data);
|
||||||
editable_userdata = data;
|
editable_userdata = data;
|
||||||
data.groups.forEach((g) => {
|
|
||||||
usergroups_array=usergroups_array.concat([g.id]);
|
|
||||||
});
|
|
||||||
usergroups_array_original = usergroups_array;
|
|
||||||
allgroups.forEach((g) => {
|
|
||||||
allgroups_ids.push(g.id);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
UserGroupService.userGroupControllerGetAll().then((data) => {
|
|
||||||
allgroups = data;
|
|
||||||
});
|
|
||||||
const permissions_promise = PermissionService.permissionControllerGetAll();
|
|
||||||
permissions_promise.then((data) => {
|
|
||||||
data.forEach((p) => {
|
|
||||||
allpermissions=allpermissions.concat([p.target + ":" + p.action])
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
$: changes_performed = !lodashIsEqual(original_data, editable_userdata);
|
$: changes_performed = !lodashIsEqual(original_data, editable_userdata);
|
||||||
$: groups_changed = JSON.stringify(usergroups_array)===JSON.stringify(usergroups_array_original);
|
|
||||||
$: save_enabled = changes_performed||!groups_changed;
|
|
||||||
function submit() {
|
function submit() {
|
||||||
if (
|
if (data_loaded === true && changes_performed === true) {
|
||||||
!lodashIsEqual(original_data.permissions, editable_userdata.permissions)
|
console.log("ok, submitting...");
|
||||||
) {
|
console.log(editable_userdata);
|
||||||
// TODO: add+delete permissions
|
|
||||||
}
|
|
||||||
if (data_loaded === true && save_enabled) {
|
|
||||||
let tmp=[];
|
|
||||||
usergroups_array.forEach(g => {
|
|
||||||
const group=allgroups.find(obj=>obj.id===g);
|
|
||||||
tmp.push(group);
|
|
||||||
});
|
|
||||||
editable_userdata.groups=tmp;
|
|
||||||
Toastify({
|
|
||||||
text: $_("updating-user"),
|
|
||||||
duration: 2500,
|
|
||||||
}).showToast();
|
|
||||||
UserService.userControllerPut(original_data.id, editable_userdata)
|
UserService.userControllerPut(original_data.id, editable_userdata)
|
||||||
.then((resp) => {
|
.then((resp) => {
|
||||||
|
console.log(resp);
|
||||||
Object.assign(original_data, editable_userdata);
|
Object.assign(original_data, editable_userdata);
|
||||||
original_data = editable_userdata;
|
original_data = editable_userdata;
|
||||||
Object.assign(original_data, editable_userdata);
|
Object.assign(original_data, editable_userdata);
|
||||||
//
|
|
||||||
Toastify({
|
|
||||||
text: $_("user-updated"),
|
|
||||||
duration: 2500,
|
|
||||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
|
||||||
}).showToast();
|
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
|
console.log(err);
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
|
console.log("no changes performed");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function deleteUser() {
|
function deleteUser() {
|
||||||
UserService.userControllerRemove(original_data.id, true)
|
UserService.userControllerRemove(original_data.id, true)
|
||||||
.then((resp) => {
|
.then((resp) => {
|
||||||
|
console.log(resp);
|
||||||
location.replace("./");
|
location.replace("./");
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
|
console.log(err);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@ -163,19 +120,27 @@
|
|||||||
{/if}
|
{/if}
|
||||||
{#if !delete_triggered}
|
{#if !delete_triggered}
|
||||||
<button
|
<button
|
||||||
disabled={!save_enabled}
|
disabled={!changes_performed}
|
||||||
class:opacity-50={!save_enabled}
|
class:opacity-50={!changes_performed}
|
||||||
type="button"
|
type="button"
|
||||||
on:click={submit}
|
on:click={submit}
|
||||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
|
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
|
||||||
{/if}
|
{/if}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- -->
|
||||||
<div class="mt-2 flex items-center">
|
<div class="mt-2 flex items-center">
|
||||||
<img
|
<img
|
||||||
alt={$_('profile-picture')}
|
alt={$_('profile-picture')}
|
||||||
class="inline-block h-20 w-20 rounded-full overflow-hidden bg-gray-100"
|
class="inline-block h-20 w-20 rounded-full overflow-hidden bg-gray-100"
|
||||||
src={editable_userdata.profilePic} />
|
src={editable_userdata.profilePic} />
|
||||||
|
<!-- <span
|
||||||
|
class="inline-block h-12 w-12 rounded-full overflow-hidden bg-gray-100"><svg
|
||||||
|
class="h-full w-full text-gray-300"
|
||||||
|
fill="currentColor"
|
||||||
|
viewBox="0 0 24 24"><path
|
||||||
|
d="M24 20.993V24H0v-2.996A14.977 14.977 0 0112.004 15c4.904 0 9.26 2.354 11.996 5.993zM16.002 8.999a4 4 0 11-8 0 4 4 0 018 0z" /></svg></span> -->
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
class="ml-5 bg-white py-2 px-3 border border-gray-300 rounded-md shadow-sm text-sm leading-4 font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">Change</button>
|
class="ml-5 bg-white py-2 px-3 border border-gray-300 rounded-md shadow-sm text-sm leading-4 font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">Change</button>
|
||||||
@ -245,88 +210,65 @@
|
|||||||
name="email"
|
name="email"
|
||||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 dark:bg-gray-900 dark:text-gray-100 rounded-md p-2" />
|
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 dark:bg-gray-900 dark:text-gray-100 rounded-md p-2" />
|
||||||
</div>
|
</div>
|
||||||
<div class="text-sm w-full">
|
|
||||||
<label
|
|
||||||
for="username"
|
|
||||||
class="font-medium text-gray-700">{$_('username')}</label>
|
|
||||||
<input
|
|
||||||
autocomplete="off"
|
|
||||||
placeholder={$_('username')}
|
|
||||||
type="text"
|
|
||||||
bind:value={editable_userdata.username}
|
|
||||||
name="username"
|
|
||||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 dark:bg-gray-900 dark:text-gray-100 rounded-md p-2" />
|
|
||||||
</div>
|
|
||||||
<div class="text-sm w-full">
|
<div class="text-sm w-full">
|
||||||
<span class="font-medium">{$_('groups')}</span>
|
<span class="font-medium">{$_('groups')}</span>
|
||||||
<!-- svelte-ignore a11y-no-onchange -->
|
|
||||||
<select
|
<select
|
||||||
bind:value={usergroups_array}
|
|
||||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 dark:bg-gray-900 dark:text-gray-100 rounded-md p-2"
|
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 dark:bg-gray-900 dark:text-gray-100 rounded-md p-2"
|
||||||
multiple>
|
multiple>
|
||||||
{#each allgroups as g}
|
<option>Admins</option>
|
||||||
{#if usergroups_array.includes(g.id)}
|
<option>Finanzen</option>
|
||||||
<option selected value={g.id}>{g.name}</option>
|
<option>...</option>
|
||||||
{:else}
|
|
||||||
<option value={g.id}>{g.name}</option>
|
|
||||||
{/if}
|
|
||||||
{/each}
|
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div class="text-sm w-full">
|
<div class="text-sm w-full">
|
||||||
<span class="font-medium">Permissions</span>
|
<span class="font-medium">Permissions</span>
|
||||||
<div class="border-4 border-dashed rounded mb-4 p-5 text-lg text-center">
|
<div
|
||||||
|
class="border-4 border-dashed rounded h-96 mb-4 p-5 text-lg text-center">
|
||||||
<!-- -->
|
<!-- -->
|
||||||
<div class="flex flex-wrap -mx-1 overflow-hidden">
|
<div class="flex flex-wrap -mx-1 overflow-hidden">
|
||||||
<div class="my-1 px-1 w-full overflow-hidden sm:w-1/2">
|
<div class="my-1 px-1 w-full overflow-hidden sm:w-1/2">
|
||||||
verfügbare
|
<button
|
||||||
|
type="button"
|
||||||
|
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm">></button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="my-1 px-1 w-full overflow-hidden sm:w-1/2">
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm"><</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="my-1 px-1 w-full overflow-hidden sm:w-1/2">erteilte</div>
|
|
||||||
</div>
|
</div>
|
||||||
<!-- -->
|
<!-- -->
|
||||||
<div class="flex flex-wrap -mx-1 overflow-hidden">
|
<div class="flex flex-wrap -mx-1 overflow-hidden">
|
||||||
{#if allpermissions.length > 0}
|
|
||||||
<div class="my-1 px-1 w-full overflow-hidden sm:w-1/2">
|
<div class="my-1 px-1 w-full overflow-hidden sm:w-1/2">
|
||||||
<div
|
<div
|
||||||
class="border-4 border-dashed rounded mb-4 p-5 text-lg text-center">
|
class="border-4 border-dashed rounded mb-4 p-5 text-lg text-center">
|
||||||
{#each allpermissions as p}
|
|
||||||
{#if !editable_userdata.permissions.includes(p)}
|
|
||||||
<p
|
<p
|
||||||
class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 bg-gray-200 p-2 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input">
|
class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 bg-gray-200 p-2 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input">
|
||||||
{p}
|
DEMO_PERMISSION
|
||||||
<button
|
</p>
|
||||||
on:click={() => {
|
<p
|
||||||
editable_userdata.permissions.push(p);
|
class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 bg-gray-200 p-2 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input">
|
||||||
editable_userdata.permissions = editable_userdata.permissions;
|
DEMO_PERMISSION
|
||||||
}}
|
|
||||||
type="button"
|
|
||||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-green-200 text-base font-medium text-black hover:bg-green-700 hover:text-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 sm:ml-3 sm:w-auto sm:text-sm">+</button>
|
|
||||||
</p>
|
</p>
|
||||||
{/if}
|
|
||||||
{/each}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="my-1 px-1 w-full overflow-hidden sm:w-1/2">
|
<div class="my-1 px-1 w-full overflow-hidden sm:w-1/2">
|
||||||
<div
|
<div
|
||||||
class="border-4 border-dashed rounded mb-4 p-5 text-lg text-center">
|
class="border-4 border-dashed rounded mb-4 p-5 text-lg text-center">
|
||||||
{#each allpermissions as p}
|
|
||||||
{#if editable_userdata.permissions.includes(p)}
|
|
||||||
<p
|
<p
|
||||||
class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 bg-gray-200 p-2 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input">
|
class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 bg-gray-200 p-2 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input">
|
||||||
{p}
|
DEMO_PERMISSION
|
||||||
<button
|
</p>
|
||||||
on:click={() => {
|
<p
|
||||||
editable_userdata.permissions = editable_userdata.permissions.filter((obj) => obj !== p);
|
class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 bg-gray-200 p-2 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input">
|
||||||
}}
|
DEMO_PERMISSION
|
||||||
type="button"
|
|
||||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-300 text-base font-medium text-black hover:bg-red-700 hover:text-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm">-</button>
|
|
||||||
</p>
|
</p>
|
||||||
{/if}
|
|
||||||
{/each}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
|
||||||
</div>
|
</div>
|
||||||
|
TODO: permission picker 🔒
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@ -5,7 +5,6 @@
|
|||||||
export let modal_open = false;
|
export let modal_open = false;
|
||||||
import UsersOverview from "./UsersOverview.svelte";
|
import UsersOverview from "./UsersOverview.svelte";
|
||||||
console.log(store.state.jwtinfo.userdetails.permissions);
|
console.log(store.state.jwtinfo.userdetails.permissions);
|
||||||
let current_users=[];
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<section class="container p-5">
|
<section class="container p-5">
|
||||||
@ -23,9 +22,9 @@
|
|||||||
{/if}
|
{/if}
|
||||||
</span>
|
</span>
|
||||||
<p class="mb-8 text-lg text-gray-500">{$_('manage-admin-users')}</p>
|
<p class="mb-8 text-lg text-gray-500">{$_('manage-admin-users')}</p>
|
||||||
<UsersOverview bind:current_users />
|
<UsersOverview />
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{#if store.state.jwtinfo.userdetails.permissions.includes('USER:CREATE')}
|
{#if store.state.jwtinfo.userdetails.permissions.includes('USER:CREATE')}
|
||||||
<AddUserModal bind:current_users bind:modal_open />
|
<AddUserModal bind:modal_open />
|
||||||
{/if}
|
{/if}
|
||||||
|
|||||||
@ -9,14 +9,13 @@
|
|||||||
import UsersEmptyState from "./UsersEmptyState.svelte";
|
import UsersEmptyState from "./UsersEmptyState.svelte";
|
||||||
$: searchvalue = "";
|
$: searchvalue = "";
|
||||||
$: active_deletes = [];
|
$: active_deletes = [];
|
||||||
export let current_users=[];
|
|
||||||
$: userscache = [];
|
$: userscache = [];
|
||||||
$: advanced_search = false;
|
$: advanced_search = false;
|
||||||
usersstore.subscribe((val) => {
|
usersstore.subscribe((val) => {
|
||||||
userscache = val;
|
userscache = val;
|
||||||
current_users=val;
|
|
||||||
});
|
});
|
||||||
users_promise.then((data) => {
|
users_promise.then((data) => {
|
||||||
|
console.log(data);
|
||||||
usersstore.set(data);
|
usersstore.set(data);
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
@ -29,8 +28,8 @@
|
|||||||
<p class="font-bold">users are being loaded...</p>
|
<p class="font-bold">users are being loaded...</p>
|
||||||
<p class="text-sm">{$_('this-might-take-a-moment')}</p>
|
<p class="text-sm">{$_('this-might-take-a-moment')}</p>
|
||||||
</div>
|
</div>
|
||||||
{:then}
|
{:then users}
|
||||||
{#if current_users.length === 0}
|
{#if userscache.length === 0}
|
||||||
<UsersEmptyState />
|
<UsersEmptyState />
|
||||||
{:else}
|
{:else}
|
||||||
{#if advanced_search}
|
{#if advanced_search}
|
||||||
@ -79,12 +78,12 @@
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody class="divide-y divide-gray-200">
|
<tbody class="divide-y divide-gray-200">
|
||||||
{#each current_users as u}
|
{#each users as u}
|
||||||
{#if Object.values(u)
|
{#if Object.values(u)
|
||||||
.toString()
|
.toString()
|
||||||
.toLowerCase()
|
.toLowerCase()
|
||||||
.includes(searchvalue)}
|
.includes(searchvalue)}
|
||||||
<tr data-rowid="user_{u.id}">
|
<tr>
|
||||||
<td class="px-6 py-4 whitespace-nowrap">
|
<td class="px-6 py-4 whitespace-nowrap">
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
{#if u.profilePic}
|
{#if u.profilePic}
|
||||||
@ -138,7 +137,12 @@
|
|||||||
on:click={() => {
|
on:click={() => {
|
||||||
UserService.userControllerRemove(u.id, true)
|
UserService.userControllerRemove(u.id, true)
|
||||||
.then((resp) => {
|
.then((resp) => {
|
||||||
current_users=current_users.filter(obj=>obj.id!==u.id);
|
console.log(resp);
|
||||||
|
// user deleted
|
||||||
|
users_promise.then((data) => {
|
||||||
|
console.log(data);
|
||||||
|
usersstore.set(data);
|
||||||
|
});
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
// error deleting user
|
// error deleting user
|
||||||
|
|||||||
@ -117,9 +117,6 @@
|
|||||||
"track-length-in-m": "Track Length in m",
|
"track-length-in-m": "Track Length in m",
|
||||||
"track-name": "Track name",
|
"track-name": "Track name",
|
||||||
"tracks": "Tracks",
|
"tracks": "Tracks",
|
||||||
"updating-user": "updating user...",
|
|
||||||
"user-updated": "User updated",
|
|
||||||
"username": "Username",
|
|
||||||
"users": "Users",
|
"users": "Users",
|
||||||
"valid-email-is-required": "valid email is required",
|
"valid-email-is-required": "valid email is required",
|
||||||
"welcome_wavinghand": "Welcome 👋",
|
"welcome_wavinghand": "Welcome 👋",
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user