添加定时任务

src/app/api/timeTask/getTaskType/route.ts

@@ -0,0 +1,12 @@
+import {serverGet} from "@/utils/axiosServer";
+import {TaskTypeResponse} from "@/type/timeTask/type";
+import {NextResponse} from "next/server";
+import {R} from "@/utils/R"
+
+export const GET = async ()=>{
+  const res = await serverGet<any,TaskTypeResponse>("/timeTask/getAllTaskType");
+  if(res.code !== 200){
+    return NextResponse.json(R.error(res.msg));
+  }
+  return NextResponse.json(R.success(res.data));
+}

src/app/api/timeTask/route.ts

@@ -1,6 +1,13 @@
 import {NextRequest, NextResponse} from "next/server";
-import {serverGet, serverPost} from "@/utils/axiosServer";
-import {AreaType, ButtonType, ScheduleType, TaskScheduleReponse, TaskTypeResponse} from "@/type/timeTask/type";
+import {serverGet, serverPost, serverPut} from "@/utils/axiosServer";
+import {
+  AreaType,
+  ButtonType,
+  ScheduleType,
+  TaskForm,
+  TaskScheduleReponse,
+  TaskTypeResponse
+} from "@/type/timeTask/type";
 import {R} from "@/utils/R"
 export const GET =async (request:NextRequest)=>{
   const res = await serverGet<any,TaskScheduleReponse>("/timeTask/getAllTask")
@@ -44,7 +51,7 @@ export const GET =async (request:NextRequest)=>{
   return NextResponse.json(R.success(result))
 }
 
-export const POST = async (request:NextRequest)=>{
+export const PUT = async (request:NextRequest)=>{
   const req:AreaType[] = await request.json();
   for (let i = 0; i < req.length; i++) {
     const q = req[i];
@@ -55,9 +62,19 @@ export const POST = async (request:NextRequest)=>{
     });
   }
   const toServerList = req.flatMap(q=>q.buttons);
-  const res:any = await serverPost("/timeTask/updateAllModifySchedule",toServerList);
+  const res:any = await serverPut("/timeTask/updateAllModifySchedule",toServerList);
   if(res.code !== 200){
     return NextResponse.json(R.error(res.msg))
   }
   return NextResponse.json(new R(200,null,"更新定时任务成功"))
+}
+
+export const POST = async (request:NextRequest)=>{
+  const req:TaskForm = await request.json();
+  const res:any = await serverPost<TaskForm>('/timeTask/addTaskForXhSchedule',req);
+  console.log(res);
+  if(res.code !== 200){
+    return NextResponse.json(R.error(res.msg))
+  }
+  return NextResponse.json(new R(200,null,"添加定时任务成功"))
 }

src/app/timeTask/page.tsx

@@ -1,26 +1,58 @@
 'use client'
 
 import React, {useEffect, useState} from 'react'
-import {Button, Card, Row, Col, Modal, message} from 'antd'
+import {Button, Card, Row, Col, Modal, message, Form, Input, Select} from 'antd'
 import LadderShapedTab from "@/components/LadderShapedTab";
 import {usePathname} from "next/navigation";
-import {clientGet, clientPost} from "@/utils/axiosClient";
-import {AreaType, ButtonType, TaskScheduleClientReponse} from "@/type/timeTask/type";
+import {clientGet, clientPost, clientPut} from "@/utils/axiosClient";
+import {
+  AreaType,
+  ButtonType,
+  ScheduleType,
+  TaskForm,
+  TaskScheduleClientReponse,
+  TaskTypeResponse
+} from "@/type/timeTask/type";
 
 export default function page() {
   const [areas, setAreas] = useState<AreaType[]>([])
   const [open, setOpen] = useState(false);
+  const [addModalOpen, setAddModalOpen] = useState(false);
   const [confirmLoading, setConfirmLoading] = useState(false);
   const [modalText, setModalText] = useState('确定要同步这个定时任务控制？');
   const [menuCard, setMenuCard] = useState(false);
   const [cradPosition, setcradPosition] = useState({x: 0, y: 0});
-  const [processCard, setProcessCard] = useState<ButtonType|null>(null);
+  const [processCard, setProcessCard] = useState<ButtonType | null>(null);
+  const [allTaskType, setAllTaskType] = useState<ScheduleType[]>()
+  const [form] = Form.useForm<TaskForm>();
   const showModal = () => {
     setOpen(true);
     setModalText("确定要同步这个定时任务控制？");
     console.log(areas);
   };
-
+  const showAddModal = () => {
+    setAddModalOpen(true);
+  }
+  const handleAddModalOk = async () => {
+    try {
+      setConfirmLoading(true);
+      const values = await form.validateFields();
+      const res: any = await clientPost('/api/timeTask', values);
+      if (res.code !== 200) {
+        message.error(res.data);
+        return;
+      }
+      message.success(res.data);
+      setAddModalOpen(false);
+    } catch (error) {
+      // console.warn(error)
+    } finally {
+      setConfirmLoading(false);
+    }
+  };
+  const handleAddModalCancel = () => {
+    setAddModalOpen(false);
+  }
   const handleOk = async () => {
     setModalText('正在提交中请稍后');
     setConfirmLoading(true);
@@ -89,22 +121,22 @@ export default function page() {
   };
 
   const updateTask = async () => {
-    const res: any = await clientPost<AreaType[]>('/api/timeTask', areas)
+    const res: any = await clientPut<AreaType[]>('/api/timeTask', areas)
     if (res.code !== 200) {
       message.error(res.message)
     }
     message.success(res.message)
   }
 
-  const handleClick = (button: ButtonType)=> (e: React.MouseEvent)=>{
+  const handleClick = (button: ButtonType) => (e: React.MouseEvent) => {
     e.preventDefault()
     e.stopPropagation();
     setMenuCard(!menuCard)
-    setcradPosition({x:e.clientX,y:e.clientY});
+    setcradPosition({x: e.clientX, y: e.clientY});
     setProcessCard(button);
   }
 
-  const disAbledOrAbledButton = (button: ButtonType|null)=> {
+  const disAbledOrAbledButton = (button: ButtonType | null) => {
     try {
       if (!!button) {
         if (button.enabled === 1) {
@@ -119,18 +151,27 @@ export default function page() {
       setMenuCard(false);
     }
   }
+  const getAllTaskType = async () => {
+    const r = await clientGet<any, TaskTypeResponse>('/api/timeTask/getTaskType');
+    if (r.code !== 200) {
+      message.error(r.msg);
+    } else {
+      setAllTaskType(r.data);
+    }
+  }
 
   useEffect(() => {
     getAllTask()
+    getAllTaskType()
   }, []);
 
   return (
-    <Row gutter={[16, 16]} style={{margin:0}}>
+    <Row gutter={[16, 16]} style={{margin: 0}}>
       <Col span={24}>
         <LadderShapedTab currentTab={usePathname()}/>
       </Col>
       <Col span={24}>
-        <Button type={'primary'} onClick={showModal}>点我同步所有的任务</Button>
+        <Button type={'primary'} onClick={showModal}>保存修改</Button>
         <Modal
           title="提交定时任务控制"
           open={open}
@@ -142,11 +183,46 @@ export default function page() {
         >
           <p>{modalText}</p>
         </Modal>
+        <Button type={'default'} onClick={showAddModal}>添加定时任务</Button>
+        <Modal
+          title="添加定时任务"
+          open={addModalOpen}
+          onOk={handleAddModalOk}
+          confirmLoading={confirmLoading}
+          onCancel={handleAddModalCancel}
+          cancelText={'取消'}
+          okText={'确定'}
+        >
+          <Form form={form} labelCol={{span: 4}} wrapperCol={{span: 20}}>
+            <Form.Item label="任务名称" name="taskName" rules={[{required: true, message: '请输入任务名称'}]}>
+              <Input/>
+            </Form.Item>
+            <Form.Item label="服务名称" name="serviceName" rules={[{required: true, message: '请输入服务名称'}]}>
+              <Input/>
+            </Form.Item>
+            <Form.Item label="执行类型" name="scheduleType" rules={[{required: true, message: '请输入执行类型'}]}>
+              <Select options={allTaskType?.map(q => {
+                return {
+                  label: generateSchedule(q.scheduleType),
+                  value: q.scheduleType
+                }
+              })} onChange={(v: string) => {
+                form.setFieldValue('cronExpression',
+                    allTaskType?.filter(item => item.scheduleType === v)
+                      .map(item => item.cornExpress).join()
+                  )
+              }}/>
+            </Form.Item>
+            <Form.Item label="corn表达式" name="cronExpression" rules={[{required: true, message: '请输入corn表达式'}]}>
+              <Input disabled={true}/>
+            </Form.Item>
+          </Form>
+        </Modal>
       </Col>
       {areas.map(area => (
-        <Col xs={24} sm={12} md={8} lg={6} key={area.id} >
+        <Col xs={24} sm={12} md={8} lg={6} key={area.id}>
           <Card
-            onClick={(e)=>{
+            onClick={(e) => {
               setMenuCard(false)
             }}
             title={generateSchedule(area.title)}
@@ -164,7 +240,8 @@ export default function page() {
                   onDrop={(e) => onDrop(e, area.id, index)}
                   style={{marginBottom: '8px'}}
                 >
-                  <Button onClick={handleClick(button)} type={button.enabled===0?'primary':'default'} danger={button.enabled===0}>{button.taskName}</Button>
+                  <Button onClick={handleClick(button)} type={button.enabled === 0 ? 'primary' : 'default'}
+                          danger={button.enabled === 0}>{button.taskName}</Button>
                 </div>
               ))}
             </div>
@@ -173,12 +250,12 @@ export default function page() {
       ))}
       {menuCard &&
           <Button
-          style={{position:"fixed",left:cradPosition.x,top:cradPosition.y}}
-          type={'primary'}
-          danger={processCard?.enabled===1}
-          onClick={()=>disAbledOrAbledButton(processCard)}>
-          {processCard?.enabled===1?'禁用':'启用'}
-        </Button>
+              style={{position: "fixed", left: cradPosition.x, top: cradPosition.y}}
+              type={'primary'}
+              danger={processCard?.enabled === 1}
+              onClick={() => disAbledOrAbledButton(processCard)}>
+            {processCard?.enabled === 1 ? '禁用' : '启用'}
+          </Button>
       }
     </Row>
   )

src/type/timeTask/type.ts

@@ -7,6 +7,13 @@ export type AreaType = {
   buttons: ButtonType[]
 }
 
+export interface TaskForm{
+  taskName: string
+  serviceName: string
+  cronExpression: string
+  scheduleType: string
+}
+
 export type ButtonType = {
   id: number;
   taskName: string;