Tree with Partial Page Rendering



  • Hi all,

    I’m assessing the migration of a JSF (Oracle ADF) App to Quasar, and I came across this tricky requirement:

    24048ce9-e129-40a0-aa3b-ae52262d0cee-image.png

    The drawer inside the yellow border belongs to main layout and routes to modules, like this reference data management one.

    Both the tree and form inside the green and blue borders are, at the moment on a single page, which is a a route from the main layout, hence being inside a page container.

    So, the tricky part is that the tree can provide multiple actions for very different entities, although the tree itself if based on the same data set, by wizardry of weird queries and datamodels.

    Ideally I would use child routes for the different forms, but that, as far as I can tell, would make me loose the state of the tree, since it is inside the page container.

    I think a sort of workaround would be to make components that represent each type of form and chain a lot of v-if’s, but that would severely gimp what I can do with routes as far as something like /rdm/entity/:name

    And as final resort, I have the chance to have second drawer (on the right or something like that), that would keep the tree at the layout level, but would make everyone have a crap user experience.

    So, am I missing something here? I know SPA’s rarely have this kind of state complexity (and I didn’t even get to the place where the tree needs to be contextually refresh because of deleting and adding content), but I think my options are too complicated and I hope there’s a better way.

    Any pointers are very welcome.

    Thanks in advance



  • It should be possible to have pages within pages. So, create a page with the tree in it, where there is also another page-container and router-view. Then build your “sub-pages” to be viewed in that page-container.

    Scott


Log in to reply