feat:处理悬浮展示提示

91a3f720 · zhangleyuan · fa4275cc · 91a3f720 · 91a3f720 · 91a3f720
Commit 91a3f720 authored Aug 05, 2021 by zhangleyuan
9 changed files
--- a/src/modules/college-manage/EmployeeManage.less
+++ b/src/modules/college-manage/EmployeeManage.less
@@ -17,4 +17,10 @@
        font-size:14px;
        color:#5289FA;
    }
+    .post-name{
+        max-width: 200px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+    }
 }
\ No newline at end of file
--- a/src/modules/college-manage/EmployeeManage.tsx
+++ b/src/modules/college-manage/EmployeeManage.tsx
@@ -9,7 +9,7 @@ import React, { useEffect, useState } from "react";
 import { withRouter } from "react-router-dom";
 import _ from "underscore";
 import { CheckBox, PageControl } from "@/components";
-import { Button, Table, Modal, message, Input } from "antd";
+import { Button, Table, Modal, message, Input,Tooltip} from "antd";
 import { XMTable } from '@/components';
 import college from '@/common/lottie/college.json';
 import StoreService from "@/domains/store-domain/storeService";
@@ -178,10 +178,17 @@ function EmployeeManage() {
          if(!record.depNameList){
            return <span>-</span>
          }
-          return record.depNameList.map((item,index)=>{
+          if(record.depNameList.length === 0){
-            return <span><WWOpenDataCom type="departmentName" openid={item}/>{index<(record.depNameList.length -1)?'、':''}</span>;
+            return <span>-</span>
-          })
+          }
+          // return record.depNameList.map((item,index)=>{
+          //   return <span><WWOpenDataCom type="departmentName" openid={item}/>{index<(record.depNameList.length -1)?';':''}</span>;
+          // })
+          return <Tooltip title={<div>{handleDepName(record.depNameList)}</div>} placement='top' arrowPointAtCenter><div className="post-name"> {record.depNameList.map((item, index) => {
+            return <span><WWOpenDataCom type="departmentName" openid={item}/>{index<(record.depNameList.length -1)?';':''}</span>
+            })}
+          </div>
+          </Tooltip>
        },
      },
      {
@@ -233,6 +240,13 @@ function EmployeeManage() {
    return columns;
  }
+  function handleDepName(depArray:any):any{
+    const depArrayDom = depArray.map((item:any, index:any) => {
+    return <WWOpenDataCom type="departmentName" openid={item}/>
+    });
+    return depArrayDom;
+  };
  function handleEditEmployee(record: RecordTypes) {
    const { nickName, phone, roleCodes, avatar, id, weChatAccount } = record;
    const _choosesItem = {

--- a/src/modules/college-manage/components/DepartMentTabCon.jsx
+++ b/src/modules/college-manage/components/DepartMentTabCon.jsx
 import React, { useEffect, useState } from "react";
 import { withRouter } from "react-router-dom";
-import { Button, Input, message,Modal} from "antd";
+import { Button, Input, message,Modal,Tooltip} from "antd";
 import NewChooseMembersModal from "@/modules/college-manage/modal/NewChooseMembersModal";
 import LeftStructureTree from "./LeftStructureTree";
 import { XMTable, PageControl } from "@/components";
@@ -73,17 +73,17 @@ function DepartMentTabCon(props) {
      title: "岗位",
      dataIndex: "depNameList",
      render: (val, record) => {
        if(!record.depNameList){
          return <span>-</span>
        }else{
          if(record.depNameList.length === 0){
            return <span>-</span>
          }
-          return <div className="post-name"> {record.depNameList.map((item, index) => {
+          return <Tooltip title={handleDepName(record.depNameList)} placement='top' arrowPointAtCenter><div className="post-name"> {record.depNameList.map((item, index) => {
-            return <span>{item}{index!==record.depNameList.length-1 && <span>、</span>}</span>;
+            return <span>{item}{index!==record.depNameList.length-1 && <span>;</span>}</span>;
            })}
          </div>
+          </Tooltip>
        }
      }
@@ -92,7 +92,11 @@ function DepartMentTabCon(props) {
      title: "手机号",
      dataIndex: "phone",
      render: (val, item) => {
-        return <span>{val}</span>;
+        if(!val){
+            return <span>-</span>
+        }else{
+          return <span>{item.phone}</span>
+        }
      },
    },
    {
@@ -119,6 +123,17 @@ function DepartMentTabCon(props) {
      },
    },
  ];
+  function handleDepName(depArray){
+    let depStr = '';
+    depArray.forEach((item, index) => {
+      if (index < depArray.length - 1) {
+        depStr = depStr + item + '、';
+      } else {
+        depStr = depStr + item;
+      }
+    });
+    return depStr;
+  };
  function closeChooseMembersModal() {
    setChooseMembersModalVisible(false);
  }
@@ -205,7 +220,7 @@ function DepartMentTabCon(props) {
    StoreService.delDepartmentUser(params).then((res) => {
      message.success(`删除成功`);
      getUserList();
-      Bus.trigger("changeTreeData");
+      Bus.trigger("changeTreeData",{treeType:props.currentTab});
    });
  }
  function handleSelectUserList(record, selected){

--- a/src/modules/college-manage/components/LeftStructureTree.jsx
+++ b/src/modules/college-manage/components/LeftStructureTree.jsx
@@ -185,7 +185,7 @@ function LeftStructureTree(props) {
    Bus.bind("addCustomer",(record)=>{addCustomer(record.treeType,record.query)})
  },[]);
  useEffect(()=>{
-    Bus.bind("changeTreeData",(record)=>{getTreeData()})
+    Bus.bind("changeTreeData",(record)=>{getTreeData(record.treeType)})
  },[]);
  async function addCustomer(treeType,query){
    await getTreeData(treeType);
@@ -214,6 +214,7 @@ function LeftStructureTree(props) {
  }
  function handleData(dataArray){
    const _dataArray = dataArray.map((item,index)=>{
+      item.title = item.name;
      item.key=item.id;
      if(item.sonDepartmentVOList){
        item.children = item.sonDepartmentVOList;
@@ -260,10 +261,21 @@ function LeftStructureTree(props) {
  //添加岗位组/岗位
  function addPostGroup(level,record) {
-    if (treeData.length === 10) {
+    if(level===0){
+      if (treeData.length > 9) {
        message.error("岗位组数量已达10个上限");
        return;
      }
+    }
+    if(level===1){
+      if(record.sonDepartmentVOList){
+        if(record.sonDepartmentVOList.length > 19){
+          message.error("岗位数量已达20个上限");
+          return;
+        }
+      }
+    }
    setCurrentGroupData({});
    setAddOrEditPostGroupShow(true);
    setOperatePostGroupModalType("add");
@@ -336,10 +348,20 @@ function LeftStructureTree(props) {
  //添加自定义分组集合/分组
  function addCustomGroup(level,record) {
-    if (treeData.length === 10) {
+    if(level===0){
-      message.error("岗位组数量已达10个上限");
+      if (treeData.length > 9) {
+        message.error("自定义分组集合数量已达10个上限");
        return;
      }
+    }
+    if(level===1){
+      if(record.sonDepartmentVOList){
+        if(record.sonDepartmentVOList.lenght > 19){
+          message.error("自定义分组数量已达20个上限");
+          return;
+        }
+      }
+    }
    setCurrentGroupData({});
    setAddOrEditPostGroupShow(true);
    setOperatePostGroupModalType("add");

--- a/src/modules/college-manage/components/LeftStructureTree.less
+++ b/src/modules/college-manage/components/LeftStructureTree.less
 .left-structure-tree {
    margin-right: 24px;
-    width:250px;
+    width:260px;
    height: calc(~'100vh - 260px');
+    overflow-y: scroll;
    .organization{
      overflow: scroll;
      .search-con{

--- a/src/modules/college-manage/components/MemberTree.jsx
+++ b/src/modules/college-manage/components/MemberTree.jsx
@@ -38,6 +38,7 @@ function MemberTree(props) {
  }
  function handleData(dataArray){
    const _dataArray = dataArray.map((item,index)=>{
+      item.title = item.name || item.userName;
      item.key=item.id;
      item.children = []
      if(item.departmentUserVOList){

--- a/src/modules/college-manage/modal/AddOrEditPostGroupModal.jsx
+++ b/src/modules/college-manage/modal/AddOrEditPostGroupModal.jsx
@@ -2,7 +2,7 @@
 * @Author: wufan
 * @Date: 2020-11-27 16:21:49
 * @LastEditors: Please set LastEditors
- * @LastEditTime: 2021-08-03 17:23:40
+ * @LastEditTime: 2021-08-05 18:24:06
 * @Description: Description
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -48,6 +48,7 @@ function AddOrEditPostGroupModal(props) {
      return;
    }
    const { postGroupModalLevel,currentTab,currentGroupData,label} = props
    let parmas={
      depLevel:postGroupModalLevel,
      depType:DepType[currentTab],

--- a/src/modules/college-manage/modal/ChooseMembersModal.jsx
+++ b/src/modules/college-manage/modal/ChooseMembersModal.jsx
@@ -16,7 +16,6 @@ import './ChooseMembersModal.less';
 import _ from 'underscore';
 const { Search } = Input;
 class ChooseMembersModal extends React.Component {
  constructor(props) {
    super(props);
@@ -162,6 +161,7 @@ class ChooseMembersModal extends React.Component {
        })   
      }
    })
  }
  addCustomer = () => {

--- a/src/modules/college-manage/modal/SetEmployeeModal.jsx
+++ b/src/modules/college-manage/modal/SetEmployeeModal.jsx
@@ -22,6 +22,7 @@ export default class SetEmployeeModal extends React.Component {
      list,
      selected: selectedData.userId,
      roleCode: selectedData.roleCode,
+      submit:false
    }
  }
@@ -41,6 +42,7 @@ export default class SetEmployeeModal extends React.Component {
      list,
      roleCode,
      selected,
+      submit
    } = this.state;
    return (
      <Modal
@@ -55,7 +57,7 @@ export default class SetEmployeeModal extends React.Component {
          <div className="modal-footer">
            <Button style={{ float: 'left' }} onClick={() => this.props.onClose()}>上一步</Button>
            <Button onClick={() => this.props.onCancel()}>取消</Button>
-            <Button onClick={() => this.props.onOk(list)} type="primary">确定</Button>
+            <Button onClick={() =>{this.setState({submit:true},()=>this.props.onOk(list))}} type="primary" disabled={submit}>确定</Button>
          </div>
        }
      >