aldehyde 0.0.1 → 0.0.4

package/src/components/controls/signature/index.tsx

@@ -1,162 +0,0 @@
-import React from 'react'
-import {Button, Col, Image, Modal, Popconfirm, Row} from "antd";
-import {VEControlProps} from "../../tmpl/interface";
-import SignatureCanvas from 'react-signature-canvas';
-import {HighlightOutlined} from '@ant-design/icons';
-import HcserviceV3 from "../../tmpl/hcservice-v3";
-
-interface SignatureProps extends VEControlProps {
-
-}
-
-interface SignatureState {
-    modalVisible: boolean,
-    molFileLoaded: boolean,
-    trimmedDataURL:any,
-}
-
-export default class Signature extends React.PureComponent<SignatureProps, SignatureState> {
-
-    static defaultProps = {
-        viewOrEdit: 'view',
-
-    }
-
-    state = {
-        modalVisible: false,
-        molFileLoaded: false,
-        molFile: undefined,
-        trimmedDataURL:undefined,
-    }
-
-    componentDidMount() {
-        this.loadData();
-    }
-   signCanvas=undefined;
-
-    loadData = async () => {
-        const {value} = this.props
-        if (value) {
-            let val = JSON.parse(value);
-            let file
-            if (val.valid == true) {//此处要优化
-                if(/^image\/png;base64/.test(val.base.type)){
-                    file = await HcserviceV3.loadFileTxt(val.base.path);
-                }
-            } else if (val.valid == 'new') {
-                file = val.body;
-            } else {
-                file = undefined;
-            }
-            console.log('file:', file);
-
-            this.setState({
-                trimmedDataURL:file,
-            })
-        }
-    }
-
-    saveMolfile = async () => {
-        let value =  this.signCanvas.getTrimmedCanvas().toDataURL('image/png');
-        // let val=value.replace(/^data:image\/\w+;base64,/, "");
-        // let bytes = window.atob(val);
-        // // 处理异常,将ascii码小于0的转换为大于0
-        // let ab = new ArrayBuffer(bytes.length);
-        // // 生成视图（直接针对内存）：8位无符号整数，长度1个字节
-        // let ia = new Uint8Array(ab);
-        // for (let i = 0; i < bytes.length; i++) {
-        //     ia[i] = bytes.charCodeAt(i);
-        // }
-        // let b= new Blob([ia], {
-        //     type: 'image/png'
-        // });
-
-        console.log('DataURL value:', value);
-        // let data =  this.signCanvas.toData();
-        // console.log('data data:', value);
-        this.triggerChange(value);
-        this.setState({
-            modalVisible: false,
-            trimmedDataURL:value,
-        })
-    }
-
-    triggerChange = (changedValue) => {
-        const {onChange} = this.props
-        if (onChange) {
-            onChange(JSON.stringify({valid: 'new', body: changedValue,suffix:'image/png;base64',fileName:'signature.png'}));
-        }
-    }
-
-
-    showView = async () => {
-        this.signCanvas.clear();
-        this.signCanvas.fromDataURL(this.state.trimmedDataURL);
-        this.setState({
-            modalVisible: true
-        })
-    }
-    onCancel = () => {
-        this.setState({
-            modalVisible: false,
-        })
-    }
-    onClear=()=>{
-        this.signCanvas.clear();
-    }
-
-    render() {
-        const {id,disabled, viewOrEdit, value,} = this.props
-        const {molFile,trimmedDataURL} = this.state
-        return (
-            <span id={id}>{trimmedDataURL?<Image
-                width={90}
-                src={trimmedDataURL}
-                preview={{
-                    src: trimmedDataURL,
-                }}
-            />:""}
-                {viewOrEdit == 'edit'?
-                <Button
-                        onClick={this.showView}>
-                        <HighlightOutlined/>编 辑
-                    </Button>:""
-                }
-
-                <Modal
-                    closable={false}
-                    visible={this.state.modalVisible}
-                    forceRender={true}
-                    centered
-                    style={{maxWidth: 'calc(100vw - 62px)', maxHeight: 'calc(100vw - 50px)'}}
-                    width={900}
-                    onCancel={() => {
-                        this.onCancel()
-                    }}
-                    footer={disabled ? [<Button key={1} onClick={() => {
-                        this.onCancel()
-                    }}>取消</Button>] : [<Button key={1} onClick={() => {
-                       this.onClear();
-                    }} >清除</Button>,<Popconfirm key={2} placement="top" title={"确定要取消本次编辑的数据吗？"}
-                                                   onConfirm={this.onCancel} okText="确定"
-                                                   cancelText="取消"><Button>取消</Button></Popconfirm>,
-                        <Button key={3} onClick={() => {
-                            this.saveMolfile();
-                        }} type='primary'>确定</Button>]}
-                    bodyStyle={{width: '900px'}}
-                >
-                    <Row style={{
-                        height: '430px',
-                        border: '1px solid #00f',
-                        maxWidth: '860px',
-                        maxHeight: 'calc(100vw - 80px)'
-                    }}>
-                        <Col key={1} span={24} style={{height: '400px'}}>
-                            <SignatureCanvas ref={( ref )  =>  { this.signCanvas=ref} } penColor='#000'　canvasProps={{ width:860,height:400,className: 'sigCanvas'}} ></SignatureCanvas>
-                        </Col>
-                    </Row>
-                </Modal>
-            </span>
-        );
-    }
-}

