mirror of
https://github.com/haexhub/haex-hub.git
synced 2025-12-17 06:30:50 +01:00
cleanup
This commit is contained in:
@ -1,58 +1,60 @@
|
||||
<template>
|
||||
<UiCard
|
||||
v-if="group"
|
||||
:title="mode === 'create' ? t('title.create') : t('title.edit')"
|
||||
icon="mdi:folder-plus-outline"
|
||||
@close="$emit('close')"
|
||||
>
|
||||
<form
|
||||
class="flex flex-col gap-4 w-full p-4"
|
||||
@submit.prevent="$emit('submit')"
|
||||
<div class="p-1">
|
||||
<UiCard
|
||||
v-if="group"
|
||||
:title="mode === 'create' ? t('title.create') : t('title.edit')"
|
||||
icon="mdi:folder-plus-outline"
|
||||
@close="$emit('close')"
|
||||
>
|
||||
<UiInput
|
||||
:check-input="check"
|
||||
:label="t('name')"
|
||||
:placeholder="t('name')"
|
||||
autofocus
|
||||
v-model="group.name"
|
||||
ref="nameRef"
|
||||
/>
|
||||
|
||||
<UiInput
|
||||
v-model="group.description"
|
||||
:check-input="check"
|
||||
:label="t('description')"
|
||||
:placeholder="t('description')"
|
||||
/>
|
||||
|
||||
<div class="flex gap-4">
|
||||
<UiSelectIcon
|
||||
v-model="group.icon"
|
||||
default-icon="mdi:folder-outline"
|
||||
<form
|
||||
class="flex flex-col gap-4 w-full p-4"
|
||||
@submit.prevent="$emit('submit')"
|
||||
>
|
||||
<UiInput
|
||||
:check-input="check"
|
||||
:label="t('name')"
|
||||
:placeholder="t('name')"
|
||||
autofocus
|
||||
v-model="group.name"
|
||||
ref="nameRef"
|
||||
/>
|
||||
|
||||
<UiSelectColor v-model="group.color" />
|
||||
</div>
|
||||
<UiInput
|
||||
v-model="group.description"
|
||||
:check-input="check"
|
||||
:label="t('description')"
|
||||
:placeholder="t('description')"
|
||||
/>
|
||||
|
||||
<div class="flex flex-wrap justify-end gap-4">
|
||||
<UiButton
|
||||
class="btn-error btn-outline flex-1"
|
||||
@click="$emit('close')"
|
||||
>
|
||||
{{ t('abort') }}
|
||||
<Icon name="mdi:close" />
|
||||
</UiButton>
|
||||
<div class="flex gap-4">
|
||||
<UiSelectIcon
|
||||
v-model="group.icon"
|
||||
default-icon="mdi:folder-outline"
|
||||
/>
|
||||
|
||||
<UiButton
|
||||
class="btn-primary flex-1"
|
||||
@click="$emit('submit')"
|
||||
>
|
||||
{{ mode === 'create' ? t('create') : t('save') }}
|
||||
<Icon name="mdi:check" />
|
||||
</UiButton>
|
||||
</div>
|
||||
</form>
|
||||
</UiCard>
|
||||
<UiSelectColor v-model="group.color" />
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap justify-end gap-4">
|
||||
<UiButton
|
||||
class="btn-error btn-outline flex-1"
|
||||
@click="$emit('close')"
|
||||
>
|
||||
{{ t('abort') }}
|
||||
<Icon name="mdi:close" />
|
||||
</UiButton>
|
||||
|
||||
<UiButton
|
||||
class="btn-primary flex-1"
|
||||
@click="$emit('submit')"
|
||||
>
|
||||
{{ mode === 'create' ? t('create') : t('save') }}
|
||||
<Icon name="mdi:check" />
|
||||
</UiButton>
|
||||
</div>
|
||||
</form>
|
||||
</UiCard>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
|
||||
@ -1,112 +1,114 @@
|
||||
<template>
|
||||
<UiCard
|
||||
body-class="rounded overflow-auto px-0 h-full"
|
||||
@close="onClose"
|
||||
>
|
||||
<div class="">
|
||||
<nav
|
||||
aria-label="Tabs Password Item"
|
||||
aria-orientation="horizontal"
|
||||
class="tabs tabs-bordered w-full transition-all duration-700 sticky top-0 z-10"
|
||||
role="tablist"
|
||||
>
|
||||
<button
|
||||
:id="id.details"
|
||||
aria-controls="vaultDetailsId"
|
||||
aria-selected="true"
|
||||
class="tab active-tab:tab-active active w-full"
|
||||
data-tab="#vaultDetailsId"
|
||||
role="tab"
|
||||
type="button"
|
||||
<div class="p-1">
|
||||
<UiCard
|
||||
body-class="rounded overflow-auto px-0 h-full"
|
||||
@close="onClose"
|
||||
>
|
||||
<div class="">
|
||||
<nav
|
||||
aria-label="Tabs Password Item"
|
||||
aria-orientation="horizontal"
|
||||
class="tabs tabs-bordered w-full transition-all duration-700 sticky top-0 z-10"
|
||||
role="tablist"
|
||||
>
|
||||
<Icon
|
||||
name="material-symbols:key-outline"
|
||||
class="me-2"
|
||||
/>
|
||||
<span class="hidden sm:block">
|
||||
{{ t('tab.details') }}
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
:id="id.keyValue"
|
||||
aria-controls="tabs-basic-2"
|
||||
aria-selected="false"
|
||||
class="tab active-tab:tab-active w-full"
|
||||
data-tab="#tabs-basic-2"
|
||||
role="tab"
|
||||
type="button"
|
||||
>
|
||||
<Icon
|
||||
name="fluent:group-list-20-filled"
|
||||
class="me-2"
|
||||
/>
|
||||
<span class="hidden sm:block">
|
||||
{{ t('tab.keyValue') }}
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
:id="id.history"
|
||||
aria-controls="tabs-basic-3"
|
||||
aria-selected="false"
|
||||
class="tab active-tab:tab-active w-full"
|
||||
data-tab="#tabs-basic-3"
|
||||
role="tab"
|
||||
type="button"
|
||||
>
|
||||
<Icon
|
||||
name="material-symbols:history"
|
||||
class="me-2"
|
||||
/>
|
||||
<span class="hidden sm:block">
|
||||
{{ t('tab.history') }}
|
||||
</span>
|
||||
</button>
|
||||
</nav>
|
||||
<button
|
||||
:id="id.details"
|
||||
aria-controls="vaultDetailsId"
|
||||
aria-selected="true"
|
||||
class="tab active-tab:tab-active active w-full"
|
||||
data-tab="#vaultDetailsId"
|
||||
role="tab"
|
||||
type="button"
|
||||
>
|
||||
<Icon
|
||||
name="material-symbols:key-outline"
|
||||
class="me-2"
|
||||
/>
|
||||
<span class="hidden sm:block">
|
||||
{{ t('tab.details') }}
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
:id="id.keyValue"
|
||||
aria-controls="tabs-basic-2"
|
||||
aria-selected="false"
|
||||
class="tab active-tab:tab-active w-full"
|
||||
data-tab="#tabs-basic-2"
|
||||
role="tab"
|
||||
type="button"
|
||||
>
|
||||
<Icon
|
||||
name="fluent:group-list-20-filled"
|
||||
class="me-2"
|
||||
/>
|
||||
<span class="hidden sm:block">
|
||||
{{ t('tab.keyValue') }}
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
:id="id.history"
|
||||
aria-controls="tabs-basic-3"
|
||||
aria-selected="false"
|
||||
class="tab active-tab:tab-active w-full"
|
||||
data-tab="#tabs-basic-3"
|
||||
role="tab"
|
||||
type="button"
|
||||
>
|
||||
<Icon
|
||||
name="material-symbols:history"
|
||||
class="me-2"
|
||||
/>
|
||||
<span class="hidden sm:block">
|
||||
{{ t('tab.history') }}
|
||||
</span>
|
||||
</button>
|
||||
</nav>
|
||||
|
||||
<div class="h-full pb-8">
|
||||
<div
|
||||
id="vaultDetailsId"
|
||||
role="tabpanel"
|
||||
class="h-full"
|
||||
:aria-labelledby="id.details"
|
||||
>
|
||||
<HaexPassItemDetails
|
||||
v-if="details"
|
||||
v-model="details"
|
||||
with-copy-button
|
||||
:read_only
|
||||
:defaultIcon
|
||||
v-model:prevent-close="preventClose"
|
||||
/>
|
||||
</div>
|
||||
<div class="h-full pb-8">
|
||||
<div
|
||||
id="vaultDetailsId"
|
||||
role="tabpanel"
|
||||
class="h-full"
|
||||
:aria-labelledby="id.details"
|
||||
>
|
||||
<HaexPassItemDetails
|
||||
v-if="details"
|
||||
v-model="details"
|
||||
with-copy-button
|
||||
:read_only
|
||||
:defaultIcon
|
||||
v-model:prevent-close="preventClose"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="tabs-basic-2"
|
||||
class="hidden"
|
||||
role="tabpanel"
|
||||
:aria-labelledby="id.keyValue"
|
||||
>
|
||||
<HaexPassItemKeyValue
|
||||
v-if="keyValues"
|
||||
v-model="keyValues"
|
||||
v-model:items-to-add="keyValuesAdd"
|
||||
v-model:items-to-delete="keyValuesDelete"
|
||||
:read_only
|
||||
:item-id="details!.id"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
id="tabs-basic-2"
|
||||
class="hidden"
|
||||
role="tabpanel"
|
||||
:aria-labelledby="id.keyValue"
|
||||
>
|
||||
<HaexPassItemKeyValue
|
||||
v-if="keyValues"
|
||||
v-model="keyValues"
|
||||
v-model:items-to-add="keyValuesAdd"
|
||||
v-model:items-to-delete="keyValuesDelete"
|
||||
:read_only
|
||||
:item-id="details!.id"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="tabs-basic-3"
|
||||
class="hidden h-full"
|
||||
role="tabpanel"
|
||||
:aria-labelledby="id.history"
|
||||
>
|
||||
<!-- <HaexPassItemHistory v-model="itemHistory" /> -->
|
||||
<div
|
||||
id="tabs-basic-3"
|
||||
class="hidden h-full"
|
||||
role="tabpanel"
|
||||
:aria-labelledby="id.history"
|
||||
>
|
||||
<!-- <HaexPassItemHistory v-model="itemHistory" /> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</UiCard>
|
||||
</UiCard>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div v-if="menuItems?.length">
|
||||
<ul
|
||||
class="flex flex-col w-full h-full gap-y-2 *:first:rounded-t-md *:last:rounded-b-md"
|
||||
class="flex flex-col w-full h-full gap-y-2 first:rounded-t-md last:rounded-b-md p-1"
|
||||
ref="listRef"
|
||||
>
|
||||
<li
|
||||
|
||||
Reference in New Issue
Block a user