@things-factory/organization 7.0.62 → 7.0.64

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 (12) hide show
  1. package/client/pages/department/department-tree-page.ts +70 -39
  2. package/client/pages/employee/employee-list-page.ts +15 -32
  3. package/client/types/department.ts +2 -0
  4. package/dist-client/pages/department/department-tree-page.d.ts +7 -7
  5. package/dist-client/pages/department/department-tree-page.js +79 -35
  6. package/dist-client/pages/department/department-tree-page.js.map +1 -1
  7. package/dist-client/pages/employee/employee-list-page.js +15 -32
  8. package/dist-client/pages/employee/employee-list-page.js.map +1 -1
  9. package/dist-client/tsconfig.tsbuildinfo +1 -1
  10. package/dist-client/types/department.d.ts +1 -0
  11. package/dist-client/types/department.js.map +1 -1
  12. package/package.json +6 -6
package/client/pages/department/department-tree-page.ts CHANGED
@@ -1,13 +1,13 @@
1
1
  import '@operato/data-tree'
2
2
  import '@operato/context/ox-context-page-toolbar.js'
3
3
 
4
- import { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'
5
- import { CustomAlert, PageView, store } from '@operato/shell'
6
- import { css, html } from 'lit'
4
+ import { css, html, PropertyValues } from 'lit'
7
5
  import { customElement, property, query, state } from 'lit/decorators.js'
8
6
  import { ScopedElementsMixin } from '@open-wc/scoped-elements'
9
7
  import { client } from '@operato/graphql'
10
8
  import { i18next, localize } from '@operato/i18n'
9
+ import { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'
10
+ import { CustomAlert, PageView, store } from '@operato/shell'
11
11
 
12
12
  import { connect } from 'pwa-helpers/connect-mixin'
13
13
  import gql from 'graphql-tag'
@@ -56,15 +56,33 @@ export class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedE
56
56
  overflow: auto;
57
57
  }
58
58
 
59
+ content {
60
+ flex: 1;
61
+ display: flex;
62
+ flex-direction: row;
63
+ }
64
+
65
+ div[editor] {
66
+ width: 300px;
67
+ display: flex;
68
+ flex-direction: column;
69
+ }
70
+
59
71
  ox-tree-vertical {
60
72
  flex: 1;
73
+ overflow: auto;
61
74
  }
62
75
 
63
76
  department-view {
64
77
  flex: 1;
78
+ padding: var(--spacing-medium);
79
+ background-color: var(--md-sys-color-surface-variant);
80
+ overflow: auto;
81
+ }
65
82
 
66
- max-width: 500px;
67
- align-self: center;
83
+ .footer button[disabled] {
84
+ color: var(--md-sys-color-surface-dim);
85
+ background-color: transparent;
68
86
  }
69
87
  `
70
88
  ]
@@ -77,6 +95,9 @@ export class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedE
77
95
 
78
96
  @state() root?: Department
79
97
  @state() selected?: Department
98
+ @state() department?: Department
99
+ @state() modified: boolean = false
100
+ @state() appendable: boolean = false
80
101
 
81
102
  @query('department-view') departmentView!: DepartmentView
82
103
 
@@ -85,23 +106,6 @@ export class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedE
85
106
  title: i18next.t('title.department list'),
86
107
  help: 'organization/department',
87
108
  actions: [
88
- {
89
- icon: 'add',
90
- title: i18next.t('button.add'),
91
- action: this.create.bind(this)
92
- },
93
- this.selected
94
- ? {
95
- icon: 'save',
96
- title: i18next.t('button.save'),
97
- action: this.save.bind(this)
98
- }
99
- : null,
100
- {
101
- icon: 'refresh',
102
- title: i18next.t('button.reset'),
103
- action: this.reset.bind(this)
104
- },
105
109
  {
106
110
  icon: 'delete',
107
111
  title: i18next.t('button.delete'),
@@ -125,24 +129,51 @@ export class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedE
125
129
  render() {
126
130
  return html`
127
131
  <div class="header">
128
- <div class="title">${i18next.t('title.department list')}</div>
129
-
130
132
  <ox-context-page-toolbar class="actions" .context=${this.context}></ox-context-page-toolbar>
131
133
  </div>
132
134
 
133
- <ox-tree-vertical
134
- .data=${this.root}
135
- .selected=${this.selected}
136
- @select=${this.onSelect.bind(this)}
137
- id-property="controlNo"
138
- label-property="name"
139
- description-property="description"
140
- ></ox-tree-vertical>
141
-
142
- <department-view .department=${this.selected}></department-view>
135
+ <content>
136
+ <ox-tree-vertical
137
+ .data=${this.root}
138
+ .selected=${this.selected}
139
+ @select=${this.onSelect.bind(this)}
140
+ id-property="controlNo"
141
+ label-property="name"
142
+ description-property="description"
143
+ ></ox-tree-vertical>
144
+
145
+ <div editor>
146
+ <department-view
147
+ .department=${this.department}
148
+ @property-change=${(e: CustomEvent) => {
149
+ const { controlNo, name } = e.detail || {}
150
+
151
+ this.modified = true
152
+ this.appendable = controlNo && controlNo !== this.selected?.controlNo && name !== this.selected?.name
153
+ }}
154
+ ></department-view>
155
+ <div class="footer">
156
+ <button @click=${this.reset.bind(this)}><md-icon>restart_alt</md-icon>${i18next.t('button.reset')}</button>
157
+ <div filler></div>
158
+ <button @click=${this.create.bind(this)} ?disabled=${!this.appendable}>
159
+ <md-icon>add</md-icon>${i18next.t('button.add')}
160
+ </button>
161
+ <button @click=${this.save.bind(this)} ?disabled=${!this.modified} done>
162
+ <md-icon>save</md-icon>${i18next.t('button.save')}
163
+ </button>
164
+ </div>
165
+ </div>
166
+ </content>
143
167
  `
144
168
  }
145
169
 
170
+ updated(changes: PropertyValues<this>) {
171
+ if (changes.has('selected')) {
172
+ this.modified = false
173
+ this.department = { ...this.selected }
174
+ }
175
+ }
176
+
146
177
  onSelect(e: CustomEvent) {
147
178
  this.selected = e.detail as Department
148
179
  this.updateContext()
@@ -153,8 +184,8 @@ export class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedE
153
184
  }
154
185
 
155
186
  async create() {
156
- const { id: parentId } = this.selected || {}
157
- const { controlNo, name, description, picture, active, manager } = this.departmentView.department
187
+ const { id: parentId } = this.department || {}
188
+ const { controlNo, name, description, picture, active, manager } = this.department || {}
158
189
 
159
190
  var department = {
160
191
  controlNo,
@@ -164,7 +195,7 @@ export class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedE
164
195
  active
165
196
  } as any
166
197
 
167
- if (picture instanceof File) {
198
+ if ((picture as any) instanceof File) {
168
199
  department.picture = picture
169
200
  }
170
201
 
@@ -197,7 +228,7 @@ export class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedE
197
228
  }
198
229
 
199
230
  async save() {
200
- const { id, controlNo, name, description, picture, active, manager } = this.departmentView.department
231
+ const { id, controlNo, name, description, picture, active, manager } = this.department || {}
201
232
 
202
233
  if (!id) {
203
234
  await CustomAlert({
@@ -218,7 +249,7 @@ export class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedE
218
249
  manager
219
250
  } as any
220
251
 
221
- if (picture instanceof File) {
252
+ if ((picture as any) instanceof File) {
222
253
  patch.picture = picture
223
254
  }
224
255
 
package/client/pages/employee/employee-list-page.ts CHANGED
@@ -134,25 +134,6 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
134
134
  columns: [
135
135
  { type: 'gutter', gutterName: 'sequence', fixed: true },
136
136
  { type: 'gutter', gutterName: 'row-selector', multiple: true, fixed: true },
137
- // {
138
- // type: 'gutter',
139
- // gutterName: 'button',
140
- // fixed: true,
141
- // forList: true,
142
- // icon: 'contact_page',
143
- // iconOnly: false,
144
- // title: i18next.t('button.edit-contact'),
145
- // width: 110,
146
- // handlers: {
147
- // click: async (columns, data, column, record, rowIndex) => {
148
- // if (record && record.contact) {
149
- // this.openContactPopup(record)
150
- // } else {
151
- // this.openContactSelector(record)
152
- // }
153
- // }
154
- // }
155
- // },
156
137
  {
157
138
  type: 'image',
158
139
  name: 'profile',
@@ -212,7 +193,7 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
212
193
  editable: true
213
194
  },
214
195
  filter: 'search',
215
- sortable: true,
196
+ sortable: false,
216
197
  width: 110
217
198
  },
218
199
  {
@@ -234,8 +215,8 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
234
215
  list: { fields: ['name', 'email'] }
235
216
  }
236
217
  },
237
- sortable: true,
238
- filter: false,
218
+ sortable: false,
219
+ filter: 'search',
239
220
  width: 100
240
221
  },
241
222
  {
@@ -243,8 +224,8 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
243
224
  name: 'type',
244
225
  header: i18next.t('field.type'),
245
226
  width: 115,
246
- sortable: false,
247
- filter: false,
227
+ sortable: true,
228
+ filter: true,
248
229
  record: {
249
230
  editable: true,
250
231
  codeName: 'EMPLOYEE_TYPE',
@@ -258,8 +239,8 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
258
239
  record: {
259
240
  editable: true
260
241
  },
261
- sortable: true,
262
- filter: false,
242
+ sortable: false,
243
+ filter: true,
263
244
  width: 130
264
245
  },
265
246
  {
@@ -350,7 +331,7 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
350
331
  descriptionField: 'controlNo'
351
332
  }
352
333
  },
353
- sortable: true,
334
+ sortable: false,
354
335
  width: 120
355
336
  },
356
337
  {
@@ -364,7 +345,7 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
364
345
  return record.contact ? record.contact.email : ''
365
346
  }
366
347
  },
367
- sortable: true
348
+ sortable: false
368
349
  },
369
350
  {
370
351
  type: 'string',
@@ -377,7 +358,7 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
377
358
  return record.contact ? record.contact.phone : ''
378
359
  }
379
360
  },
380
- sortable: true
361
+ sortable: false
381
362
  },
382
363
  {
383
364
  type: 'code',
@@ -388,7 +369,8 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
388
369
  editable: true,
389
370
  codeName: 'JOB_RESPONSIBILITY',
390
371
  selectDispOpt: 'name'
391
- }
372
+ },
373
+ filter: true
392
374
  },
393
375
  {
394
376
  type: 'code',
@@ -399,7 +381,8 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
399
381
  editable: true,
400
382
  codeName: 'JOB_POSITION',
401
383
  selectDispOpt: 'name'
402
- }
384
+ },
385
+ filter: true
403
386
  },
404
387
  {
405
388
  type: 'date',
@@ -431,7 +414,7 @@ export class EmployeeListPage extends connect(store)(p13n(localize(i18next)(Scop
431
414
  editable: true
432
415
  },
433
416
  filter: true,
434
- sortable: true
417
+ sortable: false
435
418
  },
436
419
  {
437
420
  type: 'string',
package/client/types/department.ts CHANGED
@@ -18,6 +18,8 @@ export class Department {
18
18
  extension?: string
19
19
  picture?: string
20
20
 
21
+ active?: boolean
22
+
21
23
  createdAt?: Date
22
24
  updatedAt?: Date
23
25
  deletedAt?: Date
package/dist-client/pages/department/department-tree-page.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import '@operato/data-tree';
2
2
  import '@operato/context/ox-context-page-toolbar.js';
3
+ import { PropertyValues } from 'lit';
3
4
  import { PageView } from '@operato/shell';
4
5
  import { DepartmentImporter } from './department-importer';
5
6
  import { Department } from '../../types/department';
@@ -18,23 +19,21 @@ export declare class DepartmentTreePage extends DepartmentTreePage_base {
18
19
  };
19
20
  root?: Department;
20
21
  selected?: Department;
22
+ department?: Department;
23
+ modified: boolean;
24
+ appendable: boolean;
21
25
  departmentView: DepartmentView;
22
26
  get context(): {
23
27
  title: string;
24
28
  help: string;
25
- actions: ({
26
- icon: string;
27
- title: string;
28
- action: () => void;
29
- emphasis?: undefined;
30
- } | {
29
+ actions: {
31
30
  icon: string;
32
31
  title: string;
33
32
  action: () => Promise<void>;
34
33
  emphasis: {
35
34
  danger: boolean;
36
35
  };
37
- } | null)[];
36
+ }[];
38
37
  exportable: {
39
38
  name: string;
40
39
  data: () => Promise<void>;
@@ -45,6 +44,7 @@ export declare class DepartmentTreePage extends DepartmentTreePage_base {
45
44
  toolbar: boolean;
46
45
  };
47
46
  render(): import("lit-html").TemplateResult<1>;
47
+ updated(changes: PropertyValues<this>): void;
48
48
  onSelect(e: CustomEvent): void;
49
49
  reset(): void;
50
50
  create(): Promise<void>;
package/dist-client/pages/department/department-tree-page.js CHANGED
@@ -1,13 +1,13 @@
1
1
  import { __decorate, __metadata } from "tslib";
2
2
  import '@operato/data-tree';
3
3
  import '@operato/context/ox-context-page-toolbar.js';
4
- import { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles';
5
- import { CustomAlert, PageView, store } from '@operato/shell';
6
4
  import { css, html } from 'lit';
7
5
  import { customElement, query, state } from 'lit/decorators.js';
8
6
  import { ScopedElementsMixin } from '@open-wc/scoped-elements';
9
7
  import { client } from '@operato/graphql';
10
8
  import { i18next, localize } from '@operato/i18n';
9
+ import { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles';
10
+ import { CustomAlert, PageView, store } from '@operato/shell';
11
11
  import { connect } from 'pwa-helpers/connect-mixin';
12
12
  import gql from 'graphql-tag';
13
13
  import { DepartmentImporter } from './department-importer';
@@ -38,6 +38,11 @@ const SubDepartmentFragment = gql `
38
38
  }
