Skip to content
Snippets Groups Projects
Select Git revision
  • 78b48f20983054b8f5166a48be52fd022fa48798
  • main default protected
  • renovate/lock-file-maintenance
  • demo protected
  • person-select-custom
  • dbp-translation-component
  • icon-set-mapping
  • port-i18next-parser
  • remove-sentry
  • favorites-and-recent-files
  • revert-6c632dc6
  • lit2
  • advertisement
  • wc-part
  • automagic
  • publish
  • wip-cleanup
  • demo-file-handling
18 results

demo.js

Blame
  • demo.js 5.60 KiB
    import 'vpu-auth';
    import './data-table-view.js';
    import {setting,} from './utils.js';
    import {i18n} from './i18n';
    import {html, LitElement} from 'lit-element';
    import * as commonUtils from 'vpu-common/utils';
    
    class DataTableViewDemo extends LitElement {
        constructor() {
            super();
            this.lang = 'de';
        }
    
        static get properties() {
            return {
                lang: { type: String },
            };
        }
    
        connectedCallback() {
            super.connectedCallback();
            const that = this;
    
            this.updateComplete.then(()=> {
                /*
                        First Table: with data
                 */
                const vdtv1 = that.shadowRoot.querySelector('#vdtv1');
                if (vdtv1 !== null) {
                    const vdtv1_columnDefs = [
                        { targets: [3], visible: false },
                        { targets: [2], orderData: [3] },
                        { targets: [3, 4], searchable: false },
                        { targets: [4], sortable: false }
                    ];
                    const tbl = [];
                    for (let i = 0; i<25; ++i) {
                        tbl.push(this.vdtv_create_row());
                    }
                    vdtv1.set_columns([{title:'Bezeichnung'}, {title:'Nummer'}, {title:'Datum'}, null, null])
                        .set_columnDefs(vdtv1_columnDefs)
                        .set_datatable(tbl);
                }
    
                /*
                        Second Table: no data definition only
                 */
                const vdtv2 = that.shadowRoot.querySelector('#vdtv2');
                if (vdtv2 !== null) {
                    const vdtv2_columnDefs = [
                        { targets: [3], visible: false },
                        { targets: [2], orderData: [3] },
                        { targets: [3, 4], searchable: false },
                        { targets: [4], sortable: false }
                    ];
                    vdtv2.set_columns([{title:'Bezeichnung'}, {title:'Nummer'}, {title:'Datum'}, null, null])
                        .set_columnDefs(vdtv2_columnDefs)
                        .set_datatable([]);
                }
            });
        }
    
        update(changedProperties) {
            changedProperties.forEach((oldValue, propName) => {
                if (propName === "lang") {
                    i18n.changeLanguage(this.lang);
                }
            });
    
            super.update(changedProperties);