diff --git a/packages/data-table-view/assets/index.html b/packages/data-table-view/assets/index.html
index 9ea51a4c33236e678178987eb3b3b23ac1951023..512fd934ab5f5399c9e58f098f5b5beba26eecab 100644
--- a/packages/data-table-view/assets/index.html
+++ b/packages/data-table-view/assets/index.html
@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
- <script type="module" id="vpu-data-table-view-src" src="vpu-data-table-view.js"></script>
+ <script type="module" id="vpu-data-table-view-src" src="vpu-data-table-view-demo.js"></script>
</head>
<body>
diff --git a/packages/data-table-view/package.json b/packages/data-table-view/package.json
index 4e683780959264f6ddd06bce76ecd9a7d2675c88..8a50aa1333355f5097a431a2180642b4f2c4a775 100644
--- a/packages/data-table-view/package.json
+++ b/packages/data-table-view/package.json
@@ -1,7 +1,7 @@
{
"name": "vpu-data-table-view",
"version": "1.0.0",
- "main": "src/index.js",
+ "main": "src/vpu-data-table-view.js",
"devDependencies": {
"karma": "^4.2.0",
"karma-chai": "^0.1.0",
diff --git a/packages/data-table-view/rollup.config.js b/packages/data-table-view/rollup.config.js
index 60191dec50c6b66c9c8eecc02ca62aa5c811d6e8..200cf882e4a28af2da4b2d5690f7099deb728ed1 100644
--- a/packages/data-table-view/rollup.config.js
+++ b/packages/data-table-view/rollup.config.js
@@ -11,41 +11,19 @@ import url from "rollup-plugin-url";
import consts from 'rollup-plugin-consts';
import del from 'rollup-plugin-delete'
-
const pkg = require('./package.json');
const build = (typeof process.env.BUILD !== 'undefined') ? process.env.BUILD : 'local';
console.log("build: " + build);
-let manualChunks = Object.keys(pkg.dependencies).reduce(function (acc, item) { acc[item] = [item]; return acc;}, {});
-manualChunks = Object.keys(pkg.devDependencies).reduce(function (acc, item) { if (item.startsWith('vpu-')) acc[item] = [item]; return acc;}, manualChunks);
-
-function getBuildInfo() {
- const child_process = require('child_process');
- const url = require('url');
-
- let remote = child_process.execSync('git config --get remote.origin.url').toString().trim();
- let commit = child_process.execSync('git rev-parse --short HEAD').toString().trim();
-
- let parsed = url.parse(remote);
- let newPath = parsed.path.slice(0, parsed.path.lastIndexOf('.'))
- let newUrl = parsed.protocol + '//' + parsed.host + newPath + '/commit/' + commit;
-
- return {
- info: commit,
- url: newUrl,
- env: build
- }
-}
-
export default {
- input: (build !== 'test') ? 'src/demo.js' : 'test/**/*.js',
+ input: (build != 'test') ? ['src/vpu-data-table-view.js', 'src/vpu-data-table-view-demo.js'] : 'test/**/*.js',
output: {
dir: 'dist',
- entryFileNames: pkg.name + '.js',
+ entryFileNames: '[name].js',
chunkFileNames: 'shared/[name].[hash].[format].js',
- format: 'esm'
+ format: 'esm',
+ sourcemap: true
},
- manualChunks: manualChunks,
onwarn: function (warning, warn) {
// ignore "suggestions" warning re "use strict"
if (warning.code === 'MODULE_LEVEL_DIRECTIVE') {
@@ -63,7 +41,6 @@ export default {
(build == 'test') ? multiEntry() : false,
consts({
environment: build,
- buildinfo: getBuildInfo(),
}),
resolve({
customResolveOptions: {
diff --git a/packages/data-table-view/src/demo.js b/packages/data-table-view/src/demo.js
index e16e6cba70dc0043d93abd521b853fbead2cb914..b40093091475aca01a0c77faaaebb9a9dcd73d8b 100644
--- a/packages/data-table-view/src/demo.js
+++ b/packages/data-table-view/src/demo.js
@@ -1,164 +1 @@
-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';
-import bulmaCSSPath from "bulma/css/bulma.min.css";
-
-class DataTableViewDemo extends LitElement {
- constructor() {
- super();
- this.lang = 'de';
- this.noAuth = false;
- }
-
- static get properties() {
- return {
- lang: { type: String },
- noAuth: { type: Boolean, attribute: 'no-auth' },
- };
- }
-
- 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);
- }
-
- vdtv_create_row() {
- const str = Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0, 5);
- const day = Math.floor(Math.random()*(31-1) + 1);
- const month = Math.floor(Math.random()*(12-1) + 1);
- const year = Math.floor(Math.random()*(2019-2016) + 2016);
- return [
- str,
- Math.floor(1000 * Math.random()),
- '' + day + '.' + month + '.' + year,
- '' + year + '-' + month + '-' + day,
- '<button onclick="alert(\'' + str + ' clicked\');">OK</button>'
- ];
- }
-
- vdtv2_add_rows() {
- console.log('vdtv2_add_rows() clicked');
- const vdtv2 = this.shadowRoot.querySelector('#vdtv2');
- if (vdtv2 !== null) {
- const row = this.vdtv_create_row();
- vdtv2.add_row(row).draw();
- }
- }
-
- getAuthComponentHtml() {
- return this.noAuth ? html`` : html`
- <div class="content">
- <vpu-auth lang="${this.lang}" client-id="${setting('keyCloakClientId')}" load-person force-login></vpu-auth>
- </div>
- `;
- }
-
- render() {
- commonUtils.initAssetBaseURL('vpu-data-table-view-src');
- const bulmaCSS = commonUtils.getAssetURL(bulmaCSSPath);
- return html`
- <link rel="stylesheet" href="${bulmaCSS}">
- <style>
- .box {
- margin: 10px;
- padding: 10px;
- border: 1px solid orange;
- }
- </style>
-
- <section class="section">
- <div class="content">
- <h1 class="title">DataTableView-Demo</h1>
- </div>
- ${this.getAuthComponentHtml()}
- <div class="content">
- <h4>DataTable: with data, paging and searching</h4>
- <div class="box">
- <vpu-data-table-view lang="${this.lang}" paging searching id="vdtv1"></vpu-data-table-view>
- </div>
- <h4>DataTable: no data, no paging, no searching</h4>
- <div class="box">
- <button @click="${this.vdtv2_add_rows}">noch etwas...</button>
- <vpu-data-table-view lang="${this.lang}" id="vdtv2"></vpu-data-table-view>
- </div>
- </div>
- <div class="content">
- <h4>Common Table</h4>
- <div class="box">
- <!-- <vpu-data-table-view lang="${this.lang}" paging searching> -->
- <table class="display">
- <thead>
- <tr>
- <th>A</th>
- <th>B</th>
- <th>C</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>abc</td>
- <td>123</td>
- <td>a-2-4-g</td>
- </tr>
- </tbody>
- </table>
- <!-- </vpu-data-table-view> -->
- </div>
- </div>
- </section>
- `;
- }
-}
-
-commonUtils.defineCustomElement('vpu-data-table-view-demo', DataTableViewDemo);
+import './vpu-data-table-view-demo.js';
\ No newline at end of file
diff --git a/packages/data-table-view/src/index.js b/packages/data-table-view/src/index.js
deleted file mode 100644
index a9852e899feccefbf29caf14ed509e14ec966fc5..0000000000000000000000000000000000000000
--- a/packages/data-table-view/src/index.js
+++ /dev/null
@@ -1 +0,0 @@
-import './data-table-view.js';
\ No newline at end of file
diff --git a/packages/data-table-view/src/vpu-data-table-view-demo.js b/packages/data-table-view/src/vpu-data-table-view-demo.js
new file mode 100644
index 0000000000000000000000000000000000000000..c3de4f64f70a63703e2bcc1e475a1520f823a293
--- /dev/null
+++ b/packages/data-table-view/src/vpu-data-table-view-demo.js
@@ -0,0 +1,164 @@
+import 'vpu-auth';
+import './vpu-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';
+import bulmaCSSPath from "bulma/css/bulma.min.css";
+
+class DataTableViewDemo extends LitElement {
+ constructor() {
+ super();
+ this.lang = 'de';
+ this.noAuth = false;
+ }
+
+ static get properties() {
+ return {
+ lang: { type: String },
+ noAuth: { type: Boolean, attribute: 'no-auth' },
+ };
+ }
+
+ 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);
+ }
+
+ vdtv_create_row() {
+ const str = Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0, 5);
+ const day = Math.floor(Math.random()*(31-1) + 1);
+ const month = Math.floor(Math.random()*(12-1) + 1);
+ const year = Math.floor(Math.random()*(2019-2016) + 2016);
+ return [
+ str,
+ Math.floor(1000 * Math.random()),
+ '' + day + '.' + month + '.' + year,
+ '' + year + '-' + month + '-' + day,
+ '<button onclick="alert(\'' + str + ' clicked\');">OK</button>'
+ ];
+ }
+
+ vdtv2_add_rows() {
+ console.log('vdtv2_add_rows() clicked');
+ const vdtv2 = this.shadowRoot.querySelector('#vdtv2');
+ if (vdtv2 !== null) {
+ const row = this.vdtv_create_row();
+ vdtv2.add_row(row).draw();
+ }
+ }
+
+ getAuthComponentHtml() {
+ return this.noAuth ? html`` : html`
+ <div class="content">
+ <vpu-auth lang="${this.lang}" client-id="${setting('keyCloakClientId')}" load-person force-login></vpu-auth>
+ </div>
+ `;
+ }
+
+ render() {
+ commonUtils.initAssetBaseURL('vpu-data-table-view-src');
+ const bulmaCSS = commonUtils.getAssetURL(bulmaCSSPath);
+ return html`
+ <link rel="stylesheet" href="${bulmaCSS}">
+ <style>
+ .box {
+ margin: 10px;
+ padding: 10px;
+ border: 1px solid orange;
+ }
+ </style>
+
+ <section class="section">
+ <div class="content">
+ <h1 class="title">DataTableView-Demo</h1>
+ </div>
+ ${this.getAuthComponentHtml()}
+ <div class="content">
+ <h4>DataTable: with data, paging and searching</h4>
+ <div class="box">
+ <vpu-data-table-view lang="${this.lang}" paging searching id="vdtv1"></vpu-data-table-view>
+ </div>
+ <h4>DataTable: no data, no paging, no searching</h4>
+ <div class="box">
+ <button @click="${this.vdtv2_add_rows}">noch etwas...</button>
+ <vpu-data-table-view lang="${this.lang}" id="vdtv2"></vpu-data-table-view>
+ </div>
+ </div>
+ <div class="content">
+ <h4>Common Table</h4>
+ <div class="box">
+ <!-- <vpu-data-table-view lang="${this.lang}" paging searching> -->
+ <table class="display">
+ <thead>
+ <tr>
+ <th>A</th>
+ <th>B</th>
+ <th>C</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>abc</td>
+ <td>123</td>
+ <td>a-2-4-g</td>
+ </tr>
+ </tbody>
+ </table>
+ <!-- </vpu-data-table-view> -->
+ </div>
+ </div>
+ </section>
+ `;
+ }
+}
+
+commonUtils.defineCustomElement('vpu-data-table-view-demo', DataTableViewDemo);
diff --git a/packages/data-table-view/src/data-table-view.js b/packages/data-table-view/src/vpu-data-table-view.js
similarity index 100%
rename from packages/data-table-view/src/data-table-view.js
rename to packages/data-table-view/src/vpu-data-table-view.js