update: Cleanup circle information
This commit is contained in:
parent
8e7547d06b
commit
d4279b0c7a
@ -3,7 +3,7 @@ div.content-box__info
|
||||
include templates/hd-user-avatar.pug
|
||||
|
||||
sib-widget(name='hd-user-groups')
|
||||
template ${await value.name}
|
||||
template ${value.name}
|
||||
|
||||
sib-widget(name='team-template-edit')
|
||||
template
|
||||
@ -19,17 +19,17 @@ div.content-box__info
|
||||
|
||||
sib-ac-checker(
|
||||
permission="acl:Delete"
|
||||
data-src="${await value['@id']}"
|
||||
data-src="${value['@id']}"
|
||||
)
|
||||
sib-delete(
|
||||
data-src="${await value['@id']}"
|
||||
data-src="${value['@id']}"
|
||||
data-label='Leave the circle'
|
||||
)
|
||||
|
||||
//- Only to show the table grid
|
||||
sib-ac-checker(
|
||||
no-permission="acl:Delete"
|
||||
data-src="${await value['@id']}"
|
||||
data-src="${value['@id']}"
|
||||
)
|
||||
|
||||
sib-link(class="backlink", bind-resources, next='circle-profile') Back
|
||||
|
@ -7,49 +7,96 @@
|
||||
include templates/hd-circle-team.pug
|
||||
|
||||
div.content-box__header.with-edit
|
||||
sib-display(
|
||||
bind-resources
|
||||
fields='name'
|
||||
sib-ac-checker(permission='acl:Read', bind-resources)
|
||||
sib-display(
|
||||
bind-resources
|
||||
fields='name'
|
||||
|
||||
class-name='name'
|
||||
)
|
||||
|
||||
sib-link(class="editlink", next="circle-edit" bind-resources)
|
||||
class-name='name'
|
||||
)
|
||||
|
||||
div.content-box__info
|
||||
|
||||
sib-display.block(
|
||||
bind-resources
|
||||
fields='label-description, description, entitled(title, creationDate)'
|
||||
sib-ac-checker(permission='acl:Read', bind-resources)
|
||||
sib-ac-checker(permission='acl:Write', bind-resources)
|
||||
sib-link(class="right-btn", next="circle-edit", bind-resources) Edit and add Members
|
||||
|
||||
value-label-description='Description: '
|
||||
sib-display.block(
|
||||
bind-resources
|
||||
fields='creationDateSet(title, creationDate), label-description, description'
|
||||
|
||||
default-description='No description available.'
|
||||
value-label-description='Description: '
|
||||
|
||||
value-title='Creation date:'
|
||||
)
|
||||
default-description='No description available.'
|
||||
|
||||
sib-ac-checker(permission='acl:Write' bind-resources, nested-field='team')
|
||||
value-title='Creation date:'
|
||||
)
|
||||
|
||||
|
||||
h2(name="label-team") Members:
|
||||
|
||||
//- TODO: sib-ac-checker unworking - https://git.happy-dev.fr/startinblox/framework/sib-core/issues/517
|
||||
//- sib-ac-checker(permission='acl:Write', bind-resources, nested-field='team')
|
||||
sib-form.block.team-form(
|
||||
bind-resources
|
||||
fields='team'
|
||||
range-team=`${endpoints.users}`
|
||||
partial=''
|
||||
nested-field='members'
|
||||
fields='user'
|
||||
range-user=`${endpoints.users}`
|
||||
|
||||
class-team='team form-label is-dark'
|
||||
label-team='Members:'
|
||||
widget-team='sib-form-auto-completion'
|
||||
class-user='team form-label is-dark'
|
||||
label-user=''
|
||||
widget-user='sib-form-auto-completion'
|
||||
|
||||
submit-button='Add a member'
|
||||
)
|
||||
|
||||
sib-display.block(
|
||||
bind-resources
|
||||
fields='team'
|
||||
sib-display.block(
|
||||
bind-resources
|
||||
fields='team'
|
||||
|
||||
multiple-team=''
|
||||
widget-team='circle-team-template'
|
||||
)
|
||||
|
||||
sib-ac-checker(permission='acl:Delete', bind-resources)
|
||||
sib-delete(
|
||||
bind-resources
|
||||
data-label='Delete Circle'
|
||||
class='right-btn reversed-btn'
|
||||
)
|
||||
|
||||
sib-widget(name='join-leave-circle-button')
|
||||
template
|
||||
sib-ac-checker(
|
||||
permission="acl:Delete"
|
||||
data-src="${value['@id']}"
|
||||
)
|
||||
sib-delete(
|
||||
data-src="${value['@id']}"
|
||||
data-label='Leave circle'
|
||||
)
|
||||
|
||||
sib-display(
|
||||
bind-resources
|
||||
fields='members'
|
||||
|
||||
multiple-members=''
|
||||
widget-members='join-leave-circle-button'
|
||||
)
|
||||
|
||||
sib-form.block.team-form(
|
||||
bind-resources
|
||||
nested-field='members'
|
||||
fields='user'
|
||||
label-user=''
|
||||
range-user=`${endpoints.users}`
|
||||
widget-user='sib-form-dropdown'
|
||||
|
||||
set-user-id-select="user"
|
||||
|
||||
submit-button='Join Circle'
|
||||
)
|
||||
|
||||
multiple-team=''
|
||||
widget-team='team-template'
|
||||
)
|
||||
|
||||
#circle-edit(hidden)
|
||||
include page-circle-edit.pug
|
@ -25,7 +25,7 @@
|
||||
widget-captain='captain-template',
|
||||
|
||||
value-label-team='TEAM:',
|
||||
widget-members='team-template',
|
||||
widget-members='project-team-template',
|
||||
multiple-members,
|
||||
|
||||
bind-resources
|
||||
|
@ -43,7 +43,24 @@ document.addEventListener('DOMContentLoaded', function (event) {
|
||||
for(sibDisplay of document.querySelectorAll('sib-display[set-user-id]')) {
|
||||
sibDisplay.setAttribute(sibDisplay.getAttribute('set-user-id'), user['@id']);
|
||||
}
|
||||
|
||||
for(sibForm of document.querySelectorAll('[set-user-id-select]')) {
|
||||
sibForm.addEventListener('populate', () => {
|
||||
document.querySelector('sib-form[submit-button="Join Circle"]').style.display = 'none';
|
||||
if(document.querySelectorAll('sib-ac-checker:not([hidden]) > sib-delete[data-label="Leave circle"]').length == 0) {
|
||||
document.querySelector('sib-form[submit-button="Join Circle"]').style.display = 'inline-block';
|
||||
}
|
||||
// BUG: Populate event trigger before the view is fully loaded! - https://git.happy-dev.fr/startinblox/framework/sib-core/issues/521
|
||||
for(select of sibForm.querySelectorAll('select[name="'+sibForm.getAttribute('set-user-id-select')+'"]')) {
|
||||
for(option of select.options) {
|
||||
option.selected = (option.getAttribute('value') == '{"@id": "'+user['@id']+'"}');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}).catch(error => console.log(error));
|
||||
|
||||
|
||||
|
||||
});
|
@ -86,7 +86,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
input[type='submit'] {
|
||||
input[type='submit'], .right-btn, sib-delete.right-btn button {
|
||||
background-color: $color-233-18-29;
|
||||
border: none;
|
||||
border-radius: 100em;
|
||||
@ -100,6 +100,31 @@
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.reversed-btn, sib-delete.reversed-btn button {
|
||||
background-color: transparent;
|
||||
border: 1px solid #6157e5;
|
||||
color: #6157e5;
|
||||
}
|
||||
|
||||
sib-delete.right-btn {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
sib-form[set-user-id-select] {
|
||||
|
||||
input[type="submit"] {
|
||||
margin-left: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
select {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* CLASSES Peut-être à sortir de .content-box */
|
||||
|
||||
.block.team-form>form { /* circle-profile */
|
||||
|
@ -1,138 +1,135 @@
|
||||
h2 {
|
||||
font-size: 1.7rem;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
#circle-edit {
|
||||
|
||||
.table-header {
|
||||
background: $color-228-25-79;
|
||||
color: white;
|
||||
display: flex;
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
justify-content: space-around;
|
||||
text-align: center;
|
||||
|
||||
>*{
|
||||
border-right: 1px solid $color-228-25-79;
|
||||
flex: 1;
|
||||
padding: 1rem;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
>*:first-of-type {
|
||||
border-right: 1px solid white;
|
||||
}
|
||||
}
|
||||
|
||||
.table-body div team-template-edit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
>* {
|
||||
border-bottom: 1px solid $color-228-25-79;
|
||||
flex: 1;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
>*:nth-child(odd) {
|
||||
border-left: 1px solid $color-228-25-79;
|
||||
border-right: 1px solid $color-228-25-79;
|
||||
padding: 0 2.2rem;
|
||||
}
|
||||
|
||||
>*:nth-child(even) {
|
||||
.table-header {
|
||||
background: $color-228-25-79;
|
||||
color: white;
|
||||
display: flex;
|
||||
border-right: 1px solid $color-228-25-79;
|
||||
justify-content: flex-end;
|
||||
padding: 2.7rem 2.2rem;
|
||||
}
|
||||
}
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
justify-content: space-around;
|
||||
text-align: center;
|
||||
|
||||
.member-select.color {
|
||||
|
||||
.ss-main {
|
||||
color: $color-233-18-29;
|
||||
}
|
||||
}
|
||||
|
||||
sib-multiple[widget='team-template-edit'] {
|
||||
|
||||
label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
>div>team-template-edit>sib-display>div {
|
||||
display: grid;
|
||||
grid-column-gap: 1.6rem;
|
||||
grid-template-columns: 7vh auto;
|
||||
grid-template-rows: repeat(2, 5.2vh);
|
||||
|
||||
>[name='account.picture'] {
|
||||
align-items: center;
|
||||
align-self: center;
|
||||
background-color: $color-213-20-91;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
grid-column: 1 / span 1;
|
||||
grid-row: 1 / span 2;
|
||||
height: 7vh;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
width: 7vh;
|
||||
|
||||
img {
|
||||
background-color: white;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
object-fit: cover;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
object {
|
||||
height: 45%;
|
||||
width: 45%;
|
||||
}
|
||||
>*{
|
||||
border-right: 1px solid $color-228-25-79;
|
||||
flex: 1;
|
||||
padding: 1rem;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
>[name='sup'] {
|
||||
align-self: end;
|
||||
display: flex;
|
||||
grid-column: 2 / span 1;
|
||||
grid-row: 1 / span 1;
|
||||
margin-bottom: 0.50rem;
|
||||
>*:first-of-type {
|
||||
border-right: 1px solid white;
|
||||
}
|
||||
}
|
||||
|
||||
[name='name'] {
|
||||
font-weight: 600;
|
||||
}
|
||||
.table-body div team-template-edit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
sib-multiple {
|
||||
display: flex;
|
||||
margin-left: 1rem;
|
||||
|
||||
[name='groups'] {
|
||||
@extend %user-role;
|
||||
}
|
||||
}
|
||||
>* {
|
||||
border-bottom: 1px solid $color-228-25-79;
|
||||
flex: 1;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
>[name='sub'] {
|
||||
align-self: start;
|
||||
grid-column: 2 / span 1;
|
||||
grid-row: 2 / span 1;
|
||||
margin-top: 0.50rem;
|
||||
>*:nth-child(odd) {
|
||||
border-left: 1px solid $color-228-25-79;
|
||||
border-right: 1px solid $color-228-25-79;
|
||||
padding: 0 2.2rem;
|
||||
}
|
||||
|
||||
>[name$='profile.city']:not(:empty) {
|
||||
@include mdi('atom');
|
||||
>*:nth-child(even) {
|
||||
display: flex;
|
||||
border-right: 1px solid $color-228-25-79;
|
||||
justify-content: flex-end;
|
||||
padding: 2.7rem 2.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.member-select.color {
|
||||
|
||||
.ss-main {
|
||||
color: $color-233-18-29;
|
||||
}
|
||||
}
|
||||
|
||||
sib-multiple[widget='team-template-edit'] {
|
||||
|
||||
label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
>div>team-template-edit>sib-display>div {
|
||||
display: grid;
|
||||
grid-column-gap: 1.6rem;
|
||||
grid-template-columns: 7vh auto;
|
||||
grid-template-rows: repeat(2, 5.2vh);
|
||||
|
||||
>[name='account.picture'] {
|
||||
align-items: center;
|
||||
align-self: center;
|
||||
background-color: $color-213-20-91;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
grid-column: 1 / span 1;
|
||||
grid-row: 1 / span 2;
|
||||
height: 7vh;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
width: 7vh;
|
||||
|
||||
&::before {
|
||||
color: $color-43-100-50;
|
||||
margin-right: 0.50rem;
|
||||
img {
|
||||
background-color: white;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
object-fit: cover;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
object {
|
||||
height: 45%;
|
||||
width: 45%;
|
||||
}
|
||||
}
|
||||
|
||||
>[name='sup'] {
|
||||
align-self: end;
|
||||
display: flex;
|
||||
grid-column: 2 / span 1;
|
||||
grid-row: 1 / span 1;
|
||||
margin-bottom: 0.50rem;
|
||||
|
||||
[name='name'] {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
sib-multiple {
|
||||
display: flex;
|
||||
margin-left: 1rem;
|
||||
|
||||
[name='groups'] {
|
||||
@extend %user-role;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
>[name='sub'] {
|
||||
align-self: start;
|
||||
grid-column: 2 / span 1;
|
||||
grid-row: 2 / span 1;
|
||||
margin-top: 0.50rem;
|
||||
|
||||
>[name$='profile.city']:not(:empty) {
|
||||
@include mdi('atom');
|
||||
align-items: center;
|
||||
display: flex;
|
||||
|
||||
&::before {
|
||||
color: $color-43-100-50;
|
||||
margin-right: 0.50rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,5 +1,11 @@
|
||||
#circle-information, #circle-edit {
|
||||
|
||||
h2 {
|
||||
font-size: 1.7rem;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.content-box__info {
|
||||
@extend %padding-block;
|
||||
|
||||
@ -58,7 +64,7 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
>div>team-template[name='team']>sib-display>div {
|
||||
>div>circle-team-template[name='team']>sib-display>div {
|
||||
display: grid;
|
||||
grid-column-gap: 1.6rem;
|
||||
grid-template-columns: 7vh auto;
|
||||
|
@ -193,7 +193,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
team-template[name='members'], captain-template[name='captain'] {
|
||||
project-team-template[name='members'], captain-template[name='captain'] {
|
||||
display: grid;
|
||||
grid-column-gap: 1.6rem;
|
||||
grid-template-columns: 7vh auto;
|
||||
|
@ -1,6 +1,6 @@
|
||||
include hd-user-avatar.pug
|
||||
|
||||
sib-widget(name='team-template')
|
||||
sib-widget(name='circle-team-template')
|
||||
template
|
||||
sib-display(
|
||||
data-src="${await value}"
|
||||
|
@ -1,6 +1,6 @@
|
||||
include hd-user-avatar.pug
|
||||
|
||||
sib-widget(name='team-template')
|
||||
sib-widget(name='project-team-template')
|
||||
template
|
||||
sib-display.project-profile-user-avatar(
|
||||
data-src="${value.user ? value.user['@id'] : ''}"
|
||||
|
Loading…
Reference in New Issue
Block a user