aldehyde 0.0.2 → 0.0.3

package/src/components/form/dtmpl-form.tsx

@@ -1,272 +0,0 @@
-import React, {RefObject} from 'react'
-import {Button, Card, Form as AntdForm, message, Modal, Switch} from 'antd'
-import {DtmplBaseProps, DtmplConfig, DtmplData, FieldGroupConfig} from "../tmpl/interface";
-import HcserviceV3 from "../tmpl/hcservice-v3";
-import FormItemGroup from "./form-Item-group";
-import {FormInstance} from "antd/lib/form/hooks/useForm";
-import {ReloadOutlined} from '@ant-design/icons';
-import FieldViewGroup from "../detail/view/field-view-group";
-import RelationTable from "./../table/relation-table";
-import './dtmpl-form.css';
-import CollapseCard from "../controls/collapse-card";
-
-export interface DtmplFormProps extends DtmplBaseProps {
-    parentId:string,
-    dtmplConfig: DtmplConfig,
-    dtmplData?:DtmplData,
-    formRef: RefObject<FormInstance>,
-    showConfirm: boolean,
-    onFinish: (code:string) => void,
-    onValuesChange?:()=>void,
-};
-
-interface DtmplFormStat {
-    loading: boolean,
-    dtmplData: DtmplData,
-    // changedGroupData:Map<number,DtmplData[]>
-};
-
-const confirm = Modal.confirm;
-
-export default class Form extends React.PureComponent<DtmplFormProps, DtmplFormStat> {
-    fuseMode: boolean = false;
-    premisestitle: string = "默认字段";
-
-    state = {
-        loading: true,
-        dtmplData: undefined,
-        // changedGroupData:new Map<number,DtmplData[]>()
-    }
-
-    async componentDidMount() {
-       await this.loadData();
-    }
-
-    async componentDidUpdate(preProps) {
-        // const { code,formRef} = this.props;
-        const { code:preCode} = preProps;
-        if(preProps!=this.props){
-            await this.loadData();
-        }
-        // this.props.onValuesChange();
-        //  if(code!=preCode || (!code && preCode)){
-        //     await this.loadData();
-        // }else{
-        //      formRef.current.resetFields();
-        //  }
-
-    }
-
-    loadData = async () => {
-        const { sourceId, code, formRef,dtmplData} = this.props;
-        if (code) {
-            this.setState({
-                loading: true,
-            })
-            const dtmplData_ = await HcserviceV3.requestDtmplData( sourceId, code, null);
-            this.setState({
-                dtmplData:dtmplData_,
-                //  changedGroupData:new Map<number,DtmplData[]>(),
-                loading: false,
-            })
-        }else if(dtmplData){
-            this.setState({
-                dtmplData,
-                //  changedGroupData:new Map<number,DtmplData[]>(),
-                loading: false,
-            })
-        }else{
-            this.setState({
-                dtmplData:{code:undefined,title:undefined,fieldMap:{},arrayMap:{}},
-                loading: false,
-            })
-        }
-        //debounce(formRef.current.resetFields();, 500);
-       setTimeout(()=>formRef.current.resetFields(),200)
-    }
-
-    doRefresh = async () => {
-        await this.loadData();
-        message.info("已刷新！")
-    }
-
-    onGroupChange = (fieldGroupConfig: FieldGroupConfig, selectdDatas: DtmplData[]) => {
-        const {dtmplData} = this.state;
-        dtmplData['arrayMap'][fieldGroupConfig.id] = selectdDatas;
-        let dtmplData_1 = {...dtmplData};
-
-        this.setState({
-            dtmplData: dtmplData_1,
-        })
-
-    }
-
-
-    changeFuseMode = (checked) => {
-        this.fuseMode = !checked;
-    }
-
-    postForm = async (result) => {
-        this.setState({
-            loading:true,
-        })
-        const {sourceId, code,dtmplData} = this.props;
-        if (code) { //有code是修改，没有是新增实体模板
-            result['唯一编码'] = code;
-        }else if(dtmplData && dtmplData.code){
-            result['唯一编码'] = dtmplData.code;
-        }
-        let res = await HcserviceV3.postDtmplData(sourceId, result, message);
-        this.setState({
-            loading:false,
-        })
-        if(res.status === "success"){
-            this.props.onFinish(res.code);
-        }
-    }
-
-    onSubmit = async (values: any) => {
-        const {showConfirm, code, dtmplConfig} = this.props;
-        const {dtmplData} = this.state;
-        console.log("from value:",values);
-        let resultCode = undefined;
-        const result = values;
-        for (let group of dtmplConfig.groups) {
-            if (group.type == 'relation') {
-                //添加关系标识
-                values[`${group.id}.$$flag$$`] = true;
-                //添加关系内容
-                let ds: DtmplData[] = dtmplData.arrayMap[group.id];
-                if (ds) {
-                    ds.forEach((d, index) => {
-                        values[`${group.id}[${index}].$$relation$$`] = d.relationLabel;
-                        if (d.editStatus || d.editStatus=='new') {
-                            for (let field of group.fields) {
-                                values[`${group.id}[${index}].${field.id}`] = d.fieldMap[field.id];
-                            }
-                        } else if(d.editStatus || d.editStatus=='changed'){
-                            values[`${group.id}[${index}].唯一编码`] = d.code;
-                            for (let field of group.fields) {
-                                values[`${group.id}[${index}].${field.id}`] = d.fieldMap[field.id];
-                            }
-                        }else{
-                            values[`${group.id}[${index}].唯一编码`] = d.code;
-                        }
-                    })
-                }
-            }
-        }
-        resultCode = await this.postForm(result);
-        // if (showConfirm) {
-        //     confirm({
-        //         title: '确定要保存修改吗',
-        //         okText: '确定',
-        //         okType: 'danger',
-        //         cancelText: '取消',
-        //         onOk: async () =>
-        //             await this.postForm(result)
-        //         ,
-        //     });
-        // } else {
-        //     resultCode = await this.postForm(result);
-        // }
-    }
-
-
-    fieldGroupList = () => {
-
-        const {dtmplConfig,parentId} = this.props;
-        const {dtmplData, loading} = this.state;
-
-        let groups: FieldGroupConfig[];
-        if (dtmplConfig) {
-            groups = dtmplConfig.groups;
-        }
-
-        return groups.map((item) => {
-                if (item.type == 'relation') {//关系
-                    if (item.fields) {
-                        let data: DtmplData[] = undefined;
-                        if (dtmplData) {
-                            data = dtmplData.arrayMap[item.id];
-                        }
-                        return <RelationTable loading={loading} parentId={parentId}  key={item.id} fieldGroupConfig={item} value={data}
-                                              viewOrEdit={"edit"} onChange={this.onGroupChange}/>
-                    }
-                } else {//字段组
-                    return <CollapseCard
-                        title={item.title}
-                        key={item.id}
-                        id={parentId+item.id}
-                        className="hoverable"
-                        headStyle={{background: "#f2f4f5"}}
-                        loading={loading}
-                    >
-                        <FormItemGroup  fields={item?item.fields:undefined} valueMap={dtmplData ? dtmplData.fieldMap : undefined}
-                        ></FormItemGroup>
-                    </CollapseCard>
-                }
-            }
-        );
-    }
-
-    render() {
-        const {formRef, dtmplConfig,  sourceId, code,parentId,onValuesChange,dtmplData} = this.props;
-        if(!dtmplConfig){
-           return <Card>
-               {/*loading={loading}*/}
-           </Card>
-        }
-        const {buttons, premises} = dtmplConfig;
-        return (
-            <>
-                <Card bordered={false}
-                      key={"detailTitle"}
-                      className="hoverable pageHeader"
-                    // loading={loading}
-                >
-                    <h3>
-                        {code || (dtmplData && dtmplData.code)? "[编辑]":"[新增]"}
-                        <div className="fr">
-                            {buttons && buttons.includes('fusionMode') ?
-                                <Switch
-                                    checkedChildren="开"
-                                    unCheckedChildren="关"
-                                    style={{marginRight: 10}}
-                                    title="融合模式"
-                                    onChange={this.changeFuseMode}/>
-                                : ""}
-                            <Button
-                                className="hoverbig"
-                                title="刷新"
-                                onClick={this.doRefresh}
-                            ><ReloadOutlined/></Button>
-                        </div>
-                    </h3>
-                </Card>
-                <AntdForm scrollToFirstError={true} labelWrap={true}  ref={formRef} name="control-hooks"  onValuesChange={onValuesChange} onFinish={this.onSubmit}>
-                    <AntdForm.Item hidden={true} name={'actionId'}  ></AntdForm.Item>
-                    <AntdForm.Item hidden={true} name={'mainCode'}  ></AntdForm.Item>
-                    {this.fieldGroupList()}
-                </AntdForm>
-                {premises && premises.length > 0 ?
-                    <CollapseCard
-                        title={this.premisestitle}
-                        key={this.premisestitle}
-                        id={parentId+premises[0].id}
-                        className="hoverable"
-                        headStyle={{background: "#f2f4f5"}}
-                        // loading={loading}
-                    >
-                        <FieldViewGroup
-                            fields={premises}/>
-                    </CollapseCard>
-                    : ""
-                }
-            </>
-        );
-    }
-
-}
-
-

package/src/components/form/field-group-form.tsx

@@ -1,75 +0,0 @@
-import React, {RefObject} from 'react'
-import {Form as AntdForm, message,Radio} from 'antd'
-import {DtmplData, FieldGroupConfig} from "../tmpl/interface";
-import HcserviceV3 from "../tmpl/hcservice-v3";
-import {FormInstance} from "antd/lib/form/hooks/useForm";
-import './dtmpl-form.css';
-import FormItemGroup, {FieldGroupProps} from './form-Item-group';
-import Units from '../units'
-
-
-export interface FieldGroupFormProps  {
-    fieldGroupConfig: FieldGroupConfig,
-    formRef?: RefObject<FormInstance>,
-    dtmplData?:DtmplData,
-    onFinish: (value: DtmplData) => void,
-};
-
-interface FieldGroupFormStat {
-
-};
-
-export default class Form extends React.PureComponent<FieldGroupFormProps, FieldGroupFormStat> {
-    state = {}
-
-    async componentDidMount() {
-
-    }
-
-    onSubmit =  (values: any) => {
-        const {dtmplData,fieldGroupConfig}=this.props;
-        let data:DtmplData={
-            code: dtmplData?dtmplData.code :'new'+Units.getRandomNum(6),
-            editStatus:dtmplData && dtmplData.code && !dtmplData.code.startsWith('new')?'changed':"new",
-        relationLabel: values['relationLabel']?values['relationLabel']:fieldGroupConfig.relationNames[0],
-        fieldMap: values,
-        };
-        this.props.onFinish(data);
-    }
-
-    selectRelation=()=>{
-        const {fieldGroupConfig, dtmplData} = this.props;
-        if(fieldGroupConfig.relationNames.length>1){
-            return <AntdForm.Item  name="relationLabel" initialValue={dtmplData?dtmplData.relationLabel:undefined}
-                                   rules={[{
-                                       required: true, message: `请选择关系`,
-                                   }] }
-                                   label="关系">
-                <Radio.Group>
-                    {
-                        fieldGroupConfig.relationNames.map((item)=>{
-                            return <Radio value="item">{item}</Radio>
-                        })
-                    }
-                </Radio.Group>
-            </AntdForm.Item>
-        }else{
-            return "";
-        }
-    }
-
-    render() {
-        const {formRef, fieldGroupConfig, dtmplData} = this.props;
-        return (
-            <>
-                <AntdForm labelWrap={true} ref={formRef} name="control-hooks" onFinish={this.onSubmit}>
-                    {this.selectRelation()}
-                    <FormItemGroup nameAttr={'id'} fields={fieldGroupConfig?fieldGroupConfig.fields:undefined} valueMap={dtmplData?dtmplData.fieldMap:{}}></FormItemGroup>
-                </AntdForm>
-            </>
-        );
-    }
-
-}
-
-

package/src/components/form/fields-form.tsx

@@ -1,51 +0,0 @@
-import React, {RefObject} from 'react'
-import {Form as AntdForm} from 'antd'
-import {DtmplData, FieldConfig} from "../tmpl/interface";
-import {FormInstance} from "antd/lib/form/hooks/useForm";
-import './dtmpl-form.css';
-import FormItemGroup from './form-Item-group';
-
-
-export interface FieldsFormProps {
-    fields: FieldConfig[],
-    formRef?: RefObject<FormInstance>,
-    value?: object,
-    onFinish: (value: object) => void,
-    onValuesChange:(value: object) => void,
-};
-
-interface FieldsFormStat {
-
-};
-
-export default class FieldsForm extends React.PureComponent<FieldsFormProps, FieldsFormStat> {
-    state = {}
-
-    async componentDidMount() {
-
-    }
-
-    // onSubmit = (values: any) => {
-    //     const {dtmplData, fields} = this.props;
-    //     let data: DtmplData = {
-    //         fieldMap: values,
-    //     };
-    //     this.props.onFinish(data);
-    // }
-
-
-    render() {
-        const {formRef, fields, value,onFinish,onValuesChange} = this.props;
-        return (
-            <>
-                <AntdForm onValuesChange={onValuesChange} labelWrap={true} ref={formRef} name="control-hooks" onFinish={onFinish}>
-                    <FormItemGroup nameAttr={'id'} fields={fields}
-                                   valueMap={value}></FormItemGroup>
-                </AntdForm>
-            </>
-        );
-    }
-
-}
-
-

package/src/components/form/form-Item-group.tsx

@@ -1,99 +0,0 @@
-import React from 'react'
-import {Col, Form, Row} from 'antd'
-import 'moment/locale/zh-cn';
-import {FieldConfig, FieldGroupConfig} from "../tmpl/interface";
-import EntryControl from "../controls/entry-control";
-import Units from './../units'
-
-
-
-const FormItem = Form.Item
-
-export interface FieldGroupProps {
-    fields: FieldConfig[],
-    nameAttr?:string,
-    valueMap: object,
-    width?: number,
-};
-
-interface FieldGroupState {
-    fileList: any,
-};
-
-export default class FormItemGroup extends React.PureComponent<FieldGroupProps, FieldGroupState> {
-
-    static defaultProps={
-        nameAttr:'id',
-    }
-
-    constructor(props) {
-        super(props);
-        this.state = {
-            fileList: [],
-        }
-    }
-
-    initFormList = () => {
-        const {fields, valueMap,nameAttr} = this.props
-        const formItemList = [];
-
-        if ( fields && fields.length > 0) {
-            fields.forEach((item, index) => {
-                const title = item.title;
-                let fieldValue = valueMap ? valueMap[item.id] : undefined;
-                //fieldValue 没有值时不能为null 要为 undefined。antd input所限制
-                fieldValue = (fieldValue || fieldValue==0 ) ? fieldValue : item.defaultValue ? Units.configParamTrans(item.defaultValue): undefined;
-
-                console.log("表单值：",valueMap[item.id],fieldValue);
-
-                const fieldKey = item.id + Math.random() * 100;
-                let formItem=null;
-                if(item.extControlType=='hidden'){
-                    formItem= <FormItem hidden={true}
-                                        initialValue={fieldValue}
-                                        name={item[nameAttr]} key={item.id}>
-                        <EntryControl value={fieldValue} fieldConfig={item} />
-                    </FormItem>
-                }else{
-                     formItem = <FormItem  label={item.title} name={item[nameAttr]} key={item.id}
-                                               labelCol={item.colNum == 1 ? {span: 6} : {span: 3}}
-                                               wrapperCol={item.colNum == 1 ? {span: 15} : {span: 19}}
-                                               tooltip={item.tip}
-                                               initialValue={fieldValue}
-                                               style={{ margin: 4}}
-                                               rules={item.required ? [{
-                                                   required: true, message: `请选择${title}`,
-                                               }] : undefined}>
-                        <EntryControl value={fieldValue} fieldConfig={item} />
-                    </FormItem>
-                }
-                formItemList.push(formItem);
-            });
-        }
-
-        const colList = [];
-
-        for (let i = 0; i < formItemList.length; i = i + 1) {
-            let colNum = fields[i].colNum;
-            if(fields[i].extControlType=='hidden'){
-                colNum=0;
-            }
-            let col = <Col key={i} span={12 * colNum}>
-                {formItemList[i]}
-            </Col>
-            colList.push(col);
-        }
-
-        const row =
-            <Row gutter={[16, 8]} key={1}>
-                {colList}
-            </Row>
-        return row;
-    }
-
-    render() {
-        return (
-            this.initFormList()
-        )
-    }
-}

package/src/components/form/index.css

@@ -1,13 +0,0 @@
-
-.downAvatar,.infoStyle{
-    width:220px;
-    display:inline-block;
-}
-.downAvatar a,.deleAvatar{
-    visibility: hidden;
-    color:#1890ff;
-    cursor: pointer;
-}
-.downAvatar:hover a,.downAvatar:hover .deleAvatar{
-    visibility:visible;
-}