|
|
|
|
@ -1,11 +1,14 @@
|
|
|
|
|
<script setup lang="ts"> |
|
|
|
|
// import { useEventBus } from '@vueuse/core' |
|
|
|
|
import type { ColumnType, FormType, GalleryType, GridType, KanbanType } from 'nocodb-sdk' |
|
|
|
|
import { UITypes } from 'nocodb-sdk'; |
|
|
|
|
// import { ViewTypes } from 'nocodb-sdk' |
|
|
|
|
import type { ColumnType } from 'nocodb-sdk' |
|
|
|
|
import { UITypes } from 'nocodb-sdk' |
|
|
|
|
import type { SizeType } from 'ant-design-vue/es/config-provider' |
|
|
|
|
import { computed, onMounted, provide, watch } from '#imports' |
|
|
|
|
// import { ActiveViewInj, FieldsInj, IsLockedInj, MetaInj, ReloadViewDataHookInj, TabMetaInj } from '~/components' |
|
|
|
|
// import useMetas from '~/composables/useMetas' |
|
|
|
|
import MdiTableIcon from '~icons/mdi/table' |
|
|
|
|
import MdiDeleteIcon from '~icons/mdi/close-box' |
|
|
|
|
import MdiStringIcon from '~icons/mdi/alpha-a' |
|
|
|
|
import MdiLongTextIcon from '~icons/mdi/text' |
|
|
|
|
import MdiNumericIcon from '~icons/mdi/numeric' |
|
|
|
|
import MdiPlusIcon from '~icons/mdi/plus' |
|
|
|
|
|
|
|
|
|
interface Props { |
|
|
|
|
quickImportType: string |
|
|
|
|
@ -20,6 +23,19 @@ const editableTn = ref({})
|
|
|
|
|
const LinkToAnotherRecord = 'LinkToAnotherRecord' |
|
|
|
|
const Lookup = 'Lookup' |
|
|
|
|
const Rollup = 'Rollup' |
|
|
|
|
const iconSize = ref<SizeType>('middle') |
|
|
|
|
const tableColumns = [ |
|
|
|
|
{ |
|
|
|
|
name: 'Column Name', |
|
|
|
|
dataIndex: 'column_name', |
|
|
|
|
key: 'column_name', |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
name: 'Column Type', |
|
|
|
|
dataIndex: 'column_type', |
|
|
|
|
key: 'column_type', |
|
|
|
|
}, |
|
|
|
|
] |
|
|
|
|
|
|
|
|
|
const project = reactive(<any>{ |
|
|
|
|
name: 'Project Name', |
|
|
|
|
@ -65,7 +81,7 @@ const parseTemplate = ({ tables = [], ...rest }: Record<string, any>) => {
|
|
|
|
|
...bt, |
|
|
|
|
})), |
|
|
|
|
...v.map((v: any) => { |
|
|
|
|
const res : any = { |
|
|
|
|
const res: any = { |
|
|
|
|
column_name: v.title, |
|
|
|
|
ref_table_name: { |
|
|
|
|
...v, |
|
|
|
|
@ -141,356 +157,138 @@ const deleteTableColumn = (i: number, j: number, col: ColumnType, table: string)
|
|
|
|
|
const addNewColumnRow = (table: string, uidt?: string) => { |
|
|
|
|
// TODO |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const getIcon = (type: string) => { |
|
|
|
|
// TODO |
|
|
|
|
return { |
|
|
|
|
name: 'CreateTime', |
|
|
|
|
icon: 'mdi-calendar-clock', |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<template> |
|
|
|
|
<div class="h-100" style="min-height: 500px"> |
|
|
|
|
<v-toolbar class="elevation-0"> |
|
|
|
|
<a-card> |
|
|
|
|
<template #title> |
|
|
|
|
<slot name="toolbar" /> |
|
|
|
|
</v-toolbar> |
|
|
|
|
<v-divider class="mt-6" /> |
|
|
|
|
<v-container class="text-center" style="height: calc(100% - 64px); overflow-y: auto"> |
|
|
|
|
<v-form ref="form" v-model="valid"> |
|
|
|
|
<v-row fluid class="justify-center"> |
|
|
|
|
<v-col cols="12"> |
|
|
|
|
<v-card class="elevation-0"> |
|
|
|
|
<v-card-text> |
|
|
|
|
{{ project }} |
|
|
|
|
<p v-if="project.tables && quickImportType === 'excel'" class="caption grey--text mt-4"> |
|
|
|
|
{{ project.tables.length }} sheet{{ project.tables.length > 1 ? 's' : '' }} |
|
|
|
|
available for import |
|
|
|
|
</p> |
|
|
|
|
<v-expansion-panels v-if="project.tables && project.tables.length" v-model="expansionPanel" accordion> |
|
|
|
|
<v-expansion-panel v-for="(table, i) in project.tables" :key="i"> |
|
|
|
|
<v-expansion-panel-header :id="`tn_${table.table_name}`"> |
|
|
|
|
<v-text-field |
|
|
|
|
v-if="editableTn[i]" |
|
|
|
|
:value="table.table_name" |
|
|
|
|
class="font-weight-bold" |
|
|
|
|
style="max-width: 300px" |
|
|
|
|
outlinedk |
|
|
|
|
autofocus |
|
|
|
|
density="compact" |
|
|
|
|
hide-details |
|
|
|
|
@input="(e) => onTableNameUpdate(table, e)" |
|
|
|
|
@click="(e) => e.stopPropagation()" |
|
|
|
|
@blur="$set(editableTn, i, false)" |
|
|
|
|
@keydown.enter="$set(editableTn, i, false)" |
|
|
|
|
/> |
|
|
|
|
<span v-else class="font-weight-bold" @click="(e) => (e.stopPropagation(), $set(editableTn, i, true))"> |
|
|
|
|
<v-icon color="primary lighten-1">mdi-table</v-icon> |
|
|
|
|
{{ table.table_name }} |
|
|
|
|
</span> |
|
|
|
|
|
|
|
|
|
<v-spacer /> |
|
|
|
|
<v-tooltip bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<v-icon |
|
|
|
|
v-if="project.tables.length > 1" |
|
|
|
|
class="flex-grow-0 mr-2" |
|
|
|
|
small |
|
|
|
|
color="grey" |
|
|
|
|
@click.stop="deleteTable(i)" |
|
|
|
|
v-on="on" |
|
|
|
|
> |
|
|
|
|
mdi-delete-outline |
|
|
|
|
</v-icon> |
|
|
|
|
</template> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Delete Table</span> |
|
|
|
|
</v-tooltip> |
|
|
|
|
</v-expansion-panel-header> |
|
|
|
|
<v-expansion-panel-content> |
|
|
|
|
<template> |
|
|
|
|
<v-simple-table v-if="table.columns.length" dense class="my-4"> |
|
|
|
|
<thead> |
|
|
|
|
<tr> |
|
|
|
|
<th class="caption text-left pa-1"> |
|
|
|
|
<!-- Column Name --> |
|
|
|
|
{{ $t('labels.columnName') }} |
|
|
|
|
</th> |
|
|
|
|
<th class="caption text-left pa-1" colspan="4"> |
|
|
|
|
<!-- Column Type --> |
|
|
|
|
{{ $t('labels.columnType') }} |
|
|
|
|
</th> |
|
|
|
|
<th /> |
|
|
|
|
<!-- <th class='text-center'>Related Table</th> --> |
|
|
|
|
<!-- <th class='text-center'>Related Column</th> --> |
|
|
|
|
</tr> |
|
|
|
|
</thead> |
|
|
|
|
<tbody> |
|
|
|
|
<tr v-for="(col, j) in table.columns" :key="j" :data-exp="i"> |
|
|
|
|
<td class="pa-1 text-left" :style="{ width: '15%' }"> |
|
|
|
|
<v-text-field |
|
|
|
|
:ref="`cn_${table.table_name}_${j}`" |
|
|
|
|
:value="col.column_name" |
|
|
|
|
outlined |
|
|
|
|
dense |
|
|
|
|
class="caption" |
|
|
|
|
:placeholder="$t('labels.columnName')" |
|
|
|
|
hide-details="auto" |
|
|
|
|
:rules="[ |
|
|
|
|
(v) => !!v || 'Column name required', |
|
|
|
|
(v) => |
|
|
|
|
!table.columns.some((c) => c !== col && c.column_name === v) || |
|
|
|
|
'Duplicate column not allowed', |
|
|
|
|
]" |
|
|
|
|
@input="(e) => onColumnNameUpdate(col, e, table.table_name)" |
|
|
|
|
/> |
|
|
|
|
</td> |
|
|
|
|
<template> |
|
|
|
|
<td class="pa-1 text-left" style="width: 200px; max-width: 200px"> |
|
|
|
|
<v-autocomplete |
|
|
|
|
:ref="`uidt_${table.table_name}_${j}`" |
|
|
|
|
style="max-width: 200px" |
|
|
|
|
:value="col.uidt" |
|
|
|
|
placeholder="Column Data Type" |
|
|
|
|
outlined |
|
|
|
|
dense |
|
|
|
|
class="caption" |
|
|
|
|
hide-details="auto" |
|
|
|
|
:rules="[(v) => !!v || 'Column data type required']" |
|
|
|
|
:items=" |
|
|
|
|
col.uidt === 'ForeignKey' |
|
|
|
|
? [ |
|
|
|
|
...uiTypes, |
|
|
|
|
{ |
|
|
|
|
name: 'ForeignKey', |
|
|
|
|
icon: 'mdi-link-variant', |
|
|
|
|
virtual: 1, |
|
|
|
|
}, |
|
|
|
|
] |
|
|
|
|
: uiTypes |
|
|
|
|
" |
|
|
|
|
item-text="name" |
|
|
|
|
item-value="name" |
|
|
|
|
@input="(v) => onUidtChange(col.uidt, v, col, table)" |
|
|
|
|
> |
|
|
|
|
<template #item="{ item: { name } }"> |
|
|
|
|
<v-chip v-if="colors[name]" :color="colors[name]" small> |
|
|
|
|
{{ name }} |
|
|
|
|
</v-chip> |
|
|
|
|
<span v-else class="caption">{{ name }}</span> |
|
|
|
|
</template> |
|
|
|
|
<template #selection="{ item: { name } }"> |
|
|
|
|
<v-chip v-if="colors[name]" :color="colors[name]" small style="max-width: 100px"> |
|
|
|
|
{{ name }} |
|
|
|
|
</v-chip> |
|
|
|
|
<span v-else class="caption">{{ name }}</span> |
|
|
|
|
</template> |
|
|
|
|
</v-autocomplete> |
|
|
|
|
</td> |
|
|
|
|
|
|
|
|
|
<template v-if="isRelation(col) || isLookupOrRollup(col)"> |
|
|
|
|
<td class="pa-1 text-left"> |
|
|
|
|
<v-autocomplete |
|
|
|
|
:value="col.ref_table_name" |
|
|
|
|
placeholder="Related table" |
|
|
|
|
outlined |
|
|
|
|
class="caption" |
|
|
|
|
dense |
|
|
|
|
hide-details="auto" |
|
|
|
|
:rules="[(v) => !!v || 'Related table name required', ...getRules(col, table)]" |
|
|
|
|
:items=" |
|
|
|
|
isLookupOrRollup(col) ? getRelatedTables(table.table_name, isRollup(col)) : project.tables |
|
|
|
|
" |
|
|
|
|
:item-text="(t) => (isLookupOrRollup(col) ? `${t.table_name} (${t.type})` : t.table_name)" |
|
|
|
|
:item-value="(t) => (isLookupOrRollup(col) ? t : t.table_name)" |
|
|
|
|
:value-comparator="compareRel" |
|
|
|
|
@input="(v) => onRtnChange(col.ref_table_name, v, col, table)" |
|
|
|
|
/> |
|
|
|
|
</td> |
|
|
|
|
|
|
|
|
|
<td v-if="isRelation(col)" class="pa-1"> |
|
|
|
|
<template v-if="col.uidt !== 'ForeignKey'"> |
|
|
|
|
<v-autocomplete |
|
|
|
|
:value="col.type" |
|
|
|
|
placeholder="Relation Type" |
|
|
|
|
outlined |
|
|
|
|
class="caption" |
|
|
|
|
dense |
|
|
|
|
hide-details="auto" |
|
|
|
|
:rules="[(v) => !!v || 'Relation type required']" |
|
|
|
|
:items="[ |
|
|
|
|
{ text: 'Many To Many', value: 'mm' }, |
|
|
|
|
{ text: 'Has Many', value: 'hm' }, |
|
|
|
|
]" |
|
|
|
|
@input="(v) => onRTypeChange(col.type, v, col, table)" |
|
|
|
|
/> |
|
|
|
|
</template> |
|
|
|
|
</td> |
|
|
|
|
<td v-if="isLookupOrRollup(col)" class="pa-1"> |
|
|
|
|
<v-autocomplete |
|
|
|
|
v-model="col.ref_column_name" |
|
|
|
|
placeholder="Related table column" |
|
|
|
|
outlined |
|
|
|
|
dense |
|
|
|
|
class="caption" |
|
|
|
|
hide-details="auto" |
|
|
|
|
:rules="[(v) => !!v || 'Related column name required']" |
|
|
|
|
:items=" |
|
|
|
|
( |
|
|
|
|
project.tables.find( |
|
|
|
|
(t) => |
|
|
|
|
t.table_name === |
|
|
|
|
((col.ref_table_name && col.ref_table_name.table_name) || col.ref_table_name), |
|
|
|
|
) || { columns: [] } |
|
|
|
|
).columns.filter((v) => !isVirtual(v)) |
|
|
|
|
" |
|
|
|
|
item-text="column_name" |
|
|
|
|
item-value="column_name" |
|
|
|
|
/> |
|
|
|
|
</td> |
|
|
|
|
<td v-if="isRollup(col)" class="pa-1"> |
|
|
|
|
<v-autocomplete |
|
|
|
|
v-model="col.fn" |
|
|
|
|
placeholder="Rollup function" |
|
|
|
|
outlined |
|
|
|
|
dense |
|
|
|
|
class="caption" |
|
|
|
|
hide-details="auto" |
|
|
|
|
:rules="[(v) => !!v || 'Rollup aggregate function name required']" |
|
|
|
|
:items="rollupFnList" |
|
|
|
|
/> |
|
|
|
|
</td> |
|
|
|
|
</template> |
|
|
|
|
<template v-if="isSelect(col)"> |
|
|
|
|
<td class="pa-1 text-left" colspan="2"> |
|
|
|
|
<v-text-field |
|
|
|
|
v-model="col.dtxp" |
|
|
|
|
placeholder="Select options" |
|
|
|
|
outlined |
|
|
|
|
class="caption" |
|
|
|
|
dense |
|
|
|
|
hide-details |
|
|
|
|
/> |
|
|
|
|
</td> |
|
|
|
|
</template> |
|
|
|
|
<td |
|
|
|
|
v-if="!isRollup(col)" |
|
|
|
|
:colspan=" |
|
|
|
|
isLookupOrRollup(col) || isRelation(col) || isSelect(col) ? (isRollup(col) ? 0 : 1) : 3 |
|
|
|
|
" |
|
|
|
|
/> |
|
|
|
|
<td style="max-width: 50px; width: 50px"> |
|
|
|
|
<v-tooltip v-if="j == 0" bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<x-icon small class="mr-1" color="primary" v-on="on"> mdi-key-star </x-icon> |
|
|
|
|
</template> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Primary Value</span> |
|
|
|
|
</v-tooltip> |
|
|
|
|
<v-tooltip v-else bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<v-icon |
|
|
|
|
class="flex-grow-0" |
|
|
|
|
small |
|
|
|
|
color="grey" |
|
|
|
|
@click.stop="deleteTableColumn(i, j, col, table)" |
|
|
|
|
v-on="on" |
|
|
|
|
> |
|
|
|
|
mdi-delete-outline |
|
|
|
|
</v-icon> |
|
|
|
|
</template> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Delete Column</span> |
|
|
|
|
</v-tooltip> |
|
|
|
|
</td> |
|
|
|
|
</template> |
|
|
|
|
</tr> |
|
|
|
|
</tbody> |
|
|
|
|
</v-simple-table> |
|
|
|
|
|
|
|
|
|
<div class="text-center"> |
|
|
|
|
<v-tooltip bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<v-icon class="mx-2" small @click="addNewColumnRow(table, 'Number')" v-on="on"> |
|
|
|
|
{{ getIcon('Number') }} |
|
|
|
|
</v-icon> |
|
|
|
|
</template> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Add Number Column</span> |
|
|
|
|
</v-tooltip> |
|
|
|
|
|
|
|
|
|
<v-tooltip bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<v-icon class="mx-2" small @click="addNewColumnRow(table, 'SingleLineText')" v-on="on"> |
|
|
|
|
{{ getIcon('SingleLineText') }} |
|
|
|
|
</v-icon> |
|
|
|
|
</template> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Add SingleLineText Column</span> |
|
|
|
|
</v-tooltip> |
|
|
|
|
|
|
|
|
|
<v-tooltip bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<v-icon class="mx-2" small @click="addNewColumnRow(table, 'LongText')" v-on="on"> |
|
|
|
|
{{ getIcon('LongText') }} |
|
|
|
|
</v-icon> |
|
|
|
|
</template> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Add LongText Column</span> |
|
|
|
|
</v-tooltip> |
|
|
|
|
</template> |
|
|
|
|
<v-form ref="form" v-model="valid"> |
|
|
|
|
<p v-if="project.tables && quickImportType === 'excel'" class="caption grey--text mt-4"> |
|
|
|
|
{{ project.tables.length }} sheet{{ project.tables.length > 1 ? 's' : '' }} |
|
|
|
|
available for import |
|
|
|
|
</p> |
|
|
|
|
<a-collapse |
|
|
|
|
v-if="project.value?.tables && project.value?.tables.length" |
|
|
|
|
v-model:activeKey="expansionPanel" |
|
|
|
|
v-for="(table, i) in project.value?.tables" |
|
|
|
|
:key="i" |
|
|
|
|
> |
|
|
|
|
<template #expandIcon="{ isActive }"> |
|
|
|
|
<v-text-field |
|
|
|
|
v-if="editableTn[i]" |
|
|
|
|
:value="table.table_name" |
|
|
|
|
class="font-weight-bold" |
|
|
|
|
style="max-width: 300px" |
|
|
|
|
outlinedk |
|
|
|
|
autofocus |
|
|
|
|
density="compact" |
|
|
|
|
hide-details |
|
|
|
|
@input="(e) => onTableNameUpdate(table, e)" |
|
|
|
|
@click="(e) => e.stopPropagation()" |
|
|
|
|
@blur="$set(editableTn, i, false)" |
|
|
|
|
@keydown.enter="$set(editableTn, i, false)" |
|
|
|
|
/> |
|
|
|
|
<span v-else class="font-weight-bold"> |
|
|
|
|
<MdiTableIcon /> |
|
|
|
|
{{ table.table_name }} |
|
|
|
|
</span> |
|
|
|
|
<v-spacer /> |
|
|
|
|
<a-tooltip bottom> |
|
|
|
|
<template #title> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Delete Table</span> |
|
|
|
|
</template> |
|
|
|
|
<MdiDeleteIcon v-if="project.value.tables.length > 1" @click.stop="deleteTable(i)" /> |
|
|
|
|
</a-tooltip> |
|
|
|
|
</template> |
|
|
|
|
<a-collapse-panel> |
|
|
|
|
<a-table v-if="table.columns.length" :dataSource="table.columns" :columns="tableColumns" class="my-4"> |
|
|
|
|
<template #headerCell="{ column }"> |
|
|
|
|
<template v-if="column.key === 'column_name'"> |
|
|
|
|
<span> |
|
|
|
|
{{ $t('labels.columnName') }} |
|
|
|
|
</span> |
|
|
|
|
</template> |
|
|
|
|
<template v-else-if="column.key === 'column_type'"> |
|
|
|
|
<span> |
|
|
|
|
{{ $t('labels.columnType') }} |
|
|
|
|
</span> |
|
|
|
|
</template> |
|
|
|
|
</template> |
|
|
|
|
<template #bodyCell="{ column, record }"> |
|
|
|
|
<template v-if="column.key === 'column_name'"> |
|
|
|
|
<!-- TODO: make it editable --> |
|
|
|
|
<span> {{ record.column_name }} </span> |
|
|
|
|
</template> |
|
|
|
|
<template v-else-if="column.key === 'column_type'"> |
|
|
|
|
<!-- TODO: render uidt dropdown--> |
|
|
|
|
{{ record.uidt }} |
|
|
|
|
</template> |
|
|
|
|
</template> |
|
|
|
|
</a-table> |
|
|
|
|
|
|
|
|
|
<!-- <v-tooltip bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<v-icon |
|
|
|
|
class="mx-2" |
|
|
|
|
small |
|
|
|
|
@click="addNewColumnRow(table, 'LinkToAnotherRecord')" |
|
|
|
|
v-on="on" |
|
|
|
|
> |
|
|
|
|
{{ getIcon("LinkToAnotherRecord") }} |
|
|
|
|
</v-icon> |
|
|
|
|
</template> |
|
|
|
|
<span>Add LinkToAnotherRecord Column</span> |
|
|
|
|
</v-tooltip> |
|
|
|
|
<div v-if="!viewMode" class="text-center"> |
|
|
|
|
<a-tooltip bottom> |
|
|
|
|
<template #title> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Add Number Column</span> |
|
|
|
|
</template> |
|
|
|
|
<a-button @click="addNewColumnRow(table, 'Number')" :size="iconSize"> |
|
|
|
|
<template #icon> |
|
|
|
|
<MdiNumericIcon /> |
|
|
|
|
</template> |
|
|
|
|
</a-button> |
|
|
|
|
</a-tooltip> |
|
|
|
|
|
|
|
|
|
<v-tooltip bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<v-icon |
|
|
|
|
class="mx-2" |
|
|
|
|
small |
|
|
|
|
@click="addNewColumnRow(table, 'Lookup')" |
|
|
|
|
v-on="on" |
|
|
|
|
> |
|
|
|
|
{{ getIcon("Lookup") }} |
|
|
|
|
</v-icon> |
|
|
|
|
</template> |
|
|
|
|
<span>Add Lookup Column</span> |
|
|
|
|
</v-tooltip> |
|
|
|
|
<a-tooltip bottom> |
|
|
|
|
<template #title> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Add SingleLineText Column</span> |
|
|
|
|
</template> |
|
|
|
|
<a-button @click="addNewColumnRow(table, 'SingleLineText')" :size="iconSize"> |
|
|
|
|
<template #icon> |
|
|
|
|
<MdiStringIcon /> |
|
|
|
|
</template> |
|
|
|
|
</a-button> |
|
|
|
|
</a-tooltip> |
|
|
|
|
|
|
|
|
|
<v-tooltip bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<v-icon |
|
|
|
|
class="mx-2" |
|
|
|
|
small |
|
|
|
|
@click="addNewColumnRow(table, 'Rollup')" |
|
|
|
|
v-on="on" |
|
|
|
|
> |
|
|
|
|
{{ getIcon("Rollup") }} |
|
|
|
|
</v-icon> |
|
|
|
|
</template> |
|
|
|
|
<span>Add Rollup Column</span> |
|
|
|
|
</v-tooltip> --> |
|
|
|
|
<a-tooltip bottom> |
|
|
|
|
<template #title> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Add LongText Column</span> |
|
|
|
|
</template> |
|
|
|
|
<a-button @click="addNewColumnRow(table, 'LongText')" :size="iconSize"> |
|
|
|
|
<template #icon> |
|
|
|
|
<MdiLongTextIcon /> |
|
|
|
|
</template> |
|
|
|
|
</a-button> |
|
|
|
|
</a-tooltip> |
|
|
|
|
|
|
|
|
|
<v-tooltip bottom> |
|
|
|
|
<template #activator="{ on }"> |
|
|
|
|
<v-btn class="mx-2" small @click="addNewColumnRow(table)" v-on="on"> + column </v-btn> |
|
|
|
|
</template> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Add Other Column</span> |
|
|
|
|
</v-tooltip> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</v-expansion-panel-content> |
|
|
|
|
</v-expansion-panel> |
|
|
|
|
</v-expansion-panels> |
|
|
|
|
</v-card-text> |
|
|
|
|
</v-card> |
|
|
|
|
</v-col> |
|
|
|
|
</v-row> |
|
|
|
|
</v-form> |
|
|
|
|
</v-container> |
|
|
|
|
</div> |
|
|
|
|
<a-tooltip bottom> |
|
|
|
|
<template #title> |
|
|
|
|
<!-- TODO: i18n --> |
|
|
|
|
<span>Add Other Column</span> |
|
|
|
|
</template> |
|
|
|
|
<a-button @click="addNewColumnRow(table)" :size="iconSize"> |
|
|
|
|
<template #icon> |
|
|
|
|
<MdiPlusIcon /> |
|
|
|
|
</template> |
|
|
|
|
Column |
|
|
|
|
</a-button> |
|
|
|
|
</a-tooltip> |
|
|
|
|
</div> |
|
|
|
|
</a-collapse-panel> |
|
|
|
|
</a-collapse> |
|
|
|
|
</v-form> |
|
|
|
|
</a-card> |
|
|
|
|
</template> |
|
|
|
|
|
Wing-Kam Wong
2 years ago