[Feature][UI Next] Add project task instance. (#8220)

dolphinscheduler-ui-next/package.json

@@ -17,7 +17,7 @@
     "echarts": "^5.2.2",
     "lodash": "^4.17.21",
     "monaco-editor": "^0.31.1",
-    "naive-ui": "2.23.2",
+    "naive-ui": "2.24.6",
     "nprogress": "^0.2.0",
     "pinia": "^2.0.9",
     "pinia-plugin-persistedstate": "^1.0.3",

dolphinscheduler-ui-next/src/locales/modules/en_US.ts

@@ -337,6 +337,38 @@ const project = {
     workflow_publish_status: 'Workflow Publish Status',
     schedule_publish_status: 'Schedule Publish Status'
   },
+  task: {
+    task_name: 'Task Name',
+    workflow_instance: 'Workflow Instance',
+    executor: 'Executor',
+    node_type: 'Node Type',
+    state: 'State',
+    submit_time: 'Submit Time',
+    start_time: 'Start Time',
+    end_time: 'End Time',
+    duration: 'Duration',
+    retry_count: 'Retry Count',
+    dry_run_flag: 'Dry Run Flag',
+    host: 'Host',
+    operation: 'Operation',
+    submitted_success: 'Submitted Success',
+    running_execution: 'Running Execution',
+    ready_pause: 'Ready Pause',
+    pause: 'Pause',
+    ready_stop: 'Ready Stop',
+    stop: 'Stop',
+    failure: 'Failure',
+    success: 'Success',
+    need_fault_tolerance: 'Need Fault Tolerance',
+    kill: 'Kill',
+    waiting_thread: 'Waiting Thread',
+    waiting_depend: 'Waiting Depend',
+    delay_execution: 'Delay Execution',
+    forced_success: 'Forced Success',
+    serial_wait: 'Serial Wait',
+    view_log: 'View Log',
+    download_log: 'Download Log'
+  },
   dag: {
     createWorkflow: 'Create Workflow',
     search: 'Search',

dolphinscheduler-ui-next/src/locales/modules/zh_CN.ts

@@ -336,6 +336,38 @@ const project = {
     workflow_publish_status: '工作流上线状态',
     schedule_publish_status: '定时状态'
   },
+  task: {
+    task_name: '任务名称',
+    workflow_instance: '工作流实例',
+    executor: '执行用户',
+    node_type: '节点类型',
+    state: '状态',
+    submit_time: '提交时间',
+    start_time: '开始时间',
+    end_time: '结束时间',
+    duration: '运行时间',
+    retry_count: '重试次数',
+    dry_run_flag: '空跑标识',
+    host: '主机',
+    operation: '操作',
+    submitted_success: '提交成功',
+    running_execution: '正在运行',
+    ready_pause: '准备暂停',
+    pause: '暂停',
+    ready_stop: '准备停止',
+    stop: '停止',
+    failure: '失败',
+    success: '成功',
+    need_fault_tolerance: '需要容错',
+    kill: '已被杀',
+    waiting_thread: '等待线程',
+    waiting_depend: '等待依赖完成',
+    delay_execution: '延时执行',
+    forced_success: '强制成功',
+    serial_wait: '串行等待',
+    view_log: '查看日志',
+    download_log: '下载日志'
+  },
   dag: {
     createWorkflow: '创建工作流',
     search: '搜索',

dolphinscheduler-ui-next/src/service/modules/task-instances/index.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { axios } from '@/service/service'
+import { axios, downloadFile } from '@/service/service'
 import { ProjectCodeReq, IdReq, TaskListReq } from './types'
 
 export function queryTaskListPaging(
@@ -23,15 +23,19 @@ export function queryTaskListPaging(
   projectCode: ProjectCodeReq
 ): any {
   return axios({
-    url: `/projects/${projectCode}/task-instances`,
+    url: `/projects/${projectCode.projectCode}/task-instances`,
     method: 'get',
     params
   })
 }
 
-export function forceSuccess(id: IdReq, projectCode: ProjectCodeReq): any {
+export function forceSuccess(taskId: IdReq, projectCode: ProjectCodeReq): any {
   return axios({
-    url: `/projects/${projectCode}/task-instances/${id}/force-success`,
+    url: `/projects/${projectCode.projectCode}/task-instances/${taskId.id}/force-success`,
     method: 'post'
   })
 }
+
+export function downloadLog(id: number): void {
+  downloadFile(`log/download-log`, { taskInstanceId: id })
+}

dolphinscheduler-ui-next/src/service/modules/task-instances/types.ts

@@ -37,4 +37,89 @@ interface TaskListReq {
   taskName?: string
 }
 
-export { ProjectCodeReq, IdReq, TaskListReq }
+interface Dependency {
+  localParams?: any
+  varPool?: any
+  dependTaskList?: any
+  relation?: any
+  resourceFilesList: any[]
+  varPoolMap?: any
+  localParametersMap?: any
+}
+
+interface SwitchDependency extends Dependency {
+  nextNode?: any
+  resultConditionLocation: number
+  dependTaskList?: any
+}
+
+interface TotalList {
+  taskComplete: boolean
+  firstRun: boolean
+  environmentCode: number
+  processInstance?: any
+  pid: number
+  appLink: string
+  taskCode: any
+  switchTask: boolean
+  host: string
+  id: number
+  state: string
+  workerGroup: string
+  conditionsTask: boolean
+  processInstancePriority?: any
+  processInstanceId: number
+  dependency: Dependency
+  alertFlag: string
+  dependentResult?: any
+  executePath: string
+  switchDependency: SwitchDependency
+  maxRetryTimes: number
+  executorName: string
+  subProcess: boolean
+  submitTime: string
+  taskGroupId: number
+  name: string
+  taskDefinitionVersion: number
+  processInstanceName: string
+  taskGroupPriority: number
+  taskDefine?: any
+  dryRun: number
+  flag: string
+  taskParams: string
+  duration: string
+  processDefine?: any
+  taskType: string
+  taskInstancePriority: string
+  logPath: string
+  startTime: string
+  environmentConfig?: any
+  executorId: number
+  firstSubmitTime: string
+  resources?: any
+  retryTimes: number
+  varPool: string
+  dependTask: boolean
+  delayTime: number
+  retryInterval: number
+  endTime: string
+}
+
+interface TaskInstancesRes {
+  totalList: TotalList[]
+  total: number
+  totalPage: number
+  pageSize: number
+  currentPage: number
+  start: number
+}
+
+export {
+  ProjectCodeReq,
+  IdReq,
+  TaskListReq,
+  Dependency,
+  SwitchDependency,
+  TotalList,
+  TaskInstancesRes
+}

dolphinscheduler-ui-next/src/views/projects/task/instance/components/log-modal.tsx

+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { defineComponent, onMounted, PropType, toRefs, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { NLog } from 'naive-ui'
+import { useModal } from './use-modal'
+import Modal from '@/components/modal'
+
+const props = {
+  showModalRef: {
+    type: Boolean as PropType<boolean>,
+    default: false
+  },
+  row: {
+    type: Object as PropType<any>,
+    default: {}
+  }
+}
+
+const LogModal = defineComponent({
+  name: 'LogModal',
+  props,
+  emits: ['confirmModal'],
+  setup(props, ctx) {
+    const { t } = useI18n()
+    const { variables, getLogs } = useModal()
+
+    const confirmModal = () => {
+      ctx.emit('confirmModal', props.showModalRef)
+    }
+
+    watch(
+      () => props.showModalRef,
+      () => {
+        if (props.showModalRef) {
+          variables.id = props.row.id
+          props.showModalRef && variables.id && getLogs()
+        } else {
+          variables.id = ''
+          variables.logRef = ''
+          variables.loadingRef = true
+          variables.skipLineNum = 0
+          variables.limit = 1000
+        }
+      }
+    )
+
+    return { t, ...toRefs(variables), confirmModal }
+  },
+  render() {
+    const { t } = this
+
+    return (
+      <Modal
+        title={t('project.task.view_log')}
+        show={this.showModalRef}
+        cancelShow={false}
+        onConfirm={this.confirmModal}
+        style={{ width: '60%' }}
+      >
+        <NLog rows={30} log={this.logRef} loading={this.loadingRef} />
+      </Modal>
+    )
+  }
+})
+
+export default LogModal

dolphinscheduler-ui-next/src/views/projects/task/instance/components/use-modal.ts

+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { reactive, ref } from 'vue'
+import { useAsyncState } from '@vueuse/core'
+import { queryLog } from '@/service/modules/log'
+
+export function useModal() {
+  const variables = reactive({
+    id: ref(''),
+    loadingRef: ref(true),
+    logRef: ref(''),
+    skipLineNum: ref(0),
+    limit: ref(1000)
+  })
+
+  const getLogs = () => {
+    const { state } = useAsyncState(
+      queryLog({
+        taskInstanceId: Number(variables.id),
+        limit: variables.limit,
+        skipLineNum: variables.skipLineNum
+      }).then((res: string) => {
+        variables.logRef += res
+
+        if (res) {
+          variables.limit += 1000
+          variables.skipLineNum += 1000
+          getLogs()
+        } else {
+          variables.loadingRef = false
+        }
+      }),
+      {}
+    )
+
+    return state
+  }
+
+  return {
+    variables,
+    getLogs
+  }
+}

dolphinscheduler-ui-next/src/views/projects/task/instance/index.module.scss

+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+.table-card {
+  margin-top: 8px;
+
+  .pagination {
+    margin-top: 20px;
+    display: flex;
+    justify-content: center;
+  }
+}