package/src/components/controls/steps/index.tsx

@@ -1,58 +0,0 @@
-import React from 'react'
-import {Select, Steps as AntdSteps} from "antd";
-import {VEControlProps} from "../../tmpl/interface";
-import Units from "../../units";
-import HCDataSource from "../../tmpl/hc-data-source";
-
-const {Step} = AntdSteps;
-
-
-interface StepsProps extends VEControlProps {
-
-
-}
-
-
-const Steps: React.FC<StepsProps> = ({viewOrEdit = 'view', ...props}) => {
-
-    const {value, itemType, fieldConfig, onChange} = props;
-
-    let entryControl = undefined;
-
-    const changeValue = (value) => {
-        if (onChange) {
-            onChange(value);
-        }
-    }
-
-    let enumItems = HCDataSource.getEnums(fieldConfig.mstrucId);
-    let currentIndex = undefined;
-    for (let i in enumItems) {
-        if (value == enumItems[i].value) {
-            currentIndex = parseInt(i);
-        }
-    }
-
-    if ((fieldConfig.disabled || viewOrEdit=='view') ) {
-        entryControl = <AntdSteps current={currentIndex} size="small">
-            {enumItems.map(item => (
-                <Step key={item.value} title={item.title}/>
-            ))}
-        </AntdSteps>
-    } else {
-        entryControl = <Select
-            placeholder={`请选择${fieldConfig.title}`}
-            notFoundContent="暂无选项"
-            allowClear={true}
-            showSearch
-            value={value}
-            onChange={changeValue}
-        >
-            {Units.getSelectOptions(enumItems)}
-        </Select>
-    }
-
-    return entryControl;
-}
-
-export default Steps;

package/src/components/controls/text/ellipsis-text.tsx

@@ -1,70 +0,0 @@
-import * as React from "react";
-import Units from "../../units";
-import {Button, Popover,Card} from "antd";
-
-interface EllipsisTextProps {
-    isHtml?:boolean;
-    value:string;
-    showMax?:number;
-    maxWidth?:string;
-}
-
-interface EllipsisTextState {
-}
-
-export default class EllipsisText extends React.PureComponent<EllipsisTextProps, EllipsisTextState> {
-
-    state={
-    }
-
-    static defaultProps={
-        isHtml:false,
-        showMax:20,
-        maxWidth:"1024px"
-    }
-
-    toString=(value)=>{
-        if(value){
-            return  value.toString();
-        }else{
-            return value;
-        }
-    }
-
-    viewButton=()=>{
-        const {value,isHtml,maxWidth}=this.props
-        return <>
-            <Popover overlayStyle={{maxWidth}}  placement="leftBottom"  trigger="click" content={
-                // <Card bodyStyle={{padding:'0px'}}>
-                <>
-                    {isHtml?<div  style={{padding:'6px'}} dangerouslySetInnerHTML={{__html: value}} ></div>:<div style={{padding:'6px'}}>{value}</div>}
-
-                    </>
-                // </Card>
-            } >
-                <Button type={"link"}  size={'small'}
-                >查看</Button> </Popover>
-        </>
-    }
-
-    render(){
-        const {value,isHtml,showMax}=this.props;
-        var text=this.toString(value);
-        if(isHtml){
-            var re = new RegExp('<[^<>]+>', 'g');
-            text = value.replace(re, "");
-        }
-
-        let style = Units.getLongTextStyle(text.substring(0,showMax));
-       return <>
-               { text.length<=showMax?<span className="infoStyle" style={style}>{text}</span>:
-                   <span className="infoStyle" style={style}>{text.substring(0,showMax)}...
-                       {this.viewButton()}
-                   </span>
-               }
-           </>
-
-       ;
-    }
-
-}

package/src/components/controls/upload/index.tsx

@@ -1,122 +0,0 @@
-import React from 'react'
-import {Button, Upload as AntdUpload, message, Modal} from 'antd'
-import {UploadOutlined} from '@ant-design/icons';
-import HcserviceV3 from "./../../tmpl/hcservice-v3"
-import {EControlProps,FileValue} from "../../tmpl/interface";
-import Super from "../../tmpl/superagent";
-import {UploadFile} from "antd/es/upload/interface";
-import Units from '../../units'
-interface UploadProps extends EControlProps{
-
-}
-
-interface UploadState {
-
-}
-
-
-export default class Upload extends React.PureComponent<UploadProps, UploadState>{
-
-    state={
-
-    }
-
-    // handleRemove=(info)=>{
-    //     Modal.confirm({
-    //         title: "删除提示",
-    //         content: "您确定删除此图片吗？",
-    //         okText: "确认",
-    //         cancelText: "取消",
-    //         onOk: () => {
-    //             let fileList = []
-    //             this.props.onChange(JSON.stringify({valid:'delete'}));
-    //         },
-    //         onCancel: () => {
-    //             return false;
-    //         }
-    //     });
-    //
-    //     return false;
-    // }
-    handleRemove=(info)=>{
-        this.props.onChange(JSON.stringify({valid:'delete'}));
-    }
-      handleChange= async (info)=>{
-        console.log('file change:',info);
-
-        if (info.file.status=='done'){
-            let newFile:FileValue={
-                valid:'new',
-                fileKey:info.file.response.fileKey,
-                fileName:info.file.originFileObj.name,
-            }
-            const {onChange} = this.props
-            onChange(JSON.stringify(newFile));
-        }
-    }
-    // triggerChange = (changedValue) => {
-    //     onChange(changedValue);
-    //     if (onChange) {
-    //       onChange(changedValue);
-    //     }
-    //   }
-
-    beforeUpload=(file)=>{
-
-        const isLt5M = file.size / 1024 / 1024 < 40;
-        if (!isLt5M) {
-            message.error('超过40M限制 不允许上传~')
-            return false
-        }else{
-            return true
-        }
-
-    }
-
-    render(){
-        const {id,itemType,disabled,value}=this.props
-        let fileList:UploadFile[]=[];
-        if(value){
-            let value_1:FileValue=value;
-            if(typeof value_1=='string'){
-                value_1=JSON.parse(value);
-            }
-            if(value_1.valid===true){
-                fileList.push( {
-                    uid: '-1',
-                    name: value_1.base.fileName,
-                    status: 'done',
-                    url: Units.api()+'/v3/files'+value_1.base.path+`?@token=${Units.getLocalStorge("hydrocarbonToken")}&disposition=attachment`,
-                })
-            }else if(value_1.valid=='new'){
-                fileList.push({
-                    uid: '-2',
-                    name: value_1.fileName,
-                });
-            }
-        }
-
-        return (
-            <div>                                           
-                <AntdUpload id={id}
-                    maxCount={1}
-                    accept={itemType==='picture'?".png, .jpg, .jpeg":itemType==='video'?".mp4":undefined}
-                    listType={itemType =='picture'?'picture':'text'}
-                    fileList={fileList.length==0?undefined:fileList}
-                    disabled={disabled}
-                    name={'file'}
-                    headers={Super.getHeaderObj()}
-                    action={HcserviceV3.postFileAction}
-                    beforeUpload={this.beforeUpload}
-                    onChange={this.handleChange}
-                    onRemove={this.handleRemove}
-                >
-                {fileList && fileList.length>=1?"":
-                    <Button  disabled={disabled}>
-                        <UploadOutlined /> {disabled?"无需上传":'点击上传'}
-                    </Button>}                                                                                                                                                   
-                </AntdUpload>
-            </div>
-        )
-    }
-}

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

@@ -1,177 +0,0 @@
-import React from 'react'
-import {Alert, Badge, Input, Spin, Tag} from "antd";
-import loadable from "@loadable/component";
-import {ControlHolderType, EnumItem, FieldConfig, ViewOrEdit} from "../tmpl/interface";
-import ControlTypeSupportor from '../tmpl/control-type-supportor';
-import EnumTags from './enum-tag';
-import EnumBadge from './enum-badge';
-import Steps from "./steps";
-import Units from './../units';
-import FileView from '../controls/file-view';
-import Rfield from "./rfield";
-import moment from "moment";
-import Progress from './progress'
-import ColorPicker from "./color-picker";
-import EllipsisText from './text/ellipsis-text'
-//import ChemStruc from "./chemstruc/graph";
-// import HtmlEditor from "../HtmlEditor/tinymce";
-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});
-
-
-
-interface FieldViewControlProps {
-    value?: any;
-    fieldConfig: FieldConfig;
-    holderType:ControlHolderType;
-}
-
-function renderControl(fieldConfig: FieldConfig, fieldValue: any,pHolderType:ControlHolderType, width: any) {
-
-    let itemType = ControlTypeSupportor.getControlType(fieldConfig, fieldValue);
-    let holderType:ControlHolderType=pHolderType;
-    if(!holderType){
-        holderType="descriptions";
-    }
-
-    const colNum = fieldConfig.colNum;
-    let scalableWidth = width;
-    if (colNum == 2) {
-        scalableWidth = width * colNum * 1.52;
-    }
-    let viewControl = undefined;
-
-    let placeholder = !fieldConfig.disabled ? `请输入${fieldConfig.title}` : "无需输入";
-    let disabled: boolean = fieldConfig.disabled;
-    let value = fieldValue ? fieldValue : fieldConfig.defaultValue ? fieldConfig.defaultValue : "";
-    let viewOrEdit:ViewOrEdit='view';
-    let controlProps = {
-        fieldConfig, itemType, value,viewOrEdit,
-    }
-
-    const unSupportControl =
-        <span className="infoStyle">{`暂未完成-${itemType}`}</span>;
-
-    switch (itemType) {
-        case 'int':
-        case 'decimal':
-        case 'float':
-        case 'double':
-        case 'intrange':
-        case 'decimalrange':
-        case "range":
-            viewControl = <span className="infoStyle">{value}</span>
-            break;
-        case 'date-YY':
-        case 'date-M1':
-        case 'date':
-        case 'datetime-HH':
-        case 'datetime-mm':
-        case 'datetime':
-        case 'time-HH':
-        case 'time-mm':
-        case 'time':
-            viewControl = <span className="infoStyle">{value ? moment(value).format(Units.getMomentFormat(itemType)) : undefined}</span>
-            break;
-        case 'daterange-YY':
-        case 'daterange-M1':
-        case 'daterange':
-        case 'datetimerange-HH':
-        case 'datetimerange-mm':
-        case 'datetimerange':
-        case 'timerange-HH':
-        case 'timerange-mm':
-        case 'timerange':
-            viewControl = <span className="infoStyle">{value}</span>
-            break;
-        case 'text':
-        case 'textarea':
-        case 'preselect':
-            if(holderType=='table'){
-                viewControl=<EllipsisText maxWidth={'400px'} isHtml={false} value={value} ></EllipsisText>
-            }else{
-                viewControl = <span className="infoStyle">{value}</span>
-            }
-            break;
-        case 'select':
-        case 'radio':
-            viewControl = <EnumBadge {...controlProps}/>
-            break;
-        case 'multiselect':
-        case 'checkbox':
-            viewControl = <EnumTags {...controlProps} />
-            break;
-        case 'html':
-            if(holderType=='table'){
-                viewControl=<EllipsisText isHtml={true} value={value} ></EllipsisText>
-            }else{
-                viewControl=<div dangerouslySetInnerHTML={{__html: value}} ></div>;
-            }
-            break;
-        case 'steps':
-            viewControl = <Steps {...controlProps}/>
-            break;
-        case 'password':
-            viewControl = unSupportControl;
-            break;
-        case 'caselect':
-            viewControl = unSupportControl;
-            break;
-        case 'relation':
-            viewControl = unSupportControl
-            break;
-        case 'file':
-        case 'picture':
-        case 'video':
-            viewControl = <FileView {...controlProps}></FileView>
-            break;
-        case 'chemstruc':
-            viewControl = <ChemStruc  {...controlProps}></ChemStruc>
-            //viewControl = unSupportControl
-            break;
-        case 'relselect':
-        case 'refselect':
-        case 'entity-select':
-        case 'table-entity-select':
-            viewControl = <Rfield {...controlProps}/>;
-            break;
-        case 'progress':
-            viewControl=<Progress {...controlProps}></Progress>
-            break;
-        case 'signature':
-            viewControl=<Signature {...controlProps}></Signature>
-            break;
-        case 'color':
-            viewControl = <ColorPicker {...controlProps}></ColorPicker>
-            break;
-        case 'hidden'://
-            viewControl = <Input
-                type="hidden"
-                value={fieldValue}
-                disabled={true}
-            />;
-            break;
-        default:
-            viewControl =unSupportControl;
-            break;
-    }
-    return viewControl;
-}
-
-const ViewControl: React.FC<FieldViewControlProps> = (props) => {
-    const {fieldConfig, value,holderType} = props;
-    return renderControl(fieldConfig, value, holderType,null);
-}
-
-export default ViewControl;