@gientech/modual 2.0.8 → 2.0.9

package/src/modules/sensitive/index.tsx

@@ -0,0 +1,313 @@
+import React, { useState, useEffect, useMemo, useRef } from 'react';
+import { message, Modal, Form, Input } from 'antd';
+import { Plus } from 'lucide-react';
+import { Xviwer, CustomComponents } from '@mxmweb/xviewer';
+import { DashboardContainer, Button } from '@mxmweb/zui';
+import AxiosInstance from './server';
+import '@mxmweb/zui/style.css';
+
+const { confirm } = Modal;
+
+// 敏感词库数据类型定义
+interface SensitiveWordLibrary {
+  id: string;
+  name: string;
+  words: string[];
+  gmtCreate: string;
+  count: number;
+}
+
+const initialPage = {
+  pageNo: 1,
+  pageSize: 999,
+};
+
+// 业务层组件样式配置
+
+/**
+ * 敏感词配置业务层组件
+ * 使用 DynamicDashDataCore 的 table 功能实现敏感词库管理
+ * @param props 组件属性
+ */
+const SensitiveView: React.FC<{
+  url?: string;
+  token?: string;
+  role?: string;
+  CustomComponents?: CustomComponents;
+  eventsEmit?: (eventName: string, data: any) => void;
+}> = ({ url, token, role, eventsEmit, CustomComponents }) => {
+  const [status, setStatus] = useState<any>({
+    container: 'ready',
+    content: 'ready',
+  });
+
+  const coreRef = useRef<any>(null);
+
+  // 敏感词库数据状态
+  const [data, setData] = useState<
+    {
+      id: string;
+      data?: any[];
+    }[]
+  >();
+  // 新建表单
+  const [form] = Form.useForm();
+
+  // 新建表单弹窗状态
+  const [showCreateModal, setShowCreateModal] = useState(false);
+
+  const { getLibraryList, deleteLibrary, createLibrary } = AxiosInstance({ url, token, role });
+
+  useEffect(() => {
+    setStatus((prev: any) => ({ ...prev, content: 'loading' }));
+    handleFetchList();
+  }, []);
+
+  /**
+   * 处理获取敏感词列表
+   */
+  const handleFetchList = async () => {
+    try {
+      const res = await getLibraryList({
+        ...initialPage,
+      });
+      if (res) {
+        const _data = convertToTableData(res.records);
+        setData(_data || []);
+        setStatus((prev: any) => ({ ...prev, content: 'ready' }));
+      }
+    } catch (e) {
+      console.log('[DatabaseApiError]  getSensitiveList:', e);
+    }
+  };
+  /**
+   * 将敏感词库数据转换为表格数据格式
+   * @param libraries 敏感词库数组
+   * @returns 表格数据格式
+   */
+  const convertToTableData = (libraries: SensitiveWordLibrary[]) => {
+    return (libraries || []).map(library => ({
+      id: library.id,
+      data: [
+        { columnId: 'name', value: library.name, type: 'label' },
+        { columnId: 'sensitiveWords', value: library.words, type: 'tag' }, // 直接传递数组
+        { columnId: 'createDate', value: library.gmtCreate, type: 'date' },
+        { columnId: 'count', value: library.count, type: 'text' },
+        { columnId: 'actions', value: 'edit', label: '编辑', type: 'action' },
+        { columnId: 'actions', value: 'delete', label: '删除', type: 'action' },
+      ],
+    }));
+  };
+
+  // 表格配置
+  const tableConfig = useMemo(
+    () => ({
+      label: '敏感词配置',
+      model: null,
+      defaultActiveId: 'sensitive-table',
+
+      views: [
+        {
+          id: 'sensitive-table',
+          label: '敏感词库列表',
+          type: 'table',
+          viewBehavior: 'pagination' as const, //or pagination
+          allowMultiSelect: false,
+          viewPageSize: 10,
+          columns: [
+            {
+              title: '名称',
+              id: 'name',
+              type: 'label',
+            },
+            {
+              title: '敏感词',
+              id: 'sensitiveWords',
+              type: 'tag', // 使用 tag 类型，直接传递数组
+            },
+            {
+              title: '创建日期',
+              id: 'createDate',
+              type: 'date',
+            },
+            {
+              title: '数量',
+              id: 'count',
+              type: 'text',
+            },
+            {
+              title: '操作',
+              id: 'actions',
+              type: 'action',
+            },
+          ],
+          toolbar: [
+            {
+              type: 'button' as const,
+              key: 'create',
+              label: '新建敏感词库',
+              btnType: 'primary' as const,
+              icon: <Plus size={16} />,
+            },
+            {
+              type: 'fuzzy_search' as const,
+              key: 'search',
+              label: '请输入内容',
+              searchKeys: ['name', 'sensitiveWords'],
+              position: 'right',
+            },
+          ],
+        },
+      ],
+    }),
+    [data]
+  );
+
+  /**
+   * 处理新建敏感词库
+   */
+  const handleCreateLibrary = async () => {
+    try {
+      const value = await form.validateFields();
+      if (value) {
+        console.log('===val', value);
+        const res = await createLibrary({
+          ...value,
+          words: [],
+        });
+        if (res && coreRef?.current) {
+          const newLibrary: any = {
+            id: res,
+            data: [
+              { columnId: 'name', value: value.name, type: 'label' },
+              { columnId: 'sensitiveWords', value: [], type: 'tag' }, // 直接传递数组
+              {
+                columnId: 'createDate',
+                value: new Date()
+                  .toLocaleString('zh-CN', {
+                    year: '2-digit',
+                    month: '2-digit',
+                    day: '2-digit',
+                    hour: '2-digit',
+                    minute: '2-digit',
+                  })
+                  .replace(/\//g, '-'),
+                type: 'date',
+              },
+              { columnId: 'count', value: 0, type: 'text' },
+              { columnId: 'actions', value: 'edit', label: '编辑', type: 'action' },
+              { columnId: 'actions', value: 'delete', label: '删除', type: 'action' },
+            ],
+          };
+          coreRef?.current?.appFn?.addItem(newLibrary, { animate: true, position: 'start' });
+          message.success('新增敏感词成功!');
+        }
+      }
+    } catch (e) {
+      console.error('新增敏感词失败!');
+    } finally {
+      setShowCreateModal(false);
+      form.resetFields();
+    }
+  };
+
+  async function handleEventsEmit(name: string, data: any, appFn: any) {
+    console.log('[SensitiveView] 事件触发:', name, data);
+
+    switch (name) {
+      case 'toolbar_create':
+        // 新建敏感词库
+        setShowCreateModal(true);
+        break;
+      case 'table_action_delete': {
+        try {
+          // 删除敏感词库
+          confirm({
+            title: '确认删除敏感词库？',
+            content: '删除后，该敏感词库将无法恢复',
+            okText: '删除',
+            cancelText: '取消',
+            async onOk() {
+              const res = await deleteLibrary(data.id);
+              if (res && coreRef?.current) {
+                console.log('=====', coreRef?.current.appFn);
+
+                coreRef?.current.appFn.removeItem(data.id);
+                message.success(`删除成功`);
+              }
+            },
+            onCancel() {
+              console.log('Cancel');
+            },
+          });
+        } catch (e) {
+          console.error('删除敏感词库失败', e);
+        }
+        break;
+      }
+
+      default:
+        // 透传其他事件
+        if (typeof eventsEmit === 'function') {
+          eventsEmit(name, data);
+        }
+        break;
+    }
+  }
+
+  return (
+    <DashboardContainer title="敏感词库管理">
+      <Xviwer
+        dataSource={data}
+        ref={coreRef}
+        eventsEmit={handleEventsEmit}
+        status={status}
+        CustomComponents={{
+          ...CustomComponents,
+        }}
+        {...tableConfig}
+      />
+      <Modal
+        title="新建敏感词库"
+        open={showCreateModal}
+        width={520}
+        destroyOnHidden
+        onCancel={() => {
+          setShowCreateModal(false);
+          form.resetFields();
+        }}
+        footer={
+          <div
+            className="w-full flex flex-row"
+            style={{
+              justifyContent: 'end',
+              gap: '10px',
+            }}
+          >
+            <Button
+              mode="default"
+              label="取消"
+              onClick={() => {
+                setShowCreateModal(false);
+                form.resetFields();
+              }}
+            />
+            <Button mode="primary" label="确认" onClick={handleCreateLibrary} />
+          </div>
+        }
+      >
+        <Form form={form}>
+          <Form.Item
+            label={null}
+            name="name"
+            rules={[{ required: true, message: '请输入敏感词库名称!' }]}
+          >
+            <Input placeholder="请输入" />
+          </Form.Item>
+        </Form>
+      </Modal>
+    </DashboardContainer>
+  );
+};
+
+export default SensitiveView;

package/src/modules/sensitive/server.ts

@@ -0,0 +1,122 @@
+import { message } from 'antd';
+import axios from 'axios';
+const specialErrorCodes = ['10014'];
+
+type IDataSourceType = 'DataTable' | 'DirectDB';
+
+interface SensitiveApiProps {
+  url?: string;
+  token?: string;
+  role?: string;
+}
+const AxiosInstance = ({ url, token, role }: SensitiveApiProps) => {
+  const axios$ = axios.create({
+    baseURL: url,
+    // 配置请求超时时间
+    timeout: 1000000,
+  });
+  // 请求拦截
+  axios$.interceptors.request.use((config: any) => {
+    let target_cookie = token;
+
+    const noA = ['user/login', 'user/kaptcha', 'user/regist'];
+    // dangerous behaviour
+    if (!target_cookie && !noA.some((item: string) => config.url.includes(item))) {
+      window.location.pathname = '/login';
+      return;
+    }
+
+    config.headers.Authorization = target_cookie || '';
+    // 这里传中文会报错
+    config.headers.userName = role === '未登录用户' ? '' : role;
+    // config.headers.userId = roleId;
+    return config;
+  });
+  // 返回拦截
+  axios$.interceptors.response.use(
+    response => {
+      // 获取接口返回结果
+      const noA = ['user/kaptcha'];
+      const res = response.data;
+      if (noA.some((item: string) => response.config.url && response.config.url.includes(item))) {
+        return res;
+      }
+      if (res.size && res.type) {
+        return res;
+      }
+      const { success, errorMsg, errorCode } = res;
+      // 处理特殊错误码的情况,页面自己处理错误，例如上传文件重复
+      if (specialErrorCodes.includes(errorCode)) {
+        return res;
+      }
+      if (success) return res;
+      message.error(errorMsg || '请求出错，请稍后再试');
+      return false;
+    },
+    error => {
+      // 主动取消请求，不给报错信息
+      if (error.message === 'canceled') {
+        return;
+      }
+      if (
+        error?.response?.data?.errorCode === '30013' ||
+        error?.response?.data?.errorCode === '30023'
+      ) {
+        message.error((error?.response?.data || {}).errorMsg || '请求出错，请稍后再试');
+        // location.pathname = '/login';
+      }
+      if (error?.response?.status === 401) {
+        console.log('Error url:', error?.request?.responseURL);
+        message.error((error?.response?.data || {}).errorMsg || '没有足够权限');
+        //window.location.pathname = "/login";
+      }
+      console.log('Error occurs', error);
+      if ('未设置默认配置！' != (error?.response?.data || {}).errorMsg) {
+        message.error((error?.response?.data || {}).errorMsg || '请求出错，请稍后再试');
+      }
+    }
+  );
+  const getLibraryList = async (params: any) => {
+    try {
+      const res: any = await axios$.get(`/library?${new URLSearchParams(params).toString()}`);
+      const { success, data } = res;
+      if (success) return data;
+      return false;
+    } catch (e) {
+      console.log('e', e);
+      return false;
+    }
+  };
+
+  const createLibrary = async (params: any) => {
+    try {
+      const res: any = await axios$.post(`/library`, params);
+      const { success, data } = res;
+      if (success) return data;
+      return false;
+    } catch (e) {
+      console.log('e', e);
+      return false;
+    }
+  };
+
+  const deleteLibrary = async (id: any) => {
+    try {
+      const res: any = await axios$.delete(`/library/${id}`);
+      const { success, data } = res;
+      if (success) return data;
+      return false;
+    } catch (e) {
+      console.log('e', e);
+      return false;
+    }
+  };
+
+  return {
+    getLibraryList,
+    createLibrary,
+    deleteLibrary,
+  };
+};
+
+export default AxiosInstance;