github
/
nocodb
mirror of https://github.com/nocodb/nocodb
1
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

enhancement: ui improvement 

Signed-off-by: Pranav C <pranavxc@gmail.com>
pull/2178/head
Pranav C 2 years ago
parent
9031f3efc6
commit
ade11881be
1 changed files with 40 additions and 9 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 49
      packages/nc-gui/components/import/ImportFromAirtable.vue

49
packages/nc-gui/components/import/ImportFromAirtable.vue
Unescape View File

@ -1,14 +1,22 @@
<template> <template>
<v-dialog v-model="airtableModal" max-width="min(600px, 90%)"> <v-dialog v-model="airtableModal" max-width="min(600px, 90%)" persistent>
<v-card class="nc-import-card h-100"> <v-card class="nc-import-card h-100">
<v-toolbar class="elevation-0 align-center" height="68"> <v-toolbar class="elevation-0 align-center" height="68">
<h3 class="mt-2"> <h3 class="mt-2">
{{ $t('title.importFromAirtable') }} {{ $t('title.importFromAirtable') }}
</h3> </h3>
<div v-t="['c:airtable-import:turbo-mode']" class="ml-2 mt-3 title pointer nc-btn-enable-turbo" @click="enableTurbo"> <div
v-t="['c:airtable-import:turbo-mode']"
class="ml-2 mt-3 title pointer nc-btn-enable-turbo"
@click="enableTurbo"
>
🚀 🚀
</div> </div>
<v-spacer /> <v-spacer />
<v-icon color="warning" class="" @click="airtableModal = false">
mdi-close
</v-icon>
</v-toolbar> </v-toolbar>
<v-divider /> <v-divider />
@ -21,11 +29,18 @@
> >
<template v-if="step === 1"> <template v-if="step === 1">
<div class="d-flex flex-column justify-center align-center pt-2 pb-6"> <div class="d-flex flex-column justify-center align-center pt-2 pb-6">
<span class="subtitle-1 font-weight-medium" @dblclick="$set(syncSource.details.options,'syncViews',true)"> <span
class="subtitle-1 font-weight-medium"
@dblclick="$set(syncSource.details.options,'syncViews',true)"
>
Credentials Credentials
</span> </span>
<a href="https://docs.nocodb.com/setup-and-usages/import-airtable-to-sql-database-within-a-minute-for-free/#get-airtable-credentials" class="caption grey--text" target="_blank">Where to find this?</a> <a
href="https://docs.nocodb.com/setup-and-usages/import-airtable-to-sql-database-within-a-minute-for-free/#get-airtable-credentials"
class="caption grey--text"
target="_blank"
>Where to find this?</a>
</div> </div>
<v-form v-model="valid"> <v-form v-model="valid">
@ -55,30 +70,39 @@
:rules="[(v) => !!v || 'Shared Base ID / URL is required']" :rules="[(v) => !!v || 'Shared Base ID / URL is required']"
/> />
</div> </div>
<v-expansion-panels class="mx-auto" style="width: 50%;" flat> <v-expansion-panels v-model="advanceOptionsPanel" class="mx-auto" style="width: 50%;" flat>
<v-expansion-panel> <v-expansion-panel>
<v-expansion-panel-header>Advanced Options</v-expansion-panel-header> <v-expansion-panel-header hide-actions>
<v-spacer />
<span class="grey--text caption">More Options <v-icon color="grey" small>
mdi-chevron-{{ advanceOptionsPanel === 0 ? 'up' : 'down' }}
</v-icon></span>
</v-expansion-panel-header>
<v-expansion-panel-content> <v-expansion-panel-content>
<v-checkbox <v-checkbox
v-model="syncSource.details.options.syncData" v-model="syncSource.details.options.syncData"
class="caption mt-n4"
label="Import Data" label="Import Data"
hide-details hide-details
dense dense
/> />
<v-checkbox <v-checkbox
v-model="syncSource.details.options.syncRollup" v-model="syncSource.details.options.syncRollup"
class="caption"
label="Import Rollup Columns" label="Import Rollup Columns"
hide-details hide-details
dense dense
/> />
<v-checkbox <v-checkbox
v-model="syncSource.details.options.syncLookup" v-model="syncSource.details.options.syncLookup"
class="caption"
label="Import Lookup Columns" label="Import Lookup Columns"
hide-details hide-details
dense dense
/> />
<v-checkbox <v-checkbox
v-model="syncSource.details.options.syncAttachment" v-model="syncSource.details.options.syncAttachment"
class="caption"
label="Import Attachment Columns" label="Import Attachment Columns"
hide-details hide-details
dense dense
@ -88,6 +112,7 @@
<div v-on="on"> <div v-on="on">
<v-checkbox <v-checkbox
v-model="syncSource.details.options.syncFormula" v-model="syncSource.details.options.syncFormula"
class="caption"
label="Import Formula Columns" label="Import Formula Columns"
hide-details hide-details
dense dense
@ -101,7 +126,7 @@
</v-expansion-panel> </v-expansion-panel>
</v-expansion-panels> </v-expansion-panels>
</v-form> </v-form>
<v-card-actions class="justify-center pb-6"> <v-card-actions class="justify-center pb-6 pt-6">
<v-btn <v-btn
v-t="['c:sync-airtable:save-and-sync']" v-t="['c:sync-airtable:save-and-sync']"
class="nc-btn-airtable-import" class="nc-btn-airtable-import"
@ -160,9 +185,14 @@
</div> </div>
</template> </template>
<div class="text-center pa-4 pb-0"> <div class="text-center pa-4 pb-0">
<a class="caption grey--text" href="https://github.com/nocodb/nocodb/issues/2052" target="_blank">Questions / Help - reach out here</a> <a class="caption grey--text" href="https://github.com/nocodb/nocodb/issues/2052" target="_blank">Questions
/ Help - reach out here</a>
<br> <br>
<span class="caption grey--text"> This feature is currently in beta and more information can be found <a href="https://github.com/nocodb/nocodb/discussions/2122" class="caption grey--text" target="_blank">here</a>.</span> <span class="caption grey--text"> This feature is currently in beta and more information can be found <a
href="https://github.com/nocodb/nocodb/discussions/2122"
class="caption grey--text"
target="_blank"
>here</a>.</span>
</div> </div>
</v-card> </v-card>
</div> </div>
@ -180,6 +210,7 @@ export default {
value: Boolean value: Boolean
}, },
data: () => ({ data: () => ({
advanceOptionsPanel: false,
isPasswordVisible: false, isPasswordVisible: false,
valid: false, valid: false,
socket: null, socket: null,

Write Preview
Loading…
Cancel
Save