👪 UserDetail - group edit support

ref #12
This commit is contained in:
Philipp Dormann 2021-01-12 20:16:16 +01:00
parent ea23b97231
commit a9e319e0c0

View File

@ -2,7 +2,7 @@
import { _ } from "svelte-i18n";
import lodashIsEqual from "lodash.isequal";
import store from "../store";
import { UserService } from "@odit/lfk-client-js";
import { UserService, UserGroupService } from "@odit/lfk-client-js";
import "gridjs/dist/theme/mermaid.css";
import Toastify from "toastify-js";
import PromiseError from "./PromiseError.svelte";
@ -12,12 +12,46 @@
$: delete_triggered = false;
$: original_data = {};
$: editable_userdata = undefined;
$: allgroups = [];
$: allgroups_ids = [];
$: usergroups_array = [];
user_promise.then((data) => {
console.log(data);
data_loaded = true;
original_data = Object.assign(original_data, data);
editable_userdata = data;
usergroups_array = [];
allgroups.forEach((g) => {
allgroups_ids.push(g.id);
});
});
UserGroupService.userGroupControllerGetAll().then((data) => {
console.log(data);
allgroups = data;
});
$: changes_performed = !lodashIsEqual(original_data, editable_userdata);
function updateGroups() {
console.log("updating groups...");
console.log(editable_userdata.groups);
allgroups.forEach((g) => {
const exists_in_currentstate = editable_userdata.groups.some(
(obj) => obj.id === g.id
);
console.log("exists:" + exists_in_currentstate);
if (exists_in_currentstate === true) {
editable_userdata.groups = editable_userdata.groups.filter(function (
obj
) {
return obj.id !== g.id;
});
} else {
console.log("add to arr:" + g.id);
editable_userdata.groups.push(g);
}
});
console.log("new groups:");
console.log(editable_userdata.groups);
}
function submit() {
if (data_loaded === true && changes_performed === true) {
console.log("ok, submitting...");
@ -235,12 +269,19 @@
</div>
<div class="text-sm w-full">
<span class="font-medium">{$_('groups')}</span>
<!-- svelte-ignore a11y-no-onchange -->
<select
on:change={updateGroups}
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"
multiple>
<option>Admins</option>
<option>Finanzen</option>
<option>...</option>
{#each allgroups as g}
{#if editable_userdata.groups.some((obj) => obj.id === g.id)}
<option selected value={g.id}>{g.name}</option>
{:else}
<option value={g.id}>{g.name}</option>
{/if}
{/each}
</select>
</div>
<div class="text-sm w-full">