yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

user-group picker working

Browse Source
This commit is contained in:
Jesper Møller Jensen
2023-05-15 17:52:20 +12:00
parent f133741dd4
commit 3dd06201e6
5 changed files with 18 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/Umbraco.Web.UI.Client/src/backoffice/users/index.ts
View File

@@ -9,6 +9,7 @@ import {
UMB_CURRENT_USER_HISTORY_STORE_CONTEXT_TOKEN,
} from './current-user/current-user-history.store';
import { UmbUserItemStore } from './users/repository/user-item.store';
import { UmbUserGroupItemStore } from './user-groups/repository/user-group-item.store';
import { UmbContextProviderController } from '@umbraco-cms/backoffice/context-api';
import { UmbEntrypointOnInit } from '@umbraco-cms/backoffice/extensions-api';
@@ -22,6 +23,7 @@ export const onInit: UmbEntrypointOnInit = (host, extensionRegistry) => {
new UmbContextProviderController(host, UMB_CURRENT_USER_STORE_CONTEXT_TOKEN, new UmbCurrentUserStore());
new UmbUserItemStore(host);
new UmbUserGroupItemStore(host);
new UmbContextProviderController(
host,
UMB_CURRENT_USER_HISTORY_STORE_CONTEXT_TOKEN,

4
src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/components/input-user-group/user-group-input.context.ts
View File

@@ -1,9 +1,9 @@
import { UmbPickerInputContext } from '@umbraco-cms/backoffice/picker-input';
import { UmbControllerHostElement } from '@umbraco-cms/backoffice/controller';
import { UserItemResponseModel } from '@umbraco-cms/backoffice/backend-api';
import { UMB_USER_GROUP_PICKER_MODAL } from '@umbraco-cms/backoffice/modal';
import { UserGroupItemResponseModel } from '@umbraco-cms/backoffice/backend-api';
export class UmbUserGroupPickerContext extends UmbPickerInputContext<UserItemResponseModel> {
export class UmbUserGroupPickerContext extends UmbPickerInputContext<UserGroupItemResponseModel> {
constructor(host: UmbControllerHostElement) {
super(host, 'Umb.Repository.UserGroup', UMB_USER_GROUP_PICKER_MODAL);
}

8
src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/components/input-user-group/user-group-input.element.ts
View File

@@ -4,7 +4,7 @@ import { customElement, property, state } from 'lit/decorators.js';
import { FormControlMixin } from '@umbraco-ui/uui-base/lib/mixins';
import { UmbUserGroupPickerContext } from './user-group-input.context';
import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
import type { UserItemResponseModel } from '@umbraco-cms/backoffice/backend-api';
import type { UserGroupItemResponseModel } from '@umbraco-cms/backoffice/backend-api';
@customElement('umb-user-group-input')
export class UmbUserGroupInputElement extends FormControlMixin(UmbLitElement) {
@@ -70,7 +70,7 @@ export class UmbUserGroupInputElement extends FormControlMixin(UmbLitElement) {
}
@state()
private _items?: Array<UserItemResponseModel>;
private _items?: Array<UserGroupItemResponseModel>;
#pickerContext = new UmbUserGroupPickerContext(this);
@@ -98,6 +98,8 @@ export class UmbUserGroupInputElement extends FormControlMixin(UmbLitElement) {
}
render() {
console.log('render', this.#pickerContext.getSelection(), this._items);
return html`
<uui-ref-list>${this._items?.map((item) => this._renderItem(item))}</uui-ref-list>
<uui-button id="add-button" look="placeholder" @click=${() => this.#pickerContext.openPicker()} label="open"
@@ -106,7 +108,7 @@ export class UmbUserGroupInputElement extends FormControlMixin(UmbLitElement) {
`;
}
private _renderItem(item: UserItemResponseModel) {
private _renderItem(item: UserGroupItemResponseModel) {
if (!item.id) return;
return html`
<uui-ref-node-user name=${item.name}>

3
src/Umbraco.Web.UI.Client/src/backoffice/users/user-groups/repository/user-group.repository.ts
View File

@@ -4,6 +4,7 @@ import { UmbUserGroupServerDataSource } from './sources/user-group.server.data';
import { UmbUserGroupCollectionServerDataSource } from './sources/user-group-collection.server.data';
import { UMB_USER_GROUP_ITEM_STORE_CONTEXT_TOKEN, UmbUserGroupItemStore } from './user-group-item.store';
import { UMB_USER_GROUP_STORE_CONTEXT_TOKEN, UmbUserGroupStore } from './user-group.store';
import { UmbUserGroupItemServerDataSource } from './sources/user-group-item.server.data';
import {
CreateUserGroupRequestModel,
UpdateUserGroupRequestModel,
@@ -23,7 +24,6 @@ import {
} from '@umbraco-cms/backoffice/repository';
import { UmbContextConsumerController } from '@umbraco-cms/backoffice/context-api';
import { UMB_NOTIFICATION_CONTEXT_TOKEN, UmbNotificationContext } from '@umbraco-cms/backoffice/notification';
import { UmbUserGroupItemServerDataSource } from './sources/user-group-item.server.data';
// TODO: implement
export class UmbUserGroupRepository
@@ -62,6 +62,7 @@ export class UmbUserGroupRepository
new UmbContextConsumerController(this.#host, UMB_USER_GROUP_ITEM_STORE_CONTEXT_TOKEN, (instance) => {
this.#itemStore = instance;
console.log('item store', instance);
}).asPromise(),
new UmbContextConsumerController(this.#host, UMB_NOTIFICATION_CONTEXT_TOKEN, (instance) => {

9
src/Umbraco.Web.UI.Client/src/backoffice/users/users/workspace/user-workspace-edit.element.ts
View File

@@ -8,6 +8,7 @@ import { repeat } from 'lit/directives/repeat.js';
import { UmbCurrentUserStore, UMB_CURRENT_USER_STORE_CONTEXT_TOKEN } from '../../current-user/current-user.store';
import { getLookAndColorFromUserStatus } from '../../utils';
import { UmbUserRepository } from '../repository/user.repository';
import UmbUserGroupInputElement from '../../user-groups/components/input-user-group/user-group-input.element';
import { UmbUserWorkspaceContext } from './user-workspace.context';
import { UMB_CHANGE_PASSWORD_MODAL } from '@umbraco-cms/backoffice/modal';
import type { UmbModalContext } from '@umbraco-cms/backoffice/modal';
@@ -85,6 +86,10 @@ export class UmbUserWorkspaceEditElement extends UmbLitElement {
}
}
#onUserGroupsChange(userGroupIds: Array<string>) {
this.#workspaceContext?.updateProperty('userGroupIds', userGroupIds);
}
#onUserDelete() {
if (!this._user || !this._user.id) return;
@@ -153,8 +158,8 @@ export class UmbUserWorkspaceEditElement extends UmbLitElement {
<umb-user-group-input
slot="editor"
.selectedIds=${this._user.userGroupIds ?? []}
@change=${(e: any) =>
this.#workspaceContext?.updateProperty('userGroupIds', e.target.value)}></umb-user-group-input>
@change=${(e: Event) =>
this.#onUserGroupsChange((e.target as UmbUserGroupInputElement).selectedIds)}></umb-user-group-input>
</umb-workspace-property-layout>
<umb-workspace-property-layout
label="Content start node"