@quansitech/antd-admin 1.1.0 → 1.1.2

package/components/ModalContext.ts

@@ -1,16 +0,0 @@
-import {createContext} from "react";
-
-export type ModalContextProps = {
-    inModal: boolean,
-    closeModal: () => void,
-    contexts?: Record<string, any>
-    setAfterClose(callback: () => void): void
-}
-
-export const ModalContext = createContext<ModalContextProps>({
-    inModal: false,
-    closeModal: () => {
-    },
-    setAfterClose: (fn: Function) => {
-    },
-})

package/components/Table/Action/Button.tsx

@@ -1,89 +0,0 @@
-import {Button, Popconfirm} from "antd";
-import {useContext, useEffect, useState} from "react";
-import {TableContext} from "../../TableContext";
-import http from "../../../lib/http";
-import {modalShow, routerNavigateTo} from "../../../lib/helpers";
-import {TableActionProps} from "./types";
-
-export default function (props: TableActionProps & {
-    props: Record<string, any>,
-    link?: {
-        url: string,
-    },
-    request?: RequestOptions,
-    modal?: ModalOptions,
-}) {
-    const tableContext = useContext(TableContext)
-
-    const onClick = async () => {
-        const rowKey = tableContext.getTableProps().rowKey
-        if (props.link) {
-            routerNavigateTo(props.link.url)
-            return
-        }
-
-        if (props.request) {
-            setLoading(true)
-            const data = props.request.data || {}
-            if (props.relateSelection) {
-                data.selection = props.selectedRows?.map(item => item[rowKey])
-                for (const key in data) {
-                    if (typeof data[key] !== 'string') {
-                        continue
-                    }
-                    const matches = data[key].match(/^__(\w+)__$/)
-                    if (!matches) {
-                        continue
-                    }
-                    data[key] = props.selectedRows?.map(item => item[matches[1]])
-                }
-            }
-            try {
-                await http({
-                    url: props.request.url,
-                    method: props.request.method,
-                    headers: props.request.headers || {},
-                    data: data,
-                })
-            } finally {
-                setLoading(false)
-            }
-            return
-        }
-
-        if (props.modal) {
-            await modalShow(props.modal)
-            return
-        }
-
-        await tableContext.actionRef?.reload()
-    }
-
-    const [loading, setLoading] = useState(false)
-
-    const [disabled, setDisabled] = useState(props.props.disabled)
-
-    useEffect(() => {
-        if (!props.relateSelection) {
-            return
-        }
-        setDisabled(props.selectedRows?.length === 0)
-
-    }, [props.selectedRows]);
-
-
-    const ButtonComponent = () => {
-        if (props.request?.confirm) {
-            return <Popconfirm title={props.request.confirm} onConfirm={onClick}>
-                <Button loading={loading} {...props.props} disabled={disabled}>{props.title}</Button>
-            </Popconfirm>
-        } else {
-            return <Button loading={loading} onClick={onClick} {...props.props}
-                           disabled={disabled}>{props.title}</Button>
-        }
-    }
-
-    return <>
-        <ButtonComponent></ButtonComponent>
-    </>
-}

package/components/Table/Action/StartEditable.tsx

@@ -1,59 +0,0 @@
-import {Button, ButtonProps, Space} from "antd";
-import {TableContext} from "../../TableContext";
-import {useContext, useState} from "react";
-import http from "../../../lib/http";
-import {TableActionProps} from "./types";
-
-export default function (props: TableActionProps & {
-    props: ButtonProps,
-    saveRequest: {
-        url: string,
-        method: string,
-    },
-}) {
-    const tableContext = useContext(TableContext)
-
-    const onStartClick = () => {
-        const rowKey = tableContext.getTableProps().rowKey
-        tableContext.getTableProps().dataSource.map(item => {
-            tableContext.actionRef?.startEditable(item[rowKey], item)
-        })
-    }
-
-    const onCancelClick = () => {
-        const rowKey = tableContext.getTableProps().rowKey
-        tableContext.getTableProps().dataSource.map(item => {
-            tableContext.actionRef?.cancelEditable(item[rowKey])
-        })
-    }
-
-    const [loading, setLoading] = useState(false)
-
-    const onSaveClick = async () => {
-        setLoading(true)
-
-        try {
-            await http({
-                method: props.saveRequest.method,
-                url: props.saveRequest.url,
-                data: tableContext.getEditedValues(),
-            })
-
-            await tableContext.actionRef?.reload()
-        } finally {
-            setLoading(false)
-        }
-        onCancelClick()
-    }
-
-    return <>
-        {tableContext.editableKeys.length > 0
-            ?
-            <Space>
-                <Button loading={loading} type={'primary'} onClick={onSaveClick}>保存</Button>
-                <Button danger={true} onClick={onCancelClick}>取消</Button>
-            </Space>
-            : <Button {...props.props} onClick={onStartClick}>{props.title}</Button>
-        }
-    </>
-}