39
39
  `;
40
40
  let DepartmentTreePage = class DepartmentTreePage extends connect(store)(localize(i18next)(ScopedElementsMixin(PageView))) {
41
+ constructor() {
42
+ super(...arguments);
43
+ this.modified = false;
44
+ this.appendable = false;
45
+ }
41
46
  static get scopedElements() {
42
47
  return {
43
48
  'department-importer': DepartmentImporter
@@ -48,23 +53,6 @@ let DepartmentTreePage = class DepartmentTreePage extends connect(store)(localiz
48
53
  title: i18next.t('title.department list'),
49
54
  help: 'organization/department',
50
55
  actions: [
51
- {
52
- icon: 'add',
53
- title: i18next.t('button.add'),
54
- action: this.create.bind(this)
55
- },
56
- this.selected
57
- ? {
58
- icon: 'save',
59
- title: i18next.t('button.save'),
60
- action: this.save.bind(this)
61
- }
62
- : null,
63
- {
64
- icon: 'refresh',
65
- title: i18next.t('button.reset'),
66
- action: this.reset.bind(this)
67
- },
68
56
  {
69
57
  icon: 'delete',
70
58
  title: i18next.t('button.delete'),
@@ -87,23 +75,49 @@ let DepartmentTreePage = class DepartmentTreePage extends connect(store)(localiz
87
75
  render() {
88
76
  return html `
