alex
/
prueba_CGI
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor inline render options

This commit is contained in:
Alex Piqueras 2024-10-11 16:03:54 +02:00
parent 757fdf1674
commit 1e9bdb6910
1 changed files with 1 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/app.js
View File

@ -23,11 +23,6 @@ class AppBase extends HTMLElement {
this.render(); this.render();
} }
renderOptions() {
const textList = this.store.getRecords();
return textList.map((item) => `<option is="custom-item" color="${this.properties.color}" value=${item.id}>${item.text}</option>`).join('\n');
}
render(action = 'INIT') { render(action = 'INIT') {
if (![Store.actions.OPEN_MODAL, Store.actions.CLOSE_MODAL, Store.actions.ADD_LINE, Store.actions.REMOVE_LINE, Store.actions.UNDO, 'INIT'].includes(action)) { if (![Store.actions.OPEN_MODAL, Store.actions.CLOSE_MODAL, Store.actions.ADD_LINE, Store.actions.REMOVE_LINE, Store.actions.UNDO, 'INIT'].includes(action)) {
return; // Only render if content changed return; // Only render if content changed
@ -85,7 +80,7 @@ class AppBase extends HTMLElement {
<h1 id="title">${this.text.title}</h1> <h1 id="title">${this.text.title}</h1>
<p id="description">${this.text.description}</p> <p id="description">${this.text.description}</p>
<select id="list" multiple is="item-list" action="${Store.actions.SELECT}" height="227px"> <select id="list" multiple is="item-list" action="${Store.actions.SELECT}" height="227px">
${this.renderOptions()} ${this.store.getRecords().map((item) => `<option is="custom-item" color="${this.properties.color}" value=${item.id}>${item.text}</option>`)}
</select> </select>
<span class="button-bar"> <span class="button-bar">
<button is="custom-button" action="${Store.actions.UNDO}" outline width="81px" color="${this.properties.color}"> <button is="custom-button" action="${Store.actions.UNDO}" outline width="81px" color="${this.properties.color}">