package/components/Table/ToolbarActions.tsx

@@ -1,44 +0,0 @@
-import {lazy, useEffect, useState} from "react";
-import container from "../../lib/container";
-import {ReactComponentLike} from "prop-types";
-import {Badge, Space} from "antd";
-import {TableActionProps} from "./Action/types";
-import {upperFirst} from "lodash";
-
-export default function ({
-                             actions,
-                             selectedRows,
-                         }: {
-    actions: TableActionProps[],
-    selectedRows?: any[]
-}) {
-    const [components, setComponents] = useState<{
-        Component: ReactComponentLike,
-        props: TableActionProps,
-    }[]>([])
-
-    useEffect(() => {
-        setComponents(actions.map(a => {
-            return {
-                Component: lazy(container.get('Table.Action.' + upperFirst(a.type))),
-                props: {
-                    ...a,
-                },
-            }
-        }))
-
-    }, []);
-
-
-    return <>
-        <Space wrap={true}>
-            {components.map(c => (
-                c.props.badge ?
-                    <Badge key={c.props.title} count={c.props.badge} style={{zIndex: 100}}>
-                        <c.Component {...c.props} selectedRows={selectedRows}></c.Component>
-                    </Badge> :
-                    <c.Component key={c.props.title} {...c.props} selectedRows={selectedRows}></c.Component>
-            ))}
-        </Space>
-    </>
-}

package/components/Table.tsx

