@ -1,27 +1,40 @@
< script lang = "ts" setup >
import type { LinkToAnotherRecordType } from 'nocodb-sdk'
import { UITypes } from 'nocodb-sdk'
import { RelationTypes , UITypes } from 'nocodb-sdk'
import {
ActiveViewInj ,
ColumnInj ,
IsLockedInj ,
MetaInj ,
Modal ,
ReloadViewDataHookInj ,
SmartsheetStoreEvents ,
defineEmits ,
defineProps ,
extractSdkResponseErrorMsg ,
getUniqueColumnName ,
inject ,
message ,
useI18n ,
useMetas ,
useNuxtApp ,
useSmartsheetStoreOrThrow ,
} from '#imports'
const { virtual = false } = defineProps < { virtual ? : boolean } > ( )
const emit = defineEmits ( [ 'edit' ] )
const emit = defineEmits ( [ 'edit' , 'addColumn' ] )
const { eventBus } = useSmartsheetStoreOrThrow ( )
const column = inject ( ColumnInj )
const reloadDataHook = inject ( ReloadViewDataHookInj )
const meta = inject ( MetaInj , ref ( ) )
const view = inject ( ActiveViewInj , ref ( ) )
const isLocked = inject ( IsLockedInj )
const { $api , $e } = useNuxtApp ( )
@ -49,7 +62,7 @@ const deleteColumn = () =>
}
$e ( 'a:column:delete' )
} catch ( e : any ) {
} catch ( e ) {
message . error ( await extractSdkResponseErrorMsg ( e ) )
}
} ,
@ -69,6 +82,131 @@ const setAsPrimaryValue = async () => {
message . error ( t ( 'msg.error.primaryColumnUpdateFailed' ) )
}
}
const sortByColumn = async ( direction : 'asc' | 'desc' ) => {
try {
$e ( 'a:sort:add' , { from : 'column-menu' } )
await $api . dbTableSort . create ( view . value ? . id as string , {
fk _column _id : column ! . value . id ,
direction ,
push _to _top : true ,
} )
eventBus . emit ( SmartsheetStoreEvents . SORT _RELOAD )
reloadDataHook ? . trigger ( )
} catch ( e ) {
message . error ( await extractSdkResponseErrorMsg ( e ) )
}
}
const duplicateColumn = async ( ) => {
let columnCreatePayload = { }
/ / g e n e r a t e d u p l i c a t e c o l u m n n a m e
const duplicateColumnName = getUniqueColumnName ( ` ${ column ! . value . title } _copy ` , meta ! . value ! . columns ! )
/ / c o n s t r u c t c o l u m n c r e a t e p a y l o a d
switch ( column . value . uidt ) {
case UITypes . LinkToAnotherRecord :
case UITypes . Lookup :
case UITypes . Rollup :
case UITypes . Formula :
return message . info ( 'Not available at the moment' )
case UITypes . SingleSelect :
case UITypes . MultiSelect :
columnCreatePayload = {
... column ! . value ! ,
title : duplicateColumnName ,
column _name : duplicateColumnName ,
id : undefined ,
order : undefined ,
colOptions : {
options :
column . value . colOptions ? . options ? . map ( ( option : Record < string , any > ) => ( {
... option ,
id : undefined ,
} ) ) ? ? [ ] ,
} ,
}
break
default :
columnCreatePayload = {
... column ! . value ! ,
... ( column ! . value . colOptions ? ? { } ) ,
title : duplicateColumnName ,
column _name : duplicateColumnName ,
id : undefined ,
colOptions : undefined ,
order : undefined ,
}
break
}
try {
const gridViewColumnList = await $api . dbViewColumn . list ( view . value ? . id as string )
const currentColumnIndex = gridViewColumnList . findIndex ( ( f ) => f . fk _column _id === column ! . value . id )
let newColumnOrder
if ( currentColumnIndex === gridViewColumnList . length - 1 ) {
newColumnOrder = gridViewColumnList [ currentColumnIndex ] . order + 1
} else {
newColumnOrder = ( gridViewColumnList [ currentColumnIndex ] . order ! + gridViewColumnList [ currentColumnIndex + 1 ] ? . order ) / 2
}
await $api . dbTableColumn . create ( meta ! . value ! . id ! , {
... columnCreatePayload ,
column _order : {
order : newColumnOrder ,
view _id : view . value ? . id as string ,
} ,
} )
await getMeta ( meta ! . value ! . id ! , true )
eventBus . emit ( SmartsheetStoreEvents . FIELD _RELOAD )
message . success ( t ( 'msg.success.columnDuplicated' ) )
} catch ( e ) {
message . error ( await extractSdkResponseErrorMsg ( e ) )
}
}
/ / a d d c o l u m n b e f o r e o r a f t e r c u r r e n t c o l u m n
const addColumn = async ( before = false ) => {
const gridViewColumnList = await $api . dbViewColumn . list ( view . value ? . id as string )
const currentColumnIndex = gridViewColumnList . findIndex ( ( f ) => f . fk _column _id === column ! . value . id )
let newColumnOrder
if ( before ) {
if ( currentColumnIndex === 0 ) {
newColumnOrder = gridViewColumnList [ currentColumnIndex ] . order / 2
} else {
newColumnOrder = ( gridViewColumnList [ currentColumnIndex ] . order ! + gridViewColumnList [ currentColumnIndex - 1 ] ? . order ) / 2
}
} else {
if ( currentColumnIndex === gridViewColumnList . length - 1 ) {
newColumnOrder = gridViewColumnList [ currentColumnIndex ] . order + 1
} else {
newColumnOrder = ( gridViewColumnList [ currentColumnIndex ] . order ! + gridViewColumnList [ currentColumnIndex + 1 ] ? . order ) / 2
}
}
emit ( 'addColumn' , {
column _order : {
order : newColumnOrder ,
view _id : view . value ? . id as string ,
} ,
} )
}
/ / h i d e t h e f i e l d i n v i e w
const hideField = async ( ) => {
const gridViewColumnList = await $api . dbViewColumn . list ( view . value ? . id as string )
const currentColumn = gridViewColumnList . find ( ( f ) => f . fk _column _id === column ! . value . id )
await $api . dbViewColumn . update ( view . value . id , currentColumn . id , { show : false } )
eventBus . emit ( SmartsheetStoreEvents . FIELD _RELOAD )
}
< / script >
< template >
@ -84,6 +222,53 @@ const setAsPrimaryValue = async () => {
{ { $t ( 'general.edit' ) } }
< / div >
< / a - m e n u - i t e m >
< template v-if ="column.uidt !== UITypes.LinkToAnotherRecord || column.colOptions.type !== RelationTypes.BELONGS_TO" >
< a -divider class = "!my-0" / >
< a -menu -item @click ="sortByColumn('asc')" >
< div class = "nc-column-insert-after nc-header-menu-item" >
< MdiSortAscending class = "text-primary" / >
Sort Ascending
< / div >
< / a - m e n u - i t e m >
< a -menu -item @click ="sortByColumn('desc')" >
< div class = "nc-column-insert-before nc-header-menu-item" >
< MdiSortDescending class = "text-primary" / >
Sort Descending
< / div >
< / a - m e n u - i t e m >
< / template >
< a -divider class = "!my-0" / >
< a -menu -item @click ="hideField" >
< div class = "nc-column-insert-before nc-header-menu-item" >
< MdiEyeOffOutline class = "text-primary" / >
Hide Field
< / div >
< / a - m e n u - i t e m >
< a -divider class = "!my-0" / >
< a -menu -item
v - if = "column.uidt !== UITypes.LinkToAnotherRecord && column.uidt !== UITypes.Lookup && !column.pk"
@ click = "duplicateColumn"
>
< div class = "nc-column-duplicate nc-header-menu-item" >
< MdiFileReplaceOutline class = "text-primary" / >
Duplicate
< / div >
< / a - m e n u - i t e m >
< a -menu -item @click ="addColumn()" >
< div class = "nc-column-insert-after nc-header-menu-item" >
< MdiTableColumnPlusAfter class = "text-primary" / >
Insert After
< / div >
< / a - m e n u - i t e m >
< a -menu -item @click ="addColumn(true)" >
< div class = "nc-column-insert-before nc-header-menu-item" >
< MdiTableColumnPlusBefore class = "text-primary" / >
Insert before
< / div >
< / a - m e n u - i t e m >
< a -divider class = "!my-0" / >
< a -menu -item v-if ="!virtual" @click="setAsPrimaryValue" >
< div class = "nc-column-set-primary nc-header-menu-item" >
Wing-Kam Wong
2 years ago
