npm - @operato/data-grist - Versions diffs - 0.2.19 → 0.2.28 - Mend

@operato/data-grist 0.2.19 → 0.2.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (16) hide show

package/CHANGELOG.md +43 -0
package/custom-elements.json +1129 -1129
package/demo/data-grist-test.html +464 -0
package/dist/src/data-grist.js +1 -2
package/dist/src/data-grist.js.map +1 -1
package/dist/src/data-report.js +14 -5
package/dist/src/data-report.js.map +1 -1
package/dist/src/empty-note.d.ts +2 -2
package/dist/src/empty-note.js +1 -1
package/dist/src/empty-note.js.map +1 -1
package/dist/tsconfig.tsbuildinfo +1 -1
package/package.json +8 -7
package/src/data-grist.ts +1 -2
package/src/data-report.ts +15 -5
package/src/empty-note.ts +1 -1
package/yarn-error.log +3149 -2371

package/demo/data-grist-test.html ADDED Viewed

@@ -0,0 +1,464 @@
+<!DOCTYPE html>
+<html lang="en-GB">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" />
+    <style>
+      body {
+        /* box-sizing: border-box; */
+        margin: 0;
+        padding: 0;
+        overflow: hidden;
+        /* This is a font-stack that tries to use the system-default sans-serifs first */
+        font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
+        line-height: 1.5;
+        -webkit-font-smoothing: antialiased;
+      }
+      #app {
+        width: 100vw;
+        height: 100vh;
+        display: flex;
+        flex-direction: column;
+      }
+      #demo {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+      }
+      grist-demo {
+        flex: 1;
+        overflow: auto;
+      }
+    </style>
+    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
+    <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
+    <link href="/themes/app-theme.css" rel="stylesheet" />
+    <link href="/themes/oops-theme.css" rel="stylesheet" />
+    <link href="/themes/grist-theme.css" rel="stylesheet" />
+  </head>
+  <body>
+    <script type="module">
+      import { LitElement, html, css, render } from 'lit'
+      import '../dist/index.js'
+      import '@operato/popup'
+      import '@material/mwc-icon'
+      const fetchHandler = async ({ page, limit, sorters = [] }) => {
+        var total = 120993
+        var start = (page - 1) * limit
+        await new Promise(resolve => setTimeout(resolve, 500))
+        return {
+          total,
+          records: Array(limit * page > total ? total % limit : limit)
+            .fill()
+            .map((item, idx) => {
+              return {
+                id: idx,
+                name: idx % 2 ? `shnam-${start + idx + 1}` : `heartyoh-${start + idx + 1}`,
+                description: idx % 2 ? `hatiolab manager-${start + idx + 1}` : `hatiosea manager-${start + idx + 1}`,
+                email: idx % 2 ? `shnam-${start + idx + 1}@gmail.com` : `heartyoh-${start + idx + 1}@gmail.com`,
+                active: Math.round(Math.random() * 2) % 2 ? true : false,
+                barcode: idx % 2 ? `1234567890${start + idx + 1}` : `0987654321${start + idx + 1}`,
+                company:
+                  idx % 2
+                    ? {
+                        id: '2',
+                        name: 'HatioLAB',
+                        description: `경기도 성남시-${start + idx + 1}`
+                      }
+                    : {
+                        id: '3',
+                        name: 'HatioSEA',
+                        description: `말레이시아 세티아알람-${start + idx + 1}`
+                      },
+                image:
+                  idx % 2
+                    ? `http://www.hatiolab.com/assets/img/operato-biz3.png`
+                    : `http://www.hatiolab.com/assets/img/thingsboard-30.png`,
+                role: ['admin', 'worker', 'tester'][idx % 3],
+                color: idx % 2 ? `#87f018` : `#180f87`,
+                rate: Math.round(Math.random() * 100),
+                dynamicType: ['text', 'email', 'checkbox', 'color', 'progress', 'barcode'][idx % 5],
+                dynamicValue: ['abcdefghijkl', 'heartyoh@hatiolab.com', 'true', 'orange', '50', '1234567890'][idx % 5],
+                homepage:
+                  idx % 2
+                    ? `http://hatiolab.com/${start + idx + 1}`
+                    : `http://deadpool.hatiolab.com/${start + idx + 1}`,
+                json5: {
+                  abc: 'abc',
+                  value: 123
+                },
+                createdAt: Date.now(),
+                updatedAt: Date.now()
+              }
+            })
+        }
+      }
+      const config = {
+        list: {
+          thumbnail: function (record, rowIndex) {
+            return html` <img src=${record.image} style="width: 100%; height: 100%;" /> `
+          },
+          fields: ['name', 'description'],
+          details: ['role', 'email']
+        },
+        columns: [
+          {
+            type: 'gutter',
+            gutterName: 'dirty'
+          },
+          {
+            type: 'gutter',
+            gutterName: 'sequence'
+          },
+          {
+            type: 'gutter',
+            gutterName: 'row-selector',
+            multiple: true
+          },
+          {
+            type: 'gutter',
+            gutterName: 'button',
+            icon: 'edit',
+            handlers: {
+              click: function () {
+                console.log('clicked')
+              }
+            }
+          },
+          {
+            type: 'string',
+            name: 'id',
+            hidden: true
+          },
+          {
+            type: 'link',
+            name: 'name',
+            label: true,
+            header: 'name',
+            record: {
+              editable: true,
+              options: {
+                // href: 'http://hatiolab.com',
+                href: function (column, record, rowIndex) {
+                  return record['homepage']
+                }
+                // target: '_blank'
+              }
+            },
+            sortable: true,
+            width: 120
+          },
+          {
+            type: 'string',
+            name: 'description',
+            header: 'description',
+            record: {
+              editable: true,
+              align: 'left'
+            },
+            width: 200,
+            handlers: {
+              dblclick: (columns, data, column, record, rowIndex) => {
+                alert(`${column.name} ${record[column.name]}, row : ${rowIndex}`)
+              }
+            }
+          },
+          {
+            type: 'email',
+            name: 'email',
+            label: true,
+            header: 'email',
+            record: {
+              editable: true
+            },
+            sortable: true,
+            width: 130,
+            validation: function (after, before, record, column) {
+              if (after.indexOf('@') == -1) {
+                document.dispatchEvent(
+                  new CustomEvent('notify', {
+                    detail: {
+                      type: 'error',
+                      message: `invalid value - ${after}`
+                    }
+                  })
+                )
+                return false
+              }
+              return true
+            }
+          },
+          {
+            type: 'boolean',
+            name: 'active',
+            header: 'active',
+            record: {
+              editable: true
+            },
+            handlers: {
+              dblclick: () => {
+                const grist = document.querySelector('ox-grist')
+                console.log(grist.dirtyRecords)
+              }
+            },
+            sortable: true,
+            width: 60
+          },
+          {
+            type: 'select',
+            name: 'role',
+            label: true,
+            header: 'role',
+            record: {
+              options: ['admin', 'worker', 'tester'],
+              editable: true
+            },
+            sortable: true,
+            width: 120
+          },
+          {
+            type: 'color',
+            name: 'color',
+            header: 'color',
+            record: {
+              editable: true
+            },
+            sortable: true,
+            width: 50
+          },
+          {
+            type: 'float',
+            name: 'rate',
+            header: 'rate',
+            record: {
+              align: 'right',
+              editable: true
+            },
+            sortable: true,
+            width: 50
+          },
+          {
+            type: 'json5',
+            name: 'json5',
+            header: 'JSON5',
+            width: 200
+          },
+          {
+            type: 'datetime',
+            name: 'updatedAt',
+            header: 'updated at',
+            record: {
+              editable: true
+            },
+            sortable: true,
+            width: 180
+          },
+          {
+            type: 'datetime',
+            name: 'createdAt',
+            header: 'created at',
+            record: {
+              editable: true
+            },
+            sortable: true,
+            width: 180
+          }
+        ],
+        rows: {
+          selectable: {
+            multiple: true
+          },
+          handlers: {
+            click: 'select-row-toggle'
+          },
+          classifier: function (record, rowIndex) {
+            const rate = record['rate']
+            const emphasized =
+              rate < 10 ? ['black', 'white'] : rate < 25 ? ['yellow', 'blue'] : rate < 40 ? ['cyan', 'red'] : undefined
+            return {
+              emphasized
+            }
+          }
+        },
+        sorters: [
+          {
+            name: 'name',
+            desc: true
+          },
+          {
+            name: 'email'
+          }
+        ],
+        pagination: {
+          pages: [20, 30, 50, 100, 200]
+        }
+      }
+      class GristDemo extends LitElement {
+        static styles = [
+          css`
+            :host {
+              display: flex;
+            }
+            ox-grist {
+              flex: 1;
+              overflow-y: auto;
+              --grid-record-emphasized-background-color: red;
+              --grid-record-emphasized-color: yellow;
+            }
+            #headroom {
+              display: flex;
+              flex-direction: column;
+              background-color: var(--primary-color);
+              height: 200px;
+              align-items: center;
+              justify-content: center;
+              color: var(--theme-white-color);
+            }
+            #modes > * {
+              padding: var(--padding-narrow);
+              font-size: 1.5em;
+              opacity: 0.7;
+            }
+            #modes > mwc-icon[active] {
+              border: 1px solid var(--status-warning-color);
+              border-radius: 9px;
+              background-color: rgba(0, 0, 0, 0.3);
+              opacity: 1;
+            }
+            #filters {
+              position: absolute;
+              left: 10px;
+              bottom: 10px;
+              width: calc(100% - 20px);
+            }
+          `
+        ]
+        static get properties() {
+          return {
+            mode: String
+          }
+        }
+        render() {
+          const mode = this.mode || 'CARD'
+          return html`
+            <ox-grist .config=${config} .mode=${mode} auto-fetch .fetchHandler=${fetchHandler}>
+              <div slot="headroom" id="headroom">
+                <h1>HEAD ROOM AREA</h1>
+                <div id="modes">
+                  <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>view_list</mwc-icon>
+                  <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>menu</mwc-icon>
+                  <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</mwc-icon>
+                </div>
+                <div id="tailer">
+                  <a href="./report-test.html">Report Test</a>|
+                  <a
+                    href="#"
+                    @click=${() => {
+                      this.renderRoot.querySelector('ox-grist').reset()
+                    }}
+                    >Reset</a
+                  >|
+                  <a
+                    href="#"
+                    @click=${() => {
+                      this.renderRoot.querySelector('ox-grist').fetch(true)
+                    }}
+                    >Fetch</a
+                  >
+                </div>
+                <div id="filters">
+                  <mwc-icon
+                    @click=${e => {
+                      const target = e.currentTarget
+                      this.renderRoot.querySelector('ox-popup-list').open({
+                        left: target.offsetLeft,
+                        top: target.offsetTop + target.offsetHeight
+                      })
+                    }}
+                    >sort</mwc-icon
+                  >
+                  <mwc-icon
+                    @click=${e => {
+                      const target = e.currentTarget
+                      this.renderRoot.querySelector('ox-popup-list').open({
+                        left: target.offsetLeft,
+                        top: target.offsetTop + target.offsetHeight
+                      })
+                    }}
+                    >more_horiz</mwc-icon
+                  >
+                  <mwc-icon
+                    @click=${e => {
+                      const target = e.currentTarget
+                      this.renderRoot.querySelector('ox-popup-list').open({
+                        left: target.offsetLeft,
+                        top: target.offsetTop + target.offsetHeight
+                      })
+                    }}
+                    >sort</mwc-icon
+                  >
+                  <ox-popup-list alive-on-select>
+                    <div
+                      option
+                      @click=${function (e) {
+                        const icon = e.currentTarget.querySelector('mwc-icon')
+                        icon.innerHTML = icon.innerHTML == 'check' ? '' : 'check'
+                      }}
+                    >
+                      <mwc-icon slot="icon" style="width: 20px;height: 20px;"></mwc-icon>
+                      <span>click me to toggle</span>
+                    </div>
+                    <div
+                      option
+                      @click=${function (e) {
+                        const icon = e.currentTarget.querySelector('mwc-icon')
+                        icon.innerHTML = icon.innerHTML == 'check' ? '' : 'check'
+                      }}
+                    >
+                      <mwc-icon slot="icon" style="width: 20px;height: 20px;"></mwc-icon>
+                      <span>click me to toggle</span>
+                    </div>
+                  </ox-popup-list>
+                </div>
+              </div>
+            </ox-grist>
+          `
+        }
+      }
+      customElements.define('grist-demo', GristDemo)
+      setTimeout(() => {
+        render(html` <grist-demo mode="LIST"></grist-demo> `, document.querySelector('#demo'))
+      })
+    </script>
+    <div id="app">
+      <div id="demo"></div>
+    </div>
+  </body>
+</html>

