setup()

in seatunnel-ui/src/views/task/synchronization-instance/sync-task.tsx [66:248]


  setup(props) {
    let logTimer: number
    const { t } = useI18n()
    const {
      variables,
      getTableData,
      batchBtnListClick,
      creatInstanceButtons,
      createColumns,
      onReset
    } = useSyncTask(props.syncTaskType)
    const route = useRoute()
    const router = useRouter()

    const tableColumn = ref([]) as any
    const requestData = () => {
      getTableData({
        pageNo: variables.page,
        pageSize: variables.pageSize,
        taskName: variables.taskName,
        executorName: variables.executeUser,
        host: variables.host,
        stateType: variables.stateType,
        startDate: variables.datePickerRange
          ? variables.datePickerRange[0]
          : '',
        endDate: variables.datePickerRange ? variables.datePickerRange[1] : '',
        syncTaskType: variables.syncTaskType
      })
    }
    const rangeShortCuts = reactive({
      rangeOption: {}
    })
    rangeShortCuts.rangeOption = getRangeShortCuts(t)

    const onUpdatePageSize = () => {
      variables.page = 1
      requestData()
    }

    const getLogs = (row: any) => {
      const { state } = useAsyncState(
        queryLog({
          taskInstanceId: Number(row.id),
          limit: variables.limit,
          skipLineNum: variables.skipLineNum
        }).then((res: LogRes) => {
          if (res.log) {
            variables.logRef += res.log
          }
          if (res.hasNext) {
            variables.limit += 1000
            variables.skipLineNum += 1000
            clearTimeout(logTimer)
            logTimer = setTimeout(() => {
              getLogs(row)
            }, 2000)
          } else {
            variables.logLoadingRef = false
          }
        }),
        {}
      )

      return state
    }

    const refreshLogs = (row: any) => {
      variables.logRef = ''
      variables.limit = 1000
      variables.skipLineNum = 0
      getLogs(row)
    }

    const handleSearch = () => {
      variables.page = 1

      const query = {} as any
      if (variables.taskName) {
        query.taskName = variables.taskName
      }

      if (variables.executeUser) {
        query.executeUser = variables.executeUser
      }

      if (variables.host) {
        query.host = variables.host
      }

      if (variables.stateType) {
        query.stateType = variables.stateType
      }

      if (variables.datePickerRange) {
        query.startDate = variables.datePickerRange[0]
        query.endDate = variables.datePickerRange[1]
      }

      router.replace({
        query: !_.isEmpty(query)
          ? {
            ...route.query,
            ...query,
            syncTaskType: props.syncTaskType,
            }
          : {
              ...route.query,
              syncTaskType: props.syncTaskType,
            }
      })
      requestData()
    }

    const handleKeyup = (event: KeyboardEvent) => {
      if (event.key === 'Enter') {
        handleSearch()
      }
    }

    const initSearch = () => {
      const { startDate, endDate } = route.query
      if (startDate && endDate) {
        variables.datePickerRange = [startDate as string, endDate as string]
      }
      variables.taskName = (route.query.taskName as string) || ''
      variables.executeUser = (route.query.executeUser as string) || ''
      variables.host = (route.query.host as string) || ''
      variables.stateType = (route.query.stateType as string) || null
    }

    onMounted(() => {
      initSearch()
      createColumns(variables)
      creatInstanceButtons(variables)
      requestData()
    })

    onUnmounted(() => {
      clearTimeout(logTimer)
    })

    watch(useI18n().locale, () => {
      createColumns(variables)
      creatInstanceButtons(variables)
      rangeShortCuts.rangeOption = getRangeShortCuts(t)
    })

    watch(
      () => variables.showModalRef,
      () => {
        if (variables.showModalRef) {
          getLogs(variables.row)
        } else {
          variables.row = {}
          variables.logRef = ''
          variables.logLoadingRef = true
          variables.skipLineNum = 0
          variables.limit = 1000
          clearTimeout(logTimer)
        }
      }
    )

    const handleChangeColumn = (options: any) => {
      tableColumn.value = options
    }

    return {
      t,
      ...toRefs(variables),
      requestData,
      onUpdatePageSize,
      refreshLogs,
      handleSearch,
      onReset,
      handleKeyup,
      handleChangeColumn,
      batchBtnListClick,
      tableColumn,
      rangeShortCuts
    }
  },