@quansitech/antd-admin 1.1.0 → 1.1.2

package/components/Column/Readonly/Action/Link.tsx

@@ -1,78 +0,0 @@
-import React, {useContext, useState} from "react";
-import {modalShow, replaceParams, replaceUrl, routerNavigateTo} from "../../../../lib/helpers";
-import {Button, Popconfirm, Spin} from "antd";
-import {TableContext} from "../../../TableContext";
-import http from "../../../../lib/http";
-import {TableColumnOptionProps} from "./types";
-
-type Props = TableColumnOptionProps & {
-    href?: string,
-    request?: RequestOptions,
-    modal?: ModalOptions,
-    modalByField?: string,
-    danger?: boolean
-}
-
-export default function (props: Props) {
-
-    const [loading, setLoading] = useState(false)
-    const tableContext = useContext(TableContext)
-
-    const onClick = async (e: any) => {
-        setLoading(true)
-        try {
-            if (props.href) {
-                routerNavigateTo(replaceUrl(props.href, props.record))
-                return
-            }
-            if (props.request) {
-                await http({
-                    method: props.request.method,
-                    url: replaceUrl(props.request.url, props.record),
-                    headers: props.request.headers || {},
-                    data: props.request.data ? replaceParams(props.request.data, props.record) : null,
-                })
-
-                await tableContext.actionRef?.reload()
-            }
-            if (props.modal) {
-                let url
-                if (props.modal.content.url) {
-                    url = replaceUrl(props.modal.content.url, props.record)
-                }
-                await modalShow({
-                    ...props.modal,
-                    contexts: {
-                        tableContext,
-                    },
-                    content: {
-                        ...props.modal.content,
-                        url,
-                    },
-                })
-            }
-            if (props.modalByField) {
-                const m = props.record[props.modalByField]
-                await modalShow({
-                    ...m,
-                    contexts: {
-                        tableContext,
-                    },
-                })
-            }
-        } finally {
-            setLoading(false)
-        }
-    }
-
-    return <>
-        <Spin spinning={loading}>
-            {props.request?.confirm
-                ? <Popconfirm title={props.request?.confirm} onConfirm={onClick}>
-                    <Button type={"link"} danger={props.danger} onClick={() => {
-                    }}>{props.title}</Button>
-                </Popconfirm> : <Button type={"link"} danger={props.danger} onClick={onClick}>{props.title}</Button>
-            }
-        </Spin>
-    </>
-}

package/components/Column/Readonly/Action.tsx

@@ -1,80 +0,0 @@
-import {Component, lazy, useEffect, useState} from "react";
-import {ReactComponentLike} from "prop-types";
-import container from "../../../lib/container";
-import {Badge, Flex} from "antd";
-import {ColumnReadonlyProps} from "./types";
-import {asyncFilter, handleRules} from "../../../lib/helpers";
-import {Rules} from "@rc-component/async-validator/lib/interface";
-import {upperFirst} from "lodash";
-import {TableColumnActionProps} from "./Action/types";
-
-type ComponentType = {
-    component: ReactComponentLike,
-    props: any,
-}
-
-export default ({actions, record}: ColumnReadonlyProps & {
-    actions?: {
-        type: string,
-        title: string,
-        showRules?: Rules,
-        badge?: any,
-    }[],
-}) => {
-
-    const [Components, setComponents] = useState<ComponentType[]>([]);
-
-    useEffect(() => {
-        if (actions) {
-            asyncFilter(actions, async (Component) => {
-                if (!Component.showRules) {
-                    return true
-                }
-                return await handleRules(Component.showRules, record)
-            }).then((Components: TableColumnActionProps[]) => setComponents(Components.map(a => {
-                let badge = a.badge
-                const matches = (badge + '').match(/^__(\w+)__$/)
-                if (matches) {
-                    badge = record[matches[1]]
-                }
-
-                const c = `Column.Readonly.Action.${upperFirst(a.type)}`
-                return {
-                    props: {
-                        ...a,
-                        record,
-                        badge,
-                    },
-                    component: lazy(container.get(c)),
-                }
-            })))
-        }
-    }, []);
-
-
-    return <>
-        {
-            <Flex wrap={true}>
-                {
-                    Components.map(Component => (
-                        Component.props.badge ?
-                            <Badge key={Component.props.title}
-                                   count={Component.props.badge}
-                                   offset={[-12, 6]}
-                                   size={'small'}
-                                   styles={{
-                                       indicator: {
-                                           zIndex: 100,
-                                           padding: '0 4px',
-                                       }
-                                   }}>
-                                <Component.component
-                                    key={Component.props.title} {...Component.props}></Component.component>
-                            </Badge> :
-                            <Component.component key={Component.props.title} {...Component.props}></Component.component>
-                    ))
-                }
-            </Flex>
-        }
-    </>
-}

