From 9fa9d08e77f5fc281054167f404fa20e359559c0 Mon Sep 17 00:00:00 2001 From: "youHong.ai" <774495953@qq.com> Date: Sun, 4 Dec 2022 20:06:30 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=9D=E6=97=B6=E6=8D=B7=E4=BA=BA=E5=91=98?= =?UTF-8?q?=E7=BB=84=E7=BB=87=E6=9E=B6=E6=9E=84=E5=89=8D=E7=AB=AF=E4=BB=A3?= =?UTF-8?q?=E7=A0=81=E7=BC=96=E5=86=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.js | 736 ++++++++++++++------------------ src/components/OrgChart.jsx | 189 +++++--- src/components/OrgChartNode.jsx | 13 +- src/css/index.css | 147 +++++-- src/css/node.css | 29 +- src/iconfont/iconfont.css | 30 +- src/iconfont/iconfont.ttf | Bin 3832 -> 4984 bytes src/iconfont/iconfont.woff | Bin 2428 -> 3100 bytes src/iconfont/iconfont.woff2 | Bin 1924 -> 2496 bytes 9 files changed, 624 insertions(+), 520 deletions(-) diff --git a/src/App.js b/src/App.js index c18ff67..d0cc088 100644 --- a/src/App.js +++ b/src/App.js @@ -4,392 +4,9 @@ import {Component, Fragment} from "react"; import {OrgChartNode} from "./components/OrgChartNode"; import "./iconfont/iconfont.css" -const orgTree = [{ - 'id': 1, - 'isRoot':true, - 'name': 'Lao Lao parent parent', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 0, - 'showChildren': 1, - "children": [{ - 'id': 2, - 'name': 'Lao Lao parent', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 0, - 'showChildren': 1, - "children": [{ - 'id': 39, - 'name': 'Lao Lao61', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 1, - 'showChildren': 0, - },{ - 'id': 38, - 'name': 'Lao Lao72', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 1, - 'showChildren': 0, - },{ - 'id': 3, - 'name': 'Lao Lao4', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 1, - 'showChildren': 1, - 'children': [ - { - 'id': 4, - 'name': 'Bo Miao', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 1 - }, - { - 'id': 5, - 'name': 'Su Miao', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 2, - 'children': [ - { - 'id': 6, - 'name': 'Tie Hua', 'title': 'senior engineer', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 1, - }, - { - 'id': 7, - 'name': 'Hei Hei', 'title': 'senior engineer', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 1 - } - ] - }, - { - 'id': 8, - 'name': 'Yu Jie', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 2, - }, - { - 'id': 9, - 'name': 'Yu Li', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 2, - 'children': [ - { - 'id': 9, - 'name': 'Bo Miao', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 1 - }, - { - 'id': 10, - 'name': 'Su Miao', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'type': 2, - 'show': 1, - 'children': [ - { - 'id': 11, - 'name': 'Tie Hua', 'title': 'senior engineer', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 1, - }, - { - 'id': 12, - 'name': 'Hei Hei', 'title': 'senior engineer', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 1 - } - ] - }, - { - 'id': 13, - 'name': 'Yu Jie', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 2, - }, - { - 'id': 14, - 'name': 'Yu Li', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 2, - }, - { - 'id': 14, - 'name': 'Hong Miao', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'showChildren': 0, - 'downLevel': '29', - 'show': 1, - 'type': 2, - }, - { - 'id': 15, - 'name': 'Yu Wei', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'showChildren': 0, - 'downLevel': '29', - 'show': 1, - 'type': 1, - }, - { - 'id': 16, - 'name': 'Chun Miao', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'showChildren': 0, - 'downLevel': '29', - 'show': 1, - 'type': 2, - }, - { - 'id': 17, - 'name': 'Yu Tie', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'showChildren': 0, - 'downLevel': '29', - 'show': 1, - 'type': 1, - } - ] - }, - { - 'id': 18, - 'name': 'Hong Miao', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'showChildren': 0, - 'downLevel': '29', - 'show': 1, - 'type': 2, - }, - { - 'id': 19, - 'name': 'Yu Wei', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'showChildren': 0, - 'downLevel': '29', - 'show': 1, - 'type': 1, - }, - { - 'id': 20, - 'name': 'Chun Miao', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'showChildren': 0, - 'downLevel': '29', - 'show': 1, - 'type': 2, - }, - { - 'id': 21, - 'name': 'Yu Tie', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'showChildren': 0, - 'downLevel': '29', - 'show': 1, - 'type': 1, - } - ] - },{ - 'id': 31, - 'name': 'Lao Lao5', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 1, - 'showChildren': 0, - },{ - 'id': 32, - 'name': 'Lao Lao6', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 1, - 'showChildren': 0, - },{ - 'id': 33, - 'name': 'Lao Lao7', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 1, - 'showChildren': 0, - }] - }, { - 'id': 25, - 'name': 'Lao Lao parent 1', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 0, - 'showChildren': 0, - }, { - 'id': 24, - 'name': 'Lao Lao parent2', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 0, - 'showChildren': 0, - "children": [{ - 'id': 23, - 'name': 'Lao Lao 1', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 1, - 'showChildren': 0, - 'children': [ - { - 'id': 26, - 'name': 'Bo Miao 1', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 1 - }, - { - 'id': 27, - 'name': 'Su Miao 1', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 2, - }, - { - 'id': 28, - 'name': 'Yu Jie 1', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'showChildren': 0, - 'show': 1, - 'type': 2, - }, - { - 'id': 29, - 'name': 'Yu Wei 1', 'title': 'department manager', 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'showChildren': 0, - 'downLevel': '29', - 'show': 1, - 'type': 1, - }] - }] - }, { - 'id': 30, - 'name': 'Lao Lao parent 3', - 'title': 'general manager', - 'avatar': 'avatar.jpg', - 'department': 'Senior Manager After Sales Marketing Communication & e-Commerce', - 'job': 'Senior Manager Technology China Advanced Driver Assistance Systems', - 'downLevel': '29', - 'type': 1, - 'show': 0, - 'showChildren': 0, - }] -}] + +const orgTree =[{"children":[{"children":[{"children":[{"children":[{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"工作流程组","departmentId":17,"id":59,"job":"测试工程师","jobId":35,"managerId":53,"managerIds":[53,42,24,23,22],"name":"徐芬","show":0,"showBrother":0,"showChildren":0,"type":4}],"childrenNum":1,"current":false,"currentParent":false,"department":"工作流程组","departmentId":17,"id":53,"job":"测试组长","jobId":31,"managerId":42,"managerIds":[42,24,23,22],"name":"刘艳","show":0,"showBrother":0,"showChildren":0,"type":3},{"childrenNum":0,"current":false,"currentParent":false,"department":"工作流程组","departmentId":17,"id":55,"job":"高级开发工程师","jobId":32,"managerId":42,"managerIds":[42,24,23,22],"name":"廖冬","show":0,"showBrother":0,"showChildren":0,"type":4},{"childrenNum":0,"current":false,"currentParent":false,"department":"工作流程组","departmentId":17,"id":56,"job":"开发工程师","jobId":33,"managerId":42,"managerIds":[42,24,23,22],"name":"茅春荣","show":0,"showBrother":0,"showChildren":0,"type":4}],"childrenNum":4,"current":false,"currentParent":false,"department":"工作流程组","departmentId":17,"id":42,"job":"模块负责人","jobId":22,"managerId":24,"managerIds":[24,23,22],"name":"王成才","show":0,"showBrother":0,"showChildren":0,"type":3},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"系统架构部","departmentId":21,"id":52,"job":"系统安全主管","jobId":30,"managerId":48,"managerIds":[48,24,23,22],"name":"柳炉","show":0,"showBrother":0,"showChildren":0,"type":3},{"childrenNum":0,"current":false,"currentParent":false,"department":"系统架构部","departmentId":21,"id":60,"job":"高级开发工程师","jobId":32,"managerId":48,"managerIds":[48,24,23,22],"name":"李斌（上海）","show":0,"showBrother":0,"showChildren":0,"type":4}],"childrenNum":2,"current":false,"currentParent":false,"department":"系统架构部","departmentId":21,"id":48,"job":"系统架构部经理","jobId":28,"managerId":24,"managerIds":[24,23,22],"name":"王金永","show":0,"showBrother":0,"showChildren":0,"type":3},{"childrenNum":0,"current":false,"currentParent":false,"department":"门户协同区组","departmentId":24,"id":72,"job":"模块负责人","jobId":22,"managerId":24,"managerIds":[24,23,22],"name":"陆佳牛","show":0,"showBrother":0,"showChildren":0,"type":5}],"childrenNum":9,"current":false,"currentParent":false,"department":"技术总服部","departmentId":5,"id":24,"job":"EBU产品开发总监","jobId":4,"managerId":23,"managerIds":[23,22],"name":"杨国生","show":0,"showBrother":0,"showChildren":0,"type":1},{"children":[{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU培训服务部","departmentId":14,"id":74,"job":"产品培训师","jobId":42,"managerId":35,"managerIds":[35,25,23,22],"name":"陈莉莉","show":0,"showBrother":0,"showChildren":0,"type":5},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU培训服务部","departmentId":14,"id":77,"job":"产品培训师","jobId":42,"managerId":35,"managerIds":[35,25,23,22],"name":"彭雨","show":0,"showBrother":0,"showChildren":0,"type":6}],"childrenNum":2,"current":false,"currentParent":false,"department":"EBU培训服务部","departmentId":14,"id":35,"job":"培训经理","jobId":15,"managerId":25,"managerIds":[25,23,22],"name":"崔莹","show":0,"showBrother":0,"showChildren":0,"type":2},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"客服EBU一部","departmentId":15,"id":50,"job":"高级客户服务顾问","jobId":20,"managerId":38,"managerIds":[38,25,23,22],"name":"金俊俊","show":0,"showBrother":0,"showChildren":0,"type":3}],"childrenNum":1,"current":false,"currentParent":false,"department":"客服EBU一部","departmentId":15,"id":38,"job":"客服EBU一部经理","jobId":18,"managerId":25,"managerIds":[25,23,22],"name":"鲍建","show":0,"showBrother":0,"showChildren":0,"type":2},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"客服EBU三部","departmentId":16,"id":40,"job":"高级客户服务顾问","jobId":20,"managerId":39,"managerIds":[39,25,23,22],"name":"王君","show":0,"showBrother":0,"showChildren":0,"type":2},{"childrenNum":0,"current":false,"currentParent":false,"department":"客服EBU三部","departmentId":16,"id":61,"job":"高级客户服务顾问","jobId":20,"managerId":39,"managerIds":[39,25,23,22],"name":"石楠","show":0,"showBrother":0,"showChildren":0,"type":4}],"childrenNum":2,"current":false,"currentParent":false,"department":"客服EBU三部","departmentId":16,"id":39,"job":"客服EBU三部经理","jobId":19,"managerId":25,"managerIds":[25,23,22],"name":"苏永强","show":0,"showBrother":0,"showChildren":0,"type":2},{"childrenNum":0,"current":false,"currentParent":false,"department":"财务服务部","departmentId":19,"id":44,"job":"出纳","jobId":24,"managerId":25,"managerIds":[25,23,22],"name":"郭敬美","show":0,"showBrother":0,"showChildren":0,"type":3},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU客服中心","departmentId":6,"id":46,"job":"客服助理","jobId":26,"managerId":25,"managerIds":[25,23,22],"name":"刘晓璇","show":0,"showBrother":0,"showChildren":0,"type":3}],"childrenNum":10,"current":false,"currentParent":false,"department":"EBU客服中心","departmentId":6,"id":25,"job":"EBU客服总监","jobId":5,"managerId":23,"managerIds":[23,22],"name":"隋清","show":0,"showBrother":0,"showChildren":0,"type":1},{"childrenNum":0,"current":false,"currentParent":false,"department":"技术总服部","departmentId":5,"id":26,"job":"EBU开发平台技术总监","jobId":6,"managerId":23,"managerIds":[23,22],"name":"胡波","show":0,"showBrother":0,"showChildren":0,"type":1},{"childrenNum":0,"current":false,"currentParent":false,"department":"技术总服部","departmentId":5,"id":27,"job":"EBU项目开发总监","jobId":7,"managerId":23,"managerIds":[23,22],"name":"周军锋","show":0,"showBrother":0,"showChildren":0,"type":1},{"children":[{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"PMO服务部","departmentId":11,"id":41,"job":"项目助理","jobId":21,"managerId":32,"managerIds":[32,31,23,22],"name":"何新琼","show":0,"showBrother":0,"showChildren":0,"type":2},{"childrenNum":0,"current":false,"currentParent":false,"department":"PMO服务部","departmentId":11,"id":54,"job":"项目助理","jobId":21,"managerId":32,"managerIds":[32,31,23,22],"name":"张弛","show":0,"showBrother":0,"showChildren":0,"type":4},{"childrenNum":0,"current":false,"currentParent":false,"department":"PMO服务部","departmentId":11,"id":71,"job":"项目助理","jobId":21,"managerId":32,"managerIds":[32,31,23,22],"name":"谢陈林","show":0,"showBrother":0,"showChildren":0,"type":5}],"childrenNum":3,"current":false,"currentParent":false,"department":"PMO服务部","departmentId":11,"id":32,"job":"PMO管理部主管","jobId":12,"managerId":31,"managerIds":[31,23,22],"name":"李芹","show":0,"showBrother":0,"showChildren":0,"type":2},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU项目一部","departmentId":12,"id":33,"job":"项目经理","jobId":13,"managerId":31,"managerIds":[31,23,22],"name":"张理祯","show":0,"showBrother":0,"showChildren":0,"type":2},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU项目服务部","departmentId":10,"id":36,"job":"项目顾问","jobId":16,"managerId":31,"managerIds":[31,23,22],"name":"郑电敏","show":0,"showBrother":0,"showChildren":0,"type":2},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU项目一部","departmentId":12,"id":57,"job":"项目经理","jobId":13,"managerId":31,"managerIds":[31,23,22],"name":"边宝","show":0,"showBrother":0,"showChildren":0,"type":4},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU项目一部","departmentId":12,"id":62,"job":"项目经理","jobId":13,"managerId":31,"managerIds":[31,23,22],"name":"平龙成","show":0,"showBrother":0,"showChildren":0,"type":4},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU项目一部","departmentId":12,"id":64,"job":"项目实施工程师","jobId":37,"managerId":31,"managerIds":[31,23,22],"name":"陈义","show":0,"showBrother":0,"showChildren":0,"type":4},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU项目一部","departmentId":12,"id":66,"job":"项目经理","jobId":13,"managerId":31,"managerIds":[31,23,22],"name":"王海涛（上海）","show":0,"showBrother":0,"showChildren":0,"type":5},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU项目一部","departmentId":12,"id":67,"job":"项目实施工程师","jobId":37,"managerId":31,"managerIds":[31,23,22],"name":"沈超","show":0,"showBrother":0,"showChildren":0,"type":5},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU项目一部","departmentId":12,"id":75,"job":"项目实施工程师","jobId":37,"managerId":69,"managerIds":[69,31,23,22],"name":"马超","show":0,"showBrother":0,"showChildren":0,"type":5},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU项目一部","departmentId":12,"id":76,"job":"项目实施工程师","jobId":37,"managerId":69,"managerIds":[69,31,23,22],"name":"李雯","show":0,"showBrother":0,"showChildren":0,"type":6}],"childrenNum":2,"current":false,"currentParent":false,"department":"EBU项目一部","departmentId":12,"id":69,"job":"项目经理","jobId":13,"managerId":31,"managerIds":[31,23,22],"name":"何源","show":0,"showBrother":0,"showChildren":0,"type":5}],"childrenNum":14,"current":false,"currentParent":false,"department":"EBU项目服务部","departmentId":10,"id":31,"job":"项目总监","jobId":11,"managerId":23,"managerIds":[23,22],"name":"严玥宸","show":0,"showBrother":0,"showChildren":0,"type":2},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"商务服务部","departmentId":13,"id":58,"job":"商务专员","jobId":34,"managerId":34,"managerIds":[34,23,22],"name":"叶小芳","show":0,"showBrother":0,"showChildren":0,"type":4}],"childrenNum":1,"current":false,"currentParent":false,"department":"商务服务部","departmentId":13,"id":34,"job":"商务经理","jobId":14,"managerId":23,"managerIds":[23,22],"name":"王玉梅","show":0,"showBrother":0,"showChildren":0,"type":2},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU营销中心","departmentId":3,"id":68,"job":"销售助理","jobId":39,"managerId":23,"managerIds":[23,22],"name":"李梦璇","show":0,"showBrother":0,"showChildren":0,"type":5},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU营销中心","departmentId":3,"id":73,"job":"售前咨询顾问","jobId":41,"managerId":23,"managerIds":[23,22],"name":"刘祥","show":0,"showBrother":0,"showChildren":0,"type":5},{"childrenNum":0,"current":false,"currentParent":false,"department":"EBU营销中心","departmentId":3,"id":80,"job":"售前咨询总监","jobId":44,"managerId":23,"managerIds":[23,22],"name":"杨昭","show":0,"showBrother":0,"showChildren":0,"type":6},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"上海大区服务中心","departmentId":28,"id":87,"job":"行政助理","jobId":47,"managerId":85,"managerIds":[85,23,22],"name":"陈倩","show":0,"showBrother":0,"showChildren":0,"type":6},{"childrenNum":0,"current":true,"currentParent":false,"department":"上海大区服务中心","departmentId":28,"id":88,"job":"出纳","jobId":48,"managerId":85,"managerIds":[85,23,22],"name":"赵咏梅","show":1,"showBrother":1,"showChildren":1,"type":6}],"childrenNum":2,"current":false,"currentParent":true,"department":"上海大区服务中心","departmentId":28,"id":85,"job":"上海大区总经理","jobId":46,"managerId":23,"managerIds":[23,22],"name":"陈驰","show":0,"showBrother":0,"showChildren":1,"type":6}],"childrenNum":46,"current":false,"currentParent":true,"department":"EBU营销中心","departmentId":3,"id":23,"job":"EBU本部总经理兼副总裁","jobId":3,"managerId":22,"managerIds":[22],"name":"王晨志","show":0,"showBrother":0,"showChildren":1,"type":1},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"行政服务部","departmentId":18,"id":43,"job":"行政助理","jobId":23,"managerId":28,"managerIds":[28,22],"name":"张逊良","show":0,"showBrother":0,"showChildren":0,"type":3},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"人事服务组","departmentId":20,"id":70,"job":"人事专员","jobId":40,"managerId":45,"managerIds":[45,28,22],"name":"叶可可","show":0,"showBrother":0,"showChildren":0,"type":5}],"childrenNum":1,"current":false,"currentParent":false,"department":"人事服务组","departmentId":20,"id":45,"job":"人事主管","jobId":25,"managerId":28,"managerIds":[28,22],"name":"马琳琳","show":0,"showBrother":0,"showChildren":0,"type":3},{"childrenNum":0,"current":false,"currentParent":false,"department":"行政服务部","departmentId":22,"id":51,"job":"行政助理","jobId":23,"managerId":28,"managerIds":[28,22],"name":"房鹏飞","show":0,"showBrother":0,"showChildren":0,"type":3},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"招聘一组","departmentId":25,"id":84,"job":"招聘专员","jobId":43,"managerId":78,"managerIds":[78,28,22],"name":"陈静","show":0,"showBrother":0,"showChildren":0,"type":6}],"childrenNum":1,"current":false,"currentParent":false,"department":"招聘一组","departmentId":25,"id":78,"job":"招聘专员","jobId":43,"managerId":28,"managerIds":[28,22],"name":"廖宇","show":0,"showBrother":0,"showChildren":0,"type":6},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"招聘二组","departmentId":26,"id":83,"job":"招聘专员","jobId":43,"managerId":79,"managerIds":[79,28,22],"name":"赵银银","show":0,"showBrother":0,"showChildren":0,"type":6}],"childrenNum":1,"current":false,"currentParent":false,"department":"招聘二组","departmentId":26,"id":79,"job":"招聘专员","jobId":43,"managerId":28,"managerIds":[28,22],"name":"贾韫琪","show":0,"showBrother":0,"showChildren":0,"type":6}],"childrenNum":8,"current":false,"currentParent":false,"department":"人力资源部","departmentId":7,"id":28,"job":"人力资源部经理","jobId":8,"managerId":22,"managerIds":[22],"name":"蔡苒","show":0,"showBrother":0,"showChildren":0,"type":1},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"财务服务部","departmentId":8,"id":30,"job":"会计","jobId":10,"managerId":29,"managerIds":[29,22],"name":"展璐芸","show":0,"showBrother":0,"showChildren":0,"type":2},{"childrenNum":0,"current":false,"currentParent":false,"department":"财务服务部","departmentId":8,"id":37,"job":"出纳","jobId":17,"managerId":29,"managerIds":[29,22],"name":"张静","show":0,"showBrother":0,"showChildren":0,"type":2},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"分支机构财务部","departmentId":27,"id":82,"job":"财务支撑","jobId":45,"managerId":81,"managerIds":[81,29,22],"name":"韩亚萍","show":0,"showBrother":0,"showChildren":0,"type":6}],"childrenNum":1,"current":false,"currentParent":false,"department":"分支机构财务部","departmentId":27,"id":81,"job":"财务支撑","jobId":45,"managerId":29,"managerIds":[29,22],"name":"吕成龙","show":0,"showBrother":0,"showChildren":0,"type":6},{"childrenNum":0,"current":false,"currentParent":false,"department":"财务服务部","departmentId":8,"id":86,"job":"会计","jobId":10,"managerId":29,"managerIds":[29,22],"name":"张元雪","show":0,"showBrother":0,"showChildren":0,"type":6}],"childrenNum":5,"current":false,"currentParent":false,"department":"财务服务部","departmentId":8,"id":29,"job":"财务经理","jobId":9,"managerId":22,"managerIds":[22],"name":"包小娟","show":0,"showBrother":0,"showChildren":0,"type":2},{"childrenNum":0,"current":false,"currentParent":false,"department":"总裁办公室","departmentId":2,"id":47,"job":"副总裁","jobId":27,"managerId":22,"managerIds":[22],"name":"金戈","show":0,"showBrother":0,"showChildren":0,"type":3},{"children":[{"childrenNum":0,"current":false,"currentParent":false,"department":"总裁办公室","departmentId":2,"id":63,"job":"投资助理","jobId":36,"managerId":49,"managerIds":[49,22],"name":"晏成","show":0,"showBrother":0,"showChildren":0,"type":4}],"childrenNum":1,"current":false,"currentParent":false,"department":"总裁办公室","departmentId":2,"id":49,"job":"泛微副总裁兼点甲创投副总裁","jobId":29,"managerId":22,"managerIds":[22],"name":"唐星坤","show":0,"showBrother":0,"showChildren":0,"type":3},{"childrenNum":0,"current":false,"currentParent":false,"department":"案例运营部","departmentId":23,"id":65,"job":"案例运营部总监","jobId":38,"managerId":22,"managerIds":[22],"name":"桂菲蓝","show":0,"showBrother":0,"showChildren":0,"type":5}],"childrenNum":66,"current":false,"currentParent":true,"department":"总裁办公室","departmentId":2,"id":22,"isRoot":true,"job":"总裁","jobId":2,"managerId":0,"managerIds":[],"name":"韦利东","show":0,"showBrother":0,"showChildren":1,"type":1}] + class App extends Component { @@ -399,7 +16,8 @@ class App extends Component { top: 0, scale: 1, cursor: 'auto', - orgTree: orgTree + layer: 0, + orgTree: [...JSON.parse(JSON.stringify(orgTree))] } getChartNoe = (node) => { @@ -445,40 +63,206 @@ class App extends Component { // document.documentElement.scrollLeft = (document.documentElement.scrollWidth - document.documentElement.clientWidth) / 2 showParent = (node) => { - if(!node){ + console.log(node) + if (!node) { return } - this.state.orgTree.forEach(item=>{ - this.findChildrenShow(item,node) - }) - this.setState({ - orgTree:[...this.state.orgTree] - }) - } - - - - findChildrenShow = (node,children)=>{ - let childrenIndex = node.children.findIndex(item=>item.id === children.id) - if(childrenIndex === -1){ - // 没有找到 - node.children.forEach(item=>{ - item.show = 0 - this.findChildrenShow(item,node) - }) - }else { - node.children.forEach((item,index)=>{ - if(index !== childrenIndex){ - item.show = 0 - }else { + if (this.state.orgTree.findIndex(item => item.id === node.managerId) !== -1) { + this.state.orgTree.forEach(item => { + if (item.id === node.managerId) { item.show = 1 } }) + } else { + this.state.orgTree.forEach(item => this.findChildrenParentShow(item, node)) + } + this.setState({ + orgTree: [...this.state.orgTree] + }, () => { + setTimeout(this.toCenter, 1000) + }) + + // console.log(node) + // this.state.orgTree.forEach(item => { + // this.findChildrenParentShow(item, node) + // }) + // this.setState({ + // orgTree: [...this.state.orgTree] + // }, () => { + // setTimeout(this.toCenter, 1000) + // }) + } + + findChildrenParentShow = (node, children) => { + if (node.children?.findIndex(item => item.id === children.managerId) !== -1) { + node.children?.forEach(item => { + if (item.id === children.managerId) { + item.show = 1 + } + }) + } else { + node.children?.forEach(item => this.findChildrenParentShow(item, children)) + } + + /*if (!node.children || node.children.length === 0) { + return + } + if (children.isRoot) { + // roo + children.show = 1 + return; + } + let childrenIndex = node.children.findIndex(item => item.id === children.id) + if (childrenIndex === -1) { + // 没有找到 + node.children.forEach(item => { + item.show = 0 + this.findChildrenParentShow(item, node) + }) + } else { + node.children.forEach((item, index) => { + if (index !== childrenIndex) { + item.show = 0 + } else { + item.show = 1 + item.showBrother = 0 + // item.children?.forEach(children => { + // children.show = 0 + // }) + } + }) + }*/ + } + + hiddenParent = (node, layer) => { + if (!node) { + return + } + if (node.isRoot) { + return; + } + this.state.orgTree.forEach(item => { + this.hiddenChildrenNodes(item, node) + if (node.managerIds.includes(item.id)) { + this.findChildrenParentHidden(item, node) + item.showChildren = 1 + } + }) + // this.state.orgTree.forEach((item, index) => { + // item.show = 0 + // this.findChildrenParentHidden(item, node, layer, 0) + // }) + this.setState({ + orgTree: [...this.state.orgTree] + }) + } + + hiddenChildrenNodes = (node, currentNode) => { + debugger + if (node.id === currentNode.id) { + return + } + node.show = 0 + node.showBrother = 0 + node.showChildren = 0 + if (node.children) { + node.children.forEach(item => this.hiddenChildrenNodes(item, currentNode)) } } - hiddenParent = (node) => { - console.log("hidden", node) + + + findChildrenParentHidden = (node, children, layer, n) => { + if (node.id === children.id) { + return + } + node?.children.forEach(item => { + this.hiddenChildrenNodes(item, children) + if (children.managerIds.includes(item.id)) { + item.showChildren = 1 + this.findChildrenParentHidden(item, children) + } + }) + // let childrenIndex = node.children?.findIndex(item => item.id === children.id) + // node.children?.forEach((item, index) => { + // if (index === childrenIndex) { + // item.show = 1 + // } else { + // item.show = 0 + // if (n >= layer) { + // item.showChildren = 0 + // } + // this.findChildrenParentHidden(item, children, layer, ++n) + // } + // }) } + + toCenter = () => { + let mid = (document.documentElement.scrollWidth - document.documentElement.clientWidth) / 2 + // let n = mid / 40; + // let interval = setInterval(() => { + // if (document.documentElement.scrollLeft >= mid) { + // clearInterval(interval) + // document.documentElement.scrollLeft = mid + document.documentElement.scrollTo(mid, 0) + // } + // document.documentElement.scrollLeft = document.documentElement.scrollLeft + 2 * n + // if (n <= 1) { + // n = 1 + // } else { + // n-- + // } + // }, 1) + } + + + showOrHiddenBrother = (node, layer) => { + if (node.isRoot) { + this.state.orgTree.forEach(item => { + (item.id === node.id) || (item.show = 0) + }) + } else { + this.state.orgTree.forEach(item => { + this.findChildrenShowOrHiddenBrother(item, node, 0, layer) + }) + } + this.setState({ + orgTree: [...this.state.orgTree] + }) + } + + findChildrenShowOrHiddenBrother = (parent, node, n, layer) => { + if (n >= layer) { + return + } + if (parent.children?.findIndex(item => item.id === node.id) !== -1) { + parent.children?.forEach(item => { + if (item.id !== node.id) { + item.show = 0 + item.showChildren = 0 + } + }) + if (parent.showBrother === 0) { + parent.showBrother = 1 + parent.children?.forEach(item => { + item.show = 1 + }) + } else { + parent.children?.forEach(item => { + if (item.id !== node.id) { + item.show = 0 + item.showChildren = 0 + } + }) + parent.showBrother = 0 + } + // (children.id === node.id) || (children.show = children.show === 0 ? ((parent.showBrother = 1) || 1) : (parent.showBrother = 0) || 0) + } else { + parent.children?.forEach(item => { + this.findChildrenShowOrHiddenBrother(item, node, n + 1, layer) + }) + } + } + amplification = () => { let scale = parseFloat(this.state.scale) + 0.05 this.setState({scale}) @@ -492,6 +276,121 @@ class App extends Component { this.setState({scale}) } + + showChildren = (node, layer) => { + if (node.isRoot) { + node.showChildren = 1 + node.showBrother = 1 + node.children?.forEach(item => item.show = 1) + } else { + this.state.orgTree.forEach(item => { + this.showChildrenStack(item, node, 0, layer) + }) + } + this.setState({ + orgTree: [...this.state.orgTree] + }) + } + showChildrenStack = (parent, node, n, layer) => { + if (n > layer) { + return; + } + let nodeIndex = parent.children?.findIndex(item => item.id === node.id) + if (nodeIndex !== -1) { + parent.children?.forEach(item => { + if (item.id === node.id) { + item.showChildren = 1 + item.showBrother = 1 + item.children?.forEach(item => item.show = 1) + } + }) + return + } + parent.children?.forEach(item => { + this.showChildrenStack(item, node, n + 1, layer) + }) + } + + hiddenChildren = (node, layer) => { + if (node.isRoot) { + node.showChildren = 0 + node.showBrother = 0 + // node.children?.forEach(item => item.show = 0) + node.children?.forEach(item => { + item.show = 0 + item.showChildren = 1 + item.showBrother = 1 + this.showOrHiddenStack(item, 0) + }) + } else { + this.state.orgTree.forEach(item => { + this.hiddenChildrenStack(item, node, 0, layer) + }) + } + this.setState({ + orgTree: [...this.state.orgTree] + }) + } + + hiddenChildrenStack = (parent, node, n, layer) => { + if (n > layer) { + return; + } + let nodeIndex = parent.children?.findIndex(item => item.id === node.id) + if (nodeIndex !== -1) { + parent.children?.forEach(item => { + if (item.id === node.id) { + item.showChildren = 0 + node.showBrother = 0 + } + item.children?.forEach(item => { + item.show = 0 + item.showChildren = 0 + item.showBrother = 0 + this.showOrHiddenStack(item, 0) + }) + }) + return + } + parent.children?.forEach(item => { + this.hiddenChildrenStack(item, node, n + 1, layer) + }) + } + + showAll = () => { + this.state.orgTree.forEach(item => this.showOrHiddenStack(item, 1)) + this.setState({ + orgTree: [...this.state.orgTree] + }, () => { + setTimeout(this.toCenter, 1000) + }) + } + + showOrHiddenStack = (node, type) => { + node.showChildren = type + node.showBrother = type + node.show = type + if (type === 0) { + if (node.currentParent) { + node.showChildren = 1 + } + if (node.current) { + node.show = 1 + } + } + if (node.children) { + node.children.forEach(item => this.showOrHiddenStack(item, type)) + } + } + + hiddenAll = () => { + this.state.orgTree.forEach(item => this.showOrHiddenStack(item, 0)) + this.setState({ + orgTree: [...this.state.orgTree] + }) + } + + render() { return ( @@ -502,7 +401,11 @@ class App extends Component { this.setState({scale: 1, left: 0, top: 0})}> + onClick={() => (this.setState({scale: 1, left: 0, top: 0})) || (this.toCenter())}> + +
{ this.state.orgTree.map(item => { - return }) diff --git a/src/components/OrgChart.jsx b/src/components/OrgChart.jsx index b04079a..fc2f136 100644 --- a/src/components/OrgChart.jsx +++ b/src/components/OrgChart.jsx @@ -14,41 +14,55 @@ export class OrgChart extends Component { this.state = {...this.state, ...props} } - showOrHidden = (node) => { + showOrHidden = (node, layer) => { if (node.showChildren === 0) { - this.showChildren(node) + this.showChildren(node, layer) } else { - this.hiddenChildren((node)) + this.hiddenChildren(node, layer) } } - showChildren = (node) => { - node.showChildren = 1 + showChildren = (node, layer) => { this.setState({ - data: {...this.state.data} + orgChildren: "" }) + this.props.showChildren(node, layer) + // node.showChildren = 1 + // node.showBrother = 1 + // node.children?.forEach(item=>item.show=1) + // this.setState({ + // data: {...this.state.data} + // }) } - hiddenChildren = (node) => { + hiddenChildren = (node, layer) => { this.setState({ orgChildren: "hidden-org-children" }) - setTimeout(() => { - node.showChildren = 0 - this.hiddenChildrenStack(node) + setTimeout(()=>{ + this.props.hiddenChildren(node, layer) this.setState({ - data: {...this.state.data}, - orgChildren: "", + orgChildren: "" }) - }, 300) + },700) + + // setTimeout(() => { + + // node.showChildren = 0 + // this.hiddenChildrenStack(node) + // this.setState({ + // data: {...this.state.data}, + // orgChildren: "", + // }) + // }, 700) } - hiddenChildrenStack = (node)=>{ - if(!node.children || node.children.length === 0){ + hiddenChildrenStack = (node) => { + if (!node.children || node.children.length === 0) { return } - node.children.forEach(item=>{ + node.children.forEach(item => { item.showChildren = 0 this.hiddenChildrenStack(item) }) @@ -56,31 +70,41 @@ export class OrgChart extends Component { getOrgChartNode = (node) => { return -
+
{ - node.isRoot ? "" : (this.props.parent && this.props.parent.show && this.props.parent.show === 1 ? - this.props.hiddenParent(this.props.parent)}> + node.isRoot ? "" : (this.props.parent?.show === 1 ? + this.props.hiddenParent(node, this.props.layer)}> : - this.props.showParent(this.props.parent)}>) + this.props.showParent(node, this.props.layer)}>) } {this.state.getChartNode(node)} - {/*{*/} - {/* node.children && node.children.length > 0 ? (node.showChildren === 0 ?*/} - {/* this.showChildren(node)}>*/} - {/* */} - {/* :*/} - {/* this.hiddenChildren(node)}>*/} - {/* ) : ""*/} - {/*}*/} + { + this.props.parent && + this.props.parent.children.length > 1 && + this.props.parent?.show ? { + this.props.showOrHiddenBrother(node, this.props.layer) + }} + > + { + this.props.showOrHiddenBrother(node, this.props.layer) + }} + > + : "" + } { node.children && node.children.length > 0 ? { - this.showOrHidden(node) + this.showOrHidden(node, this.props.layer) }} > : "" } @@ -89,69 +113,84 @@ export class OrgChart extends Component { // return this.props.getChartNode(node) } - getOrgItem = (parent) => { + getOrgItem = () => { let getChartNode = this.state.getChartNode let node = this.state.data if (node.children && node.children.length > 0) { return (
-
this.setState({marginTop: 2})} onMouseOut={() => this.setState({marginTop: 0})} - > + > { this.getOrgChartNode(node) }
{ node.showChildren === 1 ? -
- { node.children.length === 1 ? - - - : node.children.map((item, index) => { - if (index === 0) { - return + : + node.children.map((item, index) => { + if (index === 0) { + return + } + if (index === node.children.length - 1) { + return + } + return - } - if (index === node.children.length - 1) { - return - } - return - }) + showOrHiddenBrother={this.props.showOrHiddenBrother} + data={item} lineClass="line row-line" + > + }) }
: "" } -
) } else { @@ -163,12 +202,22 @@ export class OrgChart extends Component { return ( { - this.state.lineClass ? + this.state.lineClass && this.props.data?.show ?
-
-
+ { + this.props.parent?.showBrother ? +
+ :
+ } +
{ this.getOrgItem(this.props.parent) } diff --git a/src/components/OrgChartNode.jsx b/src/components/OrgChartNode.jsx index e0a400e..68ef6eb 100644 --- a/src/components/OrgChartNode.jsx +++ b/src/components/OrgChartNode.jsx @@ -9,13 +9,20 @@ export class OrgChartNode extends Component { return (
-
+
+ {node.avatar ? "" : node.name.substring(0,1)}
logo
@@ -45,7 +52,7 @@ export class OrgChartNode extends Component { d="M682.752 597.333333a256 256 0 0 1 255.786667 246.4l0.213333 9.6H725.333333a298.410667 298.410667 0 0 0-144-255.530666c5.290667-0.298667 10.666667-0.469333 16.085334-0.469334h85.333333z m-85.333333-384A170.666667 170.666667 0 1 1 529.066667 540.458667 212.650667 212.650667 0 0 0 597.418667 384a212.736 212.736 0 0 0-68.266667-156.416A169.216 169.216 0 0 1 597.418667 213.333333z" fill="#666666" p-id="930"> - {node.downLevel} + {node.childrenNum}
diff --git a/src/css/index.css b/src/css/index.css index c33f584..336f8d2 100644 --- a/src/css/index.css +++ b/src/css/index.css @@ -1,3 +1,6 @@ +html{ + scroll-behavior: smooth; +} body{ -moz-user-select:none; /*火狐*/ @@ -8,30 +11,41 @@ body{ /*cursor: move;*/ } +#org-chart-container .hidden-node{ + width: 0 !important; + height: 0 !important; + margin-top: 0 !important; + padding: 0 !important; + font-size: 0!important; +} +#org-chart-container .hidden-node i{ + font-size: 0!important; +} + #org-chart-container{ text-align: center; - padding: 20px; + padding: 10vh 20px; position: relative; transform-origin: left center; } #org-chart-container .org-root{ - transition: height 0.3s; + transition: height 0.6s; } .functional-container{ position: fixed; - top: 20px; - right: 20px; - font-size: 14px; + top: 2vw; + right: 2vw; + font-size: 0.5vw; display: flex; align-items: center; z-index: 99; background-color:rgba(255,255,255,0.8); - padding: 10px; - border-radius: 5px; - box-shadow: 1px 1px 5px 1px #f1f1f1; + padding: 0.8vw; + border-radius: 0.3vw; + box-shadow: 1px 1px 6px 1px #f1f1f1; } .functional-container .cus_iconfont{ - font-size: 25px; + font-size: 1.5vw; margin: 0 5px; cursor: pointer; color: #333; @@ -53,12 +67,12 @@ body{ align-items: flex-start; animation: 0.3s children-show; opacity: 1; - transition: 0.3s all; + transition: 0.6s all; /*margin-top: -20px;*/ } #org-chart-container .org-children-chart.hidden-org-children{ - animation: 0.4s children-hidden; + animation: 0.8s children-hidden; } @@ -114,7 +128,7 @@ body{ position: relative; left: 50%; transform: translateX(-50%); - transition: all 0.3s; + transition: all 0.6s; } #org-chart-container .right-row-line{ @@ -123,7 +137,7 @@ body{ position: relative; left: 50%; background-color: #C32929; - transition: all 0.3s; + transition: all 0.6s; } #org-chart-container .left-row-line{ height: 2px; @@ -131,14 +145,14 @@ body{ position: relative; left: 0; background-color: #C32929; - transition: all 0.3s; + transition: all 0.6s; } #org-chart-container .row-line{ height: 2px; position: relative; left: 0; background-color: #C32929; - transition: all 0.3s; + transition: all 0.6s; } #org-chart-container .top-down-line{ height: 20px; @@ -148,7 +162,7 @@ body{ top: -2px; left: 50%; transform: translateX(-50%); - transition: all 0.3s; + transition: all 0.6s; } @@ -158,7 +172,7 @@ body{ } #org-chart-container .org-chart-item:hover{ - transition: all 0.3s; + transition: all 0.6s; /*transform: scale(0.975);*/ } @@ -169,10 +183,7 @@ body{ transform: translateX(-50%) rotateZ(180deg) !important; display: inline-block; } -#org-chart-container .org-chart-item .show-parent-icon{ - transform: rotateZ(180deg); - display: inline-block; -} + #org-chart-container .org-chart-item .expansion-icon{ position: absolute; @@ -192,7 +203,7 @@ body{ color: #C32929; transform: translateX(-50%); font-size: 30px; - transition: all 0.3s; + transition: all 0.6s; } #org-chart-container .org-chart-item .show-or-hidden{ @@ -201,7 +212,7 @@ body{ position: absolute; bottom: -15px; transform: translateX(-50%); - transition: all 0.3s; + transition: all 0.6s; opacity: 0; } #org-chart-container .org-chart-item:hover .show-or-hidden{ @@ -215,4 +226,92 @@ body{ #org-chart-container .org-chart-item .show-or-hidden:hover{ transform: translateX(-50%) scale(1.125); transform-origin: center; -} \ No newline at end of file +} + +#org-chart-container .hover-icon{ + /*display: none;*/ + display: inline-block; + opacity: 1; + cursor: pointer; + transform: translateX(-50%); + position: absolute; +} + +#org-chart-container .hover-icon.show-parent-icon{ + transform: translateX(-52%) rotateZ(180deg); + left: 50%; + top: -13px; + font-size: 25px; + z-index: 999; + color: #C32929; + transition: all 0.6s; + opacity: 0; +} + +#org-chart-container .hover-icon.show-parent-icon:hover{ + transform: translateX(-52%) rotateZ(180deg) scale(1.125); + transform-origin: center; +} + + +#org-chart-container .hover-icon.hidden-parent-icon:hover{ + transform: translateX(-52%) scale(1.125); + transform-origin: center; +} + +#org-chart-container .hover-icon.hidden-parent-icon{ + transform: translateX(-52%); + left: 50%; + top: -19px; + font-size: 25px; + z-index: 999; + color: #C32929; + transition: all 0.6s; + opacity: 0; +} +#org-chart-container .org-chart-item:hover .show-parent-icon{ + opacity: 1; + top: -18px; +} + +#org-chart-container .org-chart-item:hover .hidden-parent-icon{ + opacity: 1; + top: -15px; +} + +#org-chart-container .show-or-hidden-brother{ + display: inline-block; + top: 50%; + font-size: 30px; + position: absolute; + z-index: 99; + color: #C32929; + opacity: 0; + transition: all 0.6s; +} +#org-chart-container .show-or-hidden-brother.left{ + left: -14px; + transform: rotateZ(90deg) translateY(-50%); +} + +#org-chart-container .show-or-hidden-brother.right{ + right: -14px; + transform: rotateZ(-90deg) translateY(-50%); +} + +#org-chart-container .show-or-hidden-brother.left:hover{ + transform: rotateZ(90deg) translateY(-50%) scale(1.125); + transform-origin: center; +} +#org-chart-container .show-or-hidden-brother.right:hover{ + transform: rotateZ(-90deg) translateY(-50%) scale(1.125); + transform-origin: center; +} +#org-chart-container .org-chart-item:hover .show-or-hidden-brother.left{ + opacity: 1; + left: -16.5px; +} +#org-chart-container .org-chart-item:hover .show-or-hidden-brother.right{ + opacity: 1; + right: -16.5px; +} diff --git a/src/css/node.css b/src/css/node.css index eaa1192..841ce35 100644 --- a/src/css/node.css +++ b/src/css/node.css @@ -3,12 +3,20 @@ width: 160px; border: 1px #C32929 solid; border-radius: 10px; + box-shadow: 1px 1px 5px #f2f2f2; position: relative; margin: 50px 15px 0px 15px; font-size: 10px; padding: 10px 10px 20px 10px; height: 100%; - animation: 0.6s show; + animation: 1s show; + background-color: #FFF; +} + +.node-container.current{ +} +.hidden-org-children .line{ + display: none; } .org-chart-node-item{ @@ -16,9 +24,10 @@ margin: 0 0 -3px 0; } .node-container .content-container{ - animation: 0.5s show-content; + animation: 1s show-content; } + @keyframes show-content { from{ height: 0; @@ -35,11 +44,11 @@ } .hidden-org-children .node-container{ - animation: 0.6s hidden; + animation: 1.2s hidden; } .hidden-org-children .node-container .content-container{ - animation: 0.6s hidden-content; + animation: 1s hidden-content; } @keyframes hidden-content { @@ -51,6 +60,8 @@ width: 0; opacity: 0; height: 0; + padding: 0; + margin: 0; } } @keyframes hidden { @@ -58,6 +69,7 @@ width: 0; opacity: 0; height: 0; + padding: 0; } } @@ -84,7 +96,7 @@ top: -50px; transform: translateX(-50%); border: 1px #C32929 solid; - background-color: #f2f2f2; + background-color: #C32929 !important; } .node-container .logo{ position: absolute; @@ -147,4 +159,11 @@ transform-origin:center left; } +.hidden-node .node-container{ + width: 0 !important; + height: 0 !important; + padding: 0 !important; + margin: 0 !important; +} + diff --git a/src/iconfont/iconfont.css b/src/iconfont/iconfont.css index 7efdc7b..e50a4da 100644 --- a/src/iconfont/iconfont.css +++ b/src/iconfont/iconfont.css @@ -1,8 +1,8 @@ @font-face { font-family: "cus_iconfont"; /* Project id 3778032 */ - src: url('iconfont.woff2?t=1669465666296') format('woff2'), - url('iconfont.woff?t=1669465666296') format('woff'), - url('iconfont.ttf?t=1669465666296') format('truetype'); + src: url('iconfont.woff2?t=1669805325787') format('woff2'), + url('iconfont.woff?t=1669805325787') format('woff'), + url('iconfont.ttf?t=1669805325787') format('truetype'); } .cus_iconfont { @@ -13,6 +13,30 @@ -moz-osx-font-smoothing: grayscale; } +.icon-zhankai2:before { + content: "\e6c5"; +} + +.icon-zhankai1:before { + content: "\e66c"; +} + +.icon-zhankaishousuo:before { + content: "\e6cb"; +} + +.icon-caozuo-quanping-shousuo:before { + content: "\e73a"; +} + +.icon-moduanzhankai:before { + content: "\e6e4"; +} + +.icon-shousuo:before { + content: "\e85f"; +} + .icon-fangda1:before { content: "\e614"; } diff --git a/src/iconfont/iconfont.ttf b/src/iconfont/iconfont.ttf index 6d77cf56668c761e64fae52f514f10b37f1c9c62..7ca0dde2dcdc148071104797fd26e7ef0c5e238d 100644 GIT binary patch delta 1725 zcmZuwO-vg{6n<}az2jZ%HTzQ=+~5!sY(fbMwre-UKzpcq;m}JfdWet}2t)-;1V|96 zG8Ly*jnvAD66KU$Dpks%Qb4^#5lJDJ^pHzw!yyJKogh&vxoTBZwRYcl4W&}n`gY&E z_sz`re!SnZAN%}lq2tT1&H+eo5FU+9EL{5byU}3)PX~a0b9^*65?u&10l*d^Jx&f* zl8a>DBb*$coSh$pY83!~q4nTI{$j2P!ppRume4Voo1exupz~0i(K?lz9K|PtvjBlr zy6?txe#SpL^v`F10a!ysihOaeZNLU3E+KI9;q-7I`v){AFYpPz z#Mk*_zR91z=-nCKT@cw(+~C$rXoZt6{Q;O@fCfHN%fL^!N)RAL zGFVh91yoYiK)Tes4?M<~23S7`Rzzr94BJh9w=Pk9csJ) zr3bt7E=2iv7hH&xYtOsXjNdSeQ+QwMkR}Qemm~6!{EhrX{#7}q+)^r@LAT5D6{!r( zkfd6LnCcwIU}6A65$wl4OvPTqsDVN3Mgv>W37*G9KgP~rCY?Hiv1kCL8`(8gjWAPP z&nkW&^Jyzg_ehoKk%cF_R;Y8N@3ZTw$s(${mi0&;ovmoJ$6skavQQ2wBID|od|N(2 z4QPQ*I8P#@suLoO=~NtJ_x)oI+dre^K^|L%cprCenpkCaUy-&(iROx7pMx zTVCuno6YM!%ko`sYWth}Os@!8TBYPo9*N-FRuj=RvsuGdt+L_nAVQn$n9bfwNuxOJ zO#Bz9S9X!Q8iKR*7b=hjA>lw$D459fPzoNQJ|2s*9#Q#v8X3xJuV`47v1ePytW7Pf z={nvr>ekbPkhDrsdruIHPj#JWj}EQPdPocd4Pc?VFMlfQq$WWnq&ABt*URIU#tA0d zW7P3Sry5B#UA0bzr%<5itDK|AXlItlh7zKoX0nQ3+&Hw-a delta 569 zcmZ9Iy-Ooe6vfY*iHXKc62=rFDt;lZT37@zASl}Izo0Sr6~t)36vulQsD@Du=FYjQp@*R}Fz6Tm+*oTT8pHFvnLke*~Jla0c00Cmqiy1Y7@@ZSXX z*gwa-HI>MwRU6_wZ)V=Hl1R;~%dZ)rai8z~Os}q4nf2QL10Wb>!P#!5d(493mYiP< ze2IrfpV3HzT(>8uf8V3yI0cU~H<;JMa8)k1&nmX7r((a+nJ>NOz&^~^-5{f%MJ0HU zW~GfV6+^rdl8D4)O19*>nscY278LtK%eva9rPyyHg65BpL(z)~Fa0R^{Cund0X|k& z4x5(BAHLndzbjr1J0L*~dm$kWZ-Lkv-Un&YxRXjm_^tZXjM`I=hHVTP)5eWCZhkKx)n7FztN6`sQ7Asx+b^H(exLvV diff --git a/src/iconfont/iconfont.woff b/src/iconfont/iconfont.woff index 1db0f27dc093ceee86ef14cc50be36900a2b7828..cf9a1c5f1d7aa94bce81cf83cbd4ddbd604afb82 100644 GIT binary patch delta 2605 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 Pv+S%=FA};>q5uE@Lc+ew delta 1909 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 delta 1918 zcmV-^2Z8v&6NC>KcTYw#00961000Ms01E&B000j7000Lykr*9+ghC3A9E=75HUcCA zGz%O61Rw>47YBhu8v_kdRFGoGejeDii?yKWSv*aHqGJU{aUO*vMvng^cnYFgBYS3d z5AXq5qGA%}>lGvxP(~%?!!|zUfg~$(z=~k_HuYZ(sVh|?N;0EUq#{ldNJt5!JRjbF-rpTaiDU^hoOqy;NSO8ibnlbaAulyOyXZ2Sl2kLmH!xwHT%3EjL&JIo~qf7pzW6p=@T&mY2&U4TNIa>3S&N*P1bTMd0dOw-dHDbp z3>0Tjmsz>_0C@Q`wf{5=lH4X8%OFDaDV}N_AF1XwHI9=2{G;oNmMs5k;4E* zGW(a)*WPFOXC^@{)hM>#b6tjJ;cWQqwzIy6_|KY4(d0E34j_(X&x zSR9B4NW$}fuHkgGxc~%o9snP796$uR2|x(?7Lt*` zhvk3`=?V~6uIO-=^85#|g=KUWSlZ7S;BgDfcJx}f-0?8%MY68 z%Z;N*k!VvVi%jk<^YEax)m3wU;4dhr3urLZ( z?_jg0TzrvsJS!gsRiR4ER9WVBl_RLc1+dwFi$bW_JzD;V__HM}FM+py^oy`c4=eKm z!8p4zK!Rh(nP>nfR3@R!3KIIX&$O++izAu3I)>!BX7AYY%M}Y|E@oz%L4gv^JyOf_wIgmWC&!in@jFF#aA?4P zt~ktyCO`k+0WJ@y|3X?4@(B~cGzg$vW$*={Z z1w#eHzQ8b5dEv{Qe|kbT%Z!Bl;ryz9@==z}Vs(E$X3IWNbLZJ-@6-f?4}Ep zwa0B%6A09yI6LP!T{atdU-v9+y@2$i7nY4RTl%y6%Tm0h7E6^;P`{t^zWR6=?MK3o zzv8tBJW|T$oAD>WInH4|u}PY*7xXYT1tTs~EnQ6*=-?Q+$X_V(v0 zBrDKEx#fU$|JBpp(P1AmD3FfD)$8I1_*+NB-$oBV#pz4G3%GKs+AGbB`uv(A5m3iJN~s$(YT%f{=Z+Ri?F_ar3MoQ008rUOs`4&SK_Vh zHdT^2`9C$C?l^M>fhBq|@OS(#CD+H*zZZ4f_+d3qX3YPJrTpa7zPkA2tKs z%as2!sTgbUpH{M&Rzqq(HZyU#<;Lez*ASJm4rx#z(o5i9q^!t$+YuLwc^@aav|fzj zQy*hUXtTG@Lotq+@feSPgxQ#gZvB>HimfLJhz)@@hpZT(!ZR^S#zSoCoZrV5&cDYv z%94@g!8^4v5nEYsv6!|Tnz|@JF+liM5VBuWCDRK1Mr@K!>Jfv6BIv~l_{xB&$7D?< z+zwY&Yon-&`YH{?mIf&ZB|_4*2+=UOov0`p5!JP@=!cFFgi+dm>6GdWIQ&`!uyi5; z^b-aUd{(5C`Ds)VhPk5+F_ZNBdWeDy3V|+|78(YK^gfX%=SOgJa0%@ji7K9SPdmme z6+|(HjG#%P(?k#&mSZACH)#mbdR1W}Kgc1pL_-wKNsCER;@G}8@<0%7(<#*lrlMlR ziW5(K2_%$AVo4-jl?;DZP=f)%jjar6YS7D-k%Gcp${UpIv5+pS)7SNQDEkG4%CC?$ zX@12@O@-6Dp)o^SE(==f%8;N=3-V+{7SxP`-49z~;K0ZkHHP@Y%a@1sq!~k9X#fBK E02f`29{>OV