package/dist/src/data-grist.js CHANGED Viewed

@@ -319,8 +319,7 @@ DataGrist.styles = [
       }
       ox-grid,
-      ox-list,
-      ox-card {
+      ox-list {
         flex: 1;
       }

package/dist/src/data-grist.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-grist.js","sourceRoot":"","sources":["../../src/data-grist.ts"],"names":[],"mappings":"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","sourcesContent":["import './data-grid/data-grid'\nimport './data-list/data-list'\nimport './data-card/data-card'\nimport './empty-note'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property, query, queryAsync, state } from 'lit/decorators.js'\nimport isEmpty from 'lodash-es/isEmpty'\nimport isEqual from 'lodash-es/isEqual'\n\nimport Headroom from '@operato/headroom'\nimport { pulltorefresh } from '@operato/pull-to-refresh'\nimport { HeadroomStyles, ScrollbarStyles, SpinnerStyles } from '@operato/styles'\n\nimport { buildConfig } from './configure/config-builder'\nimport { GristConfig, GristData, GristRecord, ZERO_CONFIG, ZERO_DATA, ZERO_PAGINATION } from './configure/config-types'\nimport { DataCard } from './data-card/data-card'\nimport { DataConsumer, FetchHandler } from './data-consumer'\nimport { DataGrid } from './data-grid/data-grid'\nimport { DataList } from './data-list/data-list'\nimport { DataProvider } from './data-provider'\n\n@customElement('ox-grist')\nexport class DataGrist extends LitElement implements DataConsumer {\n static styles = [\n ScrollbarStyles,\n HeadroomStyles,\n SpinnerStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n background-color: var(--grist-background-color);\n min-height: 120px;\n\n overflow: hidden;\n\n /* for pulltorefresh controller /\n position: relative;\n\n --mdc-icon-size: var(--grid-record-wide-fontsize);\n }\n\n #wrap {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: auto;\n }\n\n ox-grid,\n ox-list,\n ox-card {\n flex: 1;\n }\n\n ox-empty-note {\n display: block;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n\n slot[name='headroom'] {\n display: block;\n\n position: absolute;\n top: 0;\n left: 0;\n\n width: 100%;\n box-sizing: border-box;\n }\n `\n ]\n\n @property() mode: string = 'GRID'\n @property() config: any\n @property() data: GristData = ZERO_DATA\n @property() selectedRecords?: GristRecord[]\n @property({ type: Boolean, attribute: 'auto-fetch' }) autoFetch: boolean = false\n @property() fetchHandler?: FetchHandler\n @property() fetchOptions: any\n\n @state() _data: GristData = ZERO_DATA\n @state() _config: GristConfig = ZERO_CONFIG\n @state() private _showSpinner: boolean = false\n\n private dataProvider?: DataProvider\n private pulltorefreshHandle?: any\n private headroom?: Headroom\n\n @query('slot[name=headroom]') head!: HTMLElement\n @query('#grist') grist!: DataGrid \| DataList \| DataCard\n @queryAsync('#wrap') private wrap!: Promise<HTMLElement>\n\n connectedCallback() {\n super.connectedCallback()\n\n this.dataProvider = new DataProvider(this)\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n\n this.dataProvider?.dispose()\n this.resetPullToRefresh()\n }\n\n private resetPullToRefresh() {\n if (this.pulltorefreshHandle) {\n this.pulltorefreshHandle()\n delete this.pulltorefreshHandle\n }\n }\n\n private async setPullToRefresh() {\n this.resetPullToRefresh()\n if (this.fetchHandler) {\n this.pulltorefreshHandle = pulltorefresh({\n container: await this.wrap,\n scrollable: this.grist.pullToRefreshTarget,\n refresh: () => {\n return this.fetch(true)\n }\n })\n }\n }\n\n setHeadroom() {\n this.headroom?.destroy()\n\n if (this.grist && this.head) {\n var originPaddingTop = parseFloat(getComputedStyle(this.grist, null).getPropertyValue('padding-top'))\n this.grist.style.paddingTop = this.head.clientHeight + originPaddingTop + 'px'\n\n this.headroom = new Headroom(this.head, {\n scroller: this.grist\n })\n this.headroom.init()\n }\n }\n\n render() {\n var oops = !this._showSpinner && this._data.records.length == 0\n\n return html`\n ${oops\n ? html`\n <ox-empty-note\n icon=\"list\"\n title=\"EMPTY LIST\"\n description=\"There are no records to be shown\"\n ></ox-empty-note>\n `\n : html``}\n <div id=\"wrap\">\n ${this.mode == 'GRID'\n ? html` <ox-grid id=\"grist\" .config=${this._config} .data=${this._data}> </ox-grid> `\n : this.mode == 'CARD'\n ? html` <ox-card id=\"grist\" .config=${this._config} .data=${this._data}> </ox-card> `\n : html` <ox-list id=\"grist\" .config=${this._config} .data=${this._data}> </ox-list> `}\n </div>\n\n <div id=\"spinner\" ?show=${this._showSpinner}></div>\n\n <slot name=\"headroom\"> </slot>\n `\n }\n\n async fetch(reset = true) {\n if (!this._config) {\n / avoid to be here /\n console.warn('grist is not configured yet.')\n return\n }\n\n if (reset && this.grist) {\n /\n * scroll 의 현재위치에 의해서 scroll 이벤트가 발생할 수 있으므로, 이를 방지하기 위해서 스크롤의 위치를 TOP으로 옮긴다.\n * (scroll 이 첫페이지 크기 이상으로 내려가 있는 경우, 첫페이지부터 다시 표시하는 경우에, scroll 이벤트가 발생한다.)\n /\n this.grist.scrollTop = 0\n }\n\n if (this.dataProvider) {\n let { limit: initLimit, page: initPage, infinite } = this._config.pagination \|\| {}\n let { limit = initLimit \|\| ZERO_PAGINATION.limit, page = initPage \|\| ZERO_PAGINATION.page } = this.dataProvider\n let { sorters } = this._config\n\n if (infinite \|\| this.mode !== 'GRID') {\n await this.dataProvider.attach(reset)\n } else {\n await this.dataProvider.fetch({\n limit,\n page,\n sorters\n })\n }\n }\n }\n\n async updated(changes: PropertyValues<this>) {\n var needToSetPullToRefresh = false\n\n if (changes.has('config')) {\n this._config = buildConfig({\n ...this.config\n })\n\n this.dataProvider && (this.dataProvider.sorters = this._config.sorters)\n this.fetch()\n }\n\n if (changes.has('fetchHandler')) {\n this.dataProvider && (this.dataProvider.fetchHandler = this.fetchHandler)\n needToSetPullToRefresh = true\n }\n\n if (changes.has('fetchOptions')) {\n this.dataProvider && (this.dataProvider.fetchOptions = this.fetchOptions)\n }\n\n if (changes.has('data')) {\n this.reset()\n }\n\n if (changes.has('mode')) {\n needToSetPullToRefresh = true\n this.setHeadroom()\n }\n\n if (changes.has('selectedRecords')) {\n var { records } = this.data \|\| []\n var selectedRecords = this.selectedRecords \|\| []\n\n var _records = this._data.records\n\n / 원본데이타에서 index를 찾아서, 복사본 데이타의 selected를 설정한다. /\n selectedRecords.forEach(selected => {\n var index = records.indexOf(selected)\n var record = _records[index]\n if (record) {\n record['__selected__'] = true\n }\n })\n\n / update _data property intentionally /\n this.refresh()\n }\n\n if (needToSetPullToRefresh) {\n await this.setPullToRefresh()\n }\n }\n\n get dirtyData(): GristData {\n return (this.grist as any)?.data \|\| {}\n }\n\n get dirtyRecords() {\n var { records = [] } = this.dirtyData\n return records.filter(record => record['__dirty__'])\n }\n\n exportPatchList({ flagName = 'patchFlag', addedFlag = '+', deletedFlag = '-', modifiedFlag = 'M', idField = 'id' }) {\n let dirtyRecords = this.dirtyRecords\n if (!dirtyRecords \|\| dirtyRecords.length == 0) {\n return []\n }\n\n return dirtyRecords.map(record => {\n let flag = record.__dirty__\n\n let patch = {\n [flagName]: flag == 'M' ? modifiedFlag : flag == '+' ? addedFlag : deletedFlag\n }\n\n if (idField in record && record[idField]) {\n patch[idField] = record[idField]\n }\n\n for (let key in record.__dirtyfields__) {\n patch[key] = record[key]\n }\n return patch\n })\n }\n\n exportRecords({ ifSelectedOnly = true, includeHiddenField = true } = {}) {\n let records = ifSelectedOnly ? this.selected : this.data.records\n\n if (ifSelectedOnly && (!records \|\| records.length == 0)) {\n records = this.data.records\n }\n\n let columns = this._config.columns.filter(column => column.type !== 'gutter')\n if (!includeHiddenField) {\n columns = columns.filter(column => !column.hidden)\n }\n let columnNames = columns.map(column => column.name)\n\n return records.map(item => {\n return columnNames.reduce((record, name) => {\n record[name] = item[name]\n return record\n }, {} as any)\n })\n }\n\n get selected() {\n var { records = [] } = this.grist?.data\n return records.filter(record => record['__selected__'])\n }\n\n showSpinner() {\n this._showSpinner = true\n }\n\n hideSpinner() {\n this._showSpinner = false\n }\n\n focus() {\n super.focus()\n\n this.grist.focus()\n }\n\n commit() {\n var { page, total, limit, records } = this.grist.data\n\n this.data = {\n page,\n total,\n limit,\n records: records.map(record => {\n var copied = {\n ...record\n }\n\n delete copied.__seq__\n delete copied.__dirty__\n delete copied.__selected__\n delete copied.__changes__\n delete copied.__dirtyfields__\n delete copied.__origin__\n\n return copied\n })\n }\n }\n\n /\n Forced internal data to be reflected on the screen\n * Data changing through a normal method is automatically reflected on the screen, so it is a method that does not need to be used in general.\nTherefore, it will be deprecated.\n * @deprecated\n * @method\n /\n refresh() {\n this._data = { ...this._data }\n }\n\n /\n This method cancels all changes in the dirty state before being reflected in the data.\n \n @method\n /\n reset() {\n var {\n limit = ZERO_PAGINATION.limit,\n page = ZERO_PAGINATION.page,\n total = ZERO_PAGINATION.total,\n records = []\n } = this.data\n\n / 원본 데이타를 남기고, 복사본(_data)을 사용한다. /\n records = records.map((record, idx) => {\n return {\n ...record,\n __seq__: this.mode == 'GRID' ? (page - 1) limit + idx + 1 : idx + 1,\n __origin__: record\n }\n })\n\n this._data = {\n limit,\n page,\n total,\n records\n }\n }\n\n checkDirties() {\n const records = this.dirtyRecords\n const { columns = [] } = this._config \|\| {}\n\n for (var record of records \|\| []) {\n var origin = record['__origin__'] \|\| {}\n\n var dirtyFields = (record['__dirtyfields__'] = columns\n .filter(column => column.type !== 'gutter' && !isEqual(origin[column.name], record[column.name]))\n .reduce((sum, column) => {\n var name = column.name\n\n sum[name] = {\n before: origin[name],\n after: record[name]\n }\n\n return sum\n }, {} as any))\n\n if (record['__dirty__'] == 'M' && isEmpty(dirtyFields)) {\n delete record['__dirty__']\n }\n }\n }\n}\n"]}
1	+ {"version":3,"file":"data-grist.js","sourceRoot":"","sources":["../../src/data-grist.ts"],"names":[],"mappings":"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","sourcesContent":["import './data-grid/data-grid'\nimport './data-list/data-list'\nimport './data-card/data-card'\nimport './empty-note'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property, query, queryAsync, state } from 'lit/decorators.js'\nimport isEmpty from 'lodash-es/isEmpty'\nimport isEqual from 'lodash-es/isEqual'\n\nimport Headroom from '@operato/headroom'\nimport { pulltorefresh } from '@operato/pull-to-refresh'\nimport { HeadroomStyles, ScrollbarStyles, SpinnerStyles } from '@operato/styles'\n\nimport { buildConfig } from './configure/config-builder'\nimport { GristConfig, GristData, GristRecord, ZERO_CONFIG, ZERO_DATA, ZERO_PAGINATION } from './configure/config-types'\nimport { DataCard } from './data-card/data-card'\nimport { DataConsumer, FetchHandler } from './data-consumer'\nimport { DataGrid } from './data-grid/data-grid'\nimport { DataList } from './data-list/data-list'\nimport { DataProvider } from './data-provider'\n\n@customElement('ox-grist')\nexport class DataGrist extends LitElement implements DataConsumer {\n static styles = [\n ScrollbarStyles,\n HeadroomStyles,\n SpinnerStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n background-color: var(--grist-background-color);\n min-height: 120px;\n\n overflow: hidden;\n\n /* for pulltorefresh controller /\n position: relative;\n\n --mdc-icon-size: var(--grid-record-wide-fontsize);\n }\n\n #wrap {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: auto;\n }\n\n ox-grid,\n ox-list {\n flex: 1;\n }\n\n ox-empty-note {\n display: block;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n\n slot[name='headroom'] {\n display: block;\n\n position: absolute;\n top: 0;\n left: 0;\n\n width: 100%;\n box-sizing: border-box;\n }\n `\n ]\n\n @property() mode: string = 'GRID'\n @property() config: any\n @property() data: GristData = ZERO_DATA\n @property() selectedRecords?: GristRecord[]\n @property({ type: Boolean, attribute: 'auto-fetch' }) autoFetch: boolean = false\n @property() fetchHandler?: FetchHandler\n @property() fetchOptions: any\n\n @state() _data: GristData = ZERO_DATA\n @state() _config: GristConfig = ZERO_CONFIG\n @state() private _showSpinner: boolean = false\n\n private dataProvider?: DataProvider\n private pulltorefreshHandle?: any\n private headroom?: Headroom\n\n @query('slot[name=headroom]') head!: HTMLElement\n @query('#grist') grist!: DataGrid \| DataList \| DataCard\n @queryAsync('#wrap') private wrap!: Promise<HTMLElement>\n\n connectedCallback() {\n super.connectedCallback()\n\n this.dataProvider = new DataProvider(this)\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n\n this.dataProvider?.dispose()\n this.resetPullToRefresh()\n }\n\n private resetPullToRefresh() {\n if (this.pulltorefreshHandle) {\n this.pulltorefreshHandle()\n delete this.pulltorefreshHandle\n }\n }\n\n private async setPullToRefresh() {\n this.resetPullToRefresh()\n if (this.fetchHandler) {\n this.pulltorefreshHandle = pulltorefresh({\n container: await this.wrap,\n scrollable: this.grist.pullToRefreshTarget,\n refresh: () => {\n return this.fetch(true)\n }\n })\n }\n }\n\n setHeadroom() {\n this.headroom?.destroy()\n\n if (this.grist && this.head) {\n var originPaddingTop = parseFloat(getComputedStyle(this.grist, null).getPropertyValue('padding-top'))\n this.grist.style.paddingTop = this.head.clientHeight + originPaddingTop + 'px'\n\n this.headroom = new Headroom(this.head, {\n scroller: this.grist\n })\n this.headroom.init()\n }\n }\n\n render() {\n var oops = !this._showSpinner && this._data.records.length == 0\n\n return html`\n ${oops\n ? html`\n <ox-empty-note\n icon=\"list\"\n title=\"EMPTY LIST\"\n description=\"There are no records to be shown\"\n ></ox-empty-note>\n `\n : html``}\n <div id=\"wrap\">\n ${this.mode == 'GRID'\n ? html` <ox-grid id=\"grist\" .config=${this._config} .data=${this._data}> </ox-grid> `\n : this.mode == 'CARD'\n ? html` <ox-card id=\"grist\" .config=${this._config} .data=${this._data}> </ox-card> `\n : html` <ox-list id=\"grist\" .config=${this._config} .data=${this._data}> </ox-list> `}\n </div>\n\n <div id=\"spinner\" ?show=${this._showSpinner}></div>\n\n <slot name=\"headroom\"> </slot>\n `\n }\n\n async fetch(reset = true) {\n if (!this._config) {\n / avoid to be here /\n console.warn('grist is not configured yet.')\n return\n }\n\n if (reset && this.grist) {\n /\n * scroll 의 현재위치에 의해서 scroll 이벤트가 발생할 수 있으므로, 이를 방지하기 위해서 스크롤의 위치를 TOP으로 옮긴다.\n * (scroll 이 첫페이지 크기 이상으로 내려가 있는 경우, 첫페이지부터 다시 표시하는 경우에, scroll 이벤트가 발생한다.)\n /\n this.grist.scrollTop = 0\n }\n\n if (this.dataProvider) {\n let { limit: initLimit, page: initPage, infinite } = this._config.pagination \|\| {}\n let { limit = initLimit \|\| ZERO_PAGINATION.limit, page = initPage \|\| ZERO_PAGINATION.page } = this.dataProvider\n let { sorters } = this._config\n\n if (infinite \|\| this.mode !== 'GRID') {\n await this.dataProvider.attach(reset)\n } else {\n await this.dataProvider.fetch({\n limit,\n page,\n sorters\n })\n }\n }\n }\n\n async updated(changes: PropertyValues<this>) {\n var needToSetPullToRefresh = false\n\n if (changes.has('config')) {\n this._config = buildConfig({\n ...this.config\n })\n\n this.dataProvider && (this.dataProvider.sorters = this._config.sorters)\n this.fetch()\n }\n\n if (changes.has('fetchHandler')) {\n this.dataProvider && (this.dataProvider.fetchHandler = this.fetchHandler)\n needToSetPullToRefresh = true\n }\n\n if (changes.has('fetchOptions')) {\n this.dataProvider && (this.dataProvider.fetchOptions = this.fetchOptions)\n }\n\n if (changes.has('data')) {\n this.reset()\n }\n\n if (changes.has('mode')) {\n needToSetPullToRefresh = true\n this.setHeadroom()\n }\n\n if (changes.has('selectedRecords')) {\n var { records } = this.data \|\| []\n var selectedRecords = this.selectedRecords \|\| []\n\n var _records = this._data.records\n\n / 원본데이타에서 index를 찾아서, 복사본 데이타의 selected를 설정한다. /\n selectedRecords.forEach(selected => {\n var index = records.indexOf(selected)\n var record = _records[index]\n if (record) {\n record['__selected__'] = true\n }\n })\n\n / update _data property intentionally /\n this.refresh()\n }\n\n if (needToSetPullToRefresh) {\n await this.setPullToRefresh()\n }\n }\n\n get dirtyData(): GristData {\n return (this.grist as any)?.data \|\| {}\n }\n\n get dirtyRecords() {\n var { records = [] } = this.dirtyData\n return records.filter(record => record['__dirty__'])\n }\n\n exportPatchList({ flagName = 'patchFlag', addedFlag = '+', deletedFlag = '-', modifiedFlag = 'M', idField = 'id' }) {\n let dirtyRecords = this.dirtyRecords\n if (!dirtyRecords \|\| dirtyRecords.length == 0) {\n return []\n }\n\n return dirtyRecords.map(record => {\n let flag = record.__dirty__\n\n let patch = {\n [flagName]: flag == 'M' ? modifiedFlag : flag == '+' ? addedFlag : deletedFlag\n }\n\n if (idField in record && record[idField]) {\n patch[idField] = record[idField]\n }\n\n for (let key in record.__dirtyfields__) {\n patch[key] = record[key]\n }\n return patch\n })\n }\n\n exportRecords({ ifSelectedOnly = true, includeHiddenField = true } = {}) {\n let records = ifSelectedOnly ? this.selected : this.data.records\n\n if (ifSelectedOnly && (!records \|\| records.length == 0)) {\n records = this.data.records\n }\n\n let columns = this._config.columns.filter(column => column.type !== 'gutter')\n if (!includeHiddenField) {\n columns = columns.filter(column => !column.hidden)\n }\n let columnNames = columns.map(column => column.name)\n\n return records.map(item => {\n return columnNames.reduce((record, name) => {\n record[name] = item[name]\n return record\n }, {} as any)\n })\n }\n\n get selected() {\n var { records = [] } = this.grist?.data\n return records.filter(record => record['__selected__'])\n }\n\n showSpinner() {\n this._showSpinner = true\n }\n\n hideSpinner() {\n this._showSpinner = false\n }\n\n focus() {\n super.focus()\n\n this.grist.focus()\n }\n\n commit() {\n var { page, total, limit, records } = this.grist.data\n\n this.data = {\n page,\n total,\n limit,\n records: records.map(record => {\n var copied = {\n ...record\n }\n\n delete copied.__seq__\n delete copied.__dirty__\n delete copied.__selected__\n delete copied.__changes__\n delete copied.__dirtyfields__\n delete copied.__origin__\n\n return copied\n })\n }\n }\n\n /\n Forced internal data to be reflected on the screen\n * Data changing through a normal method is automatically reflected on the screen, so it is a method that does not need to be used in general.\nTherefore, it will be deprecated.\n * @deprecated\n * @method\n /\n refresh() {\n this._data = { ...this._data }\n }\n\n /\n This method cancels all changes in the dirty state before being reflected in the data.\n \n @method\n /\n reset() {\n var {\n limit = ZERO_PAGINATION.limit,\n page = ZERO_PAGINATION.page,\n total = ZERO_PAGINATION.total,\n records = []\n } = this.data\n\n / 원본 데이타를 남기고, 복사본(_data)을 사용한다. /\n records = records.map((record, idx) => {\n return {\n ...record,\n __seq__: this.mode == 'GRID' ? (page - 1) limit + idx + 1 : idx + 1,\n __origin__: record\n }\n })\n\n this._data = {\n limit,\n page,\n total,\n records\n }\n }\n\n checkDirties() {\n const records = this.dirtyRecords\n const { columns = [] } = this._config \|\| {}\n\n for (var record of records \|\| []) {\n var origin = record['__origin__'] \|\| {}\n\n var dirtyFields = (record['__dirtyfields__'] = columns\n .filter(column => column.type !== 'gutter' && !isEqual(origin[column.name], record[column.name]))\n .reduce((sum, column) => {\n var name = column.name\n\n sum[name] = {\n before: origin[name],\n after: record[name]\n }\n\n return sum\n }, {} as any))\n\n if (record['__dirty__'] == 'M' && isEmpty(dirtyFields)) {\n delete record['__dirty__']\n }\n }\n }\n}\n"]}

package/dist/src/data-report.js CHANGED Viewed

@@ -1,13 +1,13 @@
 import { __decorate } from "tslib";
 import './data-report/data-report-component';
 import { ZERO_CONFIG, ZERO_DATA, ZERO_PAGINATION } from './configure/config-types';
-import { ScrollbarStyles } from '@operato/styles';
 import { LitElement, css, html } from 'lit';
+import { ScrollbarStyles, SpinnerStyles } from '@operato/styles';
 import { customElement, property, query, queryAsync, state } from 'lit/decorators.js';
 import { DataProvider } from './data-provider';
-import { SpinnerStyles } from '@operato/styles';
 import { buildColumn } from './configure/column-builder';
 import { buildConfig } from './configure/config-builder';
+import i18next from 'i18next';
 import { pulltorefresh } from '@operato/pull-to-refresh';
 let DataReport = class DataReport extends LitElement {
     constructor() {
@@ -153,7 +153,14 @@ let DataReport = class DataReport extends LitElement {
         var getColumnIndex = (name) => columns.filter(column => !column.hidden).findIndex(column => column.name == name);
         var groupFieldsForTotalRecord = [
             /* add a group total record to the front. */
-            { column: '*', title: 'grand total', align: 'right', rowspan: 1 },
+            {
+                column: '*',
+                title: i18next.exists('text.ox-data-report-grand-total')
+                    ? i18next.t('text.ox-data-report-grand-total')
+                    : 'grand total',
+                align: 'right',
+                rowspan: 1
+            },
             ...groups
         ].map(group => {
             return {
@@ -168,7 +175,7 @@ let DataReport = class DataReport extends LitElement {
         let lastGroupValues;
         let reportRecords = [];
         let totalicRecords = sortedRecords[0]
-            ? (function () {
+            ? (() => {
                 /* 처음 만드는 total records */
                 let record = sortedRecords[0];
                 let totalBase = totals.reduce((base, field) => {
@@ -202,7 +209,9 @@ let DataReport = class DataReport extends LitElement {
                 {
                     '*': {
                         titleColumn: groupFieldsForTotalRecord[0].titleColumn,
-                        value: 'grand total',
+                        value: i18next.exists('text.ox-data-report-grand-total')
+                            ? i18next.t('text.ox-data-report-grand-total')
+                            : 'grand total',
                         groupName: '*',
                         row: 1,
                         rowspan: 1,