aldehyde 0.0.1 → 0.0.4

package/src/components/controls/entry-control.tsx

@@ -1,240 +0,0 @@
-import React from 'react'
-import {FieldConfig, ViewOrEdit} from "../tmpl/interface";
-import {Alert, Input, Select, Spin, Checkbox,Radio} from "antd";
-import Rfield from "./rfield";
-import ControlTypeSupportor from "../tmpl/control-type-supportor";
-import DatePicker from './date-picker';
-import Steps from "./steps";
-import InputNumber from "./input-number";
-import InputRange from "./input-range";
-import AutoComplete from "./auto-complete";
-import loadable from "@loadable/component";
-import HCDataSource from "../tmpl/hc-data-source";
-import Upload from '../controls/upload';
-import Progress from './progress'
-
-import EntitySelect from "./entity-select/entity-select";
-import PopoverEntitySelect from './entity-select/popover-entity-select'
-import ColorPicker from './color-picker'
-// import EntitySelect from "./entity-select/inner-entity-select";
-// import ChemStruc from "./chemstruc/graph";
-const  CheckboxGroup=Checkbox.Group;
-const RadioGroup=Radio.Group;
-const Loading = <Spin tip="Loading...">
-    <Alert
-        message="正在加载数据。。。"
-        description="初次访问加载数据较多，可能需要几秒或几分钟，请耐心等待！！"
-        type="info"
-    />
-</Spin>;
-const Signature = loadable(() =>
-    import("./signature"), {fallback: Loading});
-const ChemStruc = loadable(() =>
-    import("./chemstruc/graph"), {fallback: Loading});
-const HtmlEditor = loadable(() =>
-    import("./html-editor/draft"), {fallback: Loading});
-
-const {TextArea} = Input;
-
-interface EntryControlProps {
-    value?: any;
-    fieldConfig: FieldConfig;
-    onChange?: any;
-    id?:any;
-}
-
-function getOptions(mstrucId) {
-    const options = [];
-    const items = HCDataSource.getEnums(mstrucId);
-
-    if (items) {
-        items.map((item) => {
-            options.push({label: (item.order ? item.order + "." : "") + item.title, value: item.value})
-        })
-    }
-    return options;
-}
-
-
-function renderControl(id:any,fieldConfig: FieldConfig, fieldValue: any, onChange: any, width: any) {
-
-    let itemType = ControlTypeSupportor.getControlType(fieldConfig, fieldValue);
-
-    let entryControl = undefined;
-
-    let placeholder = !fieldConfig.disabled ? `请输入${fieldConfig.title}` : "无需输入";
-    let disabled: boolean = fieldConfig.disabled;
-
-    let viewOrEdit: ViewOrEdit = 'edit';
-    let controlProps = {
-       id, fieldConfig, itemType, viewOrEdit, onChange, disabled, value: fieldValue, style: {minWidth: 220, width: '100%'}
-    }
-
-    let antdControlProps = {
-        id, placeholder, disabled, value: fieldValue, onChange, style: {minWidth: 220, width: '100%'}
-    }
-
-    const unSupportControl = <Input
-        type="text"
-        placeholder={`暂未实现-${itemType}`}
-        disabled={true}
-    />;
-
-    switch (itemType) {
-        case 'int':
-        case 'decimal':
-        case 'float':
-        case 'double':
-        case 'intrange':
-        case 'decimalrange':
-            entryControl = <InputNumber
-                {...controlProps}
-            />
-            break;
-        case "text":
-            entryControl = <Input allowClear={true}
-                type="text"
-                {...antdControlProps}
-            />;
-            break;
-        case "range":
-            entryControl = <InputRange
-                // style={{width: scalableWidth}}
-                {...controlProps}
-            />;
-            break;
-        case 'select':
-            entryControl = <Select
-                {...antdControlProps}
-                notFoundContent="暂无选项"
-                allowClear={true}
-                showSearch
-                optionLabelProp={'value'}
-                optionFilterProp={'label'}
-                options={getOptions(fieldConfig.mstrucId)}
-            >
-            </Select>
-            break;
-        case 'multiselect':
-        case 'texttags':
-            entryControl = <Select
-                mode="multiple"
-                {...antdControlProps}
-                value={typeof (fieldValue) == 'string' ? fieldValue.split(',') : fieldValue}
-                notFoundContent="暂无选项"
-                allowClear={true}
-                showSearch
-                optionLabelProp={'value'}
-                optionFilterProp={'label'}
-                // filterOption={(input, option) => {
-                //     console.log('option', option);
-                //     return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
-                // }
-                // }
-                showArrow={true}
-                options={getOptions(fieldConfig.mstrucId)}
-            >
-            </Select>
-            break;
-        case "checkbox":
-            entryControl = <CheckboxGroup {...antdControlProps} options={getOptions(fieldConfig.mstrucId)} value={typeof (fieldValue) == 'string' ? fieldValue.split(',') : fieldValue}  />
-            break;
-        case "radio":
-            entryControl = <RadioGroup {...antdControlProps} options={getOptions(fieldConfig.mstrucId)} value={typeof (fieldValue) == 'string' ? fieldValue.split(',')[0] : fieldValue}  />
-            break;
-        case 'date-YY':
-        case 'daterange-YY':
-        case 'date-M1':
-        case 'daterange-M1':
-        case 'date':
-        case 'daterange':
-        case 'datetime-HH':
-        case 'datetimerange-HH':
-        case 'datetime-mm':
-        case 'datetimerange-mm':
-        case 'datetime':
-        case 'datetimerange':
-            entryControl = <DatePicker  {...controlProps}/>;
-            break;
-        case 'time-HH':
-        case 'timerange-HH':
-        case 'time-mm':
-        case 'timerange-mm':
-        case 'time':
-        case 'timerange':
-            entryControl = <DatePicker  {...controlProps}/>;
-            break;
-        case 'textarea':
-            entryControl =
-                <TextArea rows={6} allowClear={true}
-                          {...antdControlProps}
-                />
-            break;
-        case 'html':
-            entryControl = <HtmlEditor viewOrEdit={'edit'}  {...controlProps}></HtmlEditor>;
-            break;
-        case 'steps':
-            entryControl = <Steps {...controlProps}/>
-            break;
-        case 'password':
-            entryControl = unSupportControl;
-            break;
-        case 'preselect':
-            entryControl = <AutoComplete {...controlProps} />
-            break;
-        case 'caselect':
-            entryControl = unSupportControl;
-            break;
-        case 'relation':
-            entryControl = unSupportControl;
-            break;
-        case 'file':
-        case 'video':
-        case 'picture':
-            entryControl = <Upload {...controlProps} />
-            break;
-        case 'chemstruc':
-            entryControl = <ChemStruc viewOrEdit={'edit'} {...controlProps}></ChemStruc>
-            //entryControl =unSupportControl
-            break;
-        case 'relselect':
-        case 'refselect':
-        case 'entity-select':
-            entryControl=<EntitySelect maxSelected={fieldConfig.max?fieldConfig.max:undefined} {...controlProps}  />
-            //  entryControl = <EntitySelect  {...controlProps} sourceName={'rcriteria'}></EntitySelect>
-            break;
-        case 'table-entity-select':
-            entryControl=<PopoverEntitySelect maxSelected={fieldConfig.max?fieldConfig.max:undefined} {...controlProps}  />
-            //  entryControl = <EntitySelect  {...controlProps} sourceName={'rcriteria'}></EntitySelect>
-            break;
-        case 'progress':
-            entryControl = <Progress {...controlProps}></Progress>
-            break;
-        case 'signature':
-            entryControl = <Signature {...controlProps}></Signature>
-            break;
-        case 'color':
-            entryControl = <ColorPicker {...controlProps}></ColorPicker>
-            break;
-        case 'hidden'://
-            entryControl = <Input
-                type="hidden"
-                value={fieldValue}
-                disabled={true}
-            />;
-            break;
-        default:
-            entryControl = unSupportControl
-            break;
-    }
-
-    return entryControl;
-
-}
-
-const EntryControl: React.FC<EntryControlProps> = (props) => {
-    const {fieldConfig, value, onChange,id} = props;
-    return renderControl(id,fieldConfig, value, onChange, null);
-}
-
-export default EntryControl;

package/src/components/controls/enum-badge/index.tsx

@@ -1,28 +0,0 @@
-import React from 'react'
-import {Badge} from "antd";
-import {VControlProps} from "../../tmpl/interface";
-import HCDataSource from "../../tmpl/hc-data-source";
-
-interface MenuBadgeProps extends VControlProps {
-
-
-}
-
-
-const MenuBadge: React.FC<MenuBadgeProps> = (props) => {
-
-    const {value, itemType, fieldConfig} = props;
-
-    let viewControl = undefined;
-
-    let color = HCDataSource.getEnumValueColor(fieldConfig.mstrucId, value);
-    viewControl = <span className="infoStyle">
-                      {value ?
-                          <Badge color={color ? color : 'green'} text={value}/>
-                          : null}
-            </span>
-
-    return viewControl;
-}
-
-export default MenuBadge;

package/src/components/controls/enum-tag/index.tsx

@@ -1,30 +0,0 @@
-import React from 'react'
-import { Tag} from "antd";
-import {VControlProps} from "../../tmpl/interface";
-import HCDataSource from "../../tmpl/hc-data-source";
-
-interface EnumTagsProps extends VControlProps {
-
-
-}
-
-
-const EnumTags: React.FC<EnumTagsProps> = (props) => {
-
-    const {value, itemType, fieldConfig} = props;
-    let viewControl = undefined;
-    let tagList = [];
-    if (value) {
-        value.split(',').forEach(v => {
-            let color = HCDataSource.getEnumValueColor(fieldConfig.mstrucId, value);
-            tagList.push(<Tag key={v} color={color ? color : 'blue'}>{v}</Tag>)
-        })
-    }
-    viewControl = <span className="infoStyle">
-                                    {tagList}
-                                 </span>
-
-    return viewControl;
-}
-
-export default EnumTags;

package/src/components/controls/file-view/drawer-file-view.tsx

@@ -1,69 +0,0 @@
-import * as React from 'react'
-import {Button, Drawer,Space} from 'antd'
-import {ReadOutlined,DownloadOutlined,CloseOutlined} from '@ant-design/icons'
-import FileViewer from 'react-file-viewer';
-// import { CustomErrorComponent } from 'custom-error';
-// import './index.css'
-import {FileValue} from "../../tmpl/interface";
-import HCService from "../../tmpl/hcservice-v3";
-
-interface DrawerFileViewProps {
-    file: FileValue,
-};
-
-interface DrawerFileViewState {
-    drawerVisible: boolean,
-
-};
-export default class DrawerFileView extends React.PureComponent<DrawerFileViewProps, DrawerFileViewState> {
-
-    state = {
-        drawerVisible: false
-    }
-
-    onError(e) {
-        console.log(e, 'error in file-viewer');
-    }
-
-    onClose = () => {
-        this.setState({drawerVisible: false})
-    }
-
-    render() {
-        const {file} = this.props;
-        const {drawerVisible} = this.state;
-        return <span className='labelcss'>
-                        <Button type={'link'} onClick={() => {
-                            this.setState({drawerVisible: true})
-                        }} size="small">{file.base.fileName}</Button>
-                <Button type={'text'} onClick={async () => {
-                        await HCService.download(file.base.path);
-                    }} size="small"><DownloadOutlined/></Button>
-            {drawerVisible ? <Drawer
-                title={file.base.fileName}
-                placement={'left'}
-                closable={false}
-                onClose={this.onClose}
-                width={'1200px'}
-                visible={drawerVisible}
-                extra={
-                <Space>
-                    <Button  onClick={async () => {
-                        await HCService.download(file.base.path);
-                    }} ><DownloadOutlined/></Button>
-                    <Button onClick={this.onClose}><CloseOutlined /></Button>
-                </Space>
-            }>
-                <FileViewer
-                    style={{width: '100%'}}
-                    fileType={file.base.type}
-                    filePath={HCService.getFileUrl(file.base.path)}
-                    errorComponent={undefined}
-                    onError={this.onError}/>
-            </Drawer> : null
-            }
-
-                      </span>;
-    }
-
-}

package/src/components/controls/file-view/index.tsx

@@ -1,145 +0,0 @@
-import * as React from 'react'
-import {Button, Col, Image, Row,Space} from 'antd'
-import {ReadOutlined} from '@ant-design/icons'
-import FileViewer from 'react-file-viewer';
-import DrawerFileView from './drawer-file-view'
-// import { CustomErrorComponent } from 'custom-error';
-// import './index.css'
-import {FieldConfig} from "../../tmpl/interface";
-import {DownloadOutlined} from '@ant-design/icons';
-import HCService from "../../tmpl/hcservice-v3";
-import Player from "griffith";
-
-interface FileViewProps {
-    fieldConfig: FieldConfig,
-    value: any,
-    width?: number,
-};
-
-interface FileViewState {
-    urlData:string
-
-};
-export default class FileView extends React.PureComponent<FileViewProps, FileViewState> {
-
-    state={
-        urlData:undefined,
-    }
-
-    loadData= async ()=>{
-        const {value}=this.props;
-        let jsonFile=this.getJsonValue(value);
-        if(jsonFile){
-            if(/^image\/\w+;base64/.test(jsonFile.base.type)){
-                this.setState({
-                    urlData :await HCService.loadFileTxt(jsonFile.base.path)
-                })
-            }
-        }
-
-    }
-    componentDidMount() {
-        this.loadData();
-    }
-
-    componentDidUpdate(prevProps, prevState, snapshot) {
-        const {value}=this.props;
-        const {value:preValue}=this.props;
-        if(value!=preValue){
-            this.loadData();
-        }
-    }
-
-    getJsonValue=(file)=>{
-        let jsonFile;
-        if (!file) {
-            return undefined;
-        } else if (typeof (file) == 'string') {
-            jsonFile = JSON.parse(file);
-        }
-        return jsonFile;
-    }
-
-    packFile2Show =  (file) => {
-        const {urlData}=this.state;
-        let jsonFile=this.getJsonValue(file);
-        if (jsonFile) {
-                if ("new" == jsonFile.valid) {
-                    return jsonFile.fileName
-                } else if ("delete" == jsonFile.valid) {
-                    return undefined;
-                } else if (['png', 'jpg', 'jpeg', 'gif', 'PNG', 'JPG', 'JPEG', 'GIF', 'svg', 'SVG'].includes(jsonFile.base.type)) {
-                    return <Image
-                        width={90}
-                        src={jsonFile.icon.type ? HCService.getFileUrl(jsonFile.icon.path) : HCService.getFileUrl(jsonFile.base.path)}
-                        preview={{
-                            src: HCService.getFileUrl(jsonFile.base.path),
-                        }}
-                    />
-                } else if (urlData) {
-                   // let urlValue = await HCService.loadFileTxt(jsonFile.base.path)
-                    return <Image
-                        width={90}
-                        src={urlData}
-                        preview={{
-                            src: urlData,
-                        }}
-                    />
-                } else if (['mp4', 'MP4', 'mov', 'MOV', 'avi', 'AVI', 'WMV', 'wmv'].includes(jsonFile.base.type)) {
-                    let sources = {
-                        ld: {
-                            play_url: HCService.getFileUrl(jsonFile.base.path),
-                        }
-                    }
-                    return (<Row align={'middle'}>
-                        <Col style={{height: '60px', width: '300px'}}>
-                            <Player locale={'zh-Hans'} sources={sources} id={jsonFile.base.fileName}/>
-                        </Col>
-                    </Row>)
-                }else if ([ 'xlsx', 'docx','csv','webm','bmp'].includes(jsonFile.base.type)){
-                    // return <span className='labelcss'>
-                    //     <Button onClick={async () => {
-                    //         await HCService.openfile(jsonFile.base.path);
-                    //     }} size="small"><ReadOutlined />{jsonFile.base.fileName}</Button>
-                    //
-                    //     <FileViewer
-                    //         fileType={jsonFile.base.type}
-                    //         filePath={HCService.getFileUrl(jsonFile.base.path)}
-                    //         errorComponent={undefined}
-                    //         onError={this.onError}/>
-                    //   </span>
-                    return <DrawerFileView file={jsonFile} ></DrawerFileView>
-                }
-                else if ([ 'pdf','txt'].includes(jsonFile.base.type)){
-                    return <span className='labelcss'>
-                        {/*<a href={this.getFileUrl(file.base.path)}>{file.base.fileName}</a>*/}
-                        <Button type={'link'} onClick={async () => {
-                            await HCService.openfile(jsonFile.base.path);
-                        }} size="small">{jsonFile.base.fileName}</Button>
-                         <Button type={'text'}  onClick={async () => {
-                             await HCService.download(jsonFile.base.path);
-                         }} size="small"><DownloadOutlined/></Button>
-                      </span>
-                }
-                else {
-                    return <Space className='labelcss'>
-                        {/*<a href={this.getFileUrl(file.base.path)}>{file.base.fileName}</a>*/}
-                        <Button type={'link'} onClick={async () => {
-                            await HCService.download(jsonFile.base.path);
-                        }} size="small">{jsonFile.base.fileName}</Button>
-                        <Button type={'text'}  onClick={async () => {
-                            await HCService.download(jsonFile.base.path);
-                        }} size="small"><DownloadOutlined/></Button>
-                      </Space>
-                }
-        } else {
-            return undefined;
-        }
-
-    }
-
-    render() {
-        return <>{this.packFile2Show(this.props.value)}</>;
-    }
-
-}

package/src/components/controls/html-editor/draft.tsx

@@ -1,161 +0,0 @@
-
-import * as React from 'react'
-import {Card} from "antd";
-import {VEControlProps} from "../../tmpl/interface";
-// 核心
-import { EditorState, convertToRaw,convertFromRaw, ContentState } from 'draft-js'
-import { Editor } from 'react-draft-wysiwyg'
-import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css'
-// draft 转换为 html
-import draftToHtml from 'draftjs-to-html'
-// html 转换为 draft
-import htmlToDraft from 'html-to-draftjs'
-
-interface DraftProps extends VEControlProps {
-    getHtml?:any;
-}
-
-interface DraftState  {
-    editorState:boolean;
-}
-
-export default class Draft extends React.PureComponent<DraftProps, DraftState>{
-
-   state={
-       editorState:EditorState.createEmpty(),
-   }
-
-    componentDidMount() {
-        // 如果从后台读取接口存储的有值，读取过来转换为富文本格式默认显示
-        if (this.props.value) {
-            this.toDraft(this.props.value)
-        }
-    }
-
-    onEditorStateChange = (editorState) => {
-        //this.toHtml(editorState)
-
-        this.setState({
-            editorState
-        })
-    }
-
-    editorChange = value => {
-        console.log('html:',draftToHtml(value))
-        if (this.props.onChange) {
-            this.props.onChange(draftToHtml(value));
-        }
-    }
-
-    // // 转换为 html
-    // toHtml = value => {
-    //     let templateContent = draftToHtml(convertToRaw(value.getCurrentContent()))
-    //
-    //     if (this.props.getHtml) {
-    //         // 输出已经编辑好的html
-    //         this.props.getHtml(templateContent)
-    //     }
-    //
-    // }
-
-    // 转换为 Draft
-
-    toDraft = value => {
-        const blocksFromHtml = htmlToDraft(value);
-        const { contentBlocks, entityMap } = blocksFromHtml;
-        const contentState = ContentState.createFromBlockArray(contentBlocks, entityMap);
-        const editorState = EditorState.createWithContent(contentState);
-        console.log("editorState:",editorState)
-        this.setState({
-            editorState
-        })
-    }
-
-    // imgFileupOnChange = (files) => {
-    //     // 返回值 files 就是上传的文件，控件会默认 Promise 返回，否则无法抓到返回的已上传图片链接
-    //     return new Promise(
-    //         (resolve, rejects) => {
-    //             // 使用 form 表单的形式进行配置，具体参数根据接口来
-    //             let formData = new FormData()
-    //
-    //             formData.append('File', files)
-    //             formData.append('FileType', 'Thumbnail')
-    //             formData.append('IsLogin', true)
-    //             formData.append('Description', '')
-    //
-    //             new Ajax({
-    //                 // 这里是配置自己的图片上传链接
-    //                 url: `/api/file/upload`,
-    //                 method: 'post',
-    //                 headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-    //                 data: formData
-    //
-    //             })
-    //                 .start()
-    //                 .then(res => (res = res.data))
-    //                 .then(res => {
-    //                     if (res.Status === 0) {
-    //
-    //                         // Message.success('上传成功!')
-    //                         resolve({ data: { link: res.Result } })
-    //                     } else {
-    //                         // Message.fail('上传失败!')
-    //
-    //                     }
-    //                 })
-    //         }
-    //     )
-    //
-    //
-    // }
-
-     changeValue = (value) => {
-
-    }
-
-
-    render(){
-        const {viewOrEdit,disabled} = this.props;
-
-        const {editorState}=this.state;
-        let entryControl = undefined;
-
-
-
-        const setToolbar = {
-            options: ['inline', 'blockType', 'fontSize', 'fontFamily', 'list', 'textAlign', 'colorPicker', 'remove', 'history'],
-            colorPicker: {
-                // 图标可以自定义，如果使用默认就注释掉
-                // icon: 'https://-------',
-                className: undefined,
-                component: undefined,
-                popupClassName: undefined,
-                // 图片选项卡自定义
-                colors: ['rgb(97,189,109)', 'rgb(26,188,156)', 'rgb(84,172,210)', 'rgb(44,130,201)',
-                    'rgb(147,101,184)', 'rgb(71,85,119)', 'rgb(204,204,204)', 'rgb(65,168,95)', 'rgb(0,168,133)',
-                    'rgb(61,142,185)', 'rgb(41,105,176)', 'rgb(85,57,130)', 'rgb(40,50,78)', 'rgb(0,0,0)',
-                    'rgb(247,218,100)', 'rgb(251,160,38)', 'rgb(235,107,86)', 'rgb(226,80,65)', 'rgb(163,143,132)',
-                    'rgb(239,239,239)', 'rgb(255,255,255)', 'rgb(250,197,28)', 'rgb(243,121,52)', 'rgb(209,72,65)',
-                    'rgb(184,49,47)', 'rgb(124,112,107)', 'rgb(209,213,216)', 'rgb(0,0,0)'],
-            },
-        }
-
-        entryControl= <Card style={{width:'100%'}} bodyStyle={{padding:'2px',minHeight:'280px'}}>
-            <Editor
-                readOnly={disabled}
-                toolbarHidden={viewOrEdit=='view'? true: false}
-                editorState={editorState}
-                wrapperClassName="contract-template-add-wrapper"
-                editorClassName="contract-template-editor"
-                onEditorStateChange={this.onEditorStateChange}
-                onChange={this.editorChange}
-                toolbar={setToolbar}
-            />
-        </Card>
-
-
-
-        return entryControl;
-
-    }
-}