在ToDo列表中显示其他数据

默认情况下,AEM Forms工作区待办事项列表显示任务显示名称和说明。 但是,您可以添加其他信息,如创建日期、截止日期。 您还可以添加图标并更改显示屏的样式。

查看显示默认配置的HTML工作区待办事项选项卡

本文详细介绍了在ToDo列表中为每个任务添加要显示的信息的步骤。

可以添加的内容

可以添加服务器发送的task.json中的可用信息。 该信息可以添加为纯文本,也可以使用样式设置信息的格式。

有关JSON对象描述的详细信息,请参阅文章。

显示任务上的信息

  1. 按照AEM Forms工作区自定义的一般步骤操作。

  2. 要显示任务的附加信息,必须在translation.json的任务块中添加相应的键值对。

    例如,更改/apps/ws/locales/en-US/translation.json表示英语:

    "task" : {
            "reminder" : {
                "value" : "Reminder",
                "tooltip" : "This is reminder __reminderCount__, for this task."
            },
            "deadlined" : {
                "value" : "Deadlined",
                "tooltip" : "This task has deadlined"
            },
            "save" : {
                "message" : "Task has been saved successfully"
            },
            "status" : {
                "deadlined" : "Deadlined",
                "created" : "Created",
                "assignedsaved" : "Draft from assigned task",
                "terminated" : "Terminated",
                "assigned" : "Assigned",
                "unknown" : "Unknown",
                "createdsaved" : "Draft from created task",
                "completed" : "Completed"
            },
            "draft" : {
                "value" : "Saved",
                "tooltip" : "This task is marked as a draft"
            },
            "escalated" : {
                "value" : "Escalated",
                "tooltip" : "This task has been escalated"
            },
            "forward" : {
                "value" : "Forwarded",
                "tooltip" : "This task was forwarded"
            },
            "priority" : {
                "highest" : "Highest priority",
                "normal" : "Normal priority",
                "high" : "High priority",
                "low" : "Low priority",
                "lowest" : "Lowest priority"
            },
            "claimed" : {
                "value" : "Claimed",
                "tooltip" : "This task has been claimed"
            },
            "locked" : {
                "value" : "Locked",
                "tooltip" : "This task is locked"
            },
            "consulted" : {
                "value" : "Consulted",
                "tooltip" : "This task has been consulted"
            },
            "returned" : {
                "value" : "Returned",
                "tooltip" : "This task was returned back"
            },
            "multiplesubmitbuttons" : {
                "message" : "The form associated with this task has multiple submit buttons so the Workspace Complete button will be disabled. Click the appropriate button on the form to submit it."
            },
            "nosubmitbutton" : {
                "message" : "The form associated with this task does not appear to have submit buttons. You may need to upgrade your Adobe Reader version to 9.1 or greater and enable the Reader Submit option in your process."
            },
            "icon" : {
                "tooltip" : "open the task __taskName__"
            }
        }
    
    注意

    为所有支持的语言添加相应的键值对。

  3. 例如,在任务块中添加信息:

    "stepname" : {
                "value" : "Step Name",
                "tooltip" : "This task belongs to __stepName__ step"
    }
    

为新属性定义CSS

  1. 您可以对添加到任务的信息(属性)应用样式。 为此,您需要为添加到/apps/ws/css/newStyle.css的新属性添加样式信息。

    例如,添加:

    .task .taskProperties .stepname{
        width: 25px;
        background: url(../images/stepname.png) no-repeat; /*-------- Or just reuse background image / image-sprite defined .task .taskProperties span of style.css---------------------*/
        background-position: 0px 0px; /*-------- Dummy values, need to be configured as per user background image / image-sprite ---------------------*/
    }
    

在HTML模板中添加条目

最后,您需要在开发包中包含要添加到任务的每个属性的条目。 要创建一个,请参阅构建AEM Forms工作区代码。

  1. 复制 task.html:

    • 从: /libs/ws/js/runtime/templates/
    • 到: /apps/ws/js/runtime/templates/
  2. 将新信息添加到/apps/ws/js/runtime/templates/task.html

    例如,在div class="taskProperties"下添加:

    <span class="stepname" alt="<%= $.t('task.stepname.value')%>" title = '<%= $.t("task.stepname.tooltip",{stepName:stepName})%>'/>
    

On this page

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now