89
77
  <div class="header">
90
- <div class="title">${i18next.t('title.department list')}</div>
91
-
92
78
  <ox-context-page-toolbar class="actions" .context=${this.context}></ox-context-page-toolbar>
93
79
  </div>
94
80
 
95
- <ox-tree-vertical
96
- .data=${this.root}
97
- .selected=${this.selected}
98
- @select=${this.onSelect.bind(this)}
99
- id-property="controlNo"
100
- label-property="name"
101
- description-property="description"
102
- ></ox-tree-vertical>
81
+ <content>
82
+ <ox-tree-vertical
83
+ .data=${this.root}
84
+ .selected=${this.selected}
85
+ @select=${this.onSelect.bind(this)}
86
+ id-property="controlNo"
87
+ label-property="name"
88
+ description-property="description"
89
+ ></ox-tree-vertical>
103
90
 
104
- <department-view .department=${this.selected}></department-view>
91
+ <div editor>
92
+ <department-view
93
+ .department=${this.department}
94
+ @property-change=${(e) => {
95
+ var _a, _b;
96
+ const { controlNo, name } = e.detail || {};
97
+ this.modified = true;
98
+ this.appendable = controlNo && controlNo !== ((_a = this.selected) === null || _a === void 0 ? void 0 : _a.controlNo) && name !== ((_b = this.selected) === null || _b === void 0 ? void 0 : _b.name);
99
+ }}
100
+ ></department-view>
101
+ <div class="footer">
102
+ <button @click=${this.reset.bind(this)}><md-icon>restart_alt</md-icon>${i18next.t('button.reset')}</button>
103
+ <div filler></div>
104
+ <button @click=${this.create.bind(this)} ?disabled=${!this.appendable}>
105
+ <md-icon>add</md-icon>${i18next.t('button.add')}
106
+ </button>
107
+ <button @click=${this.save.bind(this)} ?disabled=${!this.modified} done>
108
+ <md-icon>save</md-icon>${i18next.t('button.save')}
109
+ </button>
110
+ </div>
111
+ </div>
112
+ </content>
105
113
  `;
106
114
  }
115
+ updated(changes) {
116
+ if (changes.has('selected')) {
117
+ this.modified = false;
118
+ this.department = Object.assign({}, this.selected);
119
+ }
120
+ }
107
121
  onSelect(e) {
108
122
  this.selected = e.detail;
109
123
  this.updateContext();
@@ -112,8 +126,8 @@ let DepartmentTreePage = class DepartmentTreePage extends connect(store)(localiz
112
126
  this.departmentView.department = {};
113
127
  }
114
128
  async create() {
115
- const { id: parentId } = this.selected || {};
116
- const { controlNo, name, description, picture, active, manager } = this.departmentView.department;
129
+ const { id: parentId } = this.department || {};
130
+ const { controlNo, name, description, picture, active, manager } = this.department || {};
117
131
  var department = {
118
132
  controlNo,
119
133
  name,
@@ -149,7 +163,7 @@ let DepartmentTreePage = class DepartmentTreePage extends connect(store)(localiz
149
163
  await this.fetch();
150
164
  }
151
165
  async save() {
152
- const { id, controlNo, name, description, picture, active, manager } = this.departmentView.department;
166
+ const { id, controlNo, name, description, picture, active, manager } = this.department || {};
153
167
  if (!id) {
154
168
  await CustomAlert({
155
169
  type: 'warning',
@@ -290,15 +304,33 @@ DepartmentTreePage.styles = [
290
304
  overflow: auto;
291
305
  }
292
306
 
307
+ content {
308
+ flex: 1;
309
+ display: flex;
310
+ flex-direction: row;
311
+ }
312
+
313
+ div[editor] {
314
+ width: 300px;
315
+ display: flex;
316
+ flex-direction: column;
317
+ }
318
+
293
319
  ox-tree-vertical {
294
320
  flex: 1;
321
+ overflow: auto;
295
322
  }
296
323
 
297
324
  department-view {
298
325
  flex: 1;
326
+ padding: var(--spacing-medium);
327
+ background-color: var(--md-sys-color-surface-variant);
328
+ overflow: auto;
329
+ }
299
330
 
300
- max-width: 500px;
301
- align-self: center;
331
+ .footer button[disabled] {
332
+ color: var(--md-sys-color-surface-dim);
333
+ background-color: transparent;
302
334
  }
303
335
  `
