2020-11-08 23:45:09 -05:00
# Tree Organization
2019-03-10 12:19:03 -04:00
## Summary
The Tree Organization WebPart shows the Organization Chart of the or the team, the web part reads infomation from current user to build the Organization Chart.
2021-02-28 15:53:14 -05:00
You can configure in the webpart properties:
* show all Organization Chart
* the only user team, (same manager and peers).
* show Organization Chart by picking up user
2019-03-10 12:19:03 -04:00
2021-02-28 15:53:14 -05:00
![Organization Chart Web Part ](./assets/react-tree-orgchart.gif )
2019-03-10 12:19:03 -04:00
![Organization Chart Web Part ](./assets/Screenshot1.png )
![Organization Chart Web Part ](./assets/Screenshot2.png )
![Organization Chart Web Part ](./assets/Screenshot3.png )
2021-02-28 15:53:14 -05:00
2019-03-10 12:19:03 -04:00
## Used SharePoint Framework Version
2020-03-09 14:15:44 -04:00
![drop ](https://img.shields.io/badge/version-1.10.0-green.svg )
2019-03-10 12:19:03 -04:00
## Applies to
2020-06-09 03:09:22 -04:00
* [SharePoint Framework ](https://docs.microsoft.com/sharepoint/dev/spfx/sharepoint-framework-overview )
* [Office 365 tenant ](https://docs.microsoft.com/sharepoint/dev/spfx/set-up-your-development-environment )
2019-03-10 12:19:03 -04:00
## WebPart Properties
Property |Type|Required| comments
--------------------|----|--------|----------
2021-02-26 20:16:28 -05:00
title | Text| no| WebPart Title
teamLeader |Text|no|UPN of manager if viewType is 4
2021-02-28 15:53:14 -05:00
viewType|viewType(number)|yes|if currentUserTeam is set it's not required
2021-02-26 20:00:18 -05:00
maxLevels | Number| yes | Maximum number of levels to show
detailBehavoir |boolean|no|Delve or Live Persona Card
excludefilter|boolean|no|Filter contains/not contains
filter|string|no|Filter Value
2021-02-26 20:16:28 -05:00
currentUserTeam|boolean|no|only in Interface to handle previouse installations
2021-02-26 20:00:18 -05:00
2021-02-28 15:53:14 -05:00
### viewType Enum:
2021-02-26 20:16:28 -05:00
```
MyTeam = 1,
CompanyHierarchy = 2,
ShowOtherTeam = 4
```
2019-03-10 12:19:03 -04:00
## Solution
Solution|Author(s)
--------|---------
Tree Organization WebPart|João Mendes
2021-02-26 20:00:18 -05:00
Tree Organization WebPart|Peter Paul Kirschner ([@petkir_at](https://twitter.com/petkir_at))
2019-03-10 12:19:03 -04:00
## Version history
Version|Date|Comments
-------|----|--------
2021-02-28 15:53:14 -05:00
1.1.0|Feb 28, 2021|Added < ul > < li > Show Other Team< / li > < li > Live Contact Card< / li > < li > Filter user by userPrincipalName< / li > < li > Graph API< / li > < li > PNPJS updates< / li > < / ul >
2021-02-26 20:00:18 -05:00
1.0.2|June 12, 2020|Added exception handler for profiles missing display name
2020-03-09 14:15:44 -04:00
1.0.1|Jan 28, 2020|Update to SPFx 1.10, minor fixes and refactoring.
2021-02-26 20:00:18 -05:00
1.0.0|Feb 25, 2019|Initial release
2019-03-10 12:19:03 -04:00
## Disclaimer
**THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**
---
## Minimal Path to Awesome
- Clone this repository
- in the command line run:
- `npm install`
- `gulp build`
- `gulp bundle --ship`
- `gulp package-solution --ship`
2020-03-09 14:15:44 -04:00
< img src = "https://telemetry.sharepointpnp.com/sp-dev-fx-webparts/samples/react-tree-orgchart" / >