feat: ✨ 查询表格组件

anyone-yuren · Dec 11, 2023 · db12e1f · db12e1f
1 parent 8351dbc
commit db12e1f
Show file tree

Hide file tree

Showing 31 changed files with 1,781 additions and 481 deletions.
diff --git a/packages/gbeata/src/GAction/index.tsx b/packages/gbeata/src/GAction/index.tsx
@@ -7,8 +7,8 @@ import { Modal } from 'antd';
 import React, { useContext, useState } from 'react';
 import GButton from '../GButton';
 import { info, success } from '../GMessage';
+import { GSearchTableContext } from '../GSearchTable/context';
 import { EditableContext } from '../GTable/context';
-import { MwSearchTableContext } from '../MwSearchTable/context';
 import locale from '../locale';
 import { AnyKeyProps } from '../types/AnyKeyProps';
 import { getKey, getRowKey } from '../utils';
@@ -371,7 +371,7 @@ export const getActionProps = (
 };
 
 export default function MwAction(props: GActionProps) {
-  const searchTable: any = useContext(MwSearchTableContext);
+  const searchTable: any = useContext(GSearchTableContext);
   const form = useContext(EditableContext);
   const actionProps = getActionProps(props, searchTable, form);
   return <GButton {...actionProps} />;

diff --git a/packages/gbeata/src/GDialogForm/g-dialog-form.d.ts b/packages/gbeata/src/GDialogForm/g-dialog-form.d.ts
@@ -1,10 +1,7 @@
 import { ModalProps } from 'antd/lib/modal';
 import { ReactNode } from 'react';
 import { Field } from '../GForm/g-form';
-import {
-  ExtendField,
-  MwSearchTableField,
-} from '../MwSearchTable/mw-search-table';
+import { ExtendField, GSearchTableField } from '../GSearchTable/g-search-table';
 import { AnyKeyProps } from '../types/AnyKeyProps';
 
 declare type ModeType = 'add' | 'update' | 'view' | 'custom' | string;
@@ -15,7 +12,7 @@ export interface GDialogFormProps extends ModalProps {
   /** 用抽屉来展示 */
   drawer?: boolean;
   /** 表单项 */
-  fields?: Array<GDialogFormField | MwSearchTableField>;
+  fields?: Array<GDialogFormField | GSearchTableField>;
   /** form 的 span */
   span?: number;
   /** 新增 api */

diff --git a/packages/gbeata/src/GField/index.d.ts b/packages/gbeata/src/GField/index.d.ts
@@ -1,8 +1,8 @@
 import { GFormField } from '../GForm/g-form';
-import { MwSearchTableField } from '../MwSearchTable/mw-search-table';
+import { GSearchTableField } from '../GSearchTable/g-search-table';
 
 declare const GField: React.ForwardRefExoticComponent<
-  (MwSearchTableField | GFormField) & React.RefAttributes<HTMLDivElement>
+  (GSearchTableField | GFormField) & React.RefAttributes<HTMLDivElement>
 >;
 
 export default GField;
diff --git a/packages/gbeata/src/GField/index.tsx b/packages/gbeata/src/GField/index.tsx
@@ -1,6 +1,6 @@
 import { GFormField } from '../GForm/g-form';
-import { MwSearchTableField } from '../MwSearchTable/mw-search-table';
+import { GSearchTableField } from '../GSearchTable/g-search-table';
 
-export default function GField(_: GFormField | MwSearchTableField) {
+export default function GField(_: GFormField | GSearchTableField) {
   return null;
 }
diff --git a/packages/gbeata/src/GForm/GFormList.tsx b/packages/gbeata/src/GForm/GFormList.tsx
@@ -1,7 +1,7 @@
 import { CopyOutlined, DeleteOutlined, PlusOutlined } from '@ant-design/icons';
 import { Button, Form, Space, Tooltip } from 'antd';
 import React, { useEffect, useState } from 'react';
-import { MwSearchTableField } from '../MwSearchTable/mw-search-table';
+import { GSearchTableField } from '../GSearchTable/g-search-table';
 import {
   FORM_TYPE_DATE,
   FORM_TYPE_DATE_RANGE,
@@ -17,7 +17,7 @@ interface AyFormListProps {
   formInstant: AnyKeyProps;
   ayFormProps: GFormProps;
   getFormItem: (
-    fields: Array<GFormField | MwSearchTableField>,
+    fields: Array<GFormField | GSearchTableField>,
     formInstans: AnyKeyProps,
     props: GFormProps,
     childrenType?: 'group' | 'card' | 'input-group' | 'list',
@@ -115,7 +115,7 @@ export default function GFormList(props: AyFormListProps) {
                     }
                   }
                   return newField;
-                }) as Array<GFormField | MwSearchTableField>,
+                }) as Array<GFormField | GSearchTableField>,
                 formInstant,
                 ayFormProps,
                 FORM_TYPE_LIST,

diff --git a/packages/gbeata/src/GForm/g-form.d.ts b/packages/gbeata/src/GForm/g-form.d.ts
@@ -1,5 +1,5 @@
 import { CSSProperties, ReactNode } from 'react';
-import { MwSearchTableField } from '../MwSearchTable/mw-search-table';
+import { GSearchTableField } from '../GSearchTable/g-search-table';
 import { AnyKeyProps } from '../types/AnyKeyProps';
 import { FormValues } from '../types/FormValues';
 
@@ -14,7 +14,7 @@ export interface ColSize {
 
 export interface GFormProps {
   /** 配置项 */
-  fields?: Array<GFormField | MwSearchTableField>;
+  fields?: Array<GFormField | GSearchTableField>;
   /** form 名称 */
   name?: string;
   /** 子元素 */
@@ -220,5 +220,5 @@ export interface GFormField extends Field {
  */
 export type FieldListener = (
   value: any,
-  field: GFormField | MwSearchTableField,
+  field: GFormField | GSearchTableField,
 ) => void;
diff --git a/packages/gbeata/src/GForm/index.tsx b/packages/gbeata/src/GForm/index.tsx
@@ -14,9 +14,9 @@ import React, {
   useState,
 } from 'react';
 import { convertChildrenToField } from '../GFields/convertFields';
-import { MwSearchField } from '../GSearch/g-search';
+import { GSearchField } from '../GSearch/g-search';
+import { GSearchTableField } from '../GSearchTable/g-search-table';
 import MwCard from '../MwCard';
-import { MwSearchTableField } from '../MwSearchTable/mw-search-table';
 import { theme } from '../Theme';
 import {
   FORM_TYPE_CARD,
@@ -73,8 +73,8 @@ install(registerField);
  * @param field 配置项
  */
 const getNoVisibleField = (
-  field: GFormField | MwSearchTableField,
-): GFormField | MwSearchTableField => {
+  field: GFormField | GSearchTableField,
+): GFormField | GSearchTableField => {
   return {
     ...field,
     title: '',
@@ -86,7 +86,7 @@ const getNoVisibleField = (
  * 生成 placeholder
  * @param field 配置项
  */
-const getPlaceholder = (field: GFormField | MwSearchTableField): string => {
+const getPlaceholder = (field: GFormField | GSearchTableField): string => {
   const defaultProps = field.props;
 
   if (defaultProps && defaultProps.placeholder) {
@@ -136,10 +136,10 @@ const getPlaceholder = (field: GFormField | MwSearchTableField): string => {
  * @param fields 配置列表
  */
 export const getDefaultValue = (
-  fields: Array<GFormField | MwSearchField | MwSearchTableField>,
+  fields: Array<GFormField | GSearchField | GSearchTableField>,
 ) => {
   let form: AnyKeyProps = {};
-  fields.forEach((field: GFormField | MwSearchField | MwSearchTableField) => {
+  fields.forEach((field: GFormField | GSearchField | GSearchTableField) => {
     if (
       [FORM_TYPE_CARD, FORM_TYPE_GROUP, FORM_TYPE_INPUT_GROUP].includes(
         field.type || '',
@@ -201,7 +201,7 @@ export const getDefaultValue = (
 
 export const getFieldDefaultValue = (
   key: string,
-  fields: Array<GFormField | MwSearchField | MwSearchTableField>,
+  fields: Array<GFormField | GSearchField | GSearchTableField>,
 ) => {
   if (!key) {
     return '';
@@ -274,8 +274,8 @@ const usedKeys = [
  * @param field 配置项
  */
 const getTag = (
-  field: GFormField | MwSearchTableField,
-  fields: Array<GFormField | MwSearchTableField>,
+  field: GFormField | GSearchTableField,
+  fields: Array<GFormField | GSearchTableField>,
   formInstans: AnyKeyProps,
   readonly?: boolean,
   childrenType?: string,
@@ -320,15 +320,15 @@ const getTag = (
  * @param childrenType 子类型
  */
 const getFormItem = (
-  fields: Array<GFormField | MwSearchTableField>,
+  fields: Array<GFormField | GSearchTableField>,
   formInstans: AnyKeyProps,
   props: GFormProps,
   childrenType?: 'group' | 'card' | 'input-group' | 'list',
 ) => {
   const { span, readonly, formLayout, gutter } = props;
   const ayFormProps: GFormProps = props;
 
-  return fields.map((field: GFormField | MwSearchTableField, index: number) => {
+  return fields.map((field: GFormField | GSearchTableField, index: number) => {
     // 把其它属性 添加到 props 里面
     field = {
       ...field,
@@ -346,7 +346,7 @@ const getFormItem = (
         children = [children];
       }
       let content = getFormItem(
-        children as Array<GFormField | MwSearchTableField>,
+        children as Array<GFormField | GSearchTableField>,
         formInstans,
         ayFormProps,
         FORM_TYPE_CARD,
@@ -476,7 +476,7 @@ const getFormItem = (
         tag = (
           <Row className="g-form-group" {...field.props}>
             {getFormItem(
-              field.children as Array<GFormField | MwSearchTableField>,
+              field.children as Array<GFormField | GSearchTableField>,
               formInstans,
               ayFormProps,
               FORM_TYPE_GROUP,
@@ -489,7 +489,7 @@ const getFormItem = (
         tag = (
           <Input.Group compact {...field.props}>
             {getFormItem(
-              field.children as Array<GFormField | MwSearchTableField>,
+              field.children as Array<GFormField | GSearchTableField>,
               formInstans,
               ayFormProps,
               FORM_TYPE_INPUT_GROUP,
@@ -541,11 +541,11 @@ const getFormItem = (
 
 const getField = (
   key: string,
-  fields: Array<GFormField | MwSearchTableField>,
+  fields: Array<GFormField | GSearchTableField>,
 ) => {
-  let field: GFormField | MwSearchTableField | null = null;
+  let field: GFormField | GSearchTableField | null = null;
 
-  const loop = (fields: Array<GFormField | MwSearchTableField>) => {
+  const loop = (fields: Array<GFormField | GSearchTableField>) => {
     for (let i = 0; i < fields.length; i++) {
       let item = fields[i];
       if (item.key === key) {
@@ -569,7 +569,7 @@ const getField = (
  */
 const formatValues = (
   values: AnyKeyProps,
-  fields: Array<GFormField | MwSearchTableField>,
+  fields: Array<GFormField | GSearchTableField>,
 ): AnyKeyProps => {
   let result: AnyKeyProps = {};
   for (let key in values) {
@@ -635,7 +635,7 @@ const formatValues = (
  */
 const handleConfirm = (
   values: AnyKeyProps,
-  fields: Array<GFormField | MwSearchTableField>,
+  fields: Array<GFormField | GSearchTableField>,
   onConfirm?: (values: FormValues) => void,
   onFinish?: (values: FormValues) => void,
   onSubmit?: (values: FormValues) => void,
@@ -662,7 +662,7 @@ const handleConfirm = (
 const handleChange = (
   changedValues: AnyKeyProps,
   allValues: AnyKeyProps,
-  fields: Array<GFormField | MwSearchTableField>,
+  fields: Array<GFormField | GSearchTableField>,
   setFieldsValue: (params: AnyKeyProps) => void,
 ) => {
   for (let key in changedValues) {
@@ -841,11 +841,11 @@ export default forwardRef(function GForm(props: GFormProps, ref: Ref<any>) {
    * @returns object
    */
   const getValues = (
-    fields: GFormField | MwSearchTableField,
+    fields: GFormField | GSearchTableField,
     readonly?: boolean,
   ) => {
     let result: AnyKeyProps = {};
-    fields?.forEach((field: GFormField | MwSearchTableField) => {
+    fields?.forEach((field: GFormField | GSearchTableField) => {
       if (!field.key) {
         return;
       }

diff --git a/packages/gbeata/src/GList/context.ts b/packages/gbeata/src/GList/context.ts
@@ -1,7 +1,7 @@
 import { createContext } from 'react';
 import { AnyKeyProps } from '../types/AnyKeyProps';
 
-export const MwListContext = createContext<AnyKeyProps>({
+export const GListContext = createContext<AnyKeyProps>({
   // 当前列表的数据
   data: [],
   // 已经禁用的 row 组成的 key

diff --git a/packages/gbeata/src/GSearch/g-search.d.ts b/packages/gbeata/src/GSearch/g-search.d.ts
@@ -1,9 +1,9 @@
 import { GFormField } from '../GForm/g-form';
-import { ExtendField } from '../MwSearchTable/mw-search-table';
+import { ExtendField } from '../GSearchTable/g-search-table';
 import { AnyKeyProps } from '../types/AnyKeyProps';
 
 export interface GSearchProps {
-  fields: Array<MwSearchField>;
+  fields: Array<GSearchField>;
   onConfirm?(values: AnyKeyProps): void;
   onReset?(): void;
   formExtend?: AnyKeyProps;

diff --git a/packages/gbeata/src/MwSearchTable/context.ts → packages/gbeata/src/GSearchTable/context.ts b/packages/gbeata/src/MwSearchTable/context.ts → packages/gbeata/src/GSearchTable/context.ts
@@ -1,7 +1,7 @@
-import { AnyKeyProps } from '../types/AnyKeyProps'
-import { createContext } from 'react'
+import { createContext } from 'react';
+import { AnyKeyProps } from '../types/AnyKeyProps';
 
-export const MwSearchTableContext = createContext<AnyKeyProps>({
+export const GSearchTableContext = createContext<AnyKeyProps>({
   // 查询区域表单控制
   formRef: { current: undefined },
   // 表格控制
@@ -23,5 +23,5 @@ export const MwSearchTableContext = createContext<AnyKeyProps>({
   // 当前查询表格控制
   searchTableRef: { current: undefined },
   // 所有编辑表格的数据
-  setEditTableRow: (ary: any[]) => {}
-})
+  setEditTableRow: (ary: any[]) => {},
+});
diff --git a/...ta/src/MwSearchTable/mw-search-table.d.ts → ...eata/src/GSearchTable/g-search-table.d.ts b/...ta/src/MwSearchTable/mw-search-table.d.ts → ...eata/src/GSearchTable/g-search-table.d.ts
@@ -1,12 +1,12 @@
 import { SizeType } from 'antd/lib/config-provider/SizeContext';
 import { ReactNode } from 'react';
-import { Field, GFormField } from '../GForm/g-form';
-import { MwTableCtrlField, MwTableField } from '../GTable/mw-table';
 import {
+  GDialogFormField,
+  GDialogFormProps,
   ModeType,
-  MwDialogFormField,
-  MwDialogFormProps,
-} from '../MwDialogForm/g-dialog-form';
+} from '../GDialogForm/g-dialog-form';
+import { Field, GFormField } from '../GForm/g-form';
+import { GTableCtrlField, GTableField } from '../GTable/g-table';
 import { AnyKeyProps } from '../types/AnyKeyProps';
 import { FormValues } from '../types/FormValues';
 import { Record } from '../types/Record';
@@ -26,11 +26,11 @@ export interface SearchTableInitConfig extends AnyKeyProps {
   extraFullscreenVisible?: boolean;
 }
 
-export interface MwSearchTableProps extends SearchTableInitConfig {
+export interface GSearchTableProps extends SearchTableInitConfig {
   /** 标题 */
   title?: string | ReactNode;
   /** 配置项 */
-  fields?: Array<MwSearchTableField>;
+  fields?: Array<GSearchTableField>;
   /** 子元素 */
   children?: Array<ReactNode> | ReactNode;
   /** 请求列表接口 */
@@ -40,7 +40,7 @@ export interface MwSearchTableProps extends SearchTableInitConfig {
   /** 表格数据（当不需要 api，由自己控制时使用） */
   data?: Array<AnyKeyProps>;
   /** 表格操作列（写法跟正常的 filed 一致） */
-  ctrl?: MwTableCtrlField;
+  ctrl?: GTableCtrlField;
   /** 为空时表示没有选框 */
   selectionType?: 'checkbox' | 'radio';
   /** 选项改变事件 */
@@ -50,9 +50,9 @@ export interface MwSearchTableProps extends SearchTableInitConfig {
   /** 选择时列表展示的 key */
   selectShowKey?: string;
   /** dialog form 的配置 */
-  dialogFormExtend?: MwDialogFormProps;
+  dialogFormExtend?: GDialogFormProps;
   /** 弹窗表单的配置项 */
-  formField?: Array<MwDialogFormField>;
+  formField?: Array<GDialogFormField>;
   /** 滚动的 X 轴数值 */
   scrollX?: number;
   /** 表格高度 */
@@ -122,13 +122,13 @@ export interface ExtendField extends Omit<GFormField, 'key'> {
   hiddenMode?: Array<ModeType>;
 }
 
-export interface MwSearchTableField extends Field, MwTableField {
-  /** MwSearch 需要的扩展参数，里面的属性比外面的属性优先级更高 */
+export interface GSearchTableField extends Field, GTableField {
+  /** GSearch 需要的扩展参数，里面的属性比外面的属性优先级更高 */
   search?: ExtendField | boolean;
-  /** MwDialogForm 需要的扩展参数，里面的属性比外面的属性优先级更高 */
+  /** GDialogForm 需要的扩展参数，里面的属性比外面的属性优先级更高 */
   dialog?: ExtendField | boolean;
-  /** MwTable 需要的扩展参数，里面的属性比外面的属性优先级更高 */
-  table?: MwTableField | boolean;
+  /** GTable 需要的扩展参数，里面的属性比外面的属性优先级更高 */
+  table?: GTableField | boolean;
   [key: string]: any;
 }
 

diff --git a/packages/gbeata/src/GSearchTable/index.d.ts b/packages/gbeata/src/GSearchTable/index.d.ts
@@ -0,0 +1,9 @@
+import { GSearchTableField, GSearchTableProps } from './g-search-table';
+
+export { GSearchTableField };
+
+declare const GSearchTable: React.ForwardRefExoticComponent<
+  GSearchTableProps & React.RefAttributes<HTMLDivElement>
+>;
+
+export default GSearchTable;