mirror of
https://github.com/open-webui/open-webui
synced 2025-06-26 18:26:48 +00:00
refac: styling
This commit is contained in:
@@ -37,6 +37,18 @@
|
||||
});
|
||||
|
||||
$: onChange(accessControl);
|
||||
|
||||
$: if (selectedGroupId) {
|
||||
onSelectGroup();
|
||||
}
|
||||
|
||||
const onSelectGroup = () => {
|
||||
if (selectedGroupId !== '') {
|
||||
accessControl.read.group_ids = [...accessControl.read.group_ids, selectedGroupId];
|
||||
|
||||
selectedGroupId = '';
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class=" rounded-lg flex flex-col gap-2">
|
||||
@@ -126,7 +138,42 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-2">
|
||||
<div class="mb-1">
|
||||
<div class="flex w-full">
|
||||
<div class="flex flex-1 items-center">
|
||||
<div class="w-full px-0.5">
|
||||
<select
|
||||
class="outline-none bg-transparent text-sm rounded-lg block w-full pr-10 max-w-full
|
||||
{selectedGroupId ? '' : 'text-gray-500'}
|
||||
dark:placeholder-gray-500"
|
||||
bind:value={selectedGroupId}
|
||||
>
|
||||
<option class=" text-gray-700" value="" disabled selected
|
||||
>{$i18n.t('Select a group')}</option
|
||||
>
|
||||
{#each groups.filter((group) => !accessControl.read.group_ids.includes(group.id)) as group}
|
||||
<option class=" text-gray-700" value={group.id}>{group.name}</option>
|
||||
{/each}
|
||||
</select>
|
||||
</div>
|
||||
<!-- <div>
|
||||
<Tooltip content={$i18n.t('Add Group')}>
|
||||
<button
|
||||
class=" p-1 rounded-xl bg-transparent dark:hover:bg-white/5 hover:bg-black/5 transition font-medium text-sm flex items-center space-x-1"
|
||||
type="button"
|
||||
on:click={() => {}}
|
||||
>
|
||||
<Plus className="size-3.5" />
|
||||
</button>
|
||||
</Tooltip>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class=" border-gray-100 dark:border-gray-700/10 mt-1.5 mb-2.5 w-full" />
|
||||
|
||||
<div class="flex flex-col gap-2 mb-1 px-0.5">
|
||||
{#if accessGroups.length > 0}
|
||||
{#each accessGroups as group}
|
||||
<div class="flex items-center gap-3 justify-between text-xs w-full transition">
|
||||
@@ -140,9 +187,9 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full flex justify-end">
|
||||
<div class="w-full flex justify-end items-center gap-0.5">
|
||||
<button
|
||||
class=" translate-y-0.5"
|
||||
class=""
|
||||
type="button"
|
||||
on:click={() => {
|
||||
if (accessControl.write.group_ids.includes(group.id)) {
|
||||
@@ -188,48 +235,6 @@
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class=" my-2 border-black/5 dark:border-white/5" />
|
||||
|
||||
<div class="mb-1">
|
||||
<div class="flex w-full">
|
||||
<div class="flex flex-1 items-center">
|
||||
<div class="w-full">
|
||||
<select
|
||||
class="outline-none bg-transparent text-sm font-medium rounded-lg block w-full pr-10 max-w-full dark:placeholder-gray-700"
|
||||
bind:value={selectedGroupId}
|
||||
>
|
||||
<option class=" text-gray-700" value="" disabled selected
|
||||
>{$i18n.t('Select a group')}</option
|
||||
>
|
||||
{#each groups.filter((group) => !accessControl.read.group_ids.includes(group.id)) as group}
|
||||
<option class=" text-gray-700" value={group.id}>{group.name}</option>
|
||||
{/each}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<Tooltip content={$i18n.t('Add Group')}>
|
||||
<button
|
||||
class=" p-1 rounded-xl bg-transparent dark:hover:bg-white/5 hover:bg-black/5 transition font-medium text-sm flex items-center space-x-1"
|
||||
type="button"
|
||||
on:click={() => {
|
||||
if (selectedGroupId !== '') {
|
||||
accessControl.read.group_ids = [
|
||||
...accessControl.read.group_ids,
|
||||
selectedGroupId
|
||||
];
|
||||
|
||||
selectedGroupId = '';
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Plus className="size-3.5" />
|
||||
</button>
|
||||
</Tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user