Create a grouped by list applet for Agent Mobile in New York


Description

In the New York agent app, the Studio app creates these records on the table themselves and users do not see the Studio UI. This KB is how to create a grouped list applet from scratch.

Release or Environment

New York

Resolution

This is an example of how to create a grouped by list for Agent Mobile in New York. In this example, we create a list of catalog tasks that are grouped by the assignment group field.

In the ITSM Mobile scope:

  1. Screen1
    • Go to sys_sg_screen table
    • New
    • List screen group by
    • any icon
    • hide filters checked
    • submit
    • Name snc_List of groups (screen 1)
  2. Screen2
    • Go to sys_sg_screen table
    • New
    • list screen group by
    • any icon
    • submit
    • Name snc_Selected group (screen 2)
  3. Create item stream on screen 1.
    • go to sys_sg_item_stream_segment table added
    • new
    • save
    • Name snc_issStreamSegment1
    • link to screen1 from step1 added
  4. Create item stream segment for screen 2
    • go to sys_sg_item_stream_segment table
    • new
    • save
    • Name snc_issStreamSegment2
    • link to screen2 from step 2 added
  5. Create data item for screen 1
    • go to sys_sg_data_item
    • add table and conditions.
    • group by assignment group
    • Name snc_DATA1
  6. Create item view 1
    • JSON describes how list should look.
    • go to sys_sg_item_view
    • give it a table
    • json: below
    • Name snc_itemView1
  7. Create form screen
    • Go to sys_sg_screen table added
    • pick any icon
    • nothing else needs to be configures save.
    • Name snc_embeddedScreen1
  8. Create main item 1
    • go to sys_sg_main_item added
    • item view created on step 6
    • table sc_task
    • embedded screen from step 7
    • Name snc_mainItem1
  9. Create function
    • go to sys_sg_button
    • type: navigation added
    • add table added
    • destination screen: from step 2
    • Name snc_Function1
    • save will come back
  10. Create function instance from main item 1.
    • go to main item 1 from step 8
    • parent should be filled if created from main item relate list
    • parent table will be table of main item 1
    • Function from step 9
    • location list item
    • Name snc_FuncInstance1
  11. Create UI parameter
    • go to screen made in step 2 and go to UI parameters related list and click new
    • parameter type screen
    • input type text
    • Name snc_ui_parameter
  12. Add redirection destination fields.
    • Go back to function from step 9
    • Go to redirection destination fields
    • new
    • Destination UI parameter from step 11
    • type field
    • source field assignment group
  13. Create item stream
    • go to sys_sg_item_stream
    • Data item from step 5
    • add item stream M2M Main items from step 8
    • Name snc_itemStream1
    • go to item stem segment from step 3 and add item stream to item stream M2M segments
  14. Open applet launcher and add your app
    • go to sys_sg_applet_launcher
    • pick your applet to launch from
    • go to > applet name > body > click on group tasks under section column
    • click applet lock and add your applet
  15. Create a data item for the second list screen
    • make new data item
    • give it a table
    • add conditions of active is true and assigned to is empty
    • save
    • you should now be able to add a parameter definition
    • table is sys_sg_data_item
    • Name snc_DATA2
  16. Create item view 2
    • go to sys_sg_item_view
    • JSON below
    • table sc_task
    • Name snc_itemView2
  17. Create main item 2
    • go to sys_sg_main_item
    • add item view from step 17
    • add table
    • no condition
    • save will come back to add embedded screen
    • Name snc_Mainitem2
  18. Create a form screen
    • go to sys_sg_form_screen
    • this we used the OOB “Unassigned by group” which contains embedded screens
    • Type form
    • change name and any value you need for your applet then use insert and stay.
    • will also need to create or use a header view for the correct table and with the correct JSON.
  19. Open main item 2 from step 18 and add embedded screen from step 19.
  20. Create item stream 2
    • go to sys_sg_item_stream
    • add data item 2 from step 16
    • add item stream M2M Main Item from step 18
    • Name snc_itemStream2
  21. Link item stream from step 21 and stream segment from step 4
  22. Create item parameter
    • Go to data item made in step 16 (snc_DATA2)
    • related list item parameter
    • click new
    • Name snc_ItemParameter2
  23. Create screen parameter mapping for screen 2
    • New
    • item parameter from step 23
    • ui parameter from step 11
  24. Link Data1 from step 5 to the form screen from step 19.
    • The JSON for step 6:
      {"Type":"ViewGroup","Margin":{"Top":0,"Bottom":0},"Orientation":"Horizontal","Alignment":"Stretch","Distribution":"Auto","Children":[{"Type":"Text","Margin":{},"Text":"PLACEHOLDER","CellId":"sys_group_by","TextColor":"#293e40","TextAlignment":"Left","MaxLines":2,"Font":{"Weight":"regular","Size":16},"Id":22123},{"Type":"Text","Margin":{"Right":8},"Text":"9999","CellId":"sys_count","TextColor":"#7d8a8c","TextAlignment":"Right","MaxLines":1,"Font":{"Weight":"regular","Size":14},"Id":22124},{"Type":"Text","Margin":{},"Width":20,"Text":"","TextColor":"#a7b0b2","TextAlignment":"Right","MaxLines":1,"Font":{"Weight":"regular","Size":14,"Name":"icomoon"},"Id":22125}],"Height":68,"Id":28090}

      And JSON for step 17:

      {"Type":"ViewGroup","Margin":{"Top":17,"Bottom":15},"Orientation":"Vertical","Alignment":"Stretch","Distribution":"Auto","Children":[{"Type":"ViewGroup","Orientation":"Horizontal","Alignment":"Stretch","Distribution":"Equal","Children":[{"Type":"ViewGroup","Margin":{"Right":12},"Orientation":"Vertical","Alignment":"Left","Distribution":"Auto","Children":[{"Type":"Text","CornerRadius":2,"BackgroundColor":"#f1f1f1","Height":21,"Width":100,"Margin":{},"studio_template_field_id":"E1","Text":"","CellId":"state","TextColor":"#293e40","TextAlignment":"Center","MaxLines":1,"Font":{"Weight":"semibold","Size":13},"Id":11566}],"Id":42845},{"Type":"ViewGroup","Margin":{},"Orientation":"Vertical","Alignment":"Right","Distribution":"Auto","Children":[{"Type":"Text","Margin":{},"studio_template_field_id":"E2","Text":"","TextColor":"#7d8a8c","TextAlignment":"Right","MaxLines":1,"Font":{"Weight":"regular","Size":13},"CellId":"number","Id":3907}],"Id":42846}],"Id":12259},{"Type":"Text","Margin":{"Top":9},"TextColor":"#293e40","TextAlignment":"Left","MaxLines":2,"Font":{"Weight":"regular","Size":18},"studio_template_field_id":"E3","Text":"","CellId":"short_description","Id":22124},{"Type":"ViewGroup","Orientation":"Vertical","Alignment":"Left","Distribution":"Auto","Children":[{"Type":"ViewGroup","Margin":{"Top":9},"Orientation":"Horizontal","Alignment":"Center","Distribution":"Auto","Children":[{"Type":"Text","Margin":{"Right":8},"studio_template_is_label":true,"studio_template_field_id":"E4","TextColor":"#7d8a8c","TextAlignment":"Left","MaxLines":1,"Font":{"Weight":"regular","Size":13},"Text":"${request.requested_for}","Id":3091},{"Type":"Image","CornerRadius":11,"Height":22,"Width":22,"Margin":{"Right":6},"studio_template_field_id":"E5","Scaling":"Fill","CellId":"request.requested_for.avatar","Id":38286},{"Type":"Text","Margin":{},"studio_template_field_id":"E4","Text":"","TextColor":"#293e40","TextAlignment":"Left","MaxLines":1,"Font":{"Weight":"regular","Size":13},"CellId":"request.requested_for","Id":3093}],"Id":34348},{"Type":"ViewGroup","Margin":{"Top":7},"Orientation":"Horizontal","Alignment":"Center","Distribution":"Auto","Children":[{"Type":"Text","studio_template_is_label":true,"studio_template_field_id":"E6","TextColor":"#7d8a8c","TextAlignment":"Left","MaxLines":1,"Font":{"Weight":"regular","Size":13},"Margin":{"Right":8},"Text":"${opened_at}","Id":9763},{"Type":"Text","Margin":{},"studio_template_field_id":"E6","Text":"","TextColor":"#293e40","TextAlignment":"Left","MaxLines":1,"Font":{"Weight":"regular","Size":13},"CellId":"opened_at","Id":9764}],"Id":34349}],"Id":12261}],"studio_card_id":"9599488923452300a8ed7f4fc7bf652e","Id":28090}