feat(protocol): saveData event

src/components/BaseCrud/save/index.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import { message, Modal, Spin } from 'antd';
 import {
   ArrayItems,
@@ -55,10 +55,21 @@ const Save = <T extends Record<string, any>>(props: Props<T>) => {
   const [current, setCurrent] = useState<T>();
   const [model, setModel] = useState<'edit' | 'add' | 'preview'>('edit');
 
+  const form = useMemo(
+    () =>
+      createForm({
+        validateFirst: true,
+        initialValues: current,
+        effects: formEffect,
+      }),
+    [current, model],
+  );
+
   useEffect(() => {
     const visibleSubscription = Store.subscribe(SystemConst.BASE_CURD_MODAL_VISIBLE, setVisible);
     const dataSubscription = Store.subscribe(SystemConst.BASE_CURD_CURRENT, setCurrent);
     const modelSubscription = Store.subscribe(SystemConst.BASE_CURD_MODEL, setModel);
+
     return () => {
       visibleSubscription.unsubscribe();
       dataSubscription.unsubscribe();
@@ -66,12 +77,6 @@ const Save = <T extends Record<string, any>>(props: Props<T>) => {
     };
   }, [current]);
 
-  const form = createForm({
-    validateFirst: true,
-    initialValues: current,
-    effects: formEffect,
-  });
-
   const SchemaField = createSchemaField({
     components: {
       FormItem,
@@ -102,7 +107,9 @@ const Save = <T extends Record<string, any>>(props: Props<T>) => {
 
   const save = async () => {
     const values: T = await (customForm || form).submit();
+    console.log(form.values, 'value', values);
     // 特殊处理通知模版
+
     if (service?.getUri().includes('/notifier/template')) {
       (values as T & { template: Record<string, any> | string }).template = JSON.stringify(
         values.template,
@@ -123,6 +130,20 @@ const Save = <T extends Record<string, any>>(props: Props<T>) => {
     reload();
   };
 
+  useEffect(() => {
+    const subscription = Store.subscribe('save-data', async (callback: (values: any) => void) => {
+      if (!callback) return;
+      await save();
+      if (typeof callback === 'function') {
+        callback(form);
+      }
+    });
+    return () => {
+      Store.set('save-data', undefined);
+      subscription.unsubscribe();
+    };
+  }, [current]);
+
   return (
     <Modal
       title={intl.formatMessage({

src/pages/link/Protocol/index.tsx

@@ -2,7 +2,7 @@ import { PageContainer } from '@ant-design/pro-layout';
 import type { ProtocolItem } from '@/pages/link/Protocol/typings';
 import { useRef } from 'react';
 import type { ActionType, ProColumns } from '@jetlinks/pro-table';
-import { message, Popconfirm, Tag, Tooltip } from 'antd';
+import { Button, message, Popconfirm, Tag, Tooltip } from 'antd';
 import {
   CloudSyncOutlined,
   DeleteOutlined,
@@ -14,7 +14,8 @@ import { useIntl } from '@@/plugin-locale/localeExports';
 import type { ISchema } from '@formily/json-schema';
 import { CurdModel } from '@/components/BaseCrud/model';
 import Service from '@/pages/link/Protocol/service';
-import { onFormMount, registerValidateRules } from '@formily/core';
+import { onFormValuesChange, registerValidateRules } from '@formily/core';
+import { Store } from 'jetlinks-store';
 
 export const service = new Service('protocol');
 const Protocol = () => {
@@ -24,9 +25,9 @@ const Protocol = () => {
   const modifyState = async (id: string, type: 'deploy' | 'un-deploy') => {
     const resp = await service.modifyState(id, type);
     if (resp.status === 200) {
-      message.success('操作成功!');
+      message.success('插件发布成功!');
     } else {
-      message.error('操作失败!');
+      message.error('插件发布失败!');
     }
     actionRef.current?.reload();
   };
@@ -143,7 +144,7 @@ const Protocol = () => {
   registerValidateRules({
     validateId(value) {
       if (!value) return '';
-      const reg = new RegExp('^\\w{3,20}$');
+      const reg = new RegExp('^[0-9a-zA-Z_\\\\-]+$');
       return reg.exec(value) ? '' : 'ID只能由数字、26个英文字母或者下划线组成';
     },
   });
@@ -297,12 +298,38 @@ const Protocol = () => {
         schema={schema}
         actionRef={actionRef}
         formEffect={() => {
-          onFormMount((form) => {
+          onFormValuesChange((form) => {
             form.setFieldState('id', (state) => {
               state.disabled = CurdModel.model === 'edit';
             });
           });
         }}
+        footer={
+          <>
+            <Button onClick={CurdModel.close}>取消</Button>
+            <Button
+              type="primary"
+              onClick={() => {
+                Store.set('save-data', true);
+              }}
+            >
+              保存
+            </Button>
+            <Button
+              type="primary"
+              onClick={() => {
+                Store.set('save-data', async (data: any) => {
+                  // 获取到的保存的数据
+                  if (data.id) {
+                    await modifyState(data.id, 'deploy');
+                  }
+                });
+              }}
+            >
+              保存并发布
+            </Button>
+          </>
+        }
       />
       {/* {visible && <Debug data={current} close={() => setVisible(!visible)} />} */}
     </PageContainer>