fix(integration): simplify manual DingTalk sync setup
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
import React, { useEffect, useState, useMemo, useCallback } from 'react';
|
import React, { useEffect, useState, useMemo, useCallback } from 'react';
|
||||||
import {
|
import {
|
||||||
Card, Form, Input, Button, Space, Spin, Switch, Alert, Descriptions, Tag,
|
Card, Form, Input, Button, Space, Spin, Alert, Descriptions, Tag, Divider,
|
||||||
Tabs, Drawer, Tree, Select, TreeSelect, Modal, DatePicker, InputNumber,
|
Drawer, Tree, Select, TreeSelect, Modal, DatePicker, InputNumber,
|
||||||
Row, Col, List,
|
Row, Col, List,
|
||||||
} from 'antd';
|
} from 'antd';
|
||||||
import {
|
import {
|
||||||
@@ -15,12 +15,15 @@ import api from '../../api';
|
|||||||
import { message } from '../../ui/app-message';
|
import { message } from '../../ui/app-message';
|
||||||
import { usePermission } from '../../hooks/usePermission';
|
import { usePermission } from '../../hooks/usePermission';
|
||||||
import PermissionButton from '../../components/PermissionButton';
|
import PermissionButton from '../../components/PermissionButton';
|
||||||
|
import {
|
||||||
|
buildDingTalkConfigPayload,
|
||||||
|
isAppSecretRequired,
|
||||||
|
type DingTalkConfigFormValues,
|
||||||
|
} from './integration-config-form';
|
||||||
|
|
||||||
interface DingTalkConfig {
|
interface DingTalkConfig {
|
||||||
agentId: string;
|
agentId: string;
|
||||||
appSecret: string;
|
|
||||||
corpId: string;
|
corpId: string;
|
||||||
startEnable: boolean;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
interface DingOrgTreeNodeExt {
|
interface DingOrgTreeNodeExt {
|
||||||
@@ -94,9 +97,9 @@ const IntegrationConfigPage: React.FC = () => {
|
|||||||
const [testing, setTesting] = useState(false);
|
const [testing, setTesting] = useState(false);
|
||||||
const [config, setConfig] = useState<DingTalkConfig | null>(null);
|
const [config, setConfig] = useState<DingTalkConfig | null>(null);
|
||||||
const [verified, setVerified] = useState<boolean | null>(null);
|
const [verified, setVerified] = useState<boolean | null>(null);
|
||||||
const [form] = Form.useForm<DingTalkConfig>();
|
const [form] = Form.useForm<DingTalkConfigFormValues>();
|
||||||
|
|
||||||
// ── Sync Users Tab ──
|
// ── Manual organization sync ──
|
||||||
const [syncRootDeptId, setSyncRootDeptId] = useState<number | undefined>(undefined);
|
const [syncRootDeptId, setSyncRootDeptId] = useState<number | undefined>(undefined);
|
||||||
const [orgTree, setOrgTree] = useState<DingOrgTreeNodeExt[]>([]);
|
const [orgTree, setOrgTree] = useState<DingOrgTreeNodeExt[]>([]);
|
||||||
const [drawerOpen, setDrawerOpen] = useState(false);
|
const [drawerOpen, setDrawerOpen] = useState(false);
|
||||||
@@ -137,9 +140,10 @@ const IntegrationConfigPage: React.FC = () => {
|
|||||||
|
|
||||||
const handleSave = async () => {
|
const handleSave = async () => {
|
||||||
const values = await form.validateFields();
|
const values = await form.validateFields();
|
||||||
|
const payload = buildDingTalkConfigPayload(values);
|
||||||
setSaving(true);
|
setSaving(true);
|
||||||
try {
|
try {
|
||||||
await api.post('/integration/config', { type: 'DINGTALK', config: values });
|
await api.post('/integration/config', { type: 'DINGTALK', config: payload });
|
||||||
message.success('配置已保存');
|
message.success('配置已保存');
|
||||||
await fetchConfig();
|
await fetchConfig();
|
||||||
} catch (e: unknown) {
|
} catch (e: unknown) {
|
||||||
@@ -152,11 +156,12 @@ const IntegrationConfigPage: React.FC = () => {
|
|||||||
|
|
||||||
const handleTest = async () => {
|
const handleTest = async () => {
|
||||||
const values = await form.validateFields();
|
const values = await form.validateFields();
|
||||||
|
const payload = buildDingTalkConfigPayload(values);
|
||||||
setTesting(true);
|
setTesting(true);
|
||||||
try {
|
try {
|
||||||
const res = await api.post<{ success: boolean; message: string }>('/integration/config/test', {
|
const res = await api.post<{ success: boolean; message: string }>('/integration/config/test', {
|
||||||
type: 'DINGTALK',
|
type: 'DINGTALK',
|
||||||
config: values,
|
config: payload,
|
||||||
});
|
});
|
||||||
setVerified(res.success);
|
setVerified(res.success);
|
||||||
message.success(res.message);
|
message.success(res.message);
|
||||||
@@ -345,12 +350,8 @@ const IntegrationConfigPage: React.FC = () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const syncTabItems = config && hasAllPermissions('sync:read', 'class:view', 'class:edit')
|
const syncPanel = config && hasAllPermissions('sync:read', 'class:view', 'class:edit')
|
||||||
? [
|
? (
|
||||||
{
|
|
||||||
key: 'sync-users',
|
|
||||||
label: '同步用户',
|
|
||||||
children: (
|
|
||||||
<div>
|
<div>
|
||||||
<Alert
|
<Alert
|
||||||
type="info"
|
type="info"
|
||||||
@@ -519,77 +520,100 @@ const IntegrationConfigPage: React.FC = () => {
|
|||||||
/>
|
/>
|
||||||
</Modal>
|
</Modal>
|
||||||
</div>
|
</div>
|
||||||
),
|
)
|
||||||
},
|
: null;
|
||||||
]
|
|
||||||
: [];
|
|
||||||
|
|
||||||
const tabItems = [
|
|
||||||
{
|
|
||||||
key: 'config',
|
|
||||||
label: '配置',
|
|
||||||
children: (
|
|
||||||
<Spin spinning={loading}>
|
|
||||||
{config && (
|
|
||||||
<Descriptions size="small" column={2} style={{ marginBottom: 24 }}>
|
|
||||||
<Descriptions.Item label="CorpId">{config.corpId || '-'}</Descriptions.Item>
|
|
||||||
<Descriptions.Item label="AppKey">{config.agentId || '-'}</Descriptions.Item>
|
|
||||||
<Descriptions.Item label="启用同步">
|
|
||||||
<Tag color={config.startEnable ? 'green' : 'default'}>
|
|
||||||
{config.startEnable ? '已启用' : '未启用'}
|
|
||||||
</Tag>
|
|
||||||
</Descriptions.Item>
|
|
||||||
</Descriptions>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<Alert
|
|
||||||
type="info"
|
|
||||||
message="配置钉钉应用凭证后,可使用组织架构同步、考勤导入和排班同步功能。"
|
|
||||||
style={{ marginBottom: 24 }}
|
|
||||||
showIcon
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Form form={form} layout="vertical" style={{ maxWidth: 480 }}>
|
|
||||||
<Form.Item name="corpId" label="CorpId(企业ID)" rules={[{ required: true, message: '请输入 CorpId' }]}>
|
|
||||||
<Input placeholder="dingxxxxxxxx" />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item name="agentId" label="AppKey(应用凭证)" rules={[{ required: true, message: '请输入 AppKey' }]}>
|
|
||||||
<Input placeholder="从钉钉开放平台获取" />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
name="appSecret"
|
|
||||||
label="AppSecret(应用密钥)"
|
|
||||||
rules={[{ required: true, message: '请输入 AppSecret' }]}
|
|
||||||
extra="保存后仅返回脱敏信息,重新编辑时需再次输入完整密钥"
|
|
||||||
>
|
|
||||||
<Input.Password placeholder="从钉钉开放平台获取" />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item name="startEnable" label="启用同步" valuePropName="checked">
|
|
||||||
<Switch />
|
|
||||||
</Form.Item>
|
|
||||||
<Space>
|
|
||||||
<PermissionButton permission="integration:trigger" type="primary" icon={<SaveOutlined />} loading={saving} onClick={handleSave}>
|
|
||||||
保存配置
|
|
||||||
</PermissionButton>
|
|
||||||
<Button icon={<ApiOutlined />} loading={testing} onClick={handleTest}>
|
|
||||||
测试连接
|
|
||||||
</Button>
|
|
||||||
</Space>
|
|
||||||
</Form>
|
|
||||||
</Spin>
|
|
||||||
),
|
|
||||||
},
|
|
||||||
...syncTabItems,
|
|
||||||
];
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card title="钉钉集成配置" extra={
|
<Card
|
||||||
<Space>
|
title="钉钉集成配置"
|
||||||
{verified === true && <Tag icon={<CheckCircleOutlined />} color="success">已连接</Tag>}
|
extra={
|
||||||
{verified === false && <Tag icon={<CloseCircleOutlined />} color="error">未连接</Tag>}
|
<Space>
|
||||||
</Space>
|
{verified === true && (
|
||||||
}>
|
<Tag icon={<CheckCircleOutlined />} color="success">
|
||||||
<Tabs items={tabItems} />
|
已连接
|
||||||
|
</Tag>
|
||||||
|
)}
|
||||||
|
{verified === false && (
|
||||||
|
<Tag icon={<CloseCircleOutlined />} color="error">
|
||||||
|
未连接
|
||||||
|
</Tag>
|
||||||
|
)}
|
||||||
|
</Space>
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Spin spinning={loading}>
|
||||||
|
{config && (
|
||||||
|
<Descriptions size="small" column={2} style={{ marginBottom: 24 }}>
|
||||||
|
<Descriptions.Item label="CorpId">{config.corpId || '-'}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="AppKey">{config.agentId || '-'}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="同步方式">手动触发</Descriptions.Item>
|
||||||
|
</Descriptions>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<Alert
|
||||||
|
type="info"
|
||||||
|
message="配置钉钉应用凭证后,可在本页手动获取组织架构并导入用户。排班同步仍在排课管理中手动触发。"
|
||||||
|
style={{ marginBottom: 24 }}
|
||||||
|
showIcon
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Form form={form} layout="vertical" style={{ maxWidth: 520 }}>
|
||||||
|
<Form.Item
|
||||||
|
name="corpId"
|
||||||
|
label="CorpId(企业ID)"
|
||||||
|
rules={[{ required: true, message: '请输入 CorpId' }]}
|
||||||
|
>
|
||||||
|
<Input placeholder="dingxxxxxxxx" />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
name="agentId"
|
||||||
|
label="AppKey(应用凭证)"
|
||||||
|
rules={[{ required: true, message: '请输入 AppKey' }]}
|
||||||
|
>
|
||||||
|
<Input placeholder="从钉钉开放平台获取" />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
name="appSecret"
|
||||||
|
label="AppSecret(应用密钥)"
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: isAppSecretRequired(!!config),
|
||||||
|
message: '首次配置请输入 AppSecret',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
extra={
|
||||||
|
config
|
||||||
|
? '已保存密钥;留空保持原值,输入新值将替换原密钥'
|
||||||
|
: '首次配置需要填写完整 AppSecret'
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Input.Password
|
||||||
|
placeholder={config ? '留空保持已保存的密钥' : '从钉钉开放平台获取'}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
<Space>
|
||||||
|
<PermissionButton
|
||||||
|
permission="integration:trigger"
|
||||||
|
type="primary"
|
||||||
|
icon={<SaveOutlined />}
|
||||||
|
loading={saving}
|
||||||
|
onClick={handleSave}
|
||||||
|
>
|
||||||
|
保存配置
|
||||||
|
</PermissionButton>
|
||||||
|
<Button icon={<ApiOutlined />} loading={testing} onClick={handleTest}>
|
||||||
|
测试连接
|
||||||
|
</Button>
|
||||||
|
</Space>
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
{syncPanel && (
|
||||||
|
<>
|
||||||
|
<Divider titlePlacement="start">组织用户导入</Divider>
|
||||||
|
{syncPanel}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Spin>
|
||||||
</Card>
|
</Card>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -0,0 +1,26 @@
|
|||||||
|
import { describe, expect, it } from 'vitest';
|
||||||
|
import {
|
||||||
|
buildDingTalkConfigPayload,
|
||||||
|
isAppSecretRequired,
|
||||||
|
} from './integration-config-form';
|
||||||
|
|
||||||
|
describe('DingTalk integration config form', () => {
|
||||||
|
it('requires AppSecret only for the first configuration', () => {
|
||||||
|
expect(isAppSecretRequired(false)).toBe(true);
|
||||||
|
expect(isAppSecretRequired(true)).toBe(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('builds a manual-sync config without the retired startEnable flag', () => {
|
||||||
|
expect(
|
||||||
|
buildDingTalkConfigPayload({
|
||||||
|
corpId: 'ding-corp',
|
||||||
|
agentId: 'app-key',
|
||||||
|
appSecret: '',
|
||||||
|
}),
|
||||||
|
).toEqual({
|
||||||
|
corpId: 'ding-corp',
|
||||||
|
agentId: 'app-key',
|
||||||
|
appSecret: undefined,
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
export interface DingTalkConfigFormValues {
|
||||||
|
agentId: string;
|
||||||
|
appSecret?: string;
|
||||||
|
corpId: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const isAppSecretRequired = (hasSavedConfig: boolean) => !hasSavedConfig;
|
||||||
|
|
||||||
|
export const buildDingTalkConfigPayload = (values: DingTalkConfigFormValues) => ({
|
||||||
|
corpId: values.corpId.trim(),
|
||||||
|
agentId: values.agentId.trim(),
|
||||||
|
appSecret: values.appSecret?.trim() || undefined,
|
||||||
|
});
|
||||||
@@ -1,18 +1,16 @@
|
|||||||
/** 钉钉配置 */
|
/** 钉钉配置 */
|
||||||
export interface DingTalkThirdConfig {
|
export interface DingTalkThirdConfig {
|
||||||
agentId: string; // AppKey
|
agentId: string; // AppKey
|
||||||
appSecret: string; // AppSecret
|
appSecret?: string; // AppSecret;更新已有配置时可留空保留旧值
|
||||||
corpId: string; // CorpId
|
corpId: string; // CorpId
|
||||||
startEnable: boolean; // 是否启用同步
|
|
||||||
appId?: string; // 内部应用ID,用于消息推送(可选)
|
appId?: string; // 内部应用ID,用于消息推送(可选)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 企微配置 */
|
/** 企微配置 */
|
||||||
export interface WeComThirdConfig {
|
export interface WeComThirdConfig {
|
||||||
agentId: string;
|
agentId: string;
|
||||||
appSecret: string;
|
appSecret?: string;
|
||||||
corpId: string;
|
corpId: string;
|
||||||
startEnable: boolean;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 对外返回的配置(脱敏后,不含 appSecret) */
|
/** 对外返回的配置(脱敏后,不含 appSecret) */
|
||||||
|
|||||||
@@ -0,0 +1,49 @@
|
|||||||
|
import { IntegrationConfigService } from './integration-config.service';
|
||||||
|
|
||||||
|
describe('IntegrationConfigService.testConnection', () => {
|
||||||
|
const originalFetch = global.fetch;
|
||||||
|
|
||||||
|
afterEach(() => {
|
||||||
|
global.fetch = originalFetch;
|
||||||
|
jest.restoreAllMocks();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('uses the saved AppSecret when testing an existing configuration with a blank secret', async () => {
|
||||||
|
const configRepo = {
|
||||||
|
findOne: jest.fn().mockResolvedValue({ id: 1, type: 'THIRD' }),
|
||||||
|
};
|
||||||
|
const detailRepo = {
|
||||||
|
findOne: jest.fn().mockResolvedValue({
|
||||||
|
configId: 1,
|
||||||
|
type: 'DINGTALK_SYNC',
|
||||||
|
content: JSON.stringify({
|
||||||
|
config: {
|
||||||
|
corpId: 'ding-corp',
|
||||||
|
agentId: 'saved-key',
|
||||||
|
appSecret: 'saved-secret',
|
||||||
|
},
|
||||||
|
}),
|
||||||
|
}),
|
||||||
|
};
|
||||||
|
global.fetch = jest.fn().mockResolvedValue({
|
||||||
|
json: jest.fn().mockResolvedValue({ accessToken: 'token' }),
|
||||||
|
}) as never;
|
||||||
|
|
||||||
|
const service = new IntegrationConfigService(configRepo as never, detailRepo as never);
|
||||||
|
|
||||||
|
await expect(
|
||||||
|
service.testConnection('DINGTALK', {
|
||||||
|
corpId: 'ding-corp',
|
||||||
|
agentId: 'saved-key',
|
||||||
|
appSecret: '',
|
||||||
|
}),
|
||||||
|
).resolves.toBe(true);
|
||||||
|
|
||||||
|
expect(global.fetch).toHaveBeenCalledWith(
|
||||||
|
'https://api.dingtalk.com/v1.0/oauth2/accessToken',
|
||||||
|
expect.objectContaining({
|
||||||
|
body: JSON.stringify({ appKey: 'saved-key', appSecret: 'saved-secret' }),
|
||||||
|
}),
|
||||||
|
);
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -125,7 +125,12 @@ export class IntegrationConfigService {
|
|||||||
config: DingTalkThirdConfig | WeComThirdConfig,
|
config: DingTalkThirdConfig | WeComThirdConfig,
|
||||||
): Promise<boolean> {
|
): Promise<boolean> {
|
||||||
try {
|
try {
|
||||||
const token = await this.getTokenForTest(type, config as unknown as Record<string, unknown>);
|
const finalConfig = { ...config } as Record<string, unknown>;
|
||||||
|
if (!finalConfig.appSecret) {
|
||||||
|
const savedConfig = await this.getRawConfig(type);
|
||||||
|
if (savedConfig?.appSecret) finalConfig.appSecret = savedConfig.appSecret;
|
||||||
|
}
|
||||||
|
const token = await this.getTokenForTest(type, finalConfig);
|
||||||
return !!token;
|
return !!token;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
this.logger.error(`连接测试失败: ${(e as Error).message}`);
|
this.logger.error(`连接测试失败: ${(e as Error).message}`);
|
||||||
|
|||||||
Reference in New Issue
Block a user