Browse Source

test: vue3 ui-acl cypress markers, tooltip fix

Signed-off-by: Raju Udava <86527202+dstala@users.noreply.github.com>
pull/2888/head
Raju Udava 2 years ago
parent
commit
506072bd48
  1. 33
      packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue

33
packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue

@ -98,25 +98,37 @@ const columns = [
<div class="flex flex-row w-full"> <div class="flex flex-row w-full">
<div class="flex flex-column w-full"> <div class="flex flex-column w-full">
<div class="flex flex-row items-center w-full mb-4 gap-2"> <div class="flex flex-row items-center w-full mb-4 gap-2">
<a-input v-model:value="searchInput" placeholder="Search models"> <a-input v-model:value="searchInput" placeholder="Search models" class="nc-acl-search">
<template #prefix> <template #prefix>
<MdiMagnify /> <MdiMagnify />
</template> </template>
</a-input> </a-input>
<a-button class="self-start" @click="loadTableList"> <a-button class="self-start nc-acl-reload" @click="loadTableList">
<div class="flex items-center gap-2 text-gray-600 font-light"> <div class="flex items-center gap-2 text-gray-600 font-light">
<MdiReload :class="{ 'animate-infinite animate-spin !text-success': isLoading }" /> <MdiReload :class="{ 'animate-infinite animate-spin !text-success': isLoading }" />
Reload Reload
</div> </div>
</a-button> </a-button>
<a-button class="self-start" @click="saveUIAcl"> <a-button class="self-start nc-acl-save" @click="saveUIAcl">
<div class="flex items-center gap-2 text-gray-600 font-light"> <div class="flex items-center gap-2 text-gray-600 font-light">
<MdiContentSave /> <MdiContentSave />
Save Save
</div> </div>
</a-button> </a-button>
</div> </div>
<a-table class="w-full" :data-source="filteredTables" :columns="columns" :pagination="false" :loading="isLoading" bordered> <a-table
class="w-full"
:data-source="filteredTables"
:columns="columns"
:pagination="false"
:loading="isLoading"
bordered
:customRow="
(record) => ({
class: `nc-acl-table-row nc-acl-table-row-${record.title}`,
})
"
>
<template #bodyCell="{ record, column }"> <template #bodyCell="{ record, column }">
<div v-if="column.name === 'table_name'">{{ record._ptn }}</div> <div v-if="column.name === 'table_name'">{{ record._ptn }}</div>
<div v-if="column.name === 'view_name'"> <div v-if="column.name === 'view_name'">
@ -128,8 +140,17 @@ const columns = [
<div v-for="role in roles" :key="role"> <div v-for="role in roles" :key="role">
<div v-if="column.name === role"> <div v-if="column.name === role">
<a-tooltip> <a-tooltip>
<template #title>Click to hide '{{ record.title }}' for role:{{ role }} in UI dashboard</template> <template #title>
<a-checkbox :checked="!record.disabled[role]" @change="onRoleCheck(record, role)"></a-checkbox> <span v-if="record.disabled[role]">
Click to make '{{ record.title }}' visible for role:{{ role }} in UI dashboard</span
>
<span v-else>Click to hide '{{ record.title }}' for role:{{ role }} in UI dashboard</span>
</template>
<a-checkbox
:checked="!record.disabled[role]"
:class="`nc-acl-${record.title}-${role}-chkbox`"
@change="onRoleCheck(record, role)"
></a-checkbox>
</a-tooltip> </a-tooltip>
</div> </div>
</div> </div>

Loading…
Cancel
Save