[DEA] - Inline display of observations with that of mobile app

[vindeolal]

Need:

Currently the DEA only supports question group when it is not repeatable. It breaks whenever it has to render a form with repeatable question group elements. And for lengthy forms it is difficult to differentiate the observations captured in different pages.

Acceptance criteria:

• Ability to display observations captured in repeated group form elements in any form/entity - encounter, cancel forms etc.,.
• Differentiate the observations captured in different pages, by displaying the name of the 'form_element_group' with grey background, like done in mobile app
  

Mockups:

Showing:

Current status of DEA with question group which is not repeatable:

Make it something similar to how it is in client as shown in the below image regarding the below 3 things:

• line dividing different question group sets.
• 'Materials dispatched' displays twice because one is page name and the other is concept name
• alignment - names of concepts within question group is left indented to the name of the question group concept name.

[himeshr]

Sample screenshot for Goonj Distribution Subject DEA screen with Repeatable(Inventory Details) and Single(Activity Details) QuestionGroups.

[himeshr]

Sample screenshots: (Goonj Revamp org)

Subject

https://staging.avniproject.org/#/app/subject?uuid=acb0bee5-e27f-4d4b-bcdf-5d9edda79739
http://localhost:6010/#/app/subject?uuid=df56a62a-e7bf-461d-ac6f-0a6134bc65c6

Encounter

https://staging.avniproject.org/#/app/subject?uuid=7dee0bc7-60d0-4588-a212-2a30f9d5c817