mirror of https://github.com/nocodb/nocodb
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
198 lines
7.4 KiB
198 lines
7.4 KiB
<template> |
|
<div> |
|
<slot :click="() => settingsModal = true"> |
|
<v-icon class="mx-2" @click="settingsModal=true"> |
|
mdi-cog-outline |
|
</v-icon> |
|
</slot> |
|
<v-dialog v-model="settingsModal" width="90%" overlay-opacity=".9"> |
|
<v-card |
|
v-if="settingsModal" |
|
width="100%" |
|
min-height="350px" |
|
> |
|
<div class="d-flex"> |
|
<v-navigation-drawer |
|
left |
|
permanent |
|
height="90vh" |
|
style="background-color: #f7f6f3" |
|
> |
|
<div class=" advance-menu "> |
|
<v-list |
|
v-if="_isUIAllowed('treeViewProjectSettings')" |
|
dense |
|
:class="{ 'advanced-border': overShieldIcon }" |
|
> |
|
<v-list-item> |
|
<v-list-item-title> |
|
<!-- Settings --> |
|
<span class="body-2 font-weight-medium grey--text text-uppercase caption">{{ $t('activity.settings') }}</span> |
|
</v-list-item-title> |
|
</v-list-item> |
|
<v-list-item-group v-model="activePage" color="x-active" mandatory> |
|
<v-tooltip bottom> |
|
<template #activator="{ on }"> |
|
<v-list-item |
|
v-t="['settings:team-auth']" |
|
value="roles" |
|
dense |
|
class="body-2 nc-settings-teamauth" |
|
v-on="on" |
|
> |
|
<v-list-item-icon> |
|
<v-icon small> |
|
mdi-account-group |
|
</v-icon> |
|
</v-list-item-icon> |
|
<!-- Team & Auth --> |
|
<v-list-item-title> |
|
<span :class="{'font-weight-medium': activePage === 'roles', 'font-weight-regular':activePage !=='roles'}">{{ |
|
$t('title.team&auth') |
|
}}</span> |
|
</v-list-item-title> |
|
</v-list-item> |
|
</template> |
|
<!-- Roles & Users Management --> |
|
{{ $t('title.rolesUserMgmt') }} |
|
</v-tooltip> |
|
|
|
<template v-if="_isUIAllowed('treeViewProjectSettings')"> |
|
<v-tooltip bottom> |
|
<template #activator="{ on }"> |
|
<v-list-item |
|
v-t="['settings:appstore']" |
|
dense |
|
class="body-2 nc-settings-appstore" |
|
value="appStore" |
|
v-on="on" |
|
> |
|
<v-list-item-icon> |
|
<v-icon small> |
|
mdi-storefront-outline |
|
</v-icon> |
|
</v-list-item-icon> |
|
<!-- App Store --> |
|
<v-list-item-title> |
|
<span :class="{'font-weight-medium': activePage === 'appStore', 'font-weight-regular':activePage !=='appStore'}">{{ |
|
$t('title.appStore') |
|
}}</span> |
|
</v-list-item-title> |
|
</v-list-item> |
|
</template> |
|
<!-- App Store --> |
|
{{ $t('title.appStore') }} |
|
</v-tooltip> |
|
|
|
<v-tooltip bottom> |
|
<template #activator="{ on }"> |
|
<v-list-item |
|
v-t="['settings:proj-metadata']" |
|
dense |
|
class="body-2 nc-settings-projmeta" |
|
value="disableOrEnableModel" |
|
v-on="on" |
|
> |
|
<v-list-item-icon> |
|
<v-icon small> |
|
mdi-table-multiple |
|
</v-icon> |
|
</v-list-item-icon> |
|
<!-- Project Metadata --> |
|
<v-list-item-title> |
|
<span :class="{'font-weight-medium': activePage === 'disableOrEnableModel', 'font-weight-regular':activePage !=='disableOrEnableModel'}">{{ |
|
$t('title.projMeta') |
|
}}</span> |
|
</v-list-item-title> |
|
</v-list-item> |
|
</template> |
|
<!-- Meta Management --> |
|
{{ $t('title.metaMgmt') }} |
|
</v-tooltip> |
|
|
|
<v-tooltip bottom> |
|
<template #activator="{ on }"> |
|
<v-list-item |
|
v-t="['settings:audit']" |
|
dense |
|
class="body-2 nc-settings-audit" |
|
value="audit" |
|
v-on="on" |
|
> |
|
<v-list-item-icon> |
|
<v-icon small> |
|
mdi-notebook-outline |
|
</v-icon> |
|
</v-list-item-icon> |
|
<!-- Project Metadata --> |
|
<v-list-item-title> |
|
<span :class="{'font-weight-medium': activePage === 'audit', 'font-weight-regular':activePage !=='audit' }">{{ |
|
$t('title.audit') |
|
}}</span> |
|
</v-list-item-title> |
|
</v-list-item> |
|
</template> |
|
<!-- Meta Management --> |
|
{{ $t('title.auditLogs') }} |
|
</v-tooltip> |
|
</template> |
|
</v-list-item-group> |
|
</v-list> |
|
</div> |
|
</v-navigation-drawer> |
|
<v-container class="flex-grow-1 py-9 px-15" style="max-height: 90vh; overflow-y: auto"> |
|
<div v-if="activePage === 'audit'" style="height:100%"> |
|
<audit-tab /> |
|
</div> |
|
<div |
|
v-else-if="activePage === 'meta'" |
|
> |
|
<xc-meta /> |
|
</div> |
|
<div |
|
v-else-if="activePage === 'roles'" |
|
> |
|
<auth-tab |
|
v-if="_isUIAllowed('team-auth')" |
|
/> |
|
</div> |
|
<div |
|
v-else-if="activePage === 'disableOrEnableModel'" |
|
> |
|
<disable-or-enable-models |
|
v-if="_isUIAllowed('project-metadata')" |
|
/> |
|
</div> |
|
<app-store v-else /> |
|
</v-container> |
|
</div> |
|
</v-card> |
|
</v-dialog> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
import AppStore from '~/components/project/appStore' |
|
import DisableOrEnableModels from '~/components/project/projectMetadata/disableOrEnableModels' |
|
import AuthTab from '~/components/authTab' |
|
import XcMeta from '~/components/project/settings/xcMeta' |
|
import AuditTab from '~/components/project/auditTab' |
|
|
|
export default { |
|
name: 'SettingsModal', |
|
components: { AuditTab, XcMeta, AuthTab, DisableOrEnableModels, AppStore }, |
|
data: () => ({ |
|
settingsModal: false, |
|
activePage: 'role' |
|
}) |
|
} |
|
</script> |
|
|
|
<style scoped lang="scss"> |
|
::v-deep{ |
|
.v-list-item__icon{ |
|
margin-right: 0 !important; |
|
} |
|
} |
|
|
|
</style>
|
|
|