Append elements to layout of existing entity

[simond]

Good day,

I want to append/edit the detail layout of the account entity in an extension.
Adding additional custom fields and relationships using the entityDefs works just fine.

However, any files (for example detail.json) I add to the path
application/Espo/Modules/<mynamespace>/Resources/layouts/Account/
are not loaded during runtime whatsoever.

The path works fine for any custom entities and their corresponding layouts.

What is the ESPO-way to edit the layouts of existing entities?

Best wishes
Simon

[eymen-elkum]

Hello, this is the expected behavior, when the layout exist on the custom it will override any layout on the modules,
the extension idea is to provide the default additional layout, but the custom is to allow the user to set the final customization

[simond]

So my concrete case here is the following and I have been trying for a couple of days already:

We have a list of custom entities foo related to the account entity.
We added one field (fooId) to the account entity, to have a primary one to set.

Now we are displaying a list of all related foo entities in the side panel of the account entity. However, the primary one (fooId matching account->fooId) is supposed to be highlighted with a red border or something alike. We do not get a grip of the row elements after rendering, to select the primary one, to highlight it. The last afterRender method we can find is of the whole relationships js object, but the row elements are not in the DOM yet.

Do we have to write our own template for something? Or are we just not trying the correct files?
It seems like a simple task, but we've been trying for some time. Which files do we have to modify to be able to access the whole list row item?

All help greatly appreciated.
Best regards
Simon

[eymen-elkum]

Such this customization needs opening a ticket with one developer, if you need me to help please contact me

[simond]

Can you give me a tip where I might find an example for this in the espo source?
Or which files I'd need to touch?

Thanks for coming back at me!

[eymen-elkum]

this need research over the code, but I can give you the key,
every list view including the relationship list has child view that holds the rows,
the rows are named using the IDs of the records of the list,
I think you need a custom view for the detail, then to navigate to the relationship view then to catch the row by the id,
this information is not 100% exactly right, but can be a good description to the start point

[telecastg]

In the base list view client/src/views/record.list.js each row is defined by the function buildRow() which creates a child view for each row, you will need to create a custom list view, override buildRow() and make your changes there.

[simond]

Thank you guys for coming back at me!

I finally found a possible way in the espo code. Instead of grabbing the whole view I just grab a single attribute from displayed entity.

For this I extended the listLayout to look like this:

listLayout: {
  rows: [
    [
      {
        name: 'name',
        link: true,
        view: 'my-namespace:views/my-entity/fields/name-for-account'
      }
    ]
  ]
}

and extended the attribute in the file name-for-account.js:

Espo.define('my-namespace:views/my-entity/fields/name-for-account', 'views/fields/person-name', function (Dep) {
  return Dep.extend({
    afterRender: function () {
      if (this.model.id === this.getParentView().getParentView().getParentView().getParentView().getParentView().getParentView().model.get("customId")) {
        this.$el[0].style.backgroundColor = "red";
      }
    }
  });
});
[I][/I]

If you are interested, have another look at the espo Code. Contact also extends a function like this in views/contact/fields/name-for-account.js.

If you have any remarks on my javascript code, please feel free to criticize.

[telecastg]

Thanks for posting the solution. This forum would be a lot more useful if everyone who asks a question takes the time to post the answer when they find it.