in seatunnel-ui/src/views/virtual-tables/list/index.tsx [39:117]
setup() {
const { t } = useI18n()
const router = useRouter()
const { state: sourceState } = useSource(true)
const { columns } = useColumns(
(id: string, type: 'edit' | 'delete') => {
if (type === 'edit') {
router.push({ name: 'virtual-tables-editor', params: { id: id } })
} else {
onDelete(id)
}
}
)
const {
state,
onSearch,
onDelete,
onPageChange,
onPageSizeChange
} = useTable()
return () => (
<NSpace vertical>
<NCard title={t('virtual_tables.virtual_tables')}>
{{
'header-extra': () => <NSpace>
<NSelect
v-model:value={state.params.pluginName}
clearable
placeholder={t('virtual_tables.source_type_tips')}
options={
sourceState.types as Array<SelectGroupOption | SelectOption>
}
class={styles['type-width']}
/>
<NInput
v-model:value={state.params.datasourceName}
clearable
placeholder={t('virtual_tables.source_name_tips')}
/>
<NButton type='primary' onClick={onSearch}>
{t('virtual_tables.search')}
</NButton>
<NButton
onClick={() => {
router.push({ name: 'virtual-tables-create' })
}}
type='success'
>
{t('virtual_tables.create')}
</NButton>
</NSpace>
}}
</NCard>
<NCard>
<NSpace vertical>
<NDataTable
columns={columns.value}
data={state.list}
loading={state.loading}
striped
/>
<NSpace justify='center'>
<NPagination
v-model:page={state.page}
v-model:page-size={state.pageSize}
item-count={state.itemCount}
show-size-picker
page-sizes={[10, 30, 50]}
show-quick-jumper
on-update:page={onPageChange}
on-update:page-size={onPageSizeChange}
/>
</NSpace>
</NSpace>
</NCard>
</NSpace>
)
}