aldehyde 0.2.64 → 0.2.65

package/src/aldehyde/detail/button/fix-right-submit-button-bar.tsx

@@ -0,0 +1,130 @@
+import React, {RefObject} from 'react'
+import './index.css'
+import {ActionConfig, ButtonName, DtmplConfig, TmplBase} from "../../../aldehyde/tmpl/interface";
+import {Affix, Button, Popconfirm, Popover} from "antd";
+import {LeftOutlined, SaveOutlined} from '@ant-design/icons';
+import Action from "../../controls/action";
+import {SubmitButtonProps} from "./submit-button-bar";
+
+interface FixRightSubmitButtonProps extends SubmitButtonProps{
+
+}
+
+
+interface FixRightSubmitButtonState {
+   // stateSerial:number
+}
+
+class FixRightSubmitButtonBar extends React.PureComponent<FixRightSubmitButtonProps, FixRightSubmitButtonState> {
+
+    state={
+      // stateSerial:0,
+    }
+
+    calcOffsetBottom = (buttons: ButtonName[], actions: ActionConfig[]) => {
+        let buttonSize:number=0;
+        if(actions ){
+            buttonSize=buttonSize+actions.length;
+        }
+        if((buttons && buttons.includes('dtmplSave')) ){
+            buttonSize=buttonSize+1;
+        }
+        if (buttonSize>=3) {
+            return 120;
+        } else if (buttonSize==2){
+            return 86;
+        }else{
+            return 80;
+        }
+    }
+
+    render() {
+       const {}=this.state;
+        const {dtmplConfig, doSubmit,formRef,serial,serverKey} = this.props
+        const {buttons, actions} = dtmplConfig;
+        const cardList: TmplBase[] = [];
+
+        //console.log(" submit-button-bar serial:",serial);
+       // console.log(" submit-button-bar stateSerial:",stateSerial);
+
+        if (dtmplConfig.premises && dtmplConfig.premises.length > 0) {
+            cardList.push({
+                id: '1', title: '默认字段',
+            });
+        }
+        dtmplConfig.groups.forEach(g => {
+            cardList.push({
+                title: g.title,
+                id: g.id,
+            });
+        })
+
+        let content
+        if (actions && actions.length > 1) {
+            content = (
+                <div className="btns">
+                    {actions.map((item, index) => {
+                        if (index > 1) {
+                            // return <Popconfirm key={item.id} placement="top" title={"确定要保存修改并执行此操作吗?"}
+                            //                    onConfirm={() => doSubmit(item.id)} okText="确定" cancelText="取消">
+                            // <Button
+                            //     type="primary"
+                            // >{item.title}</Button>
+                            // </Popconfirm>
+                           return <Action serverKey={serverKey} iconType={'icon-title'} hiddenType={'disabled'} buttonType={'primary'} serial={serial} key={item.id}   formRef={formRef} actionConfig={item}  doAction={doSubmit}></Action>
+                        }
+                    })
+                    }
+                </div>
+            );
+        }
+
+
+        return (
+            <Affix
+                //style={{position: 'absolute', right: 10, maxHeight: 100}}
+                   // offsetBottom={this.calcOffsetBottom(buttons, actions)}>
+                   style={{position: 'absolute',bottom:60,right: 15,}}  offsetBottom={this.calcOffsetBottom(buttons, actions)}
+            >
+                <div className={'submitButtonBar'} >
+                    <ul>
+                        {buttons.includes('dtmplSave') ? <li key={100}>
+                            <Button
+                                onClick={() => doSubmit()}
+                                type='primary'
+                                icon={<SaveOutlined/>}
+                                key="btn" block
+                            >保 存</Button>
+                        </li> : ""
+                        }
+                        {//处理前两个
+                            actions ? actions.map((item, index) => {
+                                    if (index < 2) {
+                                        return <li key={index}>
+                                            {/*<Popconfirm placement="left" title={"确定要保存修改并执行此操作吗?"} onConfirm={() => doSubmit(item.id)} okText="确定" cancelText="取消">*/}
+                                            {/*<Button  block*/}
+                                            {/*        type={'primary'}>{item.title}</Button>*/}
+                                            {/*</Popconfirm>*/}
+                                            <Action serverKey={serverKey} hiddenType={'disabled'} buttonType={'primary-block'} serial={serial}  key={item.id}  formRef={formRef} actionConfig={item}  doAction={doSubmit}></Action>
+                                        </li>
+                                    }
+                                }
+                            ) : ""
+                        }
+                        {//处理后面的
+                        actions && actions.length > 2 ?
+                                <Popover placement="leftTop" content={content} trigger="hover">
+                                    <Button block>
+                                        <LeftOutlined/>{'更多'}
+                                    </Button>
+                                </Popover> : ""
+                        }
+                    </ul>
+                </div>
+            </Affix>
+        )
+    }
+}
+
+export default FixRightSubmitButtonBar;
+

package/src/aldehyde/detail/button/submit-button-bar.tsx

@@ -1,15 +1,17 @@
 import React, {RefObject} from 'react'
 import './index.css'
-import {ActionConfig, ButtonName, DtmplConfig, TmplBase} from "../../../aldehyde/tmpl/interface";
+import {ActionConfig, ButtonName, ButtonPosition, DtmplConfig, TmplBase} from "../../../aldehyde/tmpl/interface";
 import {Affix, Button, Popconfirm, Popover} from "antd";
 import {LeftOutlined, SaveOutlined} from '@ant-design/icons';
 import Action from "../../controls/action";
+import FixRightSubmitButtonBar from './fix-right-submit-button-bar'
 import {FormInstance} from "antd/lib/form/hooks/useForm";
+import BottomSubmitButtonBar from "./bottom-submit-button-bar";
 
-interface SubmitButtonProps {
+export  interface SubmitButtonProps {
     serverKey?:string,
     dtmplConfig: DtmplConfig,
-   // dtmplData:DtmplData,
+    position?:ButtonPosition,
     doSubmit: (actionId?: string,codes?:string[],params?:object) => void;
     formRef: RefObject<FormInstance>,
     serial:number,
@@ -27,126 +29,18 @@ class SubmitButtonBar extends React.PureComponent<SubmitButtonProps, SubmitButto
       // stateSerial:0,
     }
 
-    calcOffsetBottom = (buttons: ButtonName[], actions: ActionConfig[]) => {
-        let buttonSize:number=0;
-        if(actions ){
-            buttonSize=buttonSize+actions.length;
-        }
-        if((buttons && buttons.includes('dtmplSave')) ){
-            buttonSize=buttonSize+1;
-        }
-        if (buttonSize>=3) {
-            return 120;
-        } else if (buttonSize==2){
-            return 86;
-        }else{
-            return 80;
-        }
-    }
-
-   //  async componentDidMount() {
-   //      console.log("SubmitButtonBar this.loadData()");
-   //
-   //      console.log("SubmitButtonBar this.loadData()1");
-   //          //  if(code!=preCode || (!code && preCode)){
-   //          //     await this.loadData();
-   //          // }else{
-   //          //      formRef.current.resetFields();
-   //          //  }
-   // }
+    static defaultProps={
 
-    // loadData = async () => {
-    //     console.log("SubmitButtonBar this.loadData()2");
-    //     this.setState({
-    //         stateSerial: this.state.stateSerial + 1,
-    //     })
-    // }
+    }
 
     render() {
-       const {}=this.state;
-        const {dtmplConfig, doSubmit,formRef,serial,serverKey} = this.props
-        const {buttons, actions} = dtmplConfig;
-        const cardList: TmplBase[] = [];
-
-        //console.log(" submit-button-bar serial:",serial);
-       // console.log(" submit-button-bar stateSerial:",stateSerial);
-
-        if (dtmplConfig.premises && dtmplConfig.premises.length > 0) {
-            cardList.push({
-                id: '1', title: '默认字段',
-            });
-        }
-        dtmplConfig.groups.forEach(g => {
-            cardList.push({
-                title: g.title,
-                id: g.id,
-            });
-        })
-
-        let content
-        if (actions && actions.length > 1) {
-            content = (
-                <div className="btns">
-                    {actions.map((item, index) => {
-                        if (index > 1) {
-                            // return <Popconfirm key={item.id} placement="top" title={"确定要保存修改并执行此操作吗?"}
-                            //                    onConfirm={() => doSubmit(item.id)} okText="确定" cancelText="取消">
-                            // <Button
-                            //     type="primary"
-                            // >{item.title}</Button>
-                            // </Popconfirm>
-                           return <Action serverKey={serverKey} iconType={'icon-title'} hiddenType={'disabled'} buttonType={'primary'} serial={serial} key={item.id}   formRef={formRef} actionConfig={item}  doAction={doSubmit}></Action>
-                        }
-                    })
-                    }
-                </div>
-            );
-        }
-
+        const {position, doSubmit, serial, dtmplConfig, formRef} = this.props;
+        let posi = position ? position : dtmplConfig.buttonPosition ? dtmplConfig.buttonPosition : undefined
 
-        return (
-            <Affix
-                //style={{position: 'absolute', right: 10, maxHeight: 100}}
-                   // offsetBottom={this.calcOffsetBottom(buttons, actions)}>
-                   style={{position: 'absolute',bottom:60,right: 15,}}  offsetBottom={this.calcOffsetBottom(buttons, actions)}
-            >
-                <div className={'submitButtonBar'} >
-                    <ul>
-                        {buttons.includes('dtmplSave') ? <li key={100}>
-                            <Button
-                                onClick={() => doSubmit()}
-                                type='primary'
-                                icon={<SaveOutlined/>}
-                                key="btn" block
-                            >保 存</Button>
-                        </li> : ""
-                        }
-                        {//处理前两个
-                            actions ? actions.map((item, index) => {
-                                    if (index < 2) {
-                                        return <li key={index}>
-                                            {/*<Popconfirm placement="left" title={"确定要保存修改并执行此操作吗?"} onConfirm={() => doSubmit(item.id)} okText="确定" cancelText="取消">*/}
-                                            {/*<Button  block*/}
-                                            {/*        type={'primary'}>{item.title}</Button>*/}
-                                            {/*</Popconfirm>*/}
-                                            <Action serverKey={serverKey} hiddenType={'disabled'} buttonType={'primary-block'} serial={serial}  key={item.id}  formRef={formRef} actionConfig={item}  doAction={doSubmit}></Action>
-                                        </li>
-                                    }
-                                }
-                            ) : ""
-                        }
-                        {//处理后面的
-                        actions && actions.length > 2 ?
-                                <Popover placement="leftTop" content={content} trigger="hover">
-                                    <Button block>
-                                        <LeftOutlined/>{'更多'}
-                                    </Button>
-                                </Popover> : ""
-                        }
-                    </ul>
-                </div>
-            </Affix>
-        )
+        return <>{!posi || posi == 'fixedBottomRight' ?
+            <FixRightSubmitButtonBar doSubmit={doSubmit} serial={serial} dtmplConfig={dtmplConfig} formRef={formRef}/>
+            : <BottomSubmitButtonBar position={posi} doSubmit={doSubmit} serial={serial} dtmplConfig={dtmplConfig} formRef={formRef}/>
+        }</>
     }
 }
 

package/src/aldehyde/detail/edit/dtmpl-edit.tsx

@@ -210,7 +210,7 @@ export default class DtmplEdit extends React.PureComponent<DtmplEditProps, Dtmpl
                 {showRightNav ?
                     <RightBar  parentId={id} dtmplConfig={dtmplConfig}/> : ""
                 }
-                <SubmitButtonBar serverKey={serverKey} serial={serial} dtmplConfig={dtmplConfig} doSubmit={this.doSubmit}  formRef={this.formRef}></SubmitButtonBar>
+                <SubmitButtonBar serverKey={serverKey} serial={serial} dtmplConfig={dtmplConfig} doSubmit={this.doSubmit} formRef={this.formRef}></SubmitButtonBar>
                 <CqueryButtonBar  serverKey={serverKey} dtmplConfig={dtmplConfig} mainCode={code}></CqueryButtonBar>
                 <PostResult
                     open={showPostResult}

package/src/aldehyde/detail/edit/row-editor.tsx

@@ -62,7 +62,6 @@ export default class RowEditor extends React.PureComponent<RowEditorProps, RowEd
                 <Button
                     disabled={disabled}
                     style={buttonStyle}
-                    type='primary'
                     icon={buttonIcon}
                     size="small"
                     onClick={() => {

package/src/aldehyde/detail/view/modal-dtmpl-view.tsx

@@ -40,7 +40,7 @@ export default class ModalDtmplView extends React.PureComponent<ModalDtmplViewPr
             open={open}
             title={"查看"}
             // style={style}
-            width={'1250px'}
+            width={"82vh"}
             centered
             wrapClassName={'aaa'}
             bodyStyle={{height: height, overflow: 'auto'}}

package/src/aldehyde/module/dtmpl-edit-page.tsx

@@ -39,8 +39,8 @@ export default class DtmplEditPage extends React.PureComponent<ModalEditorProps,
     }
     static defaultProps = {
         showConfirm: true,
-        height: 580,
-        width:1250,
+        height: '76vh',
+        width:'76vw',
         bodyWidth:'100%',
         //antd modal
         forceRender: true,

package/src/aldehyde/module/dtmpl-view-drawer.tsx

@@ -25,8 +25,8 @@ class DtmplViewDrawer extends React.PureComponent<DtmplViewDrawerProps, DtmplVie
     }
 
     static defaultProps = {
-        height: 500,
-        width:1250,
+        height: "82vh",
+        width:"82vw",
         forceRender: true,
         cancelText: "关闭",
         placement:'left',
@@ -49,7 +49,7 @@ class DtmplViewDrawer extends React.PureComponent<DtmplViewDrawerProps, DtmplVie
                     open={open}
                     width={width}
                     style={{
-                        maxWidth: 1960,
+                        maxWidth: "92vh",
                     }}
                     extra={
                         <Space>

package/src/aldehyde/module/dtmpl-view-modal.tsx

@@ -22,8 +22,8 @@ class DtmplViewModal extends React.PureComponent<DtmplViewModalProps, DtmplViewM
     }
 
     static defaultProps = {
-        height: 500,
-        width:1250,
+        height: "82vh",
+        width:"82vw",
         forceRender: true,
         style: {maxWidth: 'calc(100vw - 60px)', maxHeight: 'calc(100vh - 50px)'},
         open:false,
@@ -44,7 +44,7 @@ class DtmplViewModal extends React.PureComponent<DtmplViewModalProps, DtmplViewM
                     centered
                     onCancel={onClose}
                 >
-            <Scrollbars style={{ height: Number(height)-40 }} autoHide autoHideTimeout={1000}>
+            <Scrollbars  autoHide autoHideTimeout={1000}>
             <DtmplViewCard  codeSource={codeSource} serverKey={serverKey} sourceId={sourceId} code={code}></DtmplViewCard>
         </Scrollbars>
                 </Modal>

package/src/aldehyde/module/ltmpl-drawer.tsx

@@ -19,9 +19,9 @@ export default class LtmplDrawer extends React.PureComponent<LtmplDrawPageProps,
 
     static defaultProps = {
         showConfirm: true,
-        width:1250,
+        width:'76vw',
         forceRender: true,
-        style: {maxWidth: 'calc(100vw - 60px)', maxHeight: 'calc(100vh - 50px)'},
+        style: {maxWidth: '92vw', maxHeight: '92vh'},
         okText: "确定",
         cancelText: "取消",
         placement:'left',
@@ -43,7 +43,7 @@ export default class LtmplDrawer extends React.PureComponent<LtmplDrawPageProps,
                 open={open}
                 width={width}
                 style={{
-                    maxWidth: 1960,
+                    maxWidth: '92vw',
                 }}
                 // extra={
                 //     <Space>{this.getFooter()}</Space>

package/src/aldehyde/module/ltmpl-modal.tsx

@@ -19,8 +19,8 @@ export default class LtmplDrawer extends React.PureComponent<LtmplDrawPageProps,
 
     static defaultProps = {
         showConfirm: true,
-        height: 580,
-        width:1250,
+        height:'82vh' ,
+        width:'82vw',
         forceRender: true,
         style: {maxWidth: 'calc(100vw - 60px)', maxHeight: 'calc(100vh - 50px)',padding:10},
         okText: "确定",
@@ -39,17 +39,15 @@ export default class LtmplDrawer extends React.PureComponent<LtmplDrawPageProps,
                 width={width}
                 title={title}
                 closable={false}
-                bodyStyle={{height: height, overflow: 'auto',padding:6}}
+                bodyStyle={{height: height, overflow: 'auto',padding:"6 0 6 6"}}
                 destroyOnClose={true}
                 centered
                 onOk={onCancel}
                 onCancel={onCancel}
-                footer={[<Button onClick={onCancel}>关 闭</Button>]}
-            > <Scrollbars style={{ height: Number(height)-40 }} autoHide autoHideTimeout={1000}>
-                <Card bordered={false} bodyStyle={{padding:'4px 0 0 0'}} >
-
+                footer={[<Button onClick={onCancel}>关 闭</Button>]}>
+             <Scrollbars  autoHide autoHideTimeout={1000}>
+                <Card bordered={false} bodyStyle={{padding:'4px 10px 0  0'}} >
                     <LtmplTable {...other}></LtmplTable>
-
                 </Card>
             </Scrollbars>
         </Modal>

package/src/aldehyde/table/relation-table.tsx

@@ -190,7 +190,6 @@ class RelationTable extends React.PureComponent<RelationTableProps, RelationTabl
                     {dtmplEdit ?
                         <Button disabled={disabled}
                                 title="编辑当实体"
-                                type='primary'
                                 icon={<FormOutlined/>}
                                 size="small"
                                 onClick={() => this.showEditDtmplModel(record)}
@@ -470,7 +469,6 @@ class RelationTable extends React.PureComponent<RelationTableProps, RelationTabl
                         {buttons.includes('dtmplAdd') ?
                             <Button
                                 disabled={buttonDisabled}
-                                type='primary'
                                 icon={<PlusSquareOutlined/>}
                                 size="small"
                                 onClick={this.showAddDtmplModel}

package/src/aldehyde/tmpl/interface.tsx

@@ -110,6 +110,8 @@ export interface ColumnConfig extends FieldConfig {
 
 export type CodeSource = 'new'|'listop'|'listop-new'|undefined;
 
+export type ButtonPosition = 'fixedBottomRight'|'bottomLeft'|'bottomCenter'|'bottomRight'|undefined;
+
 export type FieldGroupType = 'relation' | 'fieldGroup' ;
 
 export type ButtonName = 'rowAdd' | 'rowEdit' | 'batchDelete'|'singleDelete'| 'selectAdd' | 'dtmplAdd' | 'dtmplEdit' | 'copy'|
@@ -148,6 +150,7 @@ export interface DtmplConfig extends TmplBase {
     actions: ActionConfig[];
     premises: FieldConfig[];
     groups: FieldGroupConfig[];
+    buttonPosition:ButtonPosition;
     onValuesChange:(changedValues,allValues:DtmplData,formInstance:FormInstance)=>void
 }