@@ -1,280 +0,0 @@
-import React, {lazy, Suspense, useContext, useEffect, useRef, useState} from "react";
-import {
-    ActionType,
-    FormInstance,
-    ProColumnType,
-    ProSkeleton,
-    ProTable,
-    ProTableProps
-} from "@ant-design/pro-components";
-import type {SortOrder} from "antd/lib/table/interface";
-import {TablePaginationConfig} from "antd/es/table";
-import {cloneDeep, isArray, uniqueId, upperFirst} from "lodash"
-import {TableContext} from "./TableContext";
-import ToolbarActions from "./Table/ToolbarActions";
-import container from "../lib/container";
-import {TableActionProps} from "./Table/Action/types";
-import http from "../lib/http";
-import {Spin} from "antd";
-import "./Table.scss"
-import {ModalContext} from "./ModalContext";
-import {commonHandler} from "../lib/schemaHandler";
-
-export type TableProps = ProTableProps<any, any> & {
-    columns: ProColumnType[],
-    dataSource: any[],
-    pagination: TablePaginationConfig & {
-        paramName?: string,
-    },
-    rowKey: string,
-    defaultSearchValue?: Record<string, any>,
-    actions: TableActionProps[],
-    searchUrl: string,
-    search?: boolean,
-    extraRenderValues?: Record<string, any>[],
-}
-
-export default function (props: TableProps) {
-
-    const request = async (params: Record<string, any> & {
-        pageSize: number,
-        current: number
-    }, sort: Record<string, SortOrder>, filter: Record<string, (string | number)[] | null>) => {
-        setLoading(true)
-        const data: Record<string, any> = {
-            ...params,
-            ...filter,
-            sort,
-        }
-        if (props.pagination) {
-            data[props.pagination.paramName || 'page'] = data.current
-            delete data.current
-            delete data.pageSize
-        }
-
-        setEditableKeys([])
-        setEditableValues([])
-
-        try {
-            const res = await http.get(props.searchUrl, {
-                params: data,
-                headers: {
-                    'X-Table-Search': '1'
-                }
-            })
-
-            if (res.data.pagination) {
-                setPagination({
-                    ...res.data.pagination,
-                    current: params.current,
-                })
-            }
-            return {
-                data: res.data.dataSource || [],
-                success: true,
-            }
-        } finally {
-            setLoading(false)
-        }
-    }
-
-    const formRef = useRef<FormInstance>()
-    const actionRef = useRef<ActionType>()
-    const [editableKeys, setEditableKeys] = useState<React.Key[]>(() => [])
-    const [columns, setColumns] = useState<ProColumnType[]>([])
-    const [selectedRows, setSelectedRows] = useState<any[]>([])
-    const [editableValues, setEditableValues] = useState<Record<string, any>[]>([])
-    const [loading, setLoading] = useState(false)
-    const [initialized, setInitialized] = useState(false)
-    const [pagination, setPagination] = useState<TablePaginationConfig>()
-    const [dataSource, setDataSource] = useState<any[]>([])
-    const [sticky, setSticky] = useState<TableProps['sticky']>(true)
-
-    const modalContext = useContext(ModalContext)
-
-    useEffect(() => {
-        setPagination(props.pagination as TablePaginationConfig || false)
-        setDataSource(postData(props.dataSource))
-
-        // 重新定义列
-        setColumns(cloneDeep(props.columns)?.map((c: ProColumnType) => {
-            c.key = c.dataIndex as string
-
-            // 列render
-            const renderComponent = 'Column.Readonly.' + upperFirst(c.valueType as string)
-            if (container.check(renderComponent)) {
-                const Component = lazy(container.get(renderComponent))
-                c.render = (dom, record, index, action) =>
-                    <Suspense fallback={<Spin/>}>
-                        <Component {...c}
-                                   schema={c}
-                                   key={c.title as string}
-                                   index={index}
-                                   record={record}
-                        ></Component>
-                    </Suspense>
-            }
-
-            // 列查询及编辑render
-            const formItemComponent = 'Column.' + upperFirst(c.valueType as string)
-            if (container.check(formItemComponent)) {
-                const Component = lazy(container.get(formItemComponent))
-                c.renderFormItem = (schema, config, form) => (
-                    <Suspense fallback={<Spin/>}>
-                        <Component config={config}
-                                   form={form}
-                                   index={schema.index}
-                                   schema={schema}
-                                   fieldProps={c.fieldProps}
-                                   key={c.title as string}
-                        ></Component>
-                    </Suspense>
-                )
-            }
-
-            if (props.defaultSearchValue?.[c.dataIndex as string] !== undefined) {
-                c.initialValue = props.defaultSearchValue[c.dataIndex as string]
-            }
-
-            commonHandler(c)
-            if (container.schemaHandler[c.valueType as string]) {
-                return container.schemaHandler[c.valueType as string](c) as ProColumnType
-            }
-
-            return c
-        }))
-
-        setLoading(false)
-        setInitialized(true)
-
-        if (!modalContext.inModal) {
-            setSticky({
-                offsetHeader: document.querySelector('.ant-layout-header')?.clientHeight || 56,
-            })
-        }
-
-    }, []);
-
-    const postData = (data: any[]) => {
-        if (!isArray(data)) {
-            return data
-        }
-
-        props.columns.map(column => {
-            switch (column.valueType) {
-                case 'dateTime':
-                    data = data.map(row => {
-                        const v = row[column.dataIndex]
-                        if (parseInt(v) == v && v < 4102444800) {
-                            row[column.dataIndex] *= 1000
-                        }
-                        return row
-                    })
-                    break;
-            }
-        })
-
-        return data.map(row => {
-            if (typeof row[props.rowKey] === 'undefined') {
-                row[props.rowKey] = uniqueId('row_')
-            }
-            return row
-        })
-    }
-
-
-    return <>
-        <TableContext.Provider value={{
-            getTableProps: () => props,
-            getEditedValues: () => editableValues,
-            editableKeys: editableKeys,
-            actionRef: actionRef.current,
-            formRef: formRef.current,
-            extraRenderValues: props.extraRenderValues,
-        }}>
-            {!initialized && <ProSkeleton type={"list"} list={2}></ProSkeleton>}
-            <ProTable rowKey={props.rowKey}
-                      style={{display: initialized ? 'block' : 'none'}}
-                      tableClassName={'qs-antd-table'}
-                      columns={columns}
-                      onDataSourceChange={setDataSource}
-                      dataSource={dataSource}
-                      pagination={pagination}
-                      loading={loading}
-                      scroll={{x: true}}
-                      postData={postData}
-                      sticky={sticky}
-                      form={{
-                          onValuesChange(changedValues) {
-                              const key = Object.keys(changedValues)[0]
-                              const c = columns.find(c => c.dataIndex === key) as ProColumnType & {
-                                  searchOnChange: boolean
-                              }
-                              if (!c) {
-                                  return
-                              }
-                              // 是否立即搜索
-                              if (c.searchOnChange) {
-                                  formRef.current?.submit()
-                              }
-                          }
-                      }}
-                      rowSelection={props.rowSelection && {
-                          alwaysShowAlert: false,
-                          selectedRowKeys: selectedRows.map(item => item[props.rowKey]),
-                          onSelect(record, selected) {
-                              if (selected) {
-                                  setSelectedRows([...selectedRows, record])
-                              } else {
-                                  setSelectedRows(selectedRows.filter(item => item[props.rowKey] !== record[props.rowKey]))
-                              }
-                          },
-                          onChange(selectedRowKeys, newSelectedRows, info) {
-                              switch (info.type) {
-                                  case 'all':
-                                      if (newSelectedRows.length) {
-                                          setSelectedRows([
-                                              ...selectedRows,
-                                              ...newSelectedRows.filter(item => !selectedRows.find(s => s[props.rowKey] == item[props.rowKey]))
-                                          ])
-                                      } else {
-                                          setSelectedRows(selectedRows.filter(item => !dataSource.find(dr => dr[props.rowKey] == item[props.rowKey])))
-                                      }
-                                      break;
-                                  case 'none':
-                                      setSelectedRows([])
-                                      break;
-                              }
-                          },
-                      }}
-                      toolbar={{
-                          filter: true,
-                      }}
-                      toolBarRender={(action) => [
-                          <ToolbarActions key={'actions'} actions={props.actions}
-                                          selectedRows={selectedRows}></ToolbarActions>
-                      ]}
-                      editable={{
-                          type: 'multiple',
-                          editableKeys: editableKeys,
-                          onChange: setEditableKeys,
-                          onValuesChange(record) {
-                              setEditableValues([
-                                  ...editableValues.filter(item => item[props.rowKey] !== record[props.rowKey]),
-                                  record
-                              ])
-                          }
-                      }}
-                      cardBordered
-                      manualRequest={true}
-                      request={request}
-                      formRef={formRef}
-                      actionRef={actionRef}
-                      search={props.search}
-                      dateFormatter={props.dateFormatter}
-            ></ProTable>
-
-        </TableContext.Provider>
-    </>
-}
-

