setup()

in seatunnel-ui/src/views/task/synchronization-definition/dag/node-model.tsx [59:139]


  setup(props, { expose }) {
    const { t } = useI18n()
    const { state, onInit, onSwitchTable, onUpdatedCheckedRowKeys } =
      useNodeModel(props.type, props.transformType, props.predecessorsNodeId, props.schemaError, props.currentNodeId, props.refForm)

    expose({
      getOutputSchema: () => ({
        allTableData: state.allTableData,
        outputTableData: state.outputTableData,
        inputTableData: state.inputTableData
      }),
      getSelectFields: () => ({
        tableFields: state.selectedKeys,
        all: state.selectedKeys.length === state.inputTableData.length
      }),
      setSelectFields: (selectedKeys: string[]) =>
        (state.selectedKeys = selectedKeys),
      initData: (info: any) => {
        onInit(info)
      }
    })

    return () => (
      <NGrid xGap={6}>
        <NGridItem
          span={6}
          class={styles['list-container']}
        >
          <NSpace vertical>
            <h3>{t('project.synchronization_definition.table_name')}</h3>
            <dl v-show={state.tables.length}>
              {state.tables.map((table) => (
                <dd
                  class={
                    table === state.currentTable ? styles['dd-active'] : ''
                  }
                  onClick={() => void onSwitchTable(table)}
                >
                  <NEllipsis>{table}</NEllipsis>
                </dd>
              ))}
            </dl>
            {state.tables.length === 0 && <NEmpty />}
          </NSpace>
        </NGridItem>
        <NGridItem span={props.type === 'sink' ? 18 : 9}>
          <NSpace vertical>
            <h3>
              {t('project.synchronization_definition.input_table_structure')}
            </h3>
            <NDataTable
              size='small'
              row-class-name={styles['adjust-th-height']}
              columns={state.inputColumns}
              data={state.inputTableData}
              onUpdateCheckedRowKeys={onUpdatedCheckedRowKeys}
              rowKey={(row) => row.name}
              checkedRowKeys={state.selectedKeys}
              scrollX={state.inputTableWidth}
            />
          </NSpace>
        </NGridItem>
        {
          props.type !== 'sink' && <NGridItem span={9}>
            <NSpace vertical>
              <h3>
                {t('project.synchronization_definition.output_table_structure')}
              </h3>
              <NDataTable
                size='small'
                row-class-name={styles['adjust-th-height']}
                columns={state.outputColumns}
                data={state.outputTableData}
                scrollX={state.outputTableWidth}
              />
            </NSpace>
          </NGridItem>
        }
      </NGrid>
    )
  }