in seatunnel-ui/src/views/virtual-tables/step-two-table.tsx [194:324]
setup(props) {
const { t } = useI18n()
const listRef = toRef(props, 'list')
return () => (
<NTable striped class={styles['step-two-table']}>
<thead>
<th>
<NText type='error'>*</NText>
{t('virtual_tables.field_name')}
</th>
<th class={styles['table-cell-center']}>
<NText type='error'>*</NText>
{t('virtual_tables.field_type')}
</th>
<th class={styles['table-cell-center']}>
<NText type='error'>*</NText>
{t('virtual_tables.is_null')}
</th>
<th class={styles['table-cell-center']}>
<NText type='error'>*</NText>
{t('virtual_tables.is_primary_key')}
</th>
<th>{t('virtual_tables.description')}</th>
<th>{t('virtual_tables.default_value')}</th>
{!props.plain && <th>{t('virtual_tables.operation')}</th>}
</thead>
<tbody>
{listRef.value.map((row, index) =>
row.isEdit && !props.plain ? (
<EditRow
key={row.key}
row={row}
plain={props.plain}
fieldTypes={props.fieldTypes}
onUpdateValue={(
field: keyof any,
value: any
) => {
// @ts-ignore
listRef.value[index][field] = value
}}
class={styles[row.isEdit ? 'edit-row' : 'plain-row']}
/>
) : (
<tr>
<td>
<span>{row.fieldName}</span>
</td>
<td class={styles['table-cell-center']}>
<span>{row.fieldType}</span>
</td>
<td class={styles['table-cell-center']}>
<span>
{row.nullable
? t('virtual_tables.yes')
: t('virtual_tables.no')}
</span>
</td>
<td class={styles['table-cell-center']}>
<span>
{row.primaryKey
? t('virtual_tables.yes')
: t('virtual_tables.no')}
</span>
</td>
<td>
<span>{row.fieldComment}</span>
</td>
<td>
<span>{row.defaultValue}</span>
</td>
{!props.plain && (
<td>
<NSpace align='start'>
<NTooltip>
{{
trigger: () => (
<NButton
type='primary'
circle
size='small'
onClick={() => {
listRef.value[index]['isEdit'] = true
}}
>
<NIcon>
<EditOutlined />
</NIcon>
</NButton>
),
default: () => t('virtual_tables.edit')
}}
</NTooltip>
<NTooltip>
{{
trigger: () => (
<NPopconfirm
onPositiveClick={() => {
listRef.value.splice(index, 1)
}}
>
{{
trigger: () => (
<NButton type='error' circle size='small'>
<NIcon>
<DeleteOutlined />
</NIcon>
</NButton>
),
default: () => t('virtual_tables.delete_confirm')
}}
</NPopconfirm>
),
default: () => t('virtual_tables.delete')
}}
</NTooltip>
</NSpace>
</td>
)}
</tr>
)
)}
<tr v-show={!listRef.value.length}>
<td colspan={6}>
<NEmpty />
</td>
</tr>
</tbody>
</NTable>
)
}