package/components/TableContext.ts

@@ -1,15 +0,0 @@
-import React, {createContext} from "react";
-import {ActionType} from "@ant-design/pro-components";
-import {TableProps} from "./Table";
-import {FormInstance} from "antd/lib/form";
-
-type TableContextValue = {
-    getTableProps: () => TableProps,
-    getEditedValues: () => Record<string, any>[],
-    editableKeys: React.Key[],
-    actionRef?: ActionType,
-    formRef?: FormInstance,
-    extraRenderValues?: Record<string, any>[],
-}
-
-export const TableContext = createContext({} as TableContextValue)

package/components/Tabs.tsx

@@ -1,72 +0,0 @@
-import {Tabs} from "antd";
-import {lazy, Suspense, useEffect, useState} from "react";
-import type {Tab} from 'rc-tabs/lib/interface';
-import container from "../lib/container";
-import {routerNavigateTo} from "../lib/helpers";
-import {upperFirst} from "lodash";
-import {ProSkeleton} from "@ant-design/pro-components";
-
-type TabProps = {
-    title: string,
-    url?: string,
-    pane?: {
-        component: 'form' | 'table',
-        props: any,
-    }
-}
-
-export type TabsPageType = {
-    tabs: Record<string, TabProps>,
-    defaultActiveKey?: string,
-}
-
-export default function (props: TabsPageType) {
-    const [items, setItems] = useState<Tab[]>([]);
-    const [activeKey, setActiveKey] = useState<string>();
-
-    useEffect(() => {
-        setActiveKey(props.defaultActiveKey || Object.keys(props.tabs)[0])
-
-        setItems(Object.keys(props.tabs).map(key => {
-            const t = props.tabs[key]
-
-            if (!t.pane) {
-                return {
-                    key,
-                    label: t.title,
-                    children: <>
-                        <ProSkeleton list={2}></ProSkeleton>
-                    </>
-                }
-            }
-
-            const Component = lazy(() => container.get('Tab.Pane.' + upperFirst(t.pane?.component)))
-
-            return {
-                key,
-                label: t.title,
-                children: <>
-                    <Suspense>
-                        <Component {...t.pane.props}></Component>
-                    </Suspense>
-                </>
-            }
-        }))
-    }, []);
-
-    const onChange = (key: string) => {
-        setActiveKey(key)
-
-        const tab = props.tabs[key]
-        if (tab.url) {
-            routerNavigateTo(tab.url)
-        }
-    }
-
-    return <>
-        <Tabs items={items}
-              onChange={onChange}
-              activeKey={activeKey}
-        ></Tabs>
-    </>
-}

