nocodb/packages/nc-gui/components/project/spreadsheet/overlay/AdditinalFeatures.vue

<template>
  <v-dialog
    v-if="show"
    v-model="show"
    align="center"
    absolute
    opacity=".75"
    z-index="9"
    width="max(90%,600px)"
  >
    <!--    :color="$store.state.settings.darkTheme ? 'white' : 'black'"-->
    <!--    :dark="$store.state.settings.darkTheme"-->
    <!--    :light="!$store.state.settings.darkTheme"-->

    <div class="feat-container backgroundColorDefault" style="position: relative; min-height: 500px">
      <!--    <v-card max-height="100%" min-width="95%" max-width="100%" style="overflow: auto">-->
      <!--      <v-card-text>-->

      <table-acl
        v-if="type === 'acl'"
        :nodes="nodes"
      />
      <columns
        v-else-if="type === 'columns'"
        :delete-table="deleteTable"
        :nodes="nodes"
      />
      <indexes
        v-else-if="type === 'indexes'"
        :delete-table="deleteTable"
        :nodes="nodes"
      />
      <triggers
        v-else-if="type === 'triggers'"
        :nodes="nodes"
      />
      <webhooks
        v-else-if="type === 'webhooks'"
        class=""
        :nodes="nodes"
        @close="show=false"
      />
      <validation
        v-else-if="type === 'validators'"
        :nodes="nodes"
      />

      <table-acl
        v-else-if="type === 'view-acl'"
        :nodes="nodes"
      />
      <view-columns
        v-else-if="type === 'view-columns'"
        :nodes="nodes"
      />
      <template
        v-else-if="type === 'shared-views'"
      >
        <shared-views-list
          v-if="show"
          :selected-view="selectedView"
          :model-name="table"
          :nodes="nodes"
          :meta="meta"
        />
      </template>

      <!--      </v-card-text>-->
      <!--    </v-card>-->
    </div>
  </v-dialog>
</template>

<script>
import TableAcl from '~/components/project/tableTabs/TableAcl'
import Columns from '~/components/project/tableTabs/Columns'
import Indexes from '~/components/project/tableTabs/Indexes'
import Triggers from '~/components/project/tableTabs/Triggers'
import Webhooks from '~/components/project/tableTabs/Webhooks'
import Validation from '~/components/project/tableTabs/Validation'
import ViewColumns from '~/components/project/viewTabs/ViewColumns'
import SharedViewsList from '~/components/project/spreadsheet/components/SharedViewsList'

export default {
  name: 'AdditionalFeatures',
  components: { SharedViewsList, ViewColumns, Validation, Webhooks, Triggers, Indexes, Columns, TableAcl },
  props: ['value', 'nodes', 'type', 'deleteTable', 'table', 'selectedView', 'meta'],
  computed: {
    show: {
      set(v) {
        this.$emit('input', v)
      },
      get() {
        return this.value
      }
    }
  }
}
</script>

<style scoped>
/deep/ .v-overlay__content {
  width: 100%;
  /*align-self: flex-start;*/
  /*position: relative;*/
  height: 100%;
  display: flex;
}

.close-icon {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 99999;
}

.feat-container {
  position: relative;
  align-self: center;
  margin:auto !important;
}
</style>