@gadmin2n/schematics 0.0.147 → 0.0.148

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/components/NodePropertyPanel.tsx

@@ -2,6 +2,7 @@ import {
   DisconnectOutlined,
   MinusCircleOutlined,
   PlusOutlined,
+  SaveOutlined,
   SearchOutlined,
   SendOutlined,
 } from '@ant-design/icons';
@@ -9,11 +10,11 @@ import {
   Alert,
   Button,
   Card,
-  Checkbox,
   Form,
   Input,
   InputNumber,
   message,
+  Modal,
   Segmented,
   Select,
   Space,
@@ -44,7 +45,6 @@ import type {
   WorkflowNodeType,
 } from '../types';
 import { NodeOutputSummary } from './NodeOutputSummary';
-import { CreateNodeInstanceDrawer } from './CreateNodeInstanceDrawer';
 import { WorkflowCodeEditor } from './WorkflowCodeEditor';
 import '../node-instances/node-config.css';
 import type { ReferencedConfigStatus } from '../hooks/useReferencedNodeInstanceConfigs';
@@ -186,12 +186,11 @@ function NodePropertyPanelImpl(
   const [instances, setInstances] = useState<WorkflowNodeInstance[]>([]);
   const [instanceLoading, setInstanceLoading] = useState(false);
   const [instanceLoadError, setInstanceLoadError] = useState(false);
-  const [createInstanceOpen, setCreateInstanceOpen] = useState(false);
+  const [saveTemplateOpen, setSaveTemplateOpen] = useState(false);
   const [paletteQuery, setPaletteQuery] = useState('');
-  const [newInstanceName, setNewInstanceName] = useState('');
-  const [newInstanceDesc, setNewInstanceDesc] = useState('');
-  const [saveAsLoading, setSaveAsLoading] = useState(false);
-  const [alsoSaveAsInstance, setAlsoSaveAsInstance] = useState(false);
+  const [templateName, setTemplateName] = useState('');
+  const [templateDescription, setTemplateDescription] = useState('');
+  const [templateSaving, setTemplateSaving] = useState(false);
   const [configForm] = Form.useForm();
 
   // Find configSchema for current node type
@@ -326,7 +325,6 @@ function NodePropertyPanelImpl(
       ]);
       setDirty(false);
       setPrompt('');
-      setAlsoSaveAsInstance(false);
     }
   }, [node?.id, currentNodeType]);
 