304
336
  ];
@@ -310,6 +342,18 @@ __decorate([
310
342
  state(),
311
343
  __metadata("design:type", Department)
312
344
  ], DepartmentTreePage.prototype, "selected", void 0);
345
+ __decorate([
346
+ state(),
347
+ __metadata("design:type", Department)
348
+ ], DepartmentTreePage.prototype, "department", void 0);
349
+ __decorate([
350
+ state(),
351
+ __metadata("design:type", Boolean)
352
+ ], DepartmentTreePage.prototype, "modified", void 0);
353
+ __decorate([
354
+ state(),
355
+ __metadata("design:type", Boolean)
356
+ ], DepartmentTreePage.prototype, "appendable", void 0);
313
357
  __decorate([
314
358
  query('department-view'),
315
359
  __metadata("design:type", DepartmentView)
package/dist-client/pages/department/department-tree-page.js.map CHANGED
@@ -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 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 id-property=\"controlNo\"\n label-property=\"name\"\n description-property=\"description\"\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"]}
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 { css, html, PropertyValues } 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'\nimport { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'\nimport { CustomAlert, PageView, store } from '@operato/shell'\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 content {\n flex: 1;\n display: flex;\n flex-direction: row;\n }\n\n div[editor] {\n width: 300px;\n display: flex;\n flex-direction: column;\n }\n\n ox-tree-vertical {\n flex: 1;\n overflow: auto;\n }\n\n department-view {\n flex: 1;\n padding: var(--spacing-medium);\n background-color: var(--md-sys-color-surface-variant);\n overflow: auto;\n }\n\n .footer button[disabled] {\n color: var(--md-sys-color-surface-dim);\n background-color: transparent;\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 @state() department?: Department\n @state() modified: boolean = false\n @state() appendable: boolean = false\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: '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 <ox-context-page-toolbar class=\"actions\" .context=${this.context}></ox-context-page-toolbar>\n </div>\n\n <content>\n <ox-tree-vertical\n .data=${this.root}\n .selected=${this.selected}\n @select=${this.onSelect.bind(this)}\n id-property=\"controlNo\"\n label-property=\"name\"\n description-property=\"description\"\n ></ox-tree-vertical>\n\n <div editor>\n <department-view\n .department=${this.department}\n @property-change=${(e: CustomEvent) => {\n const { controlNo, name } = e.detail || {}\n\n this.modified = true\n this.appendable = controlNo && controlNo !== this.selected?.controlNo && name !== this.selected?.name\n }}\n ></department-view>\n <div class=\"footer\">\n <button @click=${this.reset.bind(this)}><md-icon>restart_alt</md-icon>${i18next.t('button.reset')}</button>\n <div filler></div>\n <button @click=${this.create.bind(this)} ?disabled=${!this.appendable}>\n <md-icon>add</md-icon>${i18next.t('button.add')}\n </button>\n <button @click=${this.save.bind(this)} ?disabled=${!this.modified} done>\n <md-icon>save</md-icon>${i18next.t('button.save')}\n </button>\n </div>\n </div>\n </content>\n `\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('selected')) {\n this.modified = false\n this.department = { ...this.selected }\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.department || {}\n const { controlNo, name, description, picture, active, manager } = this.department || {}\n\n var department = {\n controlNo,\n name,\n description,\n manager,\n active\n } as any\n\n if ((picture as any) 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.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 as any) 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"]}