package/components/Column/Readonly/Cascader.tsx

@@ -1,51 +0,0 @@
-import {ColumnReadonlyProps} from "./types";
-import {ReactNode, useEffect, useState} from "react";
-import http from "../../../lib/http";
-
-export default function (props: ColumnReadonlyProps & {
-    schema: {
-        fieldProps: {
-            loadDataUrl: string
-        }
-    }
-}) {
-    const [text, setText] = useState<ReactNode>('-');
-
-    useEffect(() => {
-        setText(props.dom)
-        const value = props.entity.value
-
-        // 远程获取数据
-        if (props.schema.fieldProps?.loadDataUrl) {
-            http({
-                url: props.schema.fieldProps.loadDataUrl,
-                method: 'get',
-                params: {
-                    value,
-                }
-            }).then(res => {
-                if (!value) {
-                    return
-                }
-                const findValue = (options: any[], value: any): any => {
-                    for (let i = 0; i < options.length; i++) {
-                        const option = options[i];
-                        if (option.value === value) {
-                            return [option.label]
-                        } else if (option.children) {
-                            return [option.label, ...findValue(option.children, value)]
-                        }
-                    }
-                }
-
-                setText(findValue(res.data, value).join(' / '))
-
-            })
-        }
-
-    }, []);
-
-    return <div className={props.entity.className}>
-        {text}
-    </div>
-}

package/components/Column/Readonly/File.tsx

@@ -1,53 +0,0 @@
-import {ColumnReadonlyProps} from "./types";
-import {Spin, Upload, UploadFile} from "antd";
-import React, {useContext, useEffect, useState} from "react";
-import {FormContext} from "../../FormContext";
-import {UploadListType} from "antd/es/upload/interface";
-import {TableContext} from "../../TableContext";
-
-export default function (props: ColumnReadonlyProps & {
-    listType?: UploadListType,
-    onPreview?: (file: UploadFile) => void,
-}) {
-
-    const [loading, setLoading] = useState(true);
-    const [fileList, setFileList] = useState<UploadFile[]>([]);
-    const formContext = useContext(FormContext);
-    const tableContext = useContext(TableContext);
-
-    useEffect(() => {
-        let extraRenderValue = [];
-        if (formContext && formContext.extraRenderValues) {
-            extraRenderValue = formContext.extraRenderValues[props.schema.dataIndex as string] ?? []
-        } else if (tableContext && tableContext.extraRenderValues) {
-            extraRenderValue = tableContext.extraRenderValues[props.index]?.[props.schema.dataIndex as string] ?? []
-        }
-        setFileList(extraRenderValue.map((item: any) => {
-            return {
-                uid: item.id,
-                status: 'done',
-                url: item.url,
-                name: item.name,
-                hash_id: item.hash_id,
-                response: {
-                    file_id: item.id,
-                    url: item.url,
-                }
-            }
-        }))
-
-        setLoading(false)
-    }, []);
-
-
-    return <>
-        <Spin spinning={loading}>
-            <Upload
-                disabled={true}
-                listType={props.listType || 'text'}
-                fileList={fileList}
-                onPreview={props.onPreview}
-            ></Upload>
-        </Spin>
-    </>
-}

package/components/Column/Readonly/Image.tsx

