3204 Add expanded information for each reviewer
This commit is contained in:
parent
625cc68153
commit
6d076b2b77
view/src/main
java/se/su/dsv/scipro/admin/pages
webapp/css
@ -53,30 +53,35 @@
|
||||
Managing targets for <strong wicket:id="period"></strong>.
|
||||
</p>
|
||||
<div class="card mb-3" wicket:id="reviewers">
|
||||
<div class="row g-0" wicket:id="reviewer">
|
||||
<div class="col-auto">
|
||||
<img class="img-fluid rounded-start profile-picture-md" wicket:id="profile_image">
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="card-body">
|
||||
<h4 class="card-title" wicket:id="name">[John Doe]</h4>
|
||||
<wicket:container wicket:id="reviewer">
|
||||
<div class="row g-0">
|
||||
<div class="col-auto">
|
||||
<img class="img-fluid rounded-start profile-picture-md" wicket:id="profile_image">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<form class="card-body row justify-content-end" wicket:id="form">
|
||||
<div class="col-auto" wicket:id="feedback"></div>
|
||||
<div class="col-auto">
|
||||
<input type="number" class="form-control form-control-sm" min="0" wicket:id="target">
|
||||
<div class="col-auto">
|
||||
<div class="card-body">
|
||||
<h4 class="card-title" wicket:id="name">[John Doe]</h4>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button type="submit" class="btn btn-success btn-sm">Set target for selected period</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="col">
|
||||
<form class="card-body row justify-content-end" wicket:id="form">
|
||||
<div class="col-auto" wicket:id="feedback"></div>
|
||||
<div class="col-auto">
|
||||
<input type="number" class="form-control form-control-sm" min="0" wicket:id="target">
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button type="submit" class="btn btn-success btn-sm">Set target for selected period</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<a class="col-auto w-64-px align-self-center" wicket:id="expand">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22"><defs><clipPath><path fill="#00f" fill-opacity=".514" d="m-7 1024.36h34v34h-34z"/></clipPath><clipPath><path fill="#aade87" fill-opacity=".472" d="m-6 1028.36h32v32h-32z"/></clipPath></defs><path d="m345.44 248.29l-194.29 194.28c-12.359 12.365-32.397 12.365-44.75 0-12.354-12.354-12.354-32.391 0-44.744l171.91-171.91-171.91-171.9c-12.354-12.359-12.354-32.394 0-44.748 12.354-12.359 32.391-12.359 44.75 0l194.29 194.28c6.177 6.18 9.262 14.271 9.262 22.366 0 8.099-3.091 16.196-9.267 22.373" transform="matrix(.03541-.00013.00013.03541 2.98 3.02)" fill="#4d4d4d"/></svg>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-auto w-64-px align-self-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22"><defs><clipPath><path fill="#00f" fill-opacity=".514" d="m-7 1024.36h34v34h-34z"/></clipPath><clipPath><path fill="#aade87" fill-opacity=".472" d="m-6 1028.36h32v32h-32z"/></clipPath></defs><path d="m345.44 248.29l-194.29 194.28c-12.359 12.365-32.397 12.365-44.75 0-12.354-12.354-12.354-32.391 0-44.744l171.91-171.91-171.91-171.9c-12.354-12.359-12.354-32.394 0-44.748 12.354-12.359 32.391-12.359 44.75 0l194.29 194.28c6.177 6.18 9.262 14.271 9.262 22.366 0 8.099-3.091 16.196-9.267 22.373" transform="matrix(.03541-.00013.00013.03541 2.98 3.02)" fill="#4d4d4d"/></svg>
|
||||
<div wicket:id="expanded" class="card-body">
|
||||
<p>A very long note. Lorem ipsum dolor sit amet.</p>
|
||||
</div>
|
||||
</div>
|
||||
</wicket:container>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1,7 +1,10 @@
|
||||
package se.su.dsv.scipro.admin.pages;
|
||||
|
||||
import org.apache.wicket.AttributeModifier;
|
||||
import org.apache.wicket.Component;
|
||||
import org.apache.wicket.ajax.AjaxRequestTarget;
|
||||
import org.apache.wicket.ajax.form.AjaxFormComponentUpdatingBehavior;
|
||||
import org.apache.wicket.ajax.markup.html.AjaxLink;
|
||||
import org.apache.wicket.feedback.FencedFeedbackPanel;
|
||||
import org.apache.wicket.markup.html.WebMarkupContainer;
|
||||
import org.apache.wicket.markup.html.basic.Label;
|
||||
@ -149,6 +152,21 @@ public class AdminReviewerCapacityManagementPage extends AbstractAdminProjectPag
|
||||
add(new UserProfileImage("profile_image", reviewer, UserProfileImage.Size.MEDIUM));
|
||||
add(new UserLabel("name", reviewer));
|
||||
add(new AssignTargetForm("form", reviewer));
|
||||
ExpandedInformation expandedInformation = new ExpandedInformation("expanded", reviewer);
|
||||
expandedInformation.setOutputMarkupPlaceholderTag(true);
|
||||
expandedInformation.setVisible(false);
|
||||
add(expandedInformation);
|
||||
AjaxLink<Object> expandToggle = new AjaxLink<>("expand") {
|
||||
@Override
|
||||
public void onClick(AjaxRequestTarget target) {
|
||||
expandedInformation.setVisible(!expandedInformation.isVisible());
|
||||
target.add(expandedInformation);
|
||||
target.add(this);
|
||||
}
|
||||
};
|
||||
expandToggle.add(AttributeModifier.append("class", () -> expandedInformation.isVisible() ? "rotate-90" : ""));
|
||||
expandToggle.setOutputMarkupId(true);
|
||||
add(expandToggle);
|
||||
}
|
||||
|
||||
private class AssignTargetForm extends Form<User> {
|
||||
@ -179,5 +197,11 @@ public class AdminReviewerCapacityManagementPage extends AbstractAdminProjectPag
|
||||
success("Target assigned");
|
||||
}
|
||||
}
|
||||
|
||||
private class ExpandedInformation extends WebMarkupContainer {
|
||||
public ExpandedInformation(String id, IModel<User> reviewer) {
|
||||
super(id, reviewer);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -541,6 +541,9 @@ th.wicket_orderUp, th.sorting_asc {
|
||||
.w-64-px {
|
||||
width: 64px;
|
||||
}
|
||||
.rotate-90 {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.read-state {
|
||||
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
|
||||
|
Loading…
x
Reference in New Issue
Block a user