aldehyde 0.2.133 → 0.2.134

package/src/aldehyde/tree/block-menu-auth-tree.tsx

@@ -0,0 +1,188 @@
+import React from 'react'
+import {Card, Col, Row, Tree,Space} from 'antd';
+import './index.css'
+import HCserviceV3 from "../tmpl/hcservice-v3";
+import {BlockMenu, Level2Menu, ProgramAuth} from "../tmpl/interface";
+// import type {TreeDataNode, TreeProps} from 'antd';
+import {DeleteOutlined, KeyOutlined, LockOutlined, PlusOutlined, RedoOutlined, UnlockOutlined} from '@ant-design/icons'
+interface BlockMenuAuthTreeProps {
+    checks: string[],
+    //checkAuthCodes: string[],
+    onChange: (checkeds:string[]) => void,
+    // onCheck: (keys, info: object) => void,
+}
+
+interface BlockMenuAuthTreeState {
+    treeData?: Object[],
+    loading?: boolean,
+    // treekeyAuthId?:{},
+    // authIdtreekeys?:{}
+
+}
+
+
+class BlockMenuAuthTree extends React.PureComponent<BlockMenuAuthTreeProps, BlockMenuAuthTreeState> {
+
+    static defaultProps = {checkeds: []}
+
+     treekeyAuthId= {};
+     authIdtreekeys={};
+
+    state = {
+        treeData: undefined,
+        loading: false,
+        // treekeyAuthId:{},
+        // authIdtreekeys:{}
+    }
+
+
+    async componentDidMount() {
+        await this.refresh();
+    }
+
+
+
+    async componentDidUpdate(prevProps, prevState) {
+        // const {checks:prechecks,} = prevProps;
+        // const {checks} = this.props;
+        // if(checks!=prechecks){
+        //     await this.refresh();
+        // }
+    }
+
+    async componentWillUnmount() {
+
+    }
+
+
+    initData = async () => {
+
+        this.setState({
+            loading: true
+        })
+
+        let data: BlockMenu[] = await HCserviceV3.requestBlockMenuAuths();
+
+        //转换成Treenode
+
+        let treeData= [];
+
+        if (data) {
+            treeData = this.toTreeNode(data);
+            console.log("treeData",treeData)
+        }
+
+        //已经选了那些
+        this.setState({
+            treeData, loading: false
+        })
+    }
+
+    toTreeNode = (blockMenus: (BlockMenu | Level2Menu)[]): Object[] => {
+        let treeData= [];
+        // let authIdtreekeys={};
+        // let treekeyAuthId={};
+        if (blockMenus) {
+            blockMenus.forEach((block) => {
+                let blockNode = {key: block.id, title: block.title}
+                treeData.push(blockNode);
+                let nextBlockMenus = [];
+                blockNode["children"]=nextBlockMenus;
+                nextBlockMenus.push(...this.toTreeNode(block.items));
+                //处理权限
+                if (block["programAuths"]) {
+
+                    block["programAuths"].forEach((auth) => {
+                        let key= blockNode.key + auth.id;
+                        this.treekeyAuthId[key]=auth.id;
+                        if(!this.authIdtreekeys[auth.id]){
+                            this.authIdtreekeys[auth.id]=[];
+                        }
+                        this.authIdtreekeys[auth.id].push(key);
+                        let authNode= {key, title: auth.title, isLeaf: true}
+                        authNode["code"] = auth.id;
+                        nextBlockMenus.push(authNode);
+                    });
+                }else{
+
+                }
+            });
+        }
+
+        return treeData;
+
+
+    }
+
+    onCheck=(checkedKeys)=>{
+        let checks=[];
+
+        if(checkedKeys){
+            checkedKeys.forEach((k)=>{
+                if(this.treekeyAuthId[k]){
+                    checks.push(this.treekeyAuthId[k]);
+                }
+            })
+
+        }
+        this.props.onChange(checks);
+    }
+
+    async refresh() {
+        this.setState({
+            loading: true
+        })
+        await this.initData();
+        this.setState({
+            loading: false,
+        })
+    }
+
+    renderTitle = (nodeData) => {
+        return <Card bordered={false} style={{width:'100%',minWidth:'180px',marginBottom:2}}  bodyStyle={{padding:'2px'}} >
+            <Row>
+                <Col span={24}>
+                    <Space>
+                        {nodeData["isLeaf"]?<KeyOutlined rotate={180} style={{color: '#f5222d', marginRight: '4px'}}/>:null}
+                        {nodeData.title}
+                    </Space>
+
+                </Col>
+            </Row>
+        </Card>
+    }
+
+    render() {
+        const {checks, onChange} = this.props;
+        const {loading, treeData} = this.state;
+
+
+        let checkedKeys=[];
+        checks.forEach((id)=>{
+            if(this.authIdtreekeys[id]){
+                checkedKeys.push(...this.authIdtreekeys[id]);
+            }
+        })
+        console.log("treeData",treeData);
+        console.log("checkedKeys",checkedKeys);
+        return <Card bodyStyle={{padding: '2px', "overflowY": "scroll", height: 'calc(78vh)', minWidth: '420px'}}
+                     loading={loading}>
+            <Tree
+                checkable={true}
+                defaultExpandAll={true}
+                //defaultCheckedKeys={defaultCheckedKeys}
+                checkedKeys={checkedKeys}
+
+                showLine={{showLeafIcon: false}}
+                selectable={false}
+                onCheck={(checkedKeys)=>this.onCheck(checkedKeys)}
+                titleRender={(nodeData) => {
+                    return this.renderTitle(nodeData)
+                }}
+                treeData={treeData}
+            />
+        </Card>
+    }
+}
+
+export default BlockMenuAuthTree

package/src/aldehyde/welcome/HCWelcome.js

@@ -1,13 +1,27 @@
 import React from 'react'
-import {Card, Col, Row} from 'antd';
+import {Button, Card, Col, Row} from 'antd';
 import { BarChartOutlined } from "@ant-design/icons";
 import QuickEntrance from './quick-entrance'
 import Workbench from './workbench';
 import './index.css';
 import Units from "../units";
 import withRouter from "../routable/withroute";
+import BlockMenuAuthTree from "../tree/block-menu-auth-tree";
+import BlockMenuAuthTreeDrawer from "../module/block-menu-tree-drawer"
+
+// interface HCWelcomeProps {
+//
+// }
+//
+// interface HCWelcomeState {
+// // //     selectedAuths:string[]
+// openDrawer:boolean
+// }
+
 class HCWelcome extends React.Component {
-    state = {}
+    state = {
+        openDrawer:false
+    }
 
     intervals = [];
 
@@ -122,9 +136,9 @@ class HCWelcome extends React.Component {
 
         // option && myChart.setOption(option);
         //
-        // this.setState({
-        //     piecharts
-        // })
+        this.setState({
+            openDrawer:false
+        })
     }
 
     componentWillUnmount() {
@@ -147,6 +161,7 @@ class HCWelcome extends React.Component {
 
     render() {
         const {params} = this.props;
+        const {openDrawer}=this.state
         Units.setProgramCode4RoutePath(params);
         return <>
             <Row className={'home-page'} gutter={{xs: 4, sm: 8, md: 12, lg: 16}}>
@@ -214,6 +229,29 @@ class HCWelcome extends React.Component {
             {/*        <DtmplEditCard  code={'8999231441132377'} sourceId={'246909250609153'} ></DtmplEditCard>*/}
             {/*    </Col>*/}
             {/*</Row>*/}
+
+            <Row>
+                <Col>
+                    <Button onClick={()=>{
+                        this.setState({
+                            openDrawer:!this.state.openDrawer
+                        })
+                    }
+
+                    } >打开权限</Button>
+                    {/*<BlockMenuAuthTree />*/}
+                </Col>
+            </Row>
+            <BlockMenuAuthTreeDrawer onCancel={ ()=>{
+                this.setState({
+                    openDrawer:false
+                })
+            }}  onOk={ ()=>{
+                this.setState({
+                    openDrawer:false
+                })
+            }} open={openDrawer} roleCode={'374901611447492611'}></BlockMenuAuthTreeDrawer>
+
         </>
     }