京福项目组织架构图需求

1.人员按照上下级展示，并控制人员默认平铺。
2.人员数量根据自定义字段过滤机器人类型。
3.部门自定义表部门说明书关联关系，支持点击部门跳转部门说明书页面，人员卡片样式调整。
4.一级分部文字支持换行显示

src/components/drawer/index.jsx

@@ -20,6 +20,7 @@ import './index.less';
 let addNodeChildFunc = null;
 let orgChart = null;
 let active = 'top';
+let compact = 0;
 export default class DrawerComponents extends React.Component {
   constructor(props) {
     super(props);
@@ -39,6 +40,15 @@ export default class DrawerComponents extends React.Component {
 
   // 点击节点
   onNodeClick(node) {}
+  // onNodeClick = (node) => {
+  //   if (node.ftype == '2' || node.ftype == '4') {
+  //       orgChart &&
+  //       orgChart
+  //         .compact(false)
+  //         .render()
+  //         .fit();
+  //   }
+  // };
 
   onButtonClick(event, d) {
     if (d.children) {
@@ -51,6 +61,9 @@ export default class DrawerComponents extends React.Component {
       if (idsList.length == 0) {
         return;
       }
+      orgChart && orgChart.compact(false).render().fit();
+    } else {
+      orgChart && orgChart.compact(false).render().fit();
     }
   }
 
@@ -239,7 +252,11 @@ export default class DrawerComponents extends React.Component {
                         <img src="./img/department.png" style="width: 58px; height: 58px;position:absolute;left:29px; border-radius: 50%; margin-top: 16px;position:absolute;left:29px;z-index:999"/>
                     </div>
                     <div style="display: inline-block; margin-left: 6px;width: 55%">
-                        <div class="dept-box" style="font-size: 15px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 900;color: #333333;height: 25px;line-height: 25px;width:110px,white-space:nowrap;overflow:hidden;text-overflow:ellipsis;">
+                        <div class="dept-box" onclick="if(${
+                          d.data.smsFj
+                        } == 0) return alert('该部门未维护部门说明书') ;window.open('/spa/document/index2file.jsp?imagefileId='+${
+        d.data.smsFj
+      })"  style="font-size: 15px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 900;color: #333333;height: 25px;line-height: 25px;width:110px,white-space:nowrap;overflow:hidden;text-overflow:ellipsis;">
                             ${d.data.fname}
                         </div>
                         <div style="font-size: 13px;font-family: Microsoft YaHei-Bold, Microsoft YaHei;color: #333333;height: 25px;line-height: 25px;">
@@ -284,6 +301,13 @@ export default class DrawerComponents extends React.Component {
                     }" style="width: 58px; height: 58px; border-radius: 50%; margin-top: 16px;margin-left: -6px;z-index:999" />
                 </div>
                 <div style="display: inline-block; margin-left: 6px;width: 55%;height:100%">
+                   <div style="font-size: 13px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 400;color: #333333;height: 25px;line-height: 25px;">
+                         <div onclick="if(${
+                           d.data.jobFj
+                         } == 0) return alert('该岗位未维护岗位说明书') ;window.open('/spa/document/index2file.jsp?id='+${
+        d.data.jobFj
+      })" >岗位: ${d.data.jobTitle}</div>
+                        <span>司龄: ${d.data.companyWorkYear} 年</span>
                          <div style='display:flex;align-items:center;height: 25px;line-height: 25px;margin-top:15px'>
                         <div onclick="window.open('/spa/hrm/index_mobx.html#/main/hrm/card/cardInfo/'+${
                           d.data.id
@@ -291,13 +315,6 @@ export default class DrawerComponents extends React.Component {
         d.data.fname
       }</div>
                     </div>
-                   <div style="font-size: 13px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 400;color: #333333;height: 25px;line-height: 25px;">
-                        <span>司龄: ${d.data.companyWorkYear} 年</span>
-                        <div onclick="if(${
-                          d.data.jobFj
-                        } == 0) return alert('该岗位未维护岗位说明书') ;window.open('/spa/document/index2file.jsp?id='+${
-        d.data.jobFj
-      })" >岗位: ${d.data.jobTitle}</div>
                     </div>
                 </div>
                 </div>

src/pages/company.jsx

@@ -175,7 +175,7 @@ export default function companyPage() {
             font-family: Microsoft YaHei-Regular, Microsoft YaHei;color: #333333;text-align: center;">
             <div title=${
               d.data.fname
-            } style="width: 110px;margin: 0 auto;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;-o-text-overflow:ellipsis;
+            } style="width: 110px;margin: 0 auto;overflow: hidden;text-overflow: ellipsis;-o-text-overflow:ellipsis;
             line-height: 18px;word-break: break-all;">${d.data.fname}</div>
             <div style="display: ${statisticsStyle}">
                 <span style="color:red">${d.data.staffNum}</span> /