@cuba-platform/front-generator/lib/generators/polymer2/entity-list/template/entity-list.html

CUBA Platform front-end clients generator

<link rel="import" href="<%= relDirShift %>../bower_components/polymer/polymer.html">
<link rel="import" href="<%= relDirShift %>../bower_components/iron-selector/iron-selector.html">
<link rel="import" href="<%= relDirShift %>../bower_components/cuba-app/cuba-localize-behavior.html">
<link rel="import" href="<%= relDirShift %>../bower_components/cuba-ui/cuba-entity-list-view-behavior.html">
<link rel="import" href="<%= relDirShift %>../bower_components/cuba-data/cuba-entities.html">
<link rel="import" href="<%= relDirShift %>../bower_components/cuba-styles/cuba-styles.html">
<link rel="import" href="<%= relDirShift %>shared-styles.html">

<dom-module id="<%= componentName %>">
  <template>
    <style include="cuba-styles"></style>
    <style include="shared-styles"></style>
    <style>
      :host {
        display: block;
      }
    </style>

    <cuba-entities id="data"
                   entity-name="<%= entity.name %>"
                   data="{{entities}}"
                   <%if (view) {%>view="<%= view.name %>"<%}%>
                   loading="{{dataLoading}}"
                   limit="10"
                   provide-count="true"
                   count="{{entitiesCount}}"
                   auto="[[active]]">
    </cuba-entities>


    <iron-selector id="selector" on-iron-activate="_handleSelectionChange" class="item-list">
      <template id="entitiesList" is="dom-repeat" items="{{entities}}">
        <div class="row" on-tap="_handleItemTap">
          <div class="title">[[item._instanceName]]</div>
          <div class="description">
            <% if (view) { for (let i = 0; i < view.allProperties.length ; i++) { %>
              [[msg('<%= entity.name %>.<%= view.allProperties[i].name %>')]]: [[item.<%= view.allProperties[i].name %>]]<br>
            <%}}%>
          </div>
        </div>
      </template>
    </iron-selector>

    <vaadin-button on-tap="_loadMore" class="load-more" hidden$="[[!moreDataAvailable]]">
      [[msg('Load more')]]
    </vaadin-button>

  </template>
  <script>
    {
      /**
       * @extends {Polymer.Element}
       * @appliesMixin CubaLocalizeBehavior
       * @appliesMixin CubaEntityListViewBehavior
       */
      class <%= className %> extends Polymer.mixinBehaviors([CubaLocalizeBehavior, CubaEntityListViewBehavior], Polymer.Element) {

        static get is() { return '<%= componentName %>' }

      }

      customElements.define(<%= className %>.is, <%= className %>);
    }
  </script>
</dom-module>