feat:二维码下载

src/components/DiaryOption.tsx

@@ -16,9 +16,6 @@ import {OPERATION_BUTTON_TYPE} from "@/lib/task/project/data";
 const DiaryOption = (props: SelectDiary) => {
     // 抽屉 start
     const [open, setOpen] = useState(false);
-    const showDrawer = () => {
-        setOpen(true);
-    };
     const onClose = () => {
         setOpen(false);
     };
@@ -272,8 +269,7 @@ const DiaryOption = (props: SelectDiary) => {
             }
         },
     ]
-    const items: MenuProps['items'] = [
+    const items: MenuProps['items'] = [];
-    ];
     items.push(...commonItems)
     items.splice(1, 0, {
         label: '失效',
@@ -282,8 +278,7 @@ const DiaryOption = (props: SelectDiary) => {
             editEnableFlag("0")
         },
     })
-    const itemsEnable: MenuProps['items'] = [
+    const itemsEnable: MenuProps['items'] = [];
-    ];
     itemsEnable.push(...commonItems)
     itemsEnable.splice(1, 0, {
         label: '生效',
@@ -296,7 +291,7 @@ const DiaryOption = (props: SelectDiary) => {
 
     return (
         <Fragment>
-            <Button type="primary" onClick={showDrawer}>
+            <Button type={open?"primary":"default"} onClick={() => setOpen(!open)}>
                 日志心得
             </Button>
             <Drawer

src/components/SettingCron.tsx

@@ -0,0 +1,270 @@
+import React, {useState, useEffect, Fragment} from 'react';
+import dayjs, {Dayjs} from 'dayjs';
+import {Button, Input, Modal, Segmented} from 'antd';
+import style from "@/components/SettingCton.module.css"
+
+type PresetType = 'everyMinute' | 'everyHour' | 'daily' | 'weekly' | 'monthly';
+
+interface CronGeneratorProps {
+    setCronFunction: (data: boolean) => void;
+    cron?: string;
+}
+
+const CronGenerator: React.FC<CronGeneratorProps> = ({setCronFunction, cron}) => {
+    const [showModal,setShowModal] = useState(false);
+    const [current, setCurrent] = useState<number>(0);
+    const [cronSeconds, setCronSeconds] = useState<string>(cron ? cron.split(' ')[0] : '*');
+    const [cronMinutes, setCronMinutes] = useState<string>(cron ? cron.split(' ')[1] : '*');
+    const [cronHours, setCronHours] = useState<string>(cron ? cron.split(' ')[2] : '*');
+    const [cronDayOfMonth, setCronDayOfMonth] = useState<string>(cron ? cron.split(' ')[3] : '*');
+    const [cronMonth, setCronMonth] = useState<string>(cron ? cron.split(' ')[4] : '*');
+    const [cronDayOfWeek, setCronDayOfWeek] = useState<string>(cron ? cron.split(' ')[5] : '*');
+    const [everyNumber, setEveryNumber] = useState<number>(1);
+    const [nextOccurrences, setNextOccurrences] = useState<Dayjs[]>([]);
+    const [fullCronExpression, setFullCronExpression] = useState<string>(
+        `${cronMinutes} ${cronHours} ${cronDayOfMonth} ${cronMonth} ${cronDayOfWeek}`.trim()
+    );
+
+    const titleItem = ['具体时间', '周期', '自定义cron'];
+
+    useEffect(() => {
+        setFullCronExpression(`${cronMinutes} ${cronHours} ${cronDayOfMonth} ${cronMonth} ${cronDayOfWeek}`.trim());
+    }, [cronMinutes, cronHours, cronDayOfMonth, cronMonth, cronDayOfWeek]);
+
+    const onClickItem = (index: number) => {
+        setCurrent(index);
+    };
+
+    const onClickConfirmCron = () => {
+        if (fullCronExpression) {
+            try {
+                // Replace generateNextTimeAPI with your actual API call
+                // generateNextTimeAPI('0 ' + fullCronExpression).then(res => {
+                //   setNextOccurrences(res.map((next: string) => dayjs(next)));
+                //   setCronFunction(false);
+                // });
+                console.log('Cron confirmed:', fullCronExpression);
+                setCronFunction(false);
+            } catch (error) {
+                console.error('Cron expression is invalid', error);
+            }
+        } else {
+            setCronFunction(false);
+        }
+    };
+
+    const resetOccurrences = () => {
+        setCronSeconds('0');
+        setCronMinutes('*');
+        setCronHours('*');
+        setCronDayOfMonth('*');
+        setCronMonth('*');
+        setCronDayOfWeek('*');
+    };
+
+    const generateNextOccurrences = () => {
+        try {
+            if (!fullCronExpression) {
+                console.error('Please set the next generation time correctly');
+                return;
+            }
+            console.log('cron' + fullCronExpression);
+            // Replace generateNextTimeAPI with your actual API call
+            // generateNextTimeAPI('0 ' + fullCronExpression).then(res => {
+            //   setNextOccurrences(res.map((next: string) => dayjs(next)));
+            // });
+        } catch (error) {
+            console.error('Cron expression is invalid', error);
+        }
+    };
+
+    const setPreset = (type: PresetType) => {
+        switch (type) {
+            case 'everyMinute':
+                setCronSeconds('0');
+                setCronMinutes(`*/${everyNumber}`);
+                setCronHours('*');
+                setCronDayOfMonth('*');
+                setCronMonth('*');
+                setCronDayOfWeek('*');
+                break;
+            case 'everyHour':
+                setCronSeconds('0');
+                setCronMinutes('0');
+                setCronHours(`*/${everyNumber}`);
+                setCronDayOfMonth('*');
+                setCronMonth('*');
+                setCronDayOfWeek('*');
+                break;
+            case 'daily':
+                setCronSeconds('0');
+                setCronMinutes('0');
+                setCronHours('0');
+                setCronDayOfMonth(`*/${everyNumber}`);
+                setCronMonth('*');
+                setCronDayOfWeek('*');
+                break;
+            case 'weekly':
+                setCronSeconds('0');
+                setCronMinutes('0');
+                setCronHours('0');
+                setCronDayOfMonth('*');
+                setCronMonth('*');
+                setCronDayOfWeek(`${everyNumber}`);
+                break;
+            case 'monthly':
+                setCronSeconds('0');
+                setCronMinutes('0');
+                setCronHours('0');
+                setCronDayOfMonth('1');
+                setCronMonth('*');
+                setCronDayOfWeek('*');
+                break;
+        }
+    };
+
+    return (
+        <Fragment>
+            <Button type="primary" onClick={()=>setShowModal(!showModal)}>
+                设置时间
+            </Button>
+            <Modal
+                title="设置时间"
+                closable={{ 'aria-label': 'Custom Close Button' }}
+                open={showModal}
+                // onOk={handleOk}
+                onCancel={()=>setShowModal(false)}
+            >
+                <div className={style.container}>
+                    <div className={style.cronForm}>
+                        <div>
+                            <Segmented
+                                value={titleItem[current]}
+                                options={titleItem}
+                                onChange={(value) => onClickItem(titleItem.indexOf(value as string))}
+                                block
+                            />
+                        </div>
+                        <div className={style.content}>
+                            {current === 0 && (
+                                <>
+                                    <div className={style.formItem}>
+                                        <div className={style.label}>分钟（0-59）</div>
+                                        <Input
+                                            className={style.input}
+                                            value={cronMinutes}
+                                            onChange={(e) =>
+                                                setCronMinutes(e.target.value)}
+                                            placeholder="*"
+                                        />
+                                    </div>
+
+                                    <div className={style.formItem}>
+                                        <div className={style.label}>小时（0-23）</div>
+                                        <Input
+                                            className={style.input}
+                                            value={cronHours}
+                                            onChange={(e) =>
+                                                setCronHours(e.target.value)}
+                                            placeholder="*"
+                                        />
+                                    </div>
+
+                                    <div className={style.formItem}>
+                                        <div className={style.label}>日期（1-31）</div>
+                                        <Input
+                                            className={style.input}
+                                            value={cronDayOfMonth}
+                                            onChange={(e) => setCronDayOfMonth(e.target.value)}
+                                            placeholder="*"
+                                        />
+                                    </div>
+
+                                    <div className={style.formItem}>
+                                        <div className={style.label}>月份（1-12）</div>
+                                        <Input
+                                            className={style.input}
+                                            value={cronMonth}
+                                            onChange={(e) => setCronMonth(e.target.value)}
+                                            placeholder="*"
+                                        />
+                                    </div>
+
+                                    <div className={style.formItem}>
+                                        <div className={style.label}>星期（0-6，0=周日）</div>
+                                        <Input
+                                            className={style.input}
+                                            value={cronDayOfWeek}
+                                            onChange={(e) => setCronDayOfWeek(e.target.value)}
+                                            placeholder="*"
+                                        />
+                                    </div>
+                                </>
+                            )}
+
+                            {current === 1 && (
+                                <div className={style.presetButtons}>
+                                    <div>
+                                        <Input
+                                            type="number"
+                                            value={everyNumber}
+                                            onChange={(e) => setEveryNumber(parseInt(e.target.value) || 1)}
+                                            placeholder="1"
+                                        />
+                                    </div>
+                                    <Button className={style.presetBtn} onClick={() => setPreset('everyMinute')}>
+                                        每{everyNumber}分钟
+                                    </Button>
+                                    <Button className={style.presetBtn} onClick={() => setPreset('everyHour')}>
+                                        每{everyNumber}小时
+                                    </Button>
+                                    <Button className={style.presetBtn} onClick={() => setPreset('daily')}>
+                                        每{everyNumber}天
+                                    </Button>
+                                    <Button className={style.presetBtn} onClick={() => setPreset('weekly')}>
+                                        每周{everyNumber}
+                                    </Button>
+                                    <Button className={style.presetBtn} onClick={() => setPreset('monthly')}>
+                                        每月
+                                    </Button>
+                                </div>
+                            )}
+                            {current === 2 && (
+                                <div className={style.presetButtons}>
+                                    <div style={{color: 'red'}}>!!!目前只支持5位设定，分钟、小时、日、月、星期</div>
+                                    <Input value={fullCronExpression}
+                                           onChange={(e) => setFullCronExpression(e.target.value)}/>
+                                </div>
+                            )}
+                        </div>
+                        <div className={style.buttonFlex}>
+                            <Button size="small" danger onClick={resetOccurrences}>
+                                重置
+                            </Button>
+                            <Button size="small" type="primary" onClick={generateNextOccurrences}>
+                                查看最近触发时间
+                            </Button>
+                        </div>
+                    </div>
+
+                    {nextOccurrences.length > 0 && (
+                        <div className={style.results}>
+                            <div className={style.resultsTitle}>最近触发时间：</div>
+                            {nextOccurrences.map((item, index) => (
+                                <div className={style.occurrenceItem} key={index}>
+                                    <div>{dayjs(item).format('YYYY-MM-DD HH:mm')}</div>
+                                </div>
+                            ))}
+                        </div>
+                    )}
+                    <Button type="primary" onClick={onClickConfirmCron}>
+                        确认
+                    </Button>
+                </div>
+            </Modal>
+        </Fragment>
+
+    );
+};
+
+export default CronGenerator;

src/components/SettingCton.module.css

@@ -0,0 +1,87 @@
+.container {
+    padding: 20px;
+    background-color: #f5f5f5;
+    min-height: 100vh;
+}
+
+.header {
+    margin-bottom: 20px;
+}
+
+.title {
+    font-size: 20px;
+    font-weight: bold;
+    color: #000;
+}
+
+.content {
+    margin-top: 10px;
+}
+
+.cronForm {
+    background-color: #fff;
+    border-radius: 8px;
+    padding: 15px;
+    margin-bottom: 20px;
+}
+
+.formItem {
+    margin-bottom: 15px;
+}
+
+.label {
+    display: block;
+    margin-bottom: 5px;
+    font-size: 14px;
+    color: #333;
+}
+
+.input {
+    width: 90%;
+    padding: 10px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    font-size: 14px;
+}
+
+.results {
+    background-color: #fff;
+    border-radius: 8px;
+    padding: 15px;
+    margin-bottom: 20px;
+}
+
+.resultsTitle {
+    font-weight: bold;
+    margin-bottom: 10px;
+    display: block;
+}
+
+.occurrence-item {
+    padding: 8px 0;
+    border-bottom: 1px solid #eee;
+}
+
+.presetButtons {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 10px;
+    margin-bottom: 10px;
+}
+
+.buttonFlex {
+    display: flex;
+    gap: 10px;
+    margin-top: 10px;
+}
+
+.presetBtn {
+    background-color: #f0f0f0;
+    color: #000;
+    padding: 8px 12px;
+    border-radius: 4px;
+    font-size: 14px;
+    flex: 1;
+    min-width: 100px;
+    border: 1px solid #d9d9d9;
+}

src/components/ShareOption.tsx

@@ -1,13 +1,40 @@
 import React, {Fragment, useEffect, useState} from 'react';
-import {Button, Image, Modal, QRCode} from 'antd';
+import {Button, Image, Input, Modal, QRCode, Space } from 'antd';
 import {v4 as uuidv4} from 'uuid';
+import {copyToClipboard} from "@/lib/copyToClipboard";
 
 const ShareOption = (props: { taskId: string }) => {
-    const [loading, setLoading] = useState(false);
+    // const [loading, setLoading] = useState(false);
     const [open, setOpen] = useState(false);
-    const [buttonIndex, setButtonIndex] = useState(0);
+    const [buttonIndex, setButtonIndex] = useState(1);
     const [qrCodeValue, setQrCodeValue] = useState<string>("-");
-    const [qrCodeStatus, setQrCodeStatus]=useState<'active' | 'expired' | 'loading' | 'scanned'>("active");
+    const [qrCodeStatus, setQrCodeStatus] = useState<'active' | 'expired' | 'loading' | 'scanned'>("loading");
+
+    function doDownload(url: string, fileName: string) {
+        const a = document.createElement('a');
+        a.download = fileName;
+        a.href = url;
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+    }
+
+    const downloadCanvasQRCode = () => {
+        const canvas = document.getElementById('myqrcode')?.querySelector<HTMLCanvasElement>('canvas');
+        if (canvas) {
+            const url = canvas.toDataURL();
+            doDownload(url, 'QRCode.png');
+        }
+    };
+
+    const downloadSvgQRCode = () => {
+        const svg = document.getElementById('myqrcode')?.querySelector<SVGElement>('svg');
+        const svgData = new XMLSerializer().serializeToString(svg!);
+        const blob = new Blob([svgData], {type: 'image/svg+xml;charset=utf-8'});
+        const url = URL.createObjectURL(blob);
+        console.log({url})
+        doDownload(url, '微信小程序马上行计划管理扫码加入计划.svg');
+    };
 
     const generateQrcode = () => {
 
@@ -16,24 +43,18 @@ const ShareOption = (props:{taskId:string}    ) => {
         setOpen(true);
     };
 
-    const handleOk = () => {
-        setLoading(true);
-        setTimeout(() => {
-            setLoading(false);
-            setOpen(false);
-        }, 3000);
-    };
-
     const handleCancel = () => {
         setOpen(false);
     };
     useEffect(() => {
         // 分享人必须有权限
+        // 生成分享信息同时适用链接和二维码
         const clientId: string = uuidv4();
         let qrCodeData = {
             taskId: props.taskId, pass: clientId, local: "马上行计划管理", opType: "SHARE_OPTION"
         }
         setQrCodeValue(JSON.stringify(qrCodeData))
+        setQrCodeStatus("active")
     }, []);
 
     return (
@@ -43,41 +64,55 @@ const ShareOption = (props:{taskId:string}    ) => {
             </Button>
             <Modal
                 open={open}
-                title="Title"
+                title="分享好友"
-                onOk={handleOk}
+                // onOk={handleOk}
                 onCancel={handleCancel}
+                width={700}
                 footer={[
                     <Button key="back" onClick={handleCancel}>
                         返回
                     </Button>,
-                    <Button key="submit" type="primary" loading={loading} onClick={handleOk}>
+                    <Button key="qrcode"
+                            type={buttonIndex == 1 ? "primary" : "default"}
+                        // loading={loading}
+                            onClick={() => setButtonIndex(1)}>
                         使用二维码
                     </Button>,
                     <Button
                         key="link"
-                        href="https://google.com"
+                        // href="https://google.com"
-                        target="_blank"
+                        // target="_blank"
-                        type="primary"
+                        type={buttonIndex == 2 ? "primary" : "default"}
-                        loading={loading}
+                        // loading={loading}
-                        onClick={handleOk}
+                        onClick={() => setButtonIndex(2)}
                     >
                         使用连接
                     </Button>,
                 ]}
             >
-                {buttonIndex==1&& <div>
+                {buttonIndex == 1 && <div className="displayFlexRow">
-                    <div>
+                    <div className="displayFlexColumn">
                         <div className="title">微信小程序二维码</div>
                         <Image width={300} src="/static/pc-Web.png"/>
-                        <Button>下载</Button>
+                        <Button
+                            onClick={() => doDownload("/static/pc-Web.png", '微信小程序马上行计划管理.png')}>下载</Button>
                     </div>
-                    <div>
+                    <div className="displayFlexColumn" id="myqrcode">
                         <div className="title">小程序扫描二维码，有效期7天</div>
-                        <QRCode value={qrCodeValue} size={300} status={qrCodeStatus} onRefresh={generateQrcode}/>
+                        <QRCode type="svg" value={qrCodeValue} size={300} status={qrCodeStatus}
-                        <Button>下载</Button>
+                                onRefresh={generateQrcode}/>
+                        <Button onClick={downloadSvgQRCode}>下载</Button>
                     </div>
                 </div>}
-
+                {buttonIndex == 2 && <div>
+                    <div className="title">分享链接7日内有效</div>
+                    <Space.Compact style={{width: '100%'}}>
+                        <Input defaultValue="https://www.huaruyu.com" readOnly/>
+                        <Button loading={qrCodeStatus=="loading"}
+                                onClick={()=>copyToClipboard("https://www.huaruyu.com")}
+                                type="primary">复制链接</Button>
+                    </Space.Compact>
+                </div>}
             </Modal>
         </Fragment>
     );

src/components/StepSort.tsx

@@ -0,0 +1,112 @@
+import React, {CSSProperties, Fragment, useState} from "react";
+import {DragDropContext, Droppable, Draggable, DropResult, DraggingStyle, NotDraggingStyle} from "react-beautiful-dnd";
+import {TaskStepSortVO} from "@/components/type/TaskSort.d";
+import {Button, Drawer} from "antd";
+
+// fake data generator
+const getItems = (count: number, offset = 0) =>
+    Array.from({length: count}, (v, k) => k).map(k => ({
+        id: `item-${k + offset}-${new Date().getTime()}`,
+        stepDesc: `item ${k + offset}`,
+        sortIndex: k + offset,
+    }));
+
+const reorder = (list: TaskStepSortVO[], startIndex: number, endIndex: number) => {
+    const result = Array.from(list);
+    const [removed] = result.splice(startIndex, 1);
+    result.splice(endIndex, 0, removed);
+
+    return result;
+};
+const grid = 8;
+
+const getItemStyle = (isDragging: boolean, draggableStyle: DraggingStyle | NotDraggingStyle | undefined): CSSProperties => ({
+    // some basic styles to make the items look a bit nicer
+    userSelect: "none",
+    padding: grid * 2,
+    margin: `0 0 ${grid}px 0`,
+
+    // change background colour if dragging
+    background: isDragging ? "lightgreen" : "grey",
+
+    // styles we need to apply on draggables
+    ...draggableStyle
+});
+const getListStyle = (isDraggingOver: boolean) => ({
+    background: isDraggingOver ? "lightblue" : "lightgrey",
+    padding: grid,
+    width: 250
+});
+
+const StepSort = (props: { taskId: string }) => {
+    const [state, setState] = useState<TaskStepSortVO[]>(getItems(5, 10));
+    // 抽屉 start
+    const [open, setOpen] = useState(false);
+
+    function onDragEnd(result: DropResult) {
+        const {source, destination} = result;
+        // dropped outside the list
+        if (!destination) {
+            return;
+        }
+        const items = reorder(state, source.index, destination.index);
+        let newState = [...state];
+        newState = items;
+        setState(newState);
+    }
+
+    return (
+        <Fragment>
+            <Button type={open ? "primary" : "default"} onClick={() => setOpen(!open)}>
+                查看步骤
+            </Button>
+            <Drawer>
+                <div style={{display: "flex"}}>
+                    <DragDropContext onDragEnd={onDragEnd}>
+                        <Droppable key="sortDroppable" droppableId="sortDroppableId">
+                            {(provided, snapshot) => (
+                                <div
+                                    ref={provided.innerRef}
+                                    style={getListStyle(snapshot.isDraggingOver)}
+                                    {...provided.droppableProps}
+                                >
+                                    {state.map((item, index) => (
+                                        <Draggable
+                                            key={item.id}
+                                            draggableId={item.id}
+                                            index={index}
+                                        >
+                                            {(provided, snapshot) => (
+                                                <div
+                                                    ref={provided.innerRef}
+                                                    {...provided.draggableProps}
+                                                    {...provided.dragHandleProps}
+                                                    style={getItemStyle(
+                                                        snapshot.isDragging,
+                                                        provided.draggableProps.style
+                                                    )}
+                                                >
+                                                    <div
+                                                        style={{
+                                                            display: "flex",
+                                                            justifyContent: "space-around"
+                                                        }}
+                                                    >
+                                                        {item.stepDesc}
+                                                    </div>
+                                                </div>
+                                            )}
+                                        </Draggable>
+                                    ))}
+                                    {provided.placeholder}
+                                </div>
+                            )}
+                        </Droppable>
+                    </DragDropContext>
+                </div>
+            </Drawer>
+        </Fragment>
+    );
+}
+export default StepSort
+

src/components/type/TaskSort.d.tsx

@@ -0,0 +1,5 @@
+export type TaskStepSortVO = {
+    id: string,
+    sortIndex: number,
+    stepDesc: string
+}

src/ui/task/calendar/CalShow.tsx

@@ -148,7 +148,7 @@ const CalShow: React.FC = () => {
             clearClickTimeout()
             clickRef.current = window.setTimeout(() => {
                 // window.alert(event.title);
-                console.log(event)
+                console.log("event")
                 setOperationId(OPERATION_BUTTON_TYPE.DETAIL)
                 setDescription("任务详情")
                 setItemId(event.resource)
@@ -265,7 +265,10 @@ const CalShow: React.FC = () => {
 
     }
     return <div className="App" style={{height: '90vh'}}>
-        {open && <DetailModelForm operationId={operationId} description={description} open={open} haveButton={false}
+        {open && <DetailModelForm operationId={operationId}
+                                  description={description}
+                                  open={open}
+                                  haveButton={false}
                                   itemId={itemId}
                                   reloadData={reloadData} expectedStartTime={expectedStartTime}
                                   closeOpen={()=>setOpen(false)}

src/ui/task/project/DetailModelForm.tsx

@@ -6,8 +6,8 @@ import {
     ProFormSelect,
     ProFormText, ProFormTextArea, ProFormTreeSelect,
 } from '@ant-design/pro-components';
-import {Button, Form, message, Popconfirm} from 'antd';
+import {Button, Form, message, Popconfirm, Spin} from 'antd';
-import React, {useEffect, useState} from "react";
+import React, {Fragment, useEffect, useState} from "react";
 import {
     addTask, deleteTask, getTask,
     getTaskTreeResult,
@@ -19,6 +19,8 @@ import {DataType} from "@/lib/definitions";
 import dayjs, {Dayjs} from "dayjs";
 import DiaryOption from "@/components/DiaryOption";
 import ShareOption from "@/components/ShareOption";
+import StepSort from "@/components/StepSort";
+import SettingCron from "@/components/SettingCron";
 
 export type DetailModelFormProps = {
     // 当前内容id
@@ -52,6 +54,8 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
     const [editFormDisable, setEditFormDisable] = useState(props.operationId === OPERATION_BUTTON_TYPE.DETAIL)
     // 团队第一层 pid必须为0
     const [taskType, setTaskType] = useState('0')
+    const [spinning, setSpinning] = useState(true)
+    const [operationRequest,setOperationRequest] = useState(false)
     useEffect(() => {
         if (props.itemId != undefined && (
             props.operationId === OPERATION_BUTTON_TYPE.DETAIL || props.operationId === OPERATION_BUTTON_TYPE.UPDATE)) {
@@ -69,13 +73,19 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
                     if (task.data.pid == "0") {
                         form.setFieldValue("pid", undefined)
                     }
+                    if (task.data.taskType) {
+                        setTaskType(task.data.taskType)
+                    }
                     setRequestTask(task.data)
                     console.log("form.setFieldsValue(task.data)" + JSON.stringify(task.data))
                 } else {
                     message.error(task.status.message);
                     props.reloadData?.()
                 }
-            })
+            }).finally(() => {
+                    setSpinning(false)
+                }
+            )
         } else if (props.operationId === OPERATION_BUTTON_TYPE.ADD || props.operationId === OPERATION_BUTTON_TYPE.ADD_CHILD) {
             let data = {
                 'expectedTimeRange': [props.expectedStartTime ? props.expectedStartTime : dayjs(), props.expectedEndTime],
@@ -84,6 +94,7 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
                 'name': props.taskContent && props.taskContent?.length > 10 ? props.taskContent.substring(0, 10) : props.taskContent,
             };
             form.setFieldsValue(data)
+            setSpinning(false)
         }
     }, [props])
 
@@ -105,9 +116,11 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
     // 所以你需要用 setFieldsValue 来更新。 initialValues 只在 form 初始化时生效且只生效一次，如果你需要异步加载，
     // 推荐使用 request，或者 initialValues ? <Form/> : null
     return (
+        <Fragment>
+            <Spin spinning={spinning} fullscreen />
             <ModalForm<DataType>
                 title={props.description}
-            open={props.open && !props.haveButton}
+                open={!spinning&&props.open && !props.haveButton}
                 trigger={props.haveButton ?
                     <Button type="primary">
                         <PlusOutlined/>
@@ -115,6 +128,7 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
                     </Button> : undefined
                 }
                 form={form}
+                loading={operationRequest}
                 autoFocusFirstInput
                 modalProps={{
                     destroyOnClose: true,
@@ -159,16 +173,20 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
                                     </Button>
                                 </Popconfirm> : undefined,
                             requestTask && requestTask.id ?
-                            <DiaryOption key="diary" taskId={requestTask.id} taskName={requestTask.name}/> : undefined,
+                                <DiaryOption key="diary" taskId={requestTask.id}
+                                             taskName={requestTask.name}/> : undefined,
                         ]
 
                         // 非新增或者编辑状态不展示
                         if (!editFormDisable) {
                             result.push(...defaultDoms)
                         } else {
-                        if (props.taskType=='1') {
+                            if (editFormDisable && taskType == '1') {
                                 result.push(<ShareOption taskId={props.itemId!}/>)
                             }
+                            if (editFormDisable && taskType == '2') {
+                                result.push(<StepSort taskId={props.itemId!}/>)
+                            }
                             result.push(<Button type="primary" key="close"
                                                 onClick={() => props.closeOpen?.()}>关闭</Button>)
                         }
@@ -186,7 +204,8 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
                         // }
                         // return defaultDoms;
                         const result = defaultDoms.filter(defaultButton => defaultButton.key == 'rest');
-                    result.push(<Button type="primary" key="create-team" onClick={() => form.submit()}>{taskType=='1'?"创建团队":"确认"}
+                        result.push(<Button type="primary" key="create-team"
+                                            onClick={() => form.submit()}>{taskType == '1' ? "创建团队" : "确认"}
                         </Button>)
                         return result;
                     }
@@ -196,6 +215,7 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
                     {/* onFinish 返回true关闭窗口，范湖false不关闭窗口 */
                     }
                     console.log('Received values of form: ', values, {...requestTask, ...values});
+                    setOperationRequest(true)
                     if (requestTask) {
                         const {sortNo} = requestTask;
                         values.sortNo = sortNo;
@@ -261,6 +281,7 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
                             }
                         );
                     }
+                    setOperationRequest(false)
                     return result;
                 }}
             >
@@ -407,7 +428,12 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
                         disabled={editFormDisable}
                     />
                 </ProForm.Group>
+                {taskType=="3"&&<SettingCron setCronFunction={
+                    ()=>{}
+                }/>}
 
             </ModalForm>
+        </Fragment>
+
     );
 };