add job historyVersion List (#686)

dlink-admin/src/main/java/com/dlink/controller/TaskVersionController.java

@@ -42,8 +42,14 @@ public class TaskVersionController {
         BeanUtil.copyProperties(versionProTableResult, versionHistoryDTOProTableResult);
         List<TaskVersionHistoryDTO> collect = versionProTableResult.getData().stream().map(t -> {
             TaskVersionHistoryDTO versionHistoryDTO = new TaskVersionHistoryDTO();
-            versionHistoryDTO.setVersionId(t.getVersionId());
             versionHistoryDTO.setId(t.getId());
+            versionHistoryDTO.setTaskId(t.getTaskId());
+            versionHistoryDTO.setName(t.getName());
+            versionHistoryDTO.setAlias(t.getAlias());
+            versionHistoryDTO.setDialect(t.getDialect());
+            versionHistoryDTO.setType(t.getType());
+            versionHistoryDTO.setStatement(t.getStatement());
+            versionHistoryDTO.setVersionId(t.getVersionId());
             versionHistoryDTO.setCreateTime(t.getCreateTime());
             return versionHistoryDTO;
         }).collect(Collectors.toList());

dlink-admin/src/main/java/com/dlink/dto/TaskVersionHistoryDTO.java

@@ -13,6 +13,12 @@ import java.util.Date;
 @Data
 public class TaskVersionHistoryDTO implements Serializable {
     private Integer id;
+    private Integer taskId;
+    private String name;
+    private String alias;
+    private String dialect;
+    private String type;
+    private String statement;
     private Integer versionId;
     private Date createTime;
 }

dlink-web/src/pages/DevOps/JobInfo/Version/index.tsx

+import ProTable, {ActionType, ProColumns} from "@ant-design/pro-table";
+import {TaskVersion} from "@/pages/DevOps/data";
+import React, {useRef, useState,} from "react";
+import {queryData} from "@/components/Common/crud";
+import {getIcon} from "@/components/Studio/icon";
+import {Button, Modal, Tag} from "antd";
+import {FullscreenOutlined} from "@ant-design/icons";
+import CodeShow from "@/components/Common/CodeShow";
+
+const url = '/api/task/version';
+const TaskVersionInfo = (props: any) => {
+  const {job} = props;
+  const actionRef = useRef<ActionType>();
+  const [row, setRow] = useState<TaskVersion>();
+  const [modalVisible, setModalVisible] = useState<boolean>(false);
+
+
+
+  const cancelHandle = () => {
+    setRow(undefined);
+    setModalVisible(false);
+  }
+
+  const handleShowStatement = (statement: string) =>{
+    return (
+      <div style={{width: "1100px"}}>
+        <Modal title="作业执行 SQL" visible={modalVisible} destroyOnClose={true} width={"60%"}
+         onCancel={()=>{
+           cancelHandle();
+         }}
+         footer={[
+           <Button key="back" onClick={() => {
+             cancelHandle();
+           }}>
+             关闭
+           </Button>,
+         ]}>
+          <CodeShow language={"sql"} code={statement} height={'600px'} />
+        </Modal>
+      </div>
+    )
+
+  }
+
+
+
+  const columns: ProColumns<TaskVersion>[] = [
+    {
+      title: '作业ID',
+      align: 'center',
+      dataIndex: 'taskId',
+      hideInSearch: true,
+    },
+    {
+      title: '作业名称',
+      align: 'center',
+      sorter: true,
+      dataIndex: 'name',
+    },
+    {
+      title: '作业别名',
+      align: 'center',
+      sorter: true,
+      dataIndex: 'alias',
+    },
+    {
+      title: '作业方言',
+      align: 'center',
+      render: (dom, entity) => {
+        return <>
+            {getIcon(entity.dialect) }
+            {
+            <Tag color="blue">
+              {entity.dialect}
+            </Tag>
+            }
+        </>;
+      },
+    },
+    {
+      title: '作业类型',
+      align: 'center',
+      render: (dom, entity) => {
+        return <>
+          {
+            <Tag color="blue">
+              {entity.type}
+            </Tag>
+          }
+        </>;
+      },
+    },
+    {
+      title: '版本号',
+      align: 'center',
+      sorter: true,
+      dataIndex: 'versionId',
+    },
+    {
+      title: '作业内容',
+      align: 'center',
+      ellipsis: true,
+      hideInSearch: true,
+      render: (dom, entity) => {
+        return <>
+          {<>
+            <a onClick={()=>{
+              setRow(entity)
+              setModalVisible(true);
+            }}>
+              <Tag color="green">
+                <FullscreenOutlined title={"查看作业详情"}  />
+              </Tag> 查看作业详情
+            </a>
+            {handleShowStatement(entity.statement)}
+          </>
+          }
+        </>
+        ;
+      },
+    },
+    {
+      title: '创建时间',
+      align: 'center',
+      sorter: true,
+      valueType: 'dateTime',
+      dataIndex: 'createTime',
+    },
+  ];
+
+  return (
+    <>
+      <ProTable<TaskVersion>
+        columns={columns}
+        style={{width: '100%'}}
+        request={(params, sorter, filter) => queryData(url, {taskId: job?.instance.taskId, ...params, sorter, filter})}
+        actionRef={actionRef}
+        rowKey="id"
+        pagination={{
+          pageSize: 15,
+        }}
+        bordered
+        search={false}
+        size="small"
+      />
+    </>
+  )
+};
+
+export default TaskVersionInfo;

dlink-web/src/pages/DevOps/JobInfo/index.tsx

@@ -19,6 +19,7 @@ import Alert from "@/pages/DevOps/JobInfo/Alert";
 import DataMap from "@/pages/DevOps/JobInfo/DataMap";
 import CheckPoints from "@/pages/DevOps/JobInfo/CheckPoints";
 import FlinkClusterInfo from "@/pages/DevOps/JobInfo/FlinkClusterInfo";
+import TaskVersionInfo from "@/pages/DevOps/JobInfo/Version";
 
 
 const {Link} = Typography;
@@ -265,7 +266,7 @@ const JobInfo = (props: any) => {
         {tabKey === 'flinksql' ? <FlinkSQL job={job}/> : undefined}
         {tabKey === 'datamap' ? <DataMap job={job}/> : undefined}
         {tabKey === 'olap' ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE}/> : undefined}
-        {tabKey === 'version' ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE}/> : undefined}
+        {tabKey === 'version' ? <TaskVersionInfo job={job} /> : undefined}
         {tabKey === 'alert' ? <Alert job={job}/> : undefined}
       </ProCard>
     </PageContainer>

dlink-web/src/pages/DevOps/data.d.ts

@@ -104,3 +104,18 @@ export type TaskContainerConfigInfo = {
   taskManagerStdout: string,
   taskManagerThreadDump: string,
 }
+
+
+
+export type TaskVersion = {
+  id: number,
+  taskId: number,
+  name: string,
+  alias: string,
+  dialect: string,
+  type: string,
+  versionId: number,
+  statement: string,
+  createTime: string,
+}
+