@@ -414,8 +412,7 @@ function NodePropertyPanelImpl(
 
   // Reset selection when node changes
   useEffect(() => {
-    setAlsoSaveAsInstance(false);
-    setCreateInstanceOpen(false);
+    setSaveTemplateOpen(false);
   }, [node?.id]);
 
   const buildCurrentUpdates = useCallback((): NodePropertyUpdates | null => {
@@ -590,57 +587,51 @@ function NodePropertyPanelImpl(
     }
   }
 
-  async function handleSave() {
-    if (!node) return;
+  function openSaveTemplate() {
+    if (!node || node.instanceRef) return;
+    setTemplateName(node.label.trim());
+    setTemplateDescription('');
+    setSaveTemplateOpen(true);
+  }
+
+  async function handleSaveAsTemplate() {
+    if (!node || node.instanceRef || !currentNodeType || !templateName.trim())
+      return;
     const updates = buildCurrentUpdates();
     if (!updates?.config) return;
-    const cleanConfig = updates.config;
-    if (
-      !node.instanceRef &&
-      alsoSaveAsInstance &&
-      currentNodeType &&
-      newInstanceName.trim()
-    ) {
-      // Save node AND create a new instance, then reference it
-      setSaveAsLoading(true);
-      try {
-        const res = await customRequest<any>(
-          'workflowNodeInstance/createOne',
-          'POST',
-          {
-            nodeTypeId: Number(currentNodeType.id),
-            name: newInstanceName.trim(),
-            description: newInstanceDesc.trim() || null,
-            config: cleanConfig,
-            isEnabled: true,
-          },
-        );
-        const created = res;
-        const newId = String(created.id);
-        onSave(node.id, {
-          label,
-          config: created.config,
-          configOverride: null,
-          instanceRef: {
-            instanceId: newId,
-            instanceCode: created.code,
-          },
-        });
-        setInstances((prev) => [...prev, created]);
-        setAlsoSaveAsInstance(false);
-        setNewInstanceName('');
-        setNewInstanceDesc('');
-        message.success('已保存并创建新实例');
-      } catch (e: any) {
-        message.error(e?.message ?? '创建实例失败');
-      } finally {
-        setSaveAsLoading(false);
-      }
-    } else {
-      onSave(node.id, updates);
-      message.success('节点已保存');
+    setTemplateSaving(true);
+    try {
+      const created = await customRequest<WorkflowNodeInstance>(
+        'workflowNodeInstance/createOne',
+        'POST',
+        {
+          nodeTypeId: Number(currentNodeType.id),
+          name: templateName.trim(),
+          description: templateDescription.trim() || null,
+          config: updates.config,
+          isEnabled: true,
+        },
+      );
+      onSave(node.id, {
+        label,
+        config: created.config,
+        configOverride: null,
+        instanceRef: {
+          instanceId: String(created.id),
+          instanceCode: created.code,
+        },
+      });
+      setInstances((current) => [
+        created,
+        ...current.filter((item) => item.id !== created.id),
+      ]);
+      setSaveTemplateOpen(false);
+      message.success(t('editor.templateSavedAndApplied'));
+    } catch (error: any) {
+      message.error(error?.message ?? t('editor.templateSaveFailed'));
+    } finally {
+      setTemplateSaving(false);
     }
-    setDirty(false);
   }
 
   function handleAiSubmit() {
@@ -1017,10 +1008,11 @@ function NodePropertyPanelImpl(
                   <Button
                     size="small"
                     className="workflow-panel-action"
-                    icon={<PlusOutlined />}
-                    onClick={() => setCreateInstanceOpen(true)}
+                    icon={<SaveOutlined />}
+                    disabled={referencedConfigUnavailable}
+                    onClick={openSaveTemplate}
                   >
-                    {t('editor.createTemplate')}
+                    {t('editor.saveCurrentAsTemplate')}
                   </Button>
                 </div>
                 <Select
@@ -1225,64 +1217,40 @@ function NodePropertyPanelImpl(
           </Card>
         )}
       </div>
-      {activeTab === 'config' && (
-        <footer className="workflow-node-panel__footer">
-          {!node.instanceRef && (
-            <div className="workflow-node-panel__save-template">
-              <Checkbox
-                checked={alsoSaveAsInstance}
-                onChange={(e) => setAlsoSaveAsInstance(e.target.checked)}
-              >
-                <Text>{t('editor.saveAsInstance')}</Text>
-              </Checkbox>
-              {alsoSaveAsInstance && (
-                <Space direction="vertical" size={6} style={{ width: '100%' }}>
-                  <Input
-                    value={newInstanceName}
-                    onChange={(e) => setNewInstanceName(e.target.value)}
-                    placeholder={t('editor.instanceNamePlaceholder')}
-                    size="small"
-                  />
-                  <Input
-                    value={newInstanceDesc}
-                    onChange={(e) => setNewInstanceDesc(e.target.value)}
-                    placeholder={t('common.optionalDescription')}
-                    size="small"
-                  />
-                </Space>
-              )}
-            </div>
-          )}
-          <Button
-            type="primary"
-            size="large"
-            block
-            loading={saveAsLoading}
-            disabled={
-              referencedConfigUnavailable ||
-              (!node.instanceRef &&
-                alsoSaveAsInstance &&
-                !newInstanceName.trim())
-            }
-            onClick={handleSave}
-          >
-            {t('editor.saveChanges')}
-          </Button>
-        </footer>
-      )}
-      <CreateNodeInstanceDrawer
-        open={createInstanceOpen}
-        nodeType={currentNodeType}
-        onCancel={() => setCreateInstanceOpen(false)}
-        onCreated={(instance) => {
-          setCreateInstanceOpen(false);
-          setInstances((current) => [
-            instance,
-            ...current.filter((item) => item.id !== instance.id),
-          ]);
-          referenceInstance(instance);
-        }}
-      />
+      <Modal
+        open={saveTemplateOpen}
+        title={t('editor.saveCurrentAsTemplate')}
+        okText={t('editor.saveAndUseTemplate')}
+        cancelText={t('common.cancel')}
+        confirmLoading={templateSaving}
+        okButtonProps={{ disabled: !templateName.trim() }}
+        onOk={() => void handleSaveAsTemplate()}
+        onCancel={() => setSaveTemplateOpen(false)}
+        destroyOnHidden
+      >
+        <Typography.Paragraph type="secondary">
+          {t('editor.saveCurrentAsTemplateHint')}
+        </Typography.Paragraph>
+        <Form layout="vertical">
+          <Form.Item label={t('editor.templateName')} required>
+            <Input
+              aria-label={t('editor.templateName')}
+              value={templateName}
+              onChange={(event) => setTemplateName(event.target.value)}
+              autoFocus
+            />
+          </Form.Item>
+          <Form.Item label={t('common.description')}>
+            <Input.TextArea
+              aria-label={t('common.description')}
+              value={templateDescription}
+              onChange={(event) => setTemplateDescription(event.target.value)}
+              placeholder={t('common.optionalDescription')}
+              rows={3}
+            />
+          </Form.Item>
+        </Form>
+      </Modal>
     </div>
   );
 }

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/components/WorkflowCodeEditor.test.tsx

@@ -5,14 +5,19 @@ import { WorkflowCodeEditor } from './WorkflowCodeEditor';
 
 vi.mock('@monaco-editor/react', () => ({
   default: ({
+    language,
     value,
     onChange,
+    options,
   }: {
+    language?: string;
     value?: string;
     onChange?(value: string): void;
+    options?: { ariaLabel?: string };
   }) => (
     <textarea
-      aria-label="shared editor"
+      aria-label={options?.ariaLabel ?? 'shared editor'}
+      data-language={language}
       value={value}
       onChange={(event) => onChange?.(event.target.value)}
     />
@@ -39,4 +44,20 @@ describe('WorkflowCodeEditor', () => {
     });
     expect(onChange).toHaveBeenCalledWith('{"ok":true}');
   });
+
+  it('enables Monaco SQL mode and labels the status bar', () => {
+    render(
+      <WorkflowCodeEditor
+        language="sql"
+        value="SELECT * FROM users"
+        ariaLabel="SQL 语句"
+      />,
+    );
+
+    expect(screen.getByRole('textbox', { name: 'SQL 语句' })).toHaveAttribute(
+      'data-language',
+      'sql',
+    );
+    expect(screen.getByText('SQL')).toBeInTheDocument();
+  });
 });

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/components/WorkflowCodeEditor.tsx

@@ -2,7 +2,13 @@ import Editor from '@monaco-editor/react';
 import { useTranslation } from 'react-i18next';
 import './workflow-code-editor.css';
 
-type WorkflowEditorLanguage = 'json' | 'javascript';
+type WorkflowEditorLanguage = 'json' | 'javascript' | 'sql';
+
+const LANGUAGE_LABELS: Record<WorkflowEditorLanguage, string> = {
+  json: 'JSON',
+  javascript: 'JavaScript',
+  sql: 'SQL',
+};
 
 export function WorkflowCodeEditor({
   language,
@@ -67,7 +73,7 @@ export function WorkflowCodeEditor({
         }}
       />
       <div className="workflow-code-editor__status" aria-hidden="true">
-        <span>{language === 'json' ? 'JSON' : 'JavaScript'}</span>
+        <span>{LANGUAGE_LABELS[language]}</span>
         <span>UTF-8</span>
         <span>{t('editor.indentSpaces')}: 2</span>
       </div>

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/connections/connections.css

@@ -1,53 +1,15 @@
-.workflow-connection-card {
-  height: 100%;
-  cursor: pointer;
-}
-
-.workflow-connection-card:focus-visible {
-  outline: 2px solid var(--ant-color-primary);
-  outline-offset: 2px;
-}
-
-.workflow-connection-card .ant-card-body {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-}
-
-.workflow-connection-card__header,
-.workflow-connection-card__footer {
-  display: flex;
-  align-items: flex-start;
-  justify-content: space-between;
-  gap: 12px;
-}
-
-.workflow-connection-card__description {
-  min-height: 40px;
-  margin: 14px 0 8px;
-}
-
-.workflow-connection-card__url {
-  margin: 0 0 14px;
-  color: var(--ant-color-text);
+.workflow-connection-table__code {
+  display: block;
+  margin-top: 2px;
   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
   font-size: 12px;
 }
 
-.workflow-connection-card__footer {
-  align-items: center;
-  margin-top: auto;
-  padding-top: 12px;
-  border-top: 1px solid var(--ant-color-border-secondary);
-}
-
-.workflow-connection-card__action {
-  display: inline-flex;
-  flex: none;
-  align-items: center;
-  gap: 6px;
-  color: var(--ant-color-primary);
-  font-weight: 500;
+.workflow-connection-table__url {
+  display: block;
+  max-width: 260px;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+  font-size: 12px;
 }
 
 .workflow-connection-form__section-title {

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/connections/connectionsApi.ts

@@ -27,3 +27,10 @@ export function fetchConnectionSecrets(code: string) {
     'GET',
   );
 }
+
+export function deleteConnection(code: string) {
+  return customRequest<{ code: string }>(
+    `integration-connections/${encodeURIComponent(code)}`,
+    'DELETE',
+  );
+}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/connections/index.test.tsx

@@ -1,8 +1,8 @@
 import { render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import i18n from '../../../i18n';
-import { fetchConnections } from './connectionsApi';
+import { deleteConnection, fetchConnections } from './connectionsApi';
 import ConnectionsPage from './index';
 
 vi.mock('components', () => ({
@@ -16,6 +16,7 @@ vi.mock('components', () => ({
 
 vi.mock('./connectionsApi', () => ({
   fetchConnections: vi.fn(),
+  deleteConnection: vi.fn(),
 }));
 
 vi.mock('./ConnectionModal', () => ({
@@ -42,6 +43,11 @@ Object.defineProperty(window, 'matchMedia', {
 
 describe('ConnectionsPage', () => {
   beforeEach(async () => {
+    vi.clearAllMocks();
+    const getComputedStyle = window.getComputedStyle.bind(window);
+    vi.spyOn(window, 'getComputedStyle').mockImplementation((element) =>
+      getComputedStyle(element),
+    );
     await i18n.changeLanguage('zh_CN');
     vi.mocked(fetchConnections).mockResolvedValue([
       {
@@ -57,9 +63,12 @@ describe('ConnectionsPage', () => {
         updatedAt: '2026-08-13T00:00:00.000Z',
       },
     ]);
+    vi.mocked(deleteConnection).mockResolvedValue({ code: 'ticket-system' });
   });
 
-  it('opens the connection editor when the card is clicked', async () => {
+  afterEach(() => vi.restoreAllMocks());
+
+  it('opens the connection editor from the table row action', async () => {
     const user = userEvent.setup();
     render(<ConnectionsPage />);
 
@@ -72,4 +81,24 @@ describe('ConnectionsPage', () => {
       expect(screen.getByText('正在编辑：工单系统')).toBeInTheDocument(),
     );
   });
+
+  it('deletes the connection after confirmation', async () => {
+    const user = userEvent.setup();
+    render(<ConnectionsPage />);
+
+    await user.click(
+      await screen.findByRole('button', { name: '删除 工单系统' }),
+    );
+    await screen.findByText('删除连接 工单系统？');
+    const confirmButton = document.querySelector<HTMLButtonElement>(
+      '.ant-popconfirm-buttons .ant-btn-primary',
+    );
+    expect(confirmButton).not.toBeNull();
+    await user.click(confirmButton!);
+
+    await waitFor(() =>
+      expect(deleteConnection).toHaveBeenCalledWith('ticket-system'),
+    );
+    expect(screen.queryByText('ticket-system')).not.toBeInTheDocument();
+  });
 });