@@ -1,39 +0,0 @@
-import {ColumnReadonlyProps} from "./types";
-import {Image, UploadFile} from "antd";
-import {FileType, getBase64} from "../../../lib/upload";
-import React, {useState} from "react";
-import File from "./File";
-
-export default function (props: ColumnReadonlyProps) {
-
-    const [previewImage, setPreviewImage] = useState('');
-    const [previewOpen, setPreviewOpen] = useState(false);
-
-    const handlePreview = async (file: UploadFile) => {
-        if (!file.url && !file.preview) {
-            file.preview = await getBase64(file.originFileObj as FileType);
-        }
-
-        setPreviewImage(file.url || (file.preview as string));
-        setPreviewOpen(true);
-    };
-
-
-    return <>
-        <File {...props}
-              listType="picture-card"
-              onPreview={handlePreview}
-        ></File>
-        {previewImage && (
-            <Image
-                wrapperStyle={{display: 'none'}}
-                preview={{
-                    visible: previewOpen,
-                    onVisibleChange: (visible) => setPreviewOpen(visible),
-                    afterOpenChange: (visible) => !visible && setPreviewImage(''),
-                }}
-                src={previewImage}
-            />
-        )}
-    </>
-}

package/components/Column/Readonly/Ueditor.tsx

@@ -1,18 +0,0 @@
-import {ColumnReadonlyProps} from "./types";
-import {useEffect, useState} from "react";
-
-export default function (props: ColumnReadonlyProps) {
-
-    const [value, setValue] = useState(props.entity.value);
-
-    useEffect(() => {
-        const div = document.createElement('div');
-        div.innerHTML = props.entity.value;
-        setValue(div.innerText);
-    }, []);
-
-
-    return <>
-        <div className={'article-content'} dangerouslySetInnerHTML={{__html: value}}/>
-    </>
-}

package/components/Column/Ueditor.tsx

@@ -1,314 +0,0 @@
-import {ColumnProps} from "./types";
-import {Component} from "react";
-import {createScript, filterObjectKeys} from "../../lib/helpers";
-import {Spin} from "antd";
-import {ModalContext, ModalContextProps} from "../ModalContext";
-import {uniqueId} from "lodash";
-
-declare global {
-    interface Window {
-        UE: any,
-        UE_LOADING_PROMISE: Promise<any>,
-    }
-}
-
-export default class Ueditor extends Component<ColumnProps & {
-    fieldProps: {
-        ueditorPath: string,
-    }
-}, any> {
-    modalContext = {} as ModalContextProps
-
-    editor: any = null
-    catching = false
-    containerRef: HTMLElement | null = null
-    state = {
-        loading: true,
-        containerId: uniqueId('ueditor_'),
-        width: '',
-    }
-
-
-    componentDidMount() {
-        this.setState({
-            width: this.containerRef?.offsetWidth ? `${this.containerRef?.offsetWidth}px` : '100%'
-        })
-
-        this.props.rules?.push({
-            validator: async (rule: any, value: any) => {
-                if (this.catching) {
-                    throw new Error('正在抓取图片')
-                }
-                return true
-            },
-        })
-
-        if (!window.UE && !window.UE_LOADING_PROMISE) {
-            window.UE_LOADING_PROMISE =
-                createScript(this.props.fieldProps.configJsPath || this.props.fieldProps.ueditorPath + '/ueditor.config.js')
-                    .then(() => {
-                        return createScript(this.props.fieldProps.ueditorPath + '/ueditor.all.js')
-                    })
-                    .then(() => {
-                        return createScript(this.props.fieldProps.ueditorPath + '/lang/zh-cn/zh-cn.js')
-                    })
-        }
-
-        window.UE_LOADING_PROMISE.then(() => {
-            let that = this
-            window.UE.plugins['forceCatchRemoteImg'] = function () {
-                if (this.options.forcecatchremote) {
-                    this.addListener("afterpaste", function (t: any, a: any) {
-                        const load_src = that.props.fieldProps.ueditorPath + '/img/load.gif';
-                        const domUtils = window.UE.dom.domUtils;
-
-                        const parser = new DOMParser();
-                        const pasteDom = parser.parseFromString(a.html, "text/html");
-
-                        // @ts-ignore
-                        const allImgs = domUtils.getElementsByTagName(this.document, "img");
-                        const imgs = domUtils.getElementsByTagName(pasteDom, "img");
-
-                        let notCatch = (src: string) => {
-                            if (src.indexOf(location.host) !== -1) {
-                                return true;
-                            }
-                            if (/(^\.)|(^\/)/.test(src)) {
-                                return true;
-                            }
-                            return src.indexOf('img_catch_success') !== -1;
-
-                        }
-
-                        let catchGo = false;
-                        for (let i = 0; i < imgs.length; i++) {
-                            if (notCatch(imgs[i].src)) {
-                                continue
-                            }
-                            for (let l = 0; l < allImgs.length; l++) {
-                                if (allImgs[l].src == imgs[i].src) {
-                                    catchGo = true;
-                                    domUtils.setAttributes(allImgs[l], {
-                                        "src": load_src,
-                                        "_src": allImgs[l].src
-                                    });
-                                }
-                            }
-                        }
-
-                        if (catchGo) {
-                            //     $('.submit').trigger('startHandlePostData', '正在抓取图片');
-                            that.catching = true
-                            that.props.dataIndex && that.props.form?.validateFields([that.props.dataIndex])
-                        }
-                    });
-
-                    this.addListener("catchremotesuccess", function () {
-                        that.catching = false
-                        that.props.dataIndex && that.props.form?.validateFields([that.props.dataIndex])
-                        //     $('.submit').trigger('endHandlePostData');
-                    });
-                }
-
-            }
-
-            // plugins/insert_richtext.js
-            /**
-             * 抓取微信富文本
-             */
-            window.UE.plugin.register('insert_richtext', function () {
-                // @ts-ignore
-                const me = this;
-
-                function filter(div: HTMLElement) {
-                    const domUtils = window.UE.dom.domUtils;
-                    const browser = window.UE.browser;
-                    const utils = window.UE.utils;
-
-                    let html;
-                    let ci;
-                    if (div.firstChild) {
-                        //去掉cut中添加的边界值
-                        const nodes = domUtils.getElementsByTagName(div, 'span');
-                        for (let i = 0, ni; ni = nodes[i++];) {
-                            if (ni.id == '_baidu_cut_start' || ni.id == '_baidu_cut_end') {
-                                domUtils.remove(ni);
-                            }
-                        }
-
-                        if (browser.webkit) {
-
-                            let brs = div.querySelectorAll('div br');
-                            for (let i = 0, bi; bi = brs[i++];) {
-                                const pN = bi.parentNode as HTMLElement;
-                                if (pN) {
-                                    if (pN.tagName == 'DIV' && pN.childNodes.length == 1) {
-                                        pN.innerHTML = '<p><br/></p>';
-                                        domUtils.remove(pN);
-                                    }
-                                }
-                            }
-                            const divs = div.querySelectorAll('#baidu_pastebin');
-                            for (let i = 0, di; di = divs[i++];) {
-                                const tmpP = me.document.createElement('p');
-                                di.parentNode?.insertBefore(tmpP, di);
-                                while (di.firstChild) {
-                                    tmpP.appendChild(di.firstChild);
-                                }
-                                domUtils.remove(di);
-                            }
-
-                            const metas = div.querySelectorAll('meta');
-                            for (let i = 0, ci; ci = metas[i++];) {
-                                domUtils.remove(ci);
-                            }
-
-                            brs = div.querySelectorAll('br');
-                            for (let i = 0; ci = brs[i++];) {
-                                if (/^apple-/i.test(ci.className)) {
-                                    domUtils.remove(ci);
-                                }
-                            }
-                        }
-                        if (browser.gecko) {
-                            const dirtyNodes = div.querySelectorAll('[_moz_dirty]');
-                            for (let i = 0; ci = dirtyNodes[i++];) {
-                                ci.removeAttribute('_moz_dirty');
-                            }
-                        }
-                        if (!browser.ie) {
-                            const spans = div.querySelectorAll('span.Apple-style-span');
-                            for (let i = 0, ci; ci = spans[i++];) {
-                                domUtils.remove(ci, true);
-                            }
-                        }
-
-                        //ie下使用innerHTML会产生多余的\r\n字符，也会产生&nbsp;这里过滤掉
-                        html = div.innerHTML;//.replace(/>(?:(\s|&nbsp;)*?)</g,'><');
-
-                        //过滤word粘贴过来的冗余属性
-                        html = window.UE.filterWord(html);
-                        //取消了忽略空白的第二个参数，粘贴过来的有些是有空白的，会被套上相关的标签
-                        var root = window.UE.htmlparser(html);
-
-                        //如果给了过滤规则就先进行过滤
-                        if (me.options.filterRules) {
-                            window.UE.filterNode(root, me.options.filterRules);
-                        }
-                        //执行默认的处理
-                        me.filterInputRule(root);
-                        //针对chrome的处理
-                        if (browser.webkit) {
-                            var br = root.lastChild();
-                            if (br && br.type == 'element' && br.tagName == 'br') {
-                                root.removeChild(br)
-                            }
-                            utils.each(me.body.querySelectorAll('div'), function (node: HTMLElement) {
-                                if (domUtils.isEmptyBlock(node)) {
-                                    domUtils.remove(node, true)
-                                }
-                            })
-                        }
-                        html = {'html': root.toHtml()};
-                        me.fireEvent('beforepaste', html, root);
-                        //抢了默认的粘贴，那后边的内容就不执行了，比如表格粘贴
-                        if (!html.html) {
-                            return;
-                        }
-                        root = window.UE.htmlparser(html.html, true);
-                        //如果开启了纯文本模式
-                        if (me.queryCommandState('pasteplain') === 1) {
-                            me.execCommand('insertHtml', window.UE.filterNode(root, me.options.filterTxtRules).toHtml(), true);
-                        } else {
-                            //文本模式
-                            window.UE.filterNode(root, me.options.filterTxtRules);
-                            const txtContent = root.toHtml();
-                            //完全模式
-                            const htmlContent = html.html;
-
-                            const address = me.selection.getRange().createAddress(true);
-                            // @ts-ignore
-                            me.execCommand('insertHtml', me.getOpt('retainOnlyLabelPasted') === true ? getPureHtml(htmlContent) : htmlContent, true);
-                        }
-
-                        me.fireEvent("afterpaste", html);
-                    }
-                }
-
-
-                return {
-                    bindEvents: {
-                        'afterInsertRichText': function (e: Event, html: HTMLElement) {
-                            me.execCommand('cleardoc');
-                            filter.call(me, html);
-                            me.document.body.innerHTML = `<section>${html}</section>`;
-
-                            me.fireEvent('catchremoteimage');
-
-                            that.catching = true
-                            that.props.dataIndex && that.props.form?.validateFields([that.props.dataIndex])
-                            // $('.submit').trigger('startHandlePostData', '正在抓取图片');
-                        },
-                    },
-                    commands: {}
-                }
-            });
-
-
-            const config = {
-                ...this.props.fieldProps?.config,
-                forcecatchremote: typeof this.props.fieldProps?.config?.forcecatchremote === 'undefined' ? true : this.props.fieldProps.config.forcecatchremote,
-            }
-            if (this.modalContext?.inModal) {
-                config.zIndex = 2000
-                config.topOffset = 0
-            }
-
-            this.editor = window.UE.getEditor(this.state.containerId, config)
-            this.editor?.ready(() => {
-                const value = this.props.config.value
-                if (value) {
-                    const div = document.createElement('div')
-                    div.innerHTML = value
-                    this.editor?.setContent(div.innerText || '')
-                    this.props.form?.setFieldValue(this.props.dataIndex, this.editor?.getContent())
-                }
-
-                this.editor?.addListener('contentChange', () => {
-                    this.props.form?.setFieldValue(this.props.dataIndex, this.editor?.getContent())
-                })
-                this.setState({loading: false})
-            })
-        })
-
-    }
-
-    componentWillUnmount() {
-        this.editor?.destroy()
-    }
-
-    render() {
-        return <ModalContext.Consumer>
-            {
-                modalContext => {
-                    this.modalContext = modalContext
-                    return <div {...filterObjectKeys(this.props, [
-                        'id',
-                        'fieldProps',
-                        'onChange',
-                        'value',
-                        'form',
-                        'config',
-                        'rules',
-                        'ueditorPath',
-                        'dataIndex',
-                    ])} ref={el => this.containerRef = el}>
-                        <Spin spinning={this.state.loading}>
-                            <div id={this.state.containerId} style={{width: this.state.width}}/>
-                        </Spin>
-                    </div>
-                }
-            }
-        </ModalContext.Consumer>
-    }
-}