package/lib/container.ts

@@ -1,84 +0,0 @@
-import {schemaHandler} from "./schemaHandler";
-import {routerNavigateTo} from "./helpers";
-
-const components: Record<string, any> = {}
-
-const container = {
-    register(name: string, componentLoader: any) {
-        if (this.check(name)) {
-            throw new Error(`Component ${name} already registered`)
-        }
-        components[name] = componentLoader
-    },
-    get(name: string) {
-        if (!this.check(name)) {
-            throw new Error(`Component ${name} is not registered`)
-        }
-        return components[name]
-    },
-    check(name: string) {
-        return !!components[name]
-    },
-    schemaHandler,
-    routerNavigateTo,
-};
-
-function autoRegister(prefix: string, components: Record<string, () => Promise<any>>) {
-    for (const [key, value] of Object.entries(components)) {
-        const name = key.split('/').pop()?.split('.').shift()
-        container.register(prefix + name, value)
-    }
-}
-
-// -------- 通用 -----------
-{
-    const columnRender = import.meta.glob('../components/Column/*.tsx')
-    autoRegister('Column.', columnRender)
-
-    // readonly render
-    const columnReadonlyRender = import.meta.glob('../components/Column/Readonly/*.tsx')
-    autoRegister('Column.Readonly.', columnReadonlyRender)
-}
-
-// -------- 弹窗 -----------
-{
-    container.register('Modal.Table', import('../components/Table'))
-    container.register('Modal.Form', import('../components/Form'))
-}
-
-// -------- Tabs -----------
-{
-    container.register('Tab.Pane.Table', import('../components/Table'))
-    container.register('Tab.Pane.Form', import('../components/Form'))
-}
-
-// -------- 表格 -----------
-{
-    // column.action render
-    const optionsRender = import.meta.glob('../components/Column/Readonly/Action/*.tsx')
-    autoRegister('Column.Readonly.Action.', optionsRender)
-
-    // action render
-    const actionRender = import.meta.glob('../components/Table/Action/*.tsx')
-    autoRegister('Table.Action.', actionRender)
-}
-
-// -------- 表单 -----------
-{
-
-    // formAction render
-    const formActionRender = import.meta.glob('../components/Form/Action/*.tsx')
-    autoRegister('Form.Action.', formActionRender)
-}
-
-
-;((globalThis: any) => {
-    if (globalThis.$qsContainer) {
-        return;
-    }
-
-    globalThis.$qsContainer = container
-
-})(window)
-
-export default container

package/lib/customRule.ts

@@ -1,10 +0,0 @@
-import {RuleObject, StoreValue} from "rc-field-form/lib/interface";
-
-const customRule: Record<string, (rule: RuleObject, value: StoreValue, callback: (error?: string) => void) => any> = {
-    notInEnum(rule, value) {
-        return !rule.enum?.includes(value);
-
-    }
-}
-
-export default customRule

package/lib/global.ts

@@ -1,11 +0,0 @@
-import {MessageInstance} from "antd/es/message/interface";
-import {ModalStaticFunctions} from "antd/es/modal/confirm";
-import {NotificationInstance} from "antd/es/notification/interface";
-
-const global = {} as {
-    message: MessageInstance,
-    modal: Omit<ModalStaticFunctions, 'warn'>,
-    notification: NotificationInstance,
-}
-
-export default global