pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] hr_org_chart: BS4, restore most of the hr_org_chart feature

Browse Source 
With BS4, the popover and the chart design were broken. This is now
restored but could still use a bit of redesigning.
This commit is contained in:
qsm-odoo
2018-08-02 09:55:20 +02:00
parent f63a36e184
commit c120eb3a29
2 changed files with 31 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/hr_org_chart/static/src/scss/hr_org_chart.scss
+13 -8
View File
@@ -130,10 +130,14 @@
overflow: visible;
margin-top: 0;
&, .media-left, .media-body {
&, .o_media_left, .media-body {
position: relative;
}
.o_media_left {
padding-right: 10px;
}
.media-body {
vertical-align: middle;
@@ -161,7 +165,8 @@
}
}
.media-object {
.o_media_object {
display: block;
width: $o-hr-org-chart-entry-pic-size*0.8;
height: $o-hr-org-chart-entry-pic-size*0.8;
margin: $o-hr-org-chart-entry-pic-size*0.1;
@@ -189,7 +194,7 @@
}
&.o_org_chart_entry_manager, &.o_org_chart_entry_sub {
.media-left {
.o_media_left {
padding-right: 0;
}
.media-body > a {
@@ -197,18 +202,18 @@
max-width: calc(100% - 40px);
display: block;
.media-heading {
.o_media_heading {
color: lighten(gray('600'), 5%);
font-size: 13px;
}
}
&:hover {
.media-object {
.o_media_object {
box-shadow: 0 0 0 $o-hr-org-chart-entry-line-w*2 rgba($o-brand-primary, 0.6);
}
.media-body > a {
.media-heading {
.o_media_heading {
color: $o-brand-primary;
}
strong {
@@ -227,7 +232,7 @@
color: $text-muted;
}
.media-object {
.o_media_object {
width: $o-hr-org-chart-entry-pic-size;
height: $o-hr-org-chart-entry-pic-size;
margin: 0;
@@ -246,7 +251,7 @@
.o_org_chart_popup.popover {
max-width: 400px;
.popover-title {
.popover-header {
height: 47px;
line-height: 33px;
padding-right: 50px;
addons/hr_org_chart/static/src/xml/hr_org_chart.xml
+18 -14
View File
@@ -5,17 +5,17 @@
<div t-attf-class="o_org_chart_entry o_org_chart_entry_#{employee_type} media">
<t t-set="is_self" t-value="employee_type == 'self'"/>
<div>
<div class="o_media_left">
<!-- NOTE: Since by the default on not squared images odoo add white borders,
use bg-images to get a clean and centred images -->
<a t-if="! is_self"
class="rounded-circle o_employee_redirect"
class="o_media_object rounded-circle o_employee_redirect"
t-att-style="'background-image:url(\'/web/image/hr.employee/' + employee.id + '/image/\')'"
t-att-alt="employee.name"
t-att-data-employee-id="employee.id"
t-att-href="employee.link"/>
<div t-if="is_self"
class="rounded-circle"
class="o_media_object rounded-circle"
t-att-style="'background-image:url(\'/web/image/hr.employee/' + employee.id + '/image/\')'"/>
</div>
@@ -35,12 +35,12 @@
<t t-if="!is_self">
<a t-att-href="employee.link" class="o_employee_redirect" t-att-data-employee-id="employee.id">
<h5><b><t t-esc="employee.name"/></b></h5>
<h5 class="o_media_heading"><b><t t-esc="employee.name"/></b></h5>
<strong><t t-esc="employee.job_name"/></strong>
</a>
</t>
<t t-if="is_self">
<h5><b><t t-esc="employee.name"/></b></h5>
<h5 class="o_media_heading"><b><t t-esc="employee.name"/></b></h5>
<strong><t t-esc="employee.job_name"/></strong>
</t>
</div>
@@ -59,11 +59,13 @@
<div t-if='managers.length &gt; 0' class="o_org_chart_group_up">
<t t-if='managers_more'>
<div class="o_org_chart_entry o_org_chart_more media">
<a class="text-center o_employee_redirect"
t-att-href="managers[0].link"
t-att-data-employee-id="managers[0].id">
<i t-attf-class="fa fa-angle-double-up" role="img" aria-label="More managers" title="More managers"/>
</a>
<div class="o_media_left">
<a class="text-center o_employee_redirect"
t-att-href="managers[0].link"
t-att-data-employee-id="managers[0].id">
<i t-attf-class="fa fa-angle-double-up" role="img" aria-label="More managers" title="More managers"/>
</a>
</div>
</div>
</t>
@@ -100,16 +102,18 @@
<t t-if="(children.length + managers.length) &gt; 7">
<div class="o_org_chart_entry o_org_chart_more media">
<a href="#"
t-att-data-employee-id="self.id"
class="o_org_chart_show_more text-center o_employee_sub_redirect">&#8230;</a>
<div class="o_media_left">
<a href="#"
t-att-data-employee-id="self.id"
class="o_org_chart_show_more text-center o_employee_sub_redirect">&#8230;</a>
</div>
</div>
</t>
</div>
</t>
<t t-name="hr_orgchart_emp_popover">
<div class="popover o_org_chart_popup" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>
<div class="popover o_org_chart_popup" role="tooltip"><div class="arrow"></div><h3 class="popover-header"></h3><div class="popover-body"></div></div>
</t>
<t t-name="hr_orgchart_emp_popover_content">