modify style
This commit is contained in:
@@ -45,7 +45,7 @@
|
|||||||
</thead>
|
</thead>
|
||||||
|
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr v-for="idx in loading ? [1, 2, 3] : []">
|
<tr v-for="idx in (loading && noAvailableTag ? [1, 2, 3] : [])">
|
||||||
<td class="px-0" colspan="2">
|
<td class="px-0" colspan="2">
|
||||||
<v-skeleton-loader type="text" :loading="true"></v-skeleton-loader>
|
<v-skeleton-loader type="text" :loading="true"></v-skeleton-loader>
|
||||||
</td>
|
</td>
|
||||||
@@ -55,94 +55,95 @@
|
|||||||
<td colspan="2">{{ $t('No available tag') }}</td>
|
<td colspan="2">{{ $t('No available tag') }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
||||||
<tr :key="tag.id"
|
<template :key="tag.id" v-for="tag in tags">
|
||||||
v-show="!loading && (showHidden || !tag.hidden)"
|
<tr v-if="showHidden || !tag.hidden">
|
||||||
v-for="tag in tags">
|
<td>
|
||||||
<td>
|
<div class="d-flex align-center" v-if="editingTag.id !== tag.id">
|
||||||
<div class="d-flex align-center" v-if="editingTag.id !== tag.id">
|
|
||||||
<v-badge class="right-bottom-icon" color="secondary"
|
|
||||||
location="bottom right" offset-x="8" :icon="icons.hide"
|
|
||||||
v-if="tag.hidden">
|
|
||||||
<v-icon size="24" start :icon="icons.tag"/>
|
|
||||||
</v-badge>
|
|
||||||
<v-icon size="24" start :icon="icons.tag" v-else-if="!tag.hidden"/>
|
|
||||||
{{ tag.name }}
|
|
||||||
</div>
|
|
||||||
<v-text-field
|
|
||||||
type="text"
|
|
||||||
clearable
|
|
||||||
density="compact"
|
|
||||||
variant="underlined"
|
|
||||||
:disabled="updating"
|
|
||||||
:placeholder="$t('Tag Title')"
|
|
||||||
v-model="editingTag.name"
|
|
||||||
v-else-if="editingTag.id === tag.id"
|
|
||||||
@keyup.enter="save(newTag)"
|
|
||||||
>
|
|
||||||
<template #prepend>
|
|
||||||
<v-badge class="right-bottom-icon" color="secondary"
|
<v-badge class="right-bottom-icon" color="secondary"
|
||||||
location="bottom right" offset-x="8" :icon="icons.hide"
|
location="bottom right" offset-x="8" :icon="icons.hide"
|
||||||
v-if="tag.hidden">
|
v-if="tag.hidden">
|
||||||
<v-icon size="24" start :icon="icons.tag"/>
|
<v-icon size="24" start :icon="icons.tag"/>
|
||||||
</v-badge>
|
</v-badge>
|
||||||
<v-icon size="24" start :icon="icons.tag" v-else-if="!tag.hidden"/>
|
<v-icon size="24" start :icon="icons.tag" v-else-if="!tag.hidden"/>
|
||||||
</template>
|
{{ tag.name }}
|
||||||
</v-text-field>
|
</div>
|
||||||
</td>
|
<v-text-field
|
||||||
<td class="text-uppercase text-center">
|
type="text"
|
||||||
<v-btn color="default"
|
clearable
|
||||||
density="comfortable"
|
density="compact"
|
||||||
variant="text"
|
variant="underlined"
|
||||||
:icon="true"
|
:disabled="updating"
|
||||||
:loading="tagUpdating[tag.id]"
|
:placeholder="$t('Tag Title')"
|
||||||
:disabled="updating"
|
v-model="editingTag.name"
|
||||||
v-if="editingTag.id !== tag.id"
|
v-else-if="editingTag.id === tag.id"
|
||||||
@click="edit(tag)">
|
@keyup.enter="save(newTag)"
|
||||||
<v-icon size="24" :icon="icons.edit"/>
|
>
|
||||||
<v-tooltip activator="parent">{{ $t('Edit') }}</v-tooltip>
|
<template #prepend>
|
||||||
</v-btn>
|
<v-badge class="right-bottom-icon" color="secondary"
|
||||||
<v-btn color="default"
|
location="bottom right" offset-x="8" :icon="icons.hide"
|
||||||
density="comfortable"
|
v-if="tag.hidden">
|
||||||
variant="text"
|
<v-icon size="24" start :icon="icons.tag"/>
|
||||||
:icon="true"
|
</v-badge>
|
||||||
:disabled="updating"
|
<v-icon size="24" start :icon="icons.tag" v-else-if="!tag.hidden"/>
|
||||||
v-if="editingTag.id !== tag.id">
|
</template>
|
||||||
<v-icon size="24" :icon="icons.more"/>
|
</v-text-field>
|
||||||
<v-tooltip activator="parent">{{ $t('More') }}</v-tooltip>
|
</td>
|
||||||
<v-menu activator="parent">
|
<td class="text-uppercase text-center">
|
||||||
<v-list>
|
<v-btn color="default"
|
||||||
<v-list-item :prepend-icon="tag.hidden ? icons.show : icons.hide"
|
density="comfortable"
|
||||||
:title="tag.hidden ? $t('Show') : $t('Hide')"
|
variant="text"
|
||||||
@click="hide(tag, !tag.hidden)">
|
:icon="true"
|
||||||
</v-list-item>
|
:loading="tagUpdating[tag.id]"
|
||||||
<v-list-item :prepend-icon="icons.remove"
|
:disabled="updating"
|
||||||
:title="$t('Delete')" @click="remove(tag)">
|
v-if="editingTag.id !== tag.id"
|
||||||
</v-list-item>
|
@click="edit(tag)">
|
||||||
</v-list>
|
<v-icon size="24" :icon="icons.edit"/>
|
||||||
</v-menu>
|
<v-tooltip activator="parent">{{ $t('Edit') }}</v-tooltip>
|
||||||
</v-btn>
|
</v-btn>
|
||||||
<v-btn density="comfortable"
|
<v-btn color="default"
|
||||||
variant="text"
|
density="comfortable"
|
||||||
:icon="true"
|
variant="text"
|
||||||
:loading="tagUpdating[tag.id]"
|
:icon="true"
|
||||||
:disabled="updating || !isTagModified(tag)"
|
:disabled="updating"
|
||||||
v-if="editingTag.id === tag.id"
|
v-if="editingTag.id !== tag.id">
|
||||||
@click="save(editingTag)">
|
<v-icon size="24" :icon="icons.more"/>
|
||||||
<v-icon size="24" :icon="icons.confirm"/>
|
<v-tooltip activator="parent">{{ $t('More') }}</v-tooltip>
|
||||||
<v-tooltip activator="parent">{{ $t('Save') }}</v-tooltip>
|
<v-menu activator="parent">
|
||||||
</v-btn>
|
<v-list>
|
||||||
<v-btn class="ml-2" color="default"
|
<v-list-item :prepend-icon="tag.hidden ? icons.show : icons.hide"
|
||||||
density="comfortable"
|
:title="tag.hidden ? $t('Show') : $t('Hide')"
|
||||||
variant="text"
|
@click="hide(tag, !tag.hidden)">
|
||||||
:icon="true"
|
</v-list-item>
|
||||||
:disabled="updating"
|
<v-list-item :prepend-icon="icons.remove"
|
||||||
v-if="editingTag.id === tag.id"
|
:title="$t('Delete')" @click="remove(tag)">
|
||||||
@click="cancelSave(editingTag)">
|
</v-list-item>
|
||||||
<v-icon size="24" :icon="icons.cancel"/>
|
</v-list>
|
||||||
<v-tooltip activator="parent">{{ $t('Cancel') }}</v-tooltip>
|
</v-menu>
|
||||||
</v-btn>
|
</v-btn>
|
||||||
</td>
|
<v-btn density="comfortable"
|
||||||
</tr>
|
variant="text"
|
||||||
|
:icon="true"
|
||||||
|
:loading="tagUpdating[tag.id]"
|
||||||
|
:disabled="updating || !isTagModified(tag)"
|
||||||
|
v-if="editingTag.id === tag.id"
|
||||||
|
@click="save(editingTag)">
|
||||||
|
<v-icon size="24" :icon="icons.confirm"/>
|
||||||
|
<v-tooltip activator="parent">{{ $t('Save') }}</v-tooltip>
|
||||||
|
</v-btn>
|
||||||
|
<v-btn class="ml-2" color="default"
|
||||||
|
density="comfortable"
|
||||||
|
variant="text"
|
||||||
|
:icon="true"
|
||||||
|
:disabled="updating"
|
||||||
|
v-if="editingTag.id === tag.id"
|
||||||
|
@click="cancelSave(editingTag)">
|
||||||
|
<v-icon size="24" :icon="icons.cancel"/>
|
||||||
|
<v-tooltip activator="parent">{{ $t('Cancel') }}</v-tooltip>
|
||||||
|
</v-btn>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</template>
|
||||||
|
|
||||||
<tr v-if="newTag">
|
<tr v-if="newTag">
|
||||||
<td>
|
<td>
|
||||||
<v-text-field
|
<v-text-field
|
||||||
|
|||||||
@@ -99,7 +99,14 @@
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr :key="session.tokenId" v-for="session in sessions">
|
<tr v-for="idx in (loadingSession && (!sessions || sessions.length < 1) ? [1, 2, 3] : [])">
|
||||||
|
<td class="px-0" colspan="4">
|
||||||
|
<v-skeleton-loader type="text" :loading="true"></v-skeleton-loader>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
<tr :key="session.tokenId"
|
||||||
|
v-for="session in sessions">
|
||||||
<td>
|
<td>
|
||||||
<v-icon start :icon="session.icon"/>
|
<v-icon start :icon="session.icon"/>
|
||||||
{{ session.deviceType }}
|
{{ session.deviceType }}
|
||||||
|
|||||||
Reference in New Issue
Block a user