npm - @things-factory/organization - Versions diffs - 7.0.52 → 7.0.56 - Mend

@things-factory/organization 7.0.52 → 7.0.56

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 (83) hide show

package/dist-client/pages/department/department-tree-page.js CHANGED Viewed

@@ -13,8 +13,8 @@ import gql from 'graphql-tag';
 import { DepartmentImporter } from './department-importer';
 import { Department } from '../../types/department';
 import { DepartmentView } from '../../component/department-view';
-const departmentFragment = gql `
-  fragment departmentFragment on Department {
+const SubDepartmentFragment = gql `
+  fragment SubDepartmentFragment on Department {
     id
     controlNo
     name
@@ -129,11 +129,11 @@ let DepartmentTreePage = class DepartmentTreePage extends connect(store)(localiz
             mutation: gql `
         mutation ($department: NewDepartment!) {
           createDepartment(department: $department) {
-            ...departmentFragment
+            ...SubDepartmentFragment
           }
         }
-        ${departmentFragment}
+        ${SubDepartmentFragment}
       `,
             variables: {
                 department
@@ -171,11 +171,11 @@ let DepartmentTreePage = class DepartmentTreePage extends connect(store)(localiz
             mutation: gql `
         mutation ($id: String!, $patch: DepartmentPatch!) {
           updateDepartment(id: $id, patch: $patch) {
-            ...departmentFragment
+            ...SubDepartmentFragment
           }
         }
-        ${departmentFragment}
+        ${SubDepartmentFragment}
       `,
             variables: {
                 id,
@@ -241,21 +241,21 @@ let DepartmentTreePage = class DepartmentTreePage extends connect(store)(localiz
           responses: departmentRoots {
             total
             items {
-              ...departmentFragment
+              ...SubDepartmentFragment
               children {
-                ...departmentFragment
+                ...SubDepartmentFragment
                 children {
-                  ...departmentFragment
+                  ...SubDepartmentFragment
                   children {
-                    ...departmentFragment
+                    ...SubDepartmentFragment
                     children {
-                      ...departmentFragment
+                      ...SubDepartmentFragment
                       children {
-                        ...departmentFragment
+                        ...SubDepartmentFragment
                         children {
-                          ...departmentFragment
+                          ...SubDepartmentFragment
                           children {
-                            ...departmentFragment
+                            ...SubDepartmentFragment
                           }
                         }
                       }
@@ -267,7 +267,7 @@ let DepartmentTreePage = class DepartmentTreePage extends connect(store)(localiz
           }
         }
-        ${departmentFragment}
+        ${SubDepartmentFragment}
       `
         });
         const { items: records, total } = response.data.responses;

package/dist-client/pages/department/department-tree-page.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"department-tree-page.js","sourceRoot":"","sources":["../../../client/pages/department/department-tree-page.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/data-tree'\nimport '@operato/context/ox-context-page-toolbar.js'\n\nimport { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'\nimport { CustomAlert, PageView, store } from '@operato/shell'\nimport { css, html } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\n\nimport { connect } from 'pwa-helpers/connect-mixin'\nimport gql from 'graphql-tag'\n\nimport { DepartmentImporter } from './department-importer'\nimport { Department } from '../../types/department'\n\nimport { DepartmentView } from '../../component/department-view'\n\nconst departmentFragment = gql`\n fragment departmentFragment on Department {\n id\n controlNo\n name\n description\n\n manager {\n id\n name\n controlNo\n photo\n email\n }\n active\n picture\n\n updater {\n id\n name\n }\n updatedAt\n }\n`\n\n@customElement('department-tree-page')\nexport class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedElementsMixin(PageView))) {\n static styles = [\n CommonHeaderStyles,\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n width: 100%;\n overflow: auto;\n }\n\n ox-tree-vertical {\n flex: 1;\n }\n\n department-view {\n flex: 1;\n\n max-width: 500px;\n align-self: center;\n }\n `\n ]\n\n static get scopedElements() {\n return {\n 'department-importer': DepartmentImporter\n }\n }\n\n @state() root?: Department\n @state() selected?: Department\n\n @query('department-view') departmentView!: DepartmentView\n\n get context() {\n return {\n title: i18next.t('title.department list'),\n help: 'organization/department',\n actions: [\n {\n icon: 'add',\n title: i18next.t('button.add'),\n action: this.create.bind(this)\n },\n this.selected\n ? {\n icon: 'save',\n title: i18next.t('button.save'),\n action: this.save.bind(this)\n }\n : null,\n {\n icon: 'refresh',\n title: i18next.t('button.reset'),\n action: this.reset.bind(this)\n },\n {\n icon: 'delete',\n title: i18next.t('button.delete'),\n action: this.delete.bind(this),\n emphasis: {\n danger: true\n }\n }\n ].filter(Boolean),\n exportable: {\n name: i18next.t('title.department list'),\n data: this.exportHandler.bind(this)\n },\n importable: {\n handler: this.importHandler.bind(this)\n },\n toolbar: false\n }\n }\n\n render() {\n return html`\n <div class=\"header\">\n <div class=\"title\">${i18next.t('title.department list')}</div>\n\n <ox-context-page-toolbar class=\"actions\" .context=${this.context}></ox-context-page-toolbar>\n </div>\n\n <ox-tree-vertical\n .data=${this.root}\n .selected=${this.selected}\n @select=${this.onSelect.bind(this)}\n label-property=\"name\"\n ></ox-tree-vertical>\n\n <department-view .department=${this.selected}></department-view>\n `\n }\n\n onSelect(e: CustomEvent) {\n this.selected = e.detail as Department\n this.updateContext()\n }\n\n reset() {\n this.departmentView.department = {}\n }\n\n async create() {\n const { id: parentId } = this.selected \|\| {}\n const { controlNo, name, description, picture, active, manager } = this.departmentView.department\n\n var department = {\n controlNo,\n name,\n description,\n manager,\n active\n } as any\n\n if (picture instanceof File) {\n department.picture = picture\n }\n\n if (parentId) {\n department.parent = { id: parentId }\n }\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($department: NewDepartment!) {\n createDepartment(department: $department) {\n ...departmentFragment\n }\n }\n\n ${departmentFragment}\n `,\n variables: {\n department\n },\n context: {\n hasUpload: true\n }\n })\n\n this.selected = response.data.createDepartment\n this.updateContext()\n\n await this.fetch()\n }\n\n async save() {\n const { id, controlNo, name, description, picture, active, manager } = this.departmentView.department\n\n if (!id) {\n await CustomAlert({\n type: 'warning',\n title: 'department not selected',\n text: 'Please select department first.',\n confirmButton: { text: i18next.t('button.confirm') }\n })\n\n return\n }\n\n var patch = {\n controlNo,\n name,\n description,\n active,\n manager\n } as any\n\n if (picture instanceof File) {\n patch.picture = picture\n }\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $patch: DepartmentPatch!) {\n updateDepartment(id: $id, patch: $patch) {\n ...departmentFragment\n }\n }\n\n ${departmentFragment}\n `,\n variables: {\n id,\n patch\n },\n context: {\n hasUpload: true\n }\n })\n\n this.selected = response.data.updateDepartment\n\n this.fetch()\n }\n\n async delete() {\n if (!this.selected) {\n await CustomAlert({\n type: 'warning',\n title: 'department not selected',\n text: 'Please select department first.',\n confirmButton: { text: i18next.t('button.confirm') }\n })\n\n return\n }\n\n const children = this.selected?.children\n if (children && children.length > 0) {\n await CustomAlert({\n type: 'warning',\n title: 'Departments with subordinates cannot be deleted.',\n text: 'Department having children cannot be deleted.',\n confirmButton: { text: i18next.t('button.confirm') }\n })\n\n return\n }\n\n if (confirm(i18next.t('text.sure_to_x', { x: i18next.t('text.delete') }))) {\n const { id } = this.selected \|\| {}\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n deleteDepartment(id: $id)\n }\n `,\n variables: {\n id\n }\n })\n\n this.selected = {}\n this.updateContext()\n\n await this.fetch()\n }\n }\n\n async pageInitialized(lifecycle: any) {\n this.fetch()\n }\n\n async pageUpdated(changes: any, lifecycle: any) {\n if (this.active) {\n // do something here when this page just became as active\n }\n }\n\n async fetch() {\n const response = await client.query({\n query: gql`\n query {\n responses: departmentRoots {\n total\n items {\n ...departmentFragment\n children {\n ...departmentFragment\n children {\n ...departmentFragment\n children {\n ...departmentFragment\n children {\n ...departmentFragment\n children {\n ...departmentFragment\n children {\n ...departmentFragment\n children {\n ...departmentFragment\n }\n }\n }\n }\n }\n }\n }\n }\n }\n }\n\n ${departmentFragment}\n `\n })\n const { items: records, total } = response.data.responses\n\n this.root = records[0]\n }\n\n async exportHandler() {}\n\n async importHandler(records) {}\n}\n"]}
1	+ {"version":3,"file":"department-tree-page.js","sourceRoot":"","sources":["../../../client/pages/department/department-tree-page.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/data-tree'\nimport '@operato/context/ox-context-page-toolbar.js'\n\nimport { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'\nimport { CustomAlert, PageView, store } from '@operato/shell'\nimport { css, html } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\n\nimport { connect } from 'pwa-helpers/connect-mixin'\nimport gql from 'graphql-tag'\n\nimport { DepartmentImporter } from './department-importer'\nimport { Department } from '../../types/department'\n\nimport { DepartmentView } from '../../component/department-view'\n\nconst SubDepartmentFragment = gql`\n fragment SubDepartmentFragment on Department {\n id\n controlNo\n name\n description\n\n manager {\n id\n name\n controlNo\n photo\n email\n }\n active\n picture\n\n updater {\n id\n name\n }\n updatedAt\n }\n`\n\n@customElement('department-tree-page')\nexport class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedElementsMixin(PageView))) {\n static styles = [\n CommonHeaderStyles,\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n width: 100%;\n overflow: auto;\n }\n\n ox-tree-vertical {\n flex: 1;\n }\n\n department-view {\n flex: 1;\n\n max-width: 500px;\n align-self: center;\n }\n `\n ]\n\n static get scopedElements() {\n return {\n 'department-importer': DepartmentImporter\n }\n }\n\n @state() root?: Department\n @state() selected?: Department\n\n @query('department-view') departmentView!: DepartmentView\n\n get context() {\n return {\n title: i18next.t('title.department list'),\n help: 'organization/department',\n actions: [\n {\n icon: 'add',\n title: i18next.t('button.add'),\n action: this.create.bind(this)\n },\n this.selected\n ? {\n icon: 'save',\n title: i18next.t('button.save'),\n action: this.save.bind(this)\n }\n : null,\n {\n icon: 'refresh',\n title: i18next.t('button.reset'),\n action: this.reset.bind(this)\n },\n {\n icon: 'delete',\n title: i18next.t('button.delete'),\n action: this.delete.bind(this),\n emphasis: {\n danger: true\n }\n }\n ].filter(Boolean),\n exportable: {\n name: i18next.t('title.department list'),\n data: this.exportHandler.bind(this)\n },\n importable: {\n handler: this.importHandler.bind(this)\n },\n toolbar: false\n }\n }\n\n render() {\n return html`\n <div class=\"header\">\n <div class=\"title\">${i18next.t('title.department list')}</div>\n\n <ox-context-page-toolbar class=\"actions\" .context=${this.context}></ox-context-page-toolbar>\n </div>\n\n <ox-tree-vertical\n .data=${this.root}\n .selected=${this.selected}\n @select=${this.onSelect.bind(this)}\n label-property=\"name\"\n ></ox-tree-vertical>\n\n <department-view .department=${this.selected}></department-view>\n `\n }\n\n onSelect(e: CustomEvent) {\n this.selected = e.detail as Department\n this.updateContext()\n }\n\n reset() {\n this.departmentView.department = {}\n }\n\n async create() {\n const { id: parentId } = this.selected \|\| {}\n const { controlNo, name, description, picture, active, manager } = this.departmentView.department\n\n var department = {\n controlNo,\n name,\n description,\n manager,\n active\n } as any\n\n if (picture instanceof File) {\n department.picture = picture\n }\n\n if (parentId) {\n department.parent = { id: parentId }\n }\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($department: NewDepartment!) {\n createDepartment(department: $department) {\n ...SubDepartmentFragment\n }\n }\n\n ${SubDepartmentFragment}\n `,\n variables: {\n department\n },\n context: {\n hasUpload: true\n }\n })\n\n this.selected = response.data.createDepartment\n this.updateContext()\n\n await this.fetch()\n }\n\n async save() {\n const { id, controlNo, name, description, picture, active, manager } = this.departmentView.department\n\n if (!id) {\n await CustomAlert({\n type: 'warning',\n title: 'department not selected',\n text: 'Please select department first.',\n confirmButton: { text: i18next.t('button.confirm') }\n })\n\n return\n }\n\n var patch = {\n controlNo,\n name,\n description,\n active,\n manager\n } as any\n\n if (picture instanceof File) {\n patch.picture = picture\n }\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $patch: DepartmentPatch!) {\n updateDepartment(id: $id, patch: $patch) {\n ...SubDepartmentFragment\n }\n }\n\n ${SubDepartmentFragment}\n `,\n variables: {\n id,\n patch\n },\n context: {\n hasUpload: true\n }\n })\n\n this.selected = response.data.updateDepartment\n\n this.fetch()\n }\n\n async delete() {\n if (!this.selected) {\n await CustomAlert({\n type: 'warning',\n title: 'department not selected',\n text: 'Please select department first.',\n confirmButton: { text: i18next.t('button.confirm') }\n })\n\n return\n }\n\n const children = this.selected?.children\n if (children && children.length > 0) {\n await CustomAlert({\n type: 'warning',\n title: 'Departments with subordinates cannot be deleted.',\n text: 'Department having children cannot be deleted.',\n confirmButton: { text: i18next.t('button.confirm') }\n })\n\n return\n }\n\n if (confirm(i18next.t('text.sure_to_x', { x: i18next.t('text.delete') }))) {\n const { id } = this.selected \|\| {}\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n deleteDepartment(id: $id)\n }\n `,\n variables: {\n id\n }\n })\n\n this.selected = {}\n this.updateContext()\n\n await this.fetch()\n }\n }\n\n async pageInitialized(lifecycle: any) {\n this.fetch()\n }\n\n async pageUpdated(changes: any, lifecycle: any) {\n if (this.active) {\n // do something here when this page just became as active\n }\n }\n\n async fetch() {\n const response = await client.query({\n query: gql`\n query {\n responses: departmentRoots {\n total\n items {\n ...SubDepartmentFragment\n children {\n ...SubDepartmentFragment\n children {\n ...SubDepartmentFragment\n children {\n ...SubDepartmentFragment\n children {\n ...SubDepartmentFragment\n children {\n ...SubDepartmentFragment\n children {\n ...SubDepartmentFragment\n children {\n ...SubDepartmentFragment\n }\n }\n }\n }\n }\n }\n }\n }\n }\n }\n\n ${SubDepartmentFragment}\n `\n })\n const { items: records, total } = response.data.responses\n\n this.root = records[0]\n }\n\n async exportHandler() {}\n\n async importHandler(records) {}\n}\n"]}

package/dist-client/pages/employee/employee-importer.d.ts CHANGED Viewed

@@ -18,6 +18,6 @@ export declare class EmployeeImporter extends LitElement {
             width: number;
         }[];
     };
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
     save(): Promise<void>;
 }

package/dist-client/pages/employee/employee-importer.js CHANGED Viewed

@@ -7,7 +7,7 @@ import { property } from 'lit/decorators.js';
 import { client } from '@operato/graphql';
 import { i18next } from '@operato/i18n';
 import { isMobileDevice } from '@operato/utils';
-import { ButtonContainerStyles } from '@operato/styles';
+import { CommonHeaderStyles } from '@operato/styles';
 export class EmployeeImporter extends LitElement {
     constructor() {
         super(...arguments);
@@ -47,8 +47,9 @@ export class EmployeeImporter extends LitElement {
         }}
       ></ox-grist>
-      <div class="button-container">
-        <button @click="${this.save.bind(this)}"><md-icon>save</md-icon>${i18next.t('button.save')}</button>
+      <div class="footer">
+        <div filler></div>
+        <button @click=${this.save.bind(this)} done><md-icon>save</md-icon>${i18next.t('button.save')}</button>
       </div>
     `;
     }
@@ -68,7 +69,7 @@ export class EmployeeImporter extends LitElement {
     }
 }
 EmployeeImporter.styles = [
-    ButtonContainerStyles,
+    CommonHeaderStyles,
     css `
       :host {
         display: flex;

package/dist-client/pages/employee/employee-importer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"employee-importer.js","sourceRoot":"","sources":["../../../client/pages/employee/employee-importer.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,qBAAqB,CAAA;AAE5B,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE5C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EAAE,~~qBAAqB~~,EAAE,MAAM,iBAAiB,CAAA;~~AAEvD~~,MAAM,OAAO,gBAAiB,SAAQ,UAAU;IAAhD;;QAiB6B,cAAS,GAAU,EAAE,CAAA;QACpB,YAAO,GAAG;YACpC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,EAAE;YACzC,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;YAC9B,OAAO,EAAE;gBACP;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,MAAM;oBACZ,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;oBAC/B,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,aAAa;oBACnB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC;oBACtC,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,QAAQ;oBACd,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC;oBACjC,KAAK,EAAE,EAAE;iBACV;aACF;SACF,CAAA;~~IAgCH~~,CAAC;~~IA9BC~~,MAAM;QACJ,OAAO,IAAI,CAAA;;gBAEC,cAAc,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;kBAChC,IAAI,CAAC,OAAO;gBACd;YACN,OAAO,EAAE,IAAI,CAAC,SAAS;SACxB~~;;;;0BAIiB~~,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,~~4BAA4B~~,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC;;~~KAE7F~~,CAAA;IACH,CAAC;IAED,KAAK,CAAC,IAAI;;QACR,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;YACnC,QAAQ,EAAE,GAAG,CAAA;;;;OAIZ;YACD,SAAS,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE;SACzC,CAAC,CAAA;QAEF,IAAI,MAAA,QAAQ,CAAC,MAAM,0CAAE,MAAM;YAAE,OAAM;QAEnC,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,UAAU,CAAC,CAAC,CAAA;IACjD,CAAC;;~~AAvEM~~,uBAAM,GAAG;IACd,~~qBAAqB~~;~~IACrB~~,GAAG,CAAA;;;;;;;;;;;KAWF;CACF,AAdY,CAcZ;AAE0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;mDAAsB;AACpB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;iDAuB1B","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/data-grist'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { isMobileDevice } from '@operato/utils'\nimport { ~~ButtonContainerStyles~~ } from '@operato/styles'\n\nexport class EmployeeImporter extends LitElement {\n static styles = [\n ~~ButtonContainerStyles~~,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: var(--md-sys-color-surface);\n }\n\n ox-grist {\n flex: 1;\n }\n `\n ]\n\n @property({ type: Array }) employees: any[] = []\n @property({ type: Object }) columns = {\n list: { fields: ['name', 'description'] },\n pagination: { infinite: true },\n columns: [\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n width: 150\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n width: 200\n },\n {\n type: 'checkbox',\n name: 'active',\n header: i18next.t('field.active'),\n width: 60\n }\n ]\n }\n\n render() {\n return html`\n <ox-grist\n .mode=${isMobileDevice() ? 'LIST' : 'GRID'}\n .config=${this.columns}\n .data=${{\n records: this.employees\n }}\n ></ox-grist>\n\n <div class=\"~~button-container~~\">\n <button @click~~=\"$~~{this.save.bind(this)}\"><md-icon>save</md-icon>${i18next.t('button.save')}</button>\n </div>\n `\n }\n\n async save() {\n const response = await client.mutate({\n mutation: gql`\n mutation importEmployees($employees: [EmployeePatch!]!) {\n importEmployees(employees: $employees)\n }\n `,\n variables: { employees: this.employees }\n })\n\n if (response.errors?.length) return\n\n this.dispatchEvent(new CustomEvent('imported'))\n }\n}\n"]}
1	+ {"version":3,"file":"employee-importer.js","sourceRoot":"","sources":["../../../client/pages/employee/employee-importer.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,qBAAqB,CAAA;AAE5B,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE5C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAEpD,MAAM,OAAO,gBAAiB,SAAQ,UAAU;IAAhD;;QAiB6B,cAAS,GAAU,EAAE,CAAA;QACpB,YAAO,GAAG;YACpC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,EAAE;YACzC,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;YAC9B,OAAO,EAAE;gBACP;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,MAAM;oBACZ,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;oBAC/B,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,aAAa;oBACnB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC;oBACtC,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,QAAQ;oBACd,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC;oBACjC,KAAK,EAAE,EAAE;iBACV;aACF;SACF,CAAA;IAiCH,CAAC;IA/BC,MAAM;QACJ,OAAO,IAAI,CAAA;;gBAEC,cAAc,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;kBAChC,IAAI,CAAC,OAAO;gBACd;YACN,OAAO,EAAE,IAAI,CAAC,SAAS;SACxB;;;;;yBAKgB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,gCAAgC,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC;;KAEhG,CAAA;IACH,CAAC;IAED,KAAK,CAAC,IAAI;;QACR,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;YACnC,QAAQ,EAAE,GAAG,CAAA;;;;OAIZ;YACD,SAAS,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE;SACzC,CAAC,CAAA;QAEF,IAAI,MAAA,QAAQ,CAAC,MAAM,0CAAE,MAAM;YAAE,OAAM;QAEnC,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,UAAU,CAAC,CAAC,CAAA;IACjD,CAAC;;AAxEM,uBAAM,GAAG;IACd,kBAAkB;IAClB,GAAG,CAAA;;;;;;;;;;;KAWF;CACF,AAdY,CAcZ;AAE0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;mDAAsB;AACpB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;iDAuB1B","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/data-grist'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { isMobileDevice } from '@operato/utils'\nimport { CommonHeaderStyles } from '@operato/styles'\n\nexport class EmployeeImporter extends LitElement {\n static styles = [\n CommonHeaderStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: var(--md-sys-color-surface);\n }\n\n ox-grist {\n flex: 1;\n }\n `\n ]\n\n @property({ type: Array }) employees: any[] = []\n @property({ type: Object }) columns = {\n list: { fields: ['name', 'description'] },\n pagination: { infinite: true },\n columns: [\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n width: 150\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n width: 200\n },\n {\n type: 'checkbox',\n name: 'active',\n header: i18next.t('field.active'),\n width: 60\n }\n ]\n }\n\n render() {\n return html`\n <ox-grist\n .mode=${isMobileDevice() ? 'LIST' : 'GRID'}\n .config=${this.columns}\n .data=${{\n records: this.employees\n }}\n ></ox-grist>\n\n <div class=\"footer\">\n <div filler></div>\n <button @click=${this.save.bind(this)} done><md-icon>save</md-icon>${i18next.t('button.save')}</button>\n </div>\n `\n }\n\n async save() {\n const response = await client.mutate({\n mutation: gql`\n mutation importEmployees($employees: [EmployeePatch!]!) {\n importEmployees(employees: $employees)\n }\n `,\n variables: { employees: this.employees }\n })\n\n if (response.errors?.length) return\n\n this.dispatchEvent(new CustomEvent('imported'))\n }\n}\n"]}

package/dist-client/pages/employee/employee-list-page.d.ts CHANGED Viewed

@@ -11,6 +11,11 @@ declare const EmployeeListPage_base: (new (...args: any[]) => {
     disconnectedCallback(): void;
     stateChanged(_state: unknown): void;
     readonly isConnected: boolean;
+}) & (new (...args: any[]) => {
+    __preferenceProviders: {
+        [element: string]: import("@operato/p13n").PagePreferenceProvider;
+    };
+    getPagePreferenceProvider(element: string): import("@operato/p13n").PagePreferenceProvider | undefined;
 }) & (new (...args: any[]) => import("lit").LitElement) & typeof PageView & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/types/src/types").ScopedElementsHost>;
 export declare class EmployeeListPage extends EmployeeListPage_base {
     static styles: import("lit").CSSResult[];
@@ -52,15 +57,15 @@ export declare class EmployeeListPage extends EmployeeListPage_base {
         };
         toolbar: boolean;
     };
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
     pageInitialized(lifecycle: any): Promise<void>;
     pageUpdated(changes: any, lifecycle: any): Promise<void>;
     fetchHandler({ page, limit, sortings, filters }: FetchOption): Promise<{
         total: any;
         records: any;
     }>;
-    _deleteEmployee(): Promise<void>;
-    _updateEmployee(): Promise<void>;
+    onDeleteEmployee(): Promise<void>;
+    onUpdateEmployee(): Promise<void>;
     exportHandler(): Promise<{}[]>;
     importHandler(records: any): Promise<void>;
     openContactPopup(record: GristRecord): Promise<void>;

package/dist-client/pages/employee/employee-list-page.js CHANGED Viewed

@@ -12,10 +12,11 @@ import { client } from '@operato/graphql';
 import { i18next, localize } from '@operato/i18n';
 import { notify, openPopup } from '@operato/layout';
 import { PageView, store } from '@operato/shell';
-import { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles';
+import { CommonHeaderStyles, CommonGristStyles, ScrollbarStyles } from '@operato/styles';
 import { isMobileDevice } from '@operato/utils';
+import { p13n } from '@operato/p13n';
 import { EmployeeImporter } from './employee-importer';
-let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i18next)(ScopedElementsMixin(PageView))) {
+let EmployeeListPage = class EmployeeListPage extends connect(store)(p13n(localize(i18next)(ScopedElementsMixin(PageView)))) {
     constructor() {
         super(...arguments);
         this.mode = isMobileDevice() ? 'CARD' : 'GRID';
@@ -45,12 +46,12 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                 {
                     icon: 'save',
                     title: i18next.t('button.save'),
-                    action: this._updateEmployee.bind(this)
+                    action: this.onUpdateEmployee.bind(this)
                 },
                 {
                     icon: 'delete',
                     title: i18next.t('button.delete'),
-                    action: this._deleteEmployee.bind(this),
+                    action: this.onDeleteEmployee.bind(this),
                     emphasis: {
                         danger: true
                     }
@@ -69,13 +70,21 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
     render() {
         const mode = this.mode || (isMobileDevice() ? 'CARD' : 'GRID');
         return html `
-      <ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
+      <ox-grist
+        .mode=${mode}
+        .config=${this.gristConfig}
+        .fetchHandler=${this.fetchHandler.bind(this)}
+        .personalConfigProvider=${this.getPagePreferenceProvider('ox-grist')}
+      >
         <div slot="headroom" class="header">
           <div class="filters">
             <ox-filters-form class="filter" autofocus without-search></ox-filters-form>
           </div>
           <ox-context-page-toolbar class="actions" .context=${this.context}></ox-context-page-toolbar>
         </div>
+        <ox-grist-personalizer slot="setting"></ox-grist-personalizer>
       </ox-grist>
     `;
     }
@@ -90,21 +99,46 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
             columns: [
                 { type: 'gutter', gutterName: 'sequence', fixed: true },
                 { type: 'gutter', gutterName: 'row-selector', multiple: true, fixed: true },
+                // {
+                //   type: 'gutter',
+                //   gutterName: 'button',
+                //   fixed: true,
+                //   forList: true,
+                //   icon: 'contact_page',
+                //   iconOnly: false,
+                //   title: i18next.t('button.edit-contact'),
+                //   width: 110,
+                //   handlers: {
+                //     click: async (columns, data, column, record, rowIndex) => {
+                //       if (record && record.contact) {
+                //         this.openContactPopup(record)
+                //       } else {
+                //         this.openContactSelector(record)
+                //       }
+                //     }
+                //   }
+                // },
                 {
-                    type: 'gutter',
-                    gutterName: 'button',
-                    fixed: true,
-                    forList: true,
-                    icon: record => (!record ? 'contact_page' : record.id ? 'contact_page' : ''),
-                    iconOnly: false,
-                    title: record => !record ? i18next.t('button.edit-detail') : record.id ? i18next.t('button.edit-detail') : '',
-                    width: 100,
+                    type: 'image',
+                    name: 'profile',
+                    header: i18next.t('button.edit-contact'),
+                    width: 80,
+                    record: {
+                        align: 'center',
+                        renderer: function (value, column, record, rowIndex, field) {
+                            return html `<ox-pfp-view
+                style="min-height: 36px; width: unset; aspect-ratio: 1 / 1;"
+                .profile=${record.profile}
+                .name=${record.name}
+              ></ox-pfp-view>`;
+                        }
+                    },
                     handlers: {
                         click: async (columns, data, column, record, rowIndex) => {
-                            if (record.contact) {
+                            if (record && record.contact) {
                                 this.openContactPopup(record);
                             }
-                            else if (record.id) {
+                            else {
                                 this.openContactSelector(record);
                             }
                         }
@@ -116,7 +150,8 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                     fixed: true,
                     header: i18next.t('field.control-no'),
                     record: {
-                        editable: true
+                        editable: true,
+                        mandatory: true
                     },
                     filter: 'search',
                     sortable: true,
@@ -128,7 +163,8 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                     fixed: true,
                     header: i18next.t('field.name'),
                     record: {
-                        editable: true
+                        editable: true,
+                        mandatory: true
                     },
                     filter: 'search',
                     sortable: true,
@@ -177,7 +213,8 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                     filter: false,
                     record: {
                         editable: true,
-                        codeName: 'EMPLOYEE_TYPE'
+                        codeName: 'EMPLOYEE_TYPE',
+                        selectDispOpt: 'name'
                     }
                 },
                 {
@@ -241,7 +278,8 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                                     header: { renderer: () => i18next.t('label.type') },
                                     record: {
                                         editable: false,
-                                        codeName: 'EMPLOYEE_TYPE'
+                                        codeName: 'EMPLOYEE_TYPE',
+                                        selectDispOpt: 'name'
                                     }
                                 },
                                 {
@@ -251,7 +289,8 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                                     header: { renderer: () => i18next.t('label.job-position') },
                                     record: {
                                         editable: false,
-                                        codeName: 'JOB_POSITION'
+                                        codeName: 'JOB_POSITION',
+                                        selectDispOpt: 'name'
                                     }
                                 },
                                 {
@@ -261,14 +300,15 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                                     header: { renderer: () => i18next.t('label.job-responsibility') },
                                     record: {
                                         editable: false,
-                                        codeName: 'JOB_RESPONSIBILITY'
+                                        codeName: 'JOB_RESPONSIBILITY',
+                                        selectDispOpt: 'name'
                                     }
                                 },
                                 {
                                     type: 'date',
                                     name: 'hiredOn',
                                     header: { renderer: () => i18next.t('field.hired-on') },
-                                    width: 100
+                                    width: 120
                                 }
                             ],
                             valueField: 'id',
@@ -296,7 +336,7 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                     type: 'string',
                     name: 'phone',
                     header: i18next.t('field.phone'),
-                    width: 110,
+                    width: 130,
                     record: {
                         editable: false,
                         renderer: function (value, column, record, rowIndex, field) {
@@ -312,7 +352,8 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                     width: 175,
                     record: {
                         editable: true,
-                        codeName: 'JOB_RESPONSIBILITY'
+                        codeName: 'JOB_RESPONSIBILITY',
+                        selectDispOpt: 'name'
                     }
                 },
                 {
@@ -322,14 +363,15 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                     width: 100,
                     record: {
                         editable: true,
-                        codeName: 'JOB_POSITION'
+                        codeName: 'JOB_POSITION',
+                        selectDispOpt: 'name'
                     }
                 },
                 {
                     type: 'date',
                     name: 'hiredOn',
                     header: i18next.t('field.hired-on'),
-                    width: 100,
+                    width: 120,
                     record: {
                         editable: true
                     },
@@ -339,7 +381,7 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                     type: 'date',
                     name: 'retiredAt',
                     header: i18next.t('label.retired-at'),
-                    width: 100,
+                    width: 120,
                     record: {
                         editable: true
                     }
@@ -382,17 +424,8 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
                     sortable: true
                 },
                 {
-                    type: 'image',
-                    name: 'profile',
-                    record: {
-                        renderer: function (value, column, record, rowIndex, field) {
-                            return html `<ox-pfp-view
-                style="height:90%; width: unset; aspect-ratio: 1 / 1;"
-                .profile=${record.profile}
-                .name=${record.name}
-              ></ox-pfp-view>`;
-                        }
-                    },
+                    type: 'resource-object',
+                    name: 'contact',
                     hidden: true
                 }
             ],
@@ -435,6 +468,7 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
               }
               department {
                 id
+                controlNo
                 name
                 description
               }
@@ -480,7 +514,7 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
             records
         };
     }
-    async _deleteEmployee() {
+    async onDeleteEmployee() {
         if (confirm(i18next.t('text.sure_to_x', { x: i18next.t('text.delete') }))) {
             const ids = this.grist.selected.map(record => record.id);
             if (ids && ids.length > 0) {
@@ -503,7 +537,7 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
             }
         }
     }
-    async _updateEmployee() {
+    async onUpdateEmployee() {
         let patches = this.grist.dirtyRecords;
         if (patches && patches.length) {
             patches = patches.map(patch => {
@@ -576,40 +610,9 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
         if (!((_a = record.contact) === null || _a === void 0 ? void 0 : _a.id)) {
             return;
         }
-        const response = await client.query({
-            query: gql `
-        query ($id: String!) {
-          contact(id: $id) {
-            id
-            name
-            company
-            department
-            email
-            phone
-            address
-            note
-            items {
-              type
-              label
-              value
-            }
-            profile {
-              left
-              top
-              zoom
-              picture
-            }
-          }
-        }
-      `,
-            variables: {
-                id: record.contact.id
-            }
-        });
-        const { contact } = response.data;
         const popup = openPopup(html `
         <contact-popup
-          .contact=${contact}
+          .contactId=${record.contact.id}
           @change=${() => {
             this.grist.fetch();
         }}
@@ -634,39 +637,63 @@ let EmployeeListPage = class EmployeeListPage extends connect(store)(localize(i1
         });
     }
     async attachContact(record, contact) {
-        const response = await client.mutate({
-            mutation: gql `
-        mutation ($id: String!, $contactId: String!) {
-          attachContact(id: $id, contactId: $contactId) {
-            id
+        if (record.id) {
+            const response = await client.mutate({
+                mutation: gql `
+          mutation ($id: String!, $contactId: String!) {
+            attachContact(id: $id, contactId: $contactId) {
+              id
+            }
           }
+        `,
+                variables: {
+                    id: record.id,
+                    contactId: contact.id
+                }
+            });
+            this.grist.fetch();
+        }
+        else if (contact === null || contact === void 0 ? void 0 : contact.id) {
+            this.grist.addRecord({
+                name: contact.name,
+                contact: {
+                    id: contact.id,
+                    name: contact.name,
+                    email: contact.email,
+                    phone: contact.phone,
+                    address: contact.address
+                }
+            });
+            this.grist.refresh();
+            await this.grist.requestUpdate();
+            this.grist.checkDirties();
         }
-      `,
-            variables: {
-                id: record.id,
-                contactId: contact.id
-            }
-        });
-        this.grist.fetch();
     }
     async detachContact(record) {
-        const response = await client.mutate({
-            mutation: gql `
-        mutation ($id: String!) {
-          detachContact(id: $id) {
-            id
+        if (record.id) {
+            const response = await client.mutate({
+                mutation: gql `
+          mutation ($id: String!) {
+            detachContact(id: $id) {
+              id
+            }
           }
+        `,
+                variables: {
+                    id: record.id
+                }
+            });
+            this.grist.fetch();
+        }
+        else {
+            record.contact = null;
+            this.grist.refresh();
         }
-      `,
-            variables: {
-                id: record.id
-            }
-        });
-        this.grist.fetch();
     }
 };
 EmployeeListPage.styles = [
     ScrollbarStyles,
+    CommonGristStyles,
     CommonHeaderStyles,
     css `
       :host {