feat: 添加同步配置表单

src/module/datasource/component/DatasourceSyncView.jsx

@@ -0,0 +1,102 @@
+import { Table, Space, Switch, message } from "antd"
+import { useEffect, useState } from "react"
+import { getJobList, updateJobList } from '../services'
+
+export default function DatasourceSyncView() {
+  // 初始化同步配置任务列表
+  const [jobList, setJobList] = useState([])
+  // 任务列表完整数据
+  const [jobData, setJobData] = useState([])
+
+  // 开关加载状态
+  const [switchLoading, setSwitchLoading] = useState(false)
+
+  // 表格Loading状态
+  const [dataLoading, setDataLoading] = useState(false)
+
+  // 请求任务列表数据
+  const fetchJobList= async () => {
+    setDataLoading(true)
+    const { data } = await getJobList()
+    if (data.code === 200) {
+      const list = data.data.items.map(item => {
+        return {
+          key: item.id,
+          id: item.id,
+          job_cron: item.job_cron,
+          jsb_desc: item.job_desc,
+          trigger_status: item.trigger_status,
+        }
+      })
+      setJobList(list)
+      setJobData(data.data.items)
+    }
+    setDataLoading(false)
+  }
+
+  useEffect(() => {
+    fetchJobList()
+  }, [])
+  
+  const columns = [
+    {
+      title: '任务ID',
+      dataIndex: 'id',
+      key: 'id'
+    },
+    {
+      title: '任务描述',
+      dataIndex: 'jsb_desc',
+      key: 'jsb_desc',
+    },
+    {
+      title: '频次',
+      dataIndex: 'job_cron',
+      key: 'job_cron',
+    },
+    {
+      title: '状态',
+      key: 'trigger_status',
+      render: (_, record) => (
+        <Space>
+          <Switch
+            checkedChildren="开"
+            unCheckedChildren="关"
+            checked={record.trigger_status === 1}
+            loading={switchLoading}
+            onClick={async () => {
+              setSwitchLoading(true)
+              const switch_data = jobData.find(item => item.id === record.key)
+              const request_body = {
+                job_cron: switch_data.job_cron,
+                job_desc: switch_data.job_desc,
+                executor_route_strategy: switch_data.executor_route_strategy,
+                executor_handler: switch_data.executor_handler,
+                executor_param: switch_data.executor_param,
+                executor_block_strategy: switch_data.executor_block_strategy,
+                executor_timeout: switch_data.executor_timeout,
+                executor_fail_retry_count: switch_data.executor_fail_retry_count,
+                inc_start_time: switch_data.inc_start_time,
+                job_json: switch_data.job_json,
+                trigger_status: switch_data.trigger_status === 1 ? 0 : 1
+              }
+              const { data } = await updateJobList(record.key, request_body)
+              if (data.code === 200) {
+                message.success(record.trigger_status === 1 ? '关闭成功' : '开启成功')
+                fetchJobList()
+              } else {
+                message.error(record.trigger_status === 1 ? '关闭失败' : '开启失败')
+              }
+              setSwitchLoading(false)
+            }}
+          />
+        </Space>
+      )
+    },
+  ]
+  return (
+    <>
+    <Table columns={columns} dataSource={jobList} bordered loading={dataLoading}></Table>
+    </>
+  )
+}

src/module/datasource/page/DatasourceView.jsx

@@ -1,7 +1,7 @@
 import { Tabs, Button } from 'antd'
 import DataSourceManage from '../component/DatasourceManage.jsx'
 import DatasourceAdd from '../component/DatasourceAdd'
-
+import DatasourceSyncView from '../component/DatasourceSyncView'
 import React, { useState } from 'react'
 const { TabPane } = Tabs
 
@@ -15,26 +15,26 @@ export default function DatasourceView() {
   // 当前所处页面
   const [currentKey, setCurrentKey] = useState('1')
   // Tab标签右边按钮
-  /* const tabExtraBtn = () => {
+  const tabExtraBtn = () => {
     switch (currentKey) {
       case '1':
         return <DatasourceAdd updateDataSource={updateDataSource}/>
       case '2':
-        return <DatasourceAdd updateDataSource={updateDataSource}/>
+        return <Button type='primary'>添加同步任务</Button>
       default:
-        return null
+        return <></>
     }
-  } */
+  }
   // const syncAddBtn = <Button></Button>
   return (
     <>
       {/* Tab栏及内容 */}
-      <Tabs type="card" tabBarExtraContent={<DatasourceAdd updateDataSource={updateDataSource}/>} onChange={key => setCurrentKey(key)}>
+      <Tabs type="card" tabBarExtraContent={tabExtraBtn()} onChange={key => setCurrentKey(key)}>
         <TabPane tab="数据源管理" key="1">
           <DataSourceManage onRef={sourceRef} />
         </TabPane>
         <TabPane tab="同步配置" key="2">
-          Content of Tab Pane 2
+          <DatasourceSyncView />
         </TabPane>
         <TabPane tab="日志管理" key="3">
           Content of Tab Pane 3

src/module/datasource/services/index.js

@@ -25,4 +25,16 @@ export const createDataSource  = params => request({
   url: `/jpt/datasource/`,
   method: 'post',
   data: {...params}
+})
+
+export const getJobList = params => request({
+  url: 'jpt/jobinfo/',
+  method: 'get',
+  params
+})
+
+export const updateJobList = (id, params) => request({
+  url: 'jpt/jobinfo/' + id,
+  method: 'put',
+  data: {...params}
 })