-
Notifications
You must be signed in to change notification settings - Fork 173
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Organization Chart #2726
Organization Chart #2726
Conversation
Signed-off-by: Vassilis Kritharakis <bkrith@hotmail.com>
Signed-off-by: Vassilis Kritharakis <bkrith@hotmail.com>
This comment was marked as outdated.
This comment was marked as outdated.
This PR is the result of an idea proposal at NextGov 2022 Hackathon Abstract: there might be some UX improvements needed. This challenge comes down to defining the datasets and building the first prototype within nextcloud. As a result every team can be organised. Presentation: https://docs.google.com/presentation/d/1r_J-nop5r-cgDtSQpHPNbwJ5igaCmftc/ |
This comment was marked as outdated.
This comment was marked as outdated.
pls help me to build org chart |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
not working for me
I'm sorry for the delay.. I was busy with my dayjob.. @DineshRefex maybe it was a confusion with HEAD value which needed for the top member(root) of chart. Please try again I have removed this value(exists but it's not necessary anymore) and also added support for multiple charts. |
Thank you so much, I'll work on it and send you the result. Once again
thank you for spending your time with me.
…On Mon, Aug 15, 2022 at 9:26 PM Vassilis ***@***.***> wrote:
Dropdown at the right top with all available charts generated from
contacts.
For now the name of chart is the org field of root contact and the
fullName.
[image: image]
<https://user-images.githubusercontent.com/5513284/184670110-d2e47712-ca83-4261-bbc8-c6b866795c94.png>
—
Reply to this email directly, view it on GitHub
<#2726 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/AZH7Y7VOYGYNNI2BQC2VKQDVZJSERANCNFSM5U2SKATQ>
.
You are receiving this because you were mentioned.Message ID:
***@***.***>
--
*The information contained in this communication is intended solely for the
use of the individual or entity to whom it is addressed and others
authorized to receive it. **Please note that as the recipient, it is your
responsibility to check the email for malicious content or software. **It
may contain confidential or legally privileged information. If you are not
the intended recipient you are hereby notified that any disclosure,
copying, distribution or taking any action in reliance on the contents of
this information is strictly prohibited and may be unlawful. If you have
received this communication in error, please notify us immediately by
responding to this email.The firm is neither liable for the proper and
complete transmission of the information contained in this communication
nor for any delay in its receipt.*
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
src/models/contact.js
Outdated
* @memberof Contact | ||
*/ | ||
get orgManager() { | ||
return this.firstIfArray(this.vCard.getFirstPropertyValue('orgmanager')) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
is this possibly a standardized property? I'm not able to find references of ORGMANAGER in the vcard specs. If it's not, should be prefix with X-
@skjnldsv?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yep, if not official, prefix is mandatory
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If you use X-ManagersName, it will be compatible with korganizer/kalendar, better than nothing 😜
A similar concept exist in google eith manager and assistant name but they don't even use vcards
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I just pushed commit with all the requested changes/bugs/etc.
Currently I'm using X-ManagersName.. Relationship field is like first person property and I'm not sure(never used) if is anything else except an info.. except if extend/change it..
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Relationship to you is not helpful because it only stores the type of relation and is always relative to the addressbook owner. E.g. in your addressbook there might be a contact for me and it says Colleague. Nothing more, nothing less.
X-ManagersName
seems a lot more appropriate. The only issue we just found out is that KOrganizer stores the name of the other person for this field, not the UID. So it is not a reference to another contact. It is just a value. And this value is prone for conflicts in larger organizations where names are not unique.
I'll see if we can put together some kind of hybrid solution where we store the UID for our purposes but also X-ManagersName for interoperability.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We will go with something like X-MANAGERSNAME;UID=abc-def-123:John
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as resolved.
src/models/contact.js
Outdated
* @memberof Contact | ||
*/ | ||
get orgManager() { | ||
return this.firstIfArray(this.vCard.getFirstPropertyValue('orgmanager')) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If you use X-ManagersName, it will be compatible with korganizer/kalendar, better than nothing 😜
A similar concept exist in google eith manager and assistant name but they don't even use vcards
This comment was marked as resolved.
This comment was marked as resolved.
I tried again with the outdated branch. Same problem. However, once I created a third contact I was able to define managers. Bug?! |
@bkrith I have checked my previously commented bugs against the current state. Great job. Those are all resolved. I will also add any bugs to the todo list as I encounter them. Edit: design feedback checked against the list. |
I'd say let's get the remaining bugs fixed, then we can merge a first version of this feature. Anything else can be done as follow-ups. |
name: 'chart', | ||
params: { selectedChart: GROUP_ALL_CONTACTS }, | ||
}" | ||
icon="icon-category-monitoring" /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
icon classes are deprecated. this should use a material icon
@@ -281,6 +292,11 @@ export default { | |||
return this.sortedContacts.filter(contact => this.contacts[contact.key].groups && this.contacts[contact.key].groups.length === 0) | |||
}, | |||
|
|||
// check if any contact has manager, if not then is no need for organization chart menu | |||
existChart() { | |||
return !!Object.keys(this.contacts).filter(key => this.contacts[key].managersName).length |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some as a lightweight alternative to .filter(...).length
@@ -41,7 +41,7 @@ const isEmpty = value => { | |||
export const ContactKindProperties = ['KIND', 'X-ADDRESSBOOKSERVER-KIND'] | |||
|
|||
export const MinimalContactProperties = [ | |||
'EMAIL', 'UID', 'CATEGORIES', 'FN', 'ORG', 'N', 'X-PHONETIC-FIRST-NAME', 'X-PHONETIC-LAST-NAME', | |||
'EMAIL', 'UID', 'CATEGORIES', 'FN', 'ORG', 'N', 'X-PHONETIC-FIRST-NAME', 'X-PHONETIC-LAST-NAME', 'X-MANAGERSNAME', 'TITLE', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
what are the consequences of this change? I'm not able to figure that out from the code
@bkrith if you allow us to push commits to your branch we can fix some of the reported problems right away |
I'll open a second PR with our branch |
Thank you! I'm too busy right now.. I'm moving on new apartment and I have overloaded in my day job. |
name: 'contact', | ||
params: { | ||
selectedGroup: this.$route.params.selectedChart, | ||
selectedContact: `${uid}~contacts`, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I was wondering why my chart->contact links don't work anymore. turns out my addressbook just has a different name 🙈
#2954 is ready for review and test |
Hi there ***@***.***, I have tried my level best but once I have
done. It asking me to upgrade, after that no improvement it remains the
same.*
*I'm using 24 version of nextcloud server. Will that be ok, or else I have
to swap the version. Help me in stucked with orgchat. *
…On Thu, 18 Aug, 2022, 6:09 pm Christoph Wurst, ***@***.***> wrote:
***@***.**** commented on this pull request.
It works
[image: Bildschirmfoto vom 2022-08-18 14-39-11]
<https://user-images.githubusercontent.com/1374172/185396767-07ae80f4-250c-42c5-9ca5-893476708105.png>
------------------------------
In l10n/el.js
<#2726 (comment)>:
> @@ -240,6 +240,8 @@ OC.L10N.register(
"Pager" : "Βομβητής",
"Voice" : "Ομιλία",
"Car" : "Αμάξι",
+ "Organization Chart": "Οργανόγραμμα",
translations are handled via Transifex, not directly in our code. You can
revert these changes.
------------------------------
In src/components/OrgChart.vue
<#2726 (comment)>:
> + this.chartReference = new OrgChart()
+ }
+ this.chartReference
+ .container(this.$refs.svgElementContainer) // node or css selector
+ .data(data)
+ .nodeWidth((d) => 250)
+ .initialZoom(0.8)
+ .nodeHeight((d) => 175)
+ .childrenMargin((d) => 40)
+ .compactMarginBetween((d) => 15)
+ .compactMarginPair((d) => 80)
+ .nodeContent(function(d, i, arr, state) {
+ const imgEl = `<img src="${d.data.image || 'data:image/jpeg;base64,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'}" alt="${d.data.fullName}" style="margin-top:-30px;margin-left:${d.width / 2 - 30}px;border-radius:100px;border:1px solid lightgray;width:60px;height:60px;background-color: white" />`
+
+ return `
+ <div style="padding-top:30px;background-color:none;margin-left:1px;height:${d.height}px;border-radius:2px;overflow:visible">
is there any chance for d3 to work with Vue components instead of string
concatenation so that we can safely prevent user content injection into the
DOM?
------------------------------
In src/components/OrgChart.vue
<#2726 (comment)>:
> + .nodeContent(function(d, i, arr, state) {
+ const imgEl = `<img src="${d.data.image || 'data:image/jpeg;base64,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'}" alt="${d.data.fullName}" style="margin-top:-30px;margin-left:${d.width / 2 - 30}px;border-radius:100px;border:1px solid lightgray;width:60px;height:60px;background-color: white" />`
+
+ return `
+ <div style="padding-top:30px;background-color:none;margin-left:1px;height:${d.height}px;border-radius:2px;overflow:visible">
+ <div class="inner-box" style="height:${d.height - 32}px;padding-top:0px;background-color:white;border:1px solid lightgray;border-radius:5px">
+ <a href="${d.data.link}">
+ ${imgEl}
+ </a>
+ <div style="margin-top:-27px;background-color:#3AB6E3;height:10px;width:${d.width - 2}px;border-radius:1px" />
+ <div style="padding:20px; padding-top:35px;text-align:center">
+ <div style="color:#111672;font-size:16px;font-weight:bold"> ${d.data.fullName}</div>
+ <div style="color:#404040;font-size:16px;margin-top:4px"> ${d.data.title}</div>
+ </div>
+ <div style="display:flex;justify-content:space-between;padding-left:15px;padding-right:15px;">
+ <div> Manages: ${d.data._directSubordinates} 👤</div>
l10n
------------------------------
In src/models/contact.js
<#2726 (comment)>:
> @@ -364,6 +364,31 @@ export default class Contact {
this.vCard.updatePropertyWithValue('org', org)
}
+ /**
+ * Return the first orgManager
+ *
+ * @readonly
+ * @memberof Contact
+ */
+ get orgManager() {
+ return this.firstIfArray(this.vCard.getFirstPropertyValue('orgmanager'))
is this possibly a standardized property? I'm not able to find references
of ORGMANAGER in the vcard specs. If it's not, should be prefix with X-
@skjnldsv <https://github.com/skjnldsv>?
—
Reply to this email directly, view it on GitHub
<#2726 (review)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/AZH7Y7W55DEMZAZU5G4O5ZLVZYVIXANCNFSM5U2SKATQ>
.
You are receiving this because you were mentioned.Message ID:
***@***.***>
--
*The information contained in this communication is intended solely for the
use of the individual or entity to whom it is addressed and others
authorized to receive it. **Please note that as the recipient, it is your
responsibility to check the email for malicious content or software. **It
may contain confidential or legally privileged information. If you are not
the intended recipient you are hereby notified that any disclosure,
copying, distribution or taking any action in reliance on the contents of
this information is strictly prohibited and may be unlawful. If you have
received this communication in error, please notify us immediately by
responding to this email.The firm is neither liable for the proper and
complete transmission of the information contained in this communication
nor for any delay in its receipt.*
|
Fixes #2730
Overview
Basic organization chart for contacts.
Used d3 and d3-org-chart libraries.
Requirements
Have contacts with Org Manager field.
And, the root contact with Org Manager set to "Head".
Add field orgmanager in contact
Organization chart
Highlight path to root
Todo
h3
, the title and the info lines belowp
var(--color-primary)
– would be better to do that. Also the whitespace above that bar can be removed.border: 1px solid var(--color-border)
using the variablevar(--border-radius-large)
on the containershttps://localhost/apps/contacts/chart/All%20contacts
but click on avatar gets me tohttps://localhost/apps/contacts/All%20contacts/4cee56a8-c43c-4e4a-bcba-55026faf1687~contacts
. This means a ctrl+click (or right click and open in new tab) leads to a different page than an ordinary click