AEM Forms Workspace ermöglicht dem Benutzer, die Aufgabenaktionen anzupassen. Bevor Sie die Aktionen zur Aufgabe anpassen, führen Sie die Schritte unter Generische Schritte zur Anpassung des AEM Forms Workspace durch.
Um den Textstil anzupassen, fügen Sie das folgende Codefragment in die Datei /apps/ws/css/newStyle.css
ein:
/*-------- For Task Actions visible in task list task action popup ----------------------------------------------------*/
#taskarea .taskActionsPopUp{
position:absolute;
right: 78px;
top: 16px;
display: none;
}
#taskarea .taskActionsPopUp ul{
list-style-type: none;
padding: 0px;
margin: 0px;
border: 1px solid #B2B2B2;
background: #1D1D1D;
box-shadow: inset 0px 0px 11px 2px #1C1C1C;
height:34px;
}
#taskarea .taskActionsPopUp li{
width: auto;
height: 34px;
float: left;
border-right: 1px solid #B2B2B2;
}
#taskarea .taskActionsPopUp li i{
height: 34px;
width: 20px;
float: left;
cursor: pointer;
}
#taskarea .taskActionsPopUp li a{
color: white;
text-decoration: none;
display: inline-block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align: left;
max-width: 150px;
margin: 8px 10px 0px 4px;
}
/*-------- For Task Actions visible in task Details task action popup ----------------------------------------------------*/
.task .taskActionsPopUp {
position: absolute;
border: 1px solid #1D1D1D;
z-index: 110;
right: 5px;
top : 35px;
background: #2f2f2f;
display:none;
}
.task .taskActionsPopUp ul{
list-style: none outside none;
font-size: 13px;
width: 160px;
}
.task .taskActionsPopUp li{
height: 33px;
border-bottom: 1px solid #474747;
width: 20px
}
.task .taskActionsPopUp ul a{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: white;
text-decoration: none;
height: 26px;
width: 133px;
padding: 7px 0px 0px 27px;
display: block;
text-align: left;
cursor: pointer;
border-bottom: 1px solid #474747;
}
Um die Bilder anzupassen, fügen Sie das folgende Codefragment in die Datei /apps/ws/css/newStyle.css
ein. Das folgende Codefragment passt das Bild für die Aktion Sperren an:
#taskarea .taskActionsPopUp .lock, .task .taskActionsPopUp .lock{
background: url(../images/icons.png) no-repeat -265px -6px;
}
Fügen Sie verschiedene Stile hinzu, um verschiedene Bilder oder Bilder unterschiedlicher Auflösung für die Aufgabenlisten- und Aufgabendetailaktionen anzuzeigen. Um beispielsweise die Aktion „Sperren“ zu ändern:
#taskarea .taskActionsPopUp .lock{
background: url(../images/icons1.png) no-repeat -265px -6px;
}
.task .taskActionsPopUp .lock{
background: url(../images/icons2.png) no-repeat -265px -6px;
}
Um nur Bilder für Aktionen anzuzeigen, passen Sie die Bilder an, die in Route-Aktionen verwendet werden. Ausführliche Informationen finden Sie unter Bilder für Route-Aktionen.
Sie benötigen ein Entwicklungspaket, um Elemente des Aufgabenaktionen-Popupmenüs „Aufgabenliste“ von AEM Forms Workspace anzupassen. Ausführliche Informationen zum Erstellen des Entwicklungspakets finden Sie unter Erstellen des AEM Forms Workspace-Codes.
Kopieren Sie /libs/ws/js/runtime/templates/task.html nach /apps/ws/js/runtime/templates/task.html
ersetzen Sie das folgende Codefragment:
// Orignal code
<div class="taskActionsPopUp">
<!--START_TASKACTIONS-->
<ul>
<li class="arrow"></li>
<%if(!isMustOpenToComplete && window.lcWorkspace != undefined && window.lcWorkspace.currentUser != undefined && window.lcWorkspace.currentUser.properties != undefined && window.lcWorkspace.currentUser.properties['/client/routes/formViewOnly'] == 'false'){%>
<%if(routeList == null){%>
<li>
<a href="javascript:void(0);" title="<%= $.t('taskaction.directcommand.'+availableCommands.directCommands[0])%>" value="<%= availableCommands.directCommands[0]%>" data-action="route"><%= $.t('taskaction.directcommand.'+availableCommands.directCommands[0])%></a>
</li>
<%}else{%>
<%for(var i = 0; i<availableCommands.directCommands.length; i++){%>
<li>
<a href="javascript:void(0);" title="<%= availableCommands.directCommands[i]%>" value="<%= availableCommands.directCommands[i]%>" data-action="route"><%= availableCommands.directCommands[i]%></a>
</li>
<%}%>
<%}%>
<%}%>
<%for(var i = 0; i<availableCommands.taskACLCommands.length; i++){%>
<li class="<%= availableCommands.taskACLCommands[i]%>" alt="<%= $.t('taskaction.taskaclcommand.'+availableCommands.taskACLCommands[i]+'.value')%>">
<a href="javascript:void(0);" title="<%= $.t('taskaction.taskaclcommand.'+availableCommands.taskACLCommands[i]+'.tooltip')%>" value="<%= availableCommands.taskACLCommands[i]%>" data-action="taskACL"><%= $.t('taskaction.taskaclcommand.'+availableCommands.taskACLCommands[i]+'.value')%></a>
</li>
<%}%>
<%for(var i = 0; i<availableCommands.otherCommands.length; i++){%>
<li class="<%= availableCommands.otherCommands[i]%>" alt="<%= $.t('taskaction.othercommand.'+availableCommands.otherCommands[i]+'.value')%>">
<a href="javascript:void(0);" title="<%= $.t('taskaction.othercommand.'+availableCommands.otherCommands[i]+'.tooltip')%>" value="<%= availableCommands.otherCommands[i]%>" data-action="other"><%= $.t('taskaction.othercommand.'+availableCommands.otherCommands[i]+'.value')%></a>
</li>
<%}%>
</ul>
<!--END_TASKACTIONS-->
<%}%>
</div>
//New code
<div class="taskActionsPopUp">
<!--START_TASKACTIONS-->
<ul>
<li class="arrow"></li>
<%if(!isMustOpenToComplete && window.lcWorkspace != undefined && window.lcWorkspace.currentUser != undefined && window.lcWorkspace.currentUser.properties != undefined && window.lcWorkspace.currentUser.properties['/client/routes/formViewOnly'] == 'false'){%>
<%if(routeList == null){%>
<li>
<a href="javascript:void(0);" title="<%= $.t('taskaction.directcommand.'+availableCommands.directCommands[0])%>" value="<%= availableCommands.directCommands[0]%>" data-action="route"></a>
</li>
<%}else{%>
<%for(var i = 0; i<availableCommands.directCommands.length; i++){%>
<li>
<a href="javascript:void(0);" title="<%= availableCommands.directCommands[i]%>" value="<%= availableCommands.directCommands[i]%>" data-action="route"></a>
</li>
<%}%>
<%}%>
<%}%>
<%for(var i = 0; i<availableCommands.taskACLCommands.length; i++){%>
<li class="<%= availableCommands.taskACLCommands[i]%>" alt="<%= $.t('taskaction.taskaclcommand.'+availableCommands.taskACLCommands[i]+'.value')%>">
<a href="javascript:void(0);" title="<%= $.t('taskaction.taskaclcommand.'+availableCommands.taskACLCommands[i]+'.tooltip')%>" value="<%= availableCommands.taskACLCommands[i]%>" data-action="taskACL"></a>
</li>
<%}%>
<%for(var i = 0; i<availableCommands.otherCommands.length; i++){%>
<li class="<%= availableCommands.otherCommands[i]%>" alt="<%= $.t('taskaction.othercommand.'+availableCommands.otherCommands[i]+'.value')%>">
<a href="javascript:void(0);" title="<%= $.t('taskaction.othercommand.'+availableCommands.otherCommands[i]+'.tooltip')%>" value="<%= availableCommands.otherCommands[i]%>" data-action="other"></a>
</li>
<%}%>
</ul>
<!--END_TASKACTIONS-->
<%}%>
</div>
Entfernen Sie die feste Breite, die einem Anker-Tag zugewiesen ist, aus der Datei /apps/ws/css/newStyle.css
:
.task .taskActionsPopUp ul{
list-style: none outside none;
font-size: 13px;
width: 160px;
}
To
.task .taskActionsPopUp ul{
list-style: none outside none;
font-size: 13px;
}
AND
.task .taskActionsPopUp ul a{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: white;
text-decoration: none;
height: 26px;
width: 133px;
padding: 7px 0px 0px 27px;
display: block;
text-align: left;
cursor: pointer;
border-bottom: 1px solid #474747;
}
To
.task .taskActionsPopUp ul a{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: white;
text-decoration: none;
height: 26px;
width: 0px;
padding: 7px 0px 0px 27px;
display: block;
text-align: left;
cursor: pointer;
border-bottom: 1px solid #474747;
}
Führen Sie die folgenden Schritte aus, um das Aufgabenaktionen-Popupmenü „Aufgabendetails“ anzupassen:
/apps/ws/js/runtime/templates/
:// Original code
<div class="taskActionsPopUp">
<!--START_ACTIONBUTTONGROUP-->
<ul>
<li class="leftArrow"><a href="javascript:void(0);"><</a></li>
<% if (isOwner && showDirectActions) { %>
<% if (routeList === null) {%>
<li class="routeAction">
<a href="javascript:void(0);" title="<%= $.t('taskaction.directcommand.'+availableCommands.directCommands[0])%>" value="<%= availableCommands.directCommands[0]%>" data-action="route"><%= $.t('taskaction.directcommand.'+availableCommands.directCommands[0])%></a>
</li>
<% } else { %>
<%for (var i = 0; i < availableCommands.directCommands.length; i++) {%>
<li class="routeAction">
<a href="javascript:void(0);" title="<%= availableCommands.directCommands[i]%>" value="<%= availableCommands.directCommands[i]%>" data-action="route"><%= availableCommands.directCommands[i]%></a>
</li>
<%}%>
<%}%>
<%}%>
<% if (isOwner || (showACLActions && availableCommands.taskACLCommands !== null && availableCommands.taskACLCommands !== undefined && availableCommands.taskACLCommands.length > 0) || availableCommands.otherCommands.length > 2) { %>
<%for (var i = 0; showACLActions && i < availableCommands.taskACLCommands.length; i++) {%>
<li title="<%= $.t('taskaction.taskaclcommand.'+availableCommands.taskACLCommands[i]+'.tooltip')%>">
<i class="<%= availableCommands.taskACLCommands[i]%>" value="<%= availableCommands.taskACLCommands[i]%>" data-action="taskACL"/>
<a href="javascript:void(0);" value="<%= availableCommands.taskACLCommands[i]%>" data-action="taskACL"><%= $.t('taskaction.taskaclcommand.'+availableCommands.taskACLCommands[i]+'.value')%></a>
</li>
<%}%>
<%for (var i = 0; i < availableCommands.otherCommands.length; i++) {%>
<li title="<%= $.t('taskaction.othercommand.'+availableCommands.otherCommands[i]+'.tooltip')%>">
<i class="<%= availableCommands.otherCommands[i]%>" value="<%= availableCommands.otherCommands[i]%>" data-action="other"/>
<a href="javascript:void(0);" value="<%= availableCommands.otherCommands[i]%>" data-action="other"><%= $.t('taskaction.othercommand.'+availableCommands.otherCommands[i]+'.value')%></a>
</li>
<%}%>
<%}%>
<li class="rightArrow"><a href="javascript:void(0);">></a></li>
</ul>
<!--END_ACTIONBUTTONGROUP-->
</div>
//New code
<div class="taskActionsPopUp">
<!--START_ACTIONBUTTONGROUP-->
<ul>
<li class="leftArrow"><a href="javascript:void(0);"><</a></li>
<% if (isOwner && showDirectActions) { %>
<% if (routeList === null) {%>
<li class="routeAction">
<a href="javascript:void(0);" title="<%= $.t('taskaction.directcommand.'+availableCommands.directCommands[0])%>" value="<%= availableCommands.directCommands[0]%>" data-action="route"><%= $.t('taskaction.directcommand.'+availableCommands.directCommands[0])%></a>
</li>
<% } else { %>
<%for (var i = 0; i < availableCommands.directCommands.length; i++) {%>
<li class="routeAction">
<a href="javascript:void(0);" title="<%= availableCommands.directCommands[i]%>" value="<%= availableCommands.directCommands[i]%>" data-action="route"><%= availableCommands.directCommands[i]%></a>
</li>
<%}%>
<%}%>
<%}%>
<% if (isOwner || (showACLActions && availableCommands.taskACLCommands !== null && availableCommands.taskACLCommands !== undefined && availableCommands.taskACLCommands.length > 0) || availableCommands.otherCommands.length > 2) { %>
<%for (var i = 0; showACLActions && i < availableCommands.taskACLCommands.length; i++) {%>
<li title="<%= $.t('taskaction.taskaclcommand.'+availableCommands.taskACLCommands[i]+'.tooltip')%>">
<a href="javascript:void(0);" value="<%= availableCommands.taskACLCommands[i]%>" data-action="taskACL">
<i class="<%= availableCommands.taskACLCommands[i]%>" value="<%= availableCommands.taskACLCommands[i]%>" data-action="taskACL"/>
</a>
</li>
<%}%>
<%for (var i = 0; i < availableCommands.otherCommands.length; i++) {%>
<li title="<%= $.t('taskaction.othercommand.'+availableCommands.otherCommands[i]+'.tooltip')%>">
<a href="javascript:void(0);" value="<%= availableCommands.otherCommands[i]%>" data-action="other">
<i class="<%= availableCommands.otherCommands[i]%>" value="<%= availableCommands.otherCommands[i]%>" data-action="other"/>
</a>
</li>
<%}%>
<%}%>
<li class="rightArrow"><a href="javascript:void(0);">></a></li>
</ul>
<!--END_ACTIONBUTTONGROUP-->
</div>
text!/lc/libs/ws/js/runtime/templates/taskdetails.html
text!/lc/apps/ws/js/runtime/templates/taskdetails.html