@things-factory/organization 6.1.54 → 6.1.57

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.
@@ -0,0 +1,108 @@
1
+ import { css, html, LitElement, TemplateResult } from 'lit'
2
+ import { customElement, property, query } from 'lit/decorators.js'
3
+
4
+ import { i18next, localize } from '@operato/i18n'
5
+ import { ApprovalLineItem } from '../types/approval-line'
6
+ import { OrgMemberTargetType } from '../types/org-member'
7
+
8
+ @customElement('approval-line-brief')
9
+ export class ApprovalLineBrief extends localize(i18next)(LitElement) {
10
+ static styles = [
11
+ css`
12
+ :host {
13
+ display: block;
14
+ }
15
+
16
+ ol {
17
+ list-style: none;
18
+ margin: 0;
19
+ padding: 0;
20
+ display: flex;
21
+ }
22
+
23
+ li {
24
+ width: 85px;
25
+ text-align: center;
26
+ color: rgba(255, 255, 255, 0.7);
27
+ }
28
+
29
+ span:before {
30
+ content: '';
31
+ height: 2px;
32
+ width: 70px;
33
+ display: block;
34
+ position: absolute;
35
+ margin-left: -70px;
36
+ margin-top: 6px;
37
+ background-color: rgba(0, 0, 0, 0.4);
38
+ }
39
+
40
+ span {
41
+ display: block;
42
+ width: 15px;
43
+ height: 15px;
44
+ margin: auto;
45
+ background-color: rgba(0, 0, 0, 0.4);
46
+ border-radius: 50%;
47
+ color: var(--theme-white-color);
48
+ line-height: 1.2;
49
+ }
50
+
51
+ [past] span {
52
+ background-color: rgba(255, 255, 255, 0.9);
53
+ color: var(--primary-text-color);
54
+ }
55
+
56
+ [current] span {
57
+ background-color: #84d600;
58
+ color: var(--theme-white-color);
59
+ }
60
+
61
+ [current] {
62
+ font-weight: bold;
63
+ color: var(--theme-white-color);
64
+ }
65
+
66
+ [past] span:before,
67
+ [current] span:before {
68
+ background-color: rgba(255, 255, 255, 0.9);
69
+ }
70
+
71
+ li:first-child span:before {
72
+ display: none;
73
+ }
74
+ `
75
+ ]
76
+
77
+ @property({ type: Array }) model: ApprovalLineItem[] = []
78
+ @property({ type: Number }) current: number = -1
79
+
80
+ render() {
81
+ const items = this.model || []
82
+ const current = this.current
83
+
84
+ return html`
85
+ <ol>
86
+ ${this.model
87
+ ? html` <li approver ?current=${this.current <= 0} ?past=${this.current > 0}><span>1</span>ME</li> `
88
+ : html``}
89
+ ${items.map((item, order) => this.renderItem(item, order + 1))}
90
+ </ol>
91
+ `
92
+ }
93
+
94
+ renderItem(item: ApprovalLineItem, order: number): TemplateResult {
95
+ const { type, approver } = item
96
+ const { name } = approver || {
97
+ name: [OrgMemberTargetType.Myself, OrgMemberTargetType.MySupervisor, OrgMemberTargetType.MyDepartment].includes(
98
+ type!
99
+ )
100
+ ? i18next.t(`label.${type}`)
101
+ : ''
102
+ }
103
+
104
+ return html`
105
+ <li approver ?current=${this.current == order} ?past=${this.current > order}><span>${order + 1}</span>${name}</li>
106
+ `
107
+ }
108
+ }
@@ -3,6 +3,7 @@ import { customElement, property, query } from 'lit/decorators.js'
3
3
 
4
4
  import { i18next, localize } from '@operato/i18n'
5
5
  import { ApprovalLineItem } from '../types/approval-line'
6
+ import { OrgMemberTargetType } from '../types/org-member'
6
7
 
7
8
  @customElement('approval-line-view')
8
9
  export class ApprovalLineView extends localize(i18next)(LitElement) {
@@ -26,15 +27,16 @@ export class ApprovalLineView extends localize(i18next)(LitElement) {
26
27
  margin: 0;
27
28
  padding: 0;
28
29
  display: flex;
29
- gap:15px;
30
+ gap: 15px;
30
31
  list-style-type: none;
31
32
  }
32
33
 
33
34
  li {
34
35
  text-align: center;
35
- font-size:var(--fontsize-default);
36
+ font-size: var(--fontsize-default);
36
37
  }
37
- span:before {
38
+
39
+ li:before {
38
40
  content: '';
39
41
  height: 2px;
40
42
  width: 15px;
@@ -45,6 +47,10 @@ export class ApprovalLineView extends localize(i18next)(LitElement) {
45
47
  background-color: rgba(0, 0, 0, 0.4);
46
48
  }
47
49
 
50
+ li:first-child:before {
51
+ display: none;
52
+ }
53
+
48
54
  span {
49
55
  display: block;
50
56
  height: 15px;
@@ -52,12 +58,10 @@ export class ApprovalLineView extends localize(i18next)(LitElement) {
52
58
  margin-bottom: var(--margin-narrow);
53
59
  background-color: rgba(0, 0, 0, 0.5);
54
60
  border-radius: 10px;
55
- font-size:var(--fontsize-small);
61
+ font-size: var(--fontsize-small);
56
62
  color: var(--theme-white-color);
57
63
  line-height: 1.2;
58
- }
59
- li:first-child span:before {
60
- display: none;
64
+ padding: 0 10px;
61
65
  }
62
66
 
63
67
  [approver][current] {
@@ -78,13 +82,7 @@ export class ApprovalLineView extends localize(i18next)(LitElement) {
78
82
 
79
83
  return html`
80
84
  <ol>
81
- ${this.model
82
- ? html`
83
- <li approver>
84
- <span>ME</span>myself
85
- </span>
86
- `
87
- : html``}
85
+ ${this.model ? html` <li approver><span>ME</span>${i18next.t('label.myself')}</li> ` : html``}
88
86
  ${items.map((item, order) => this.renderItem(item, order + 1))}
89
87
  </ol>
90
88
  `
@@ -92,12 +90,17 @@ export class ApprovalLineView extends localize(i18next)(LitElement) {
92
90
 
93
91
  renderItem(item: ApprovalLineItem, order: number): TemplateResult {
94
92
  const { type, approver } = item
95
- const { name, description, controlNo } = approver || {}
96
- const subname = (description || controlNo) && `(${description || controlNo})`
93
+ const { name } = approver || {
94
+ name: [OrgMemberTargetType.Myself, OrgMemberTargetType.MySupervisor, OrgMemberTargetType.MyDepartment].includes(
95
+ type!
96
+ )
97
+ ? i18next.t(`label.${type}`)
98
+ : ''
99
+ }
97
100
 
98
101
  return html`
99
102
  <li approver ?current=${this.current == order}>
100
- <span>${type}</span>
103
+ <span>${i18next.t('label.' + type)}</span>
101
104
  ${name}
102
105
  </li>
103
106
  `
@@ -0,0 +1,11 @@
1
+ import { LitElement, TemplateResult } from 'lit';
2
+ import { ApprovalLineItem } from '../types/approval-line';
3
+ declare const ApprovalLineBrief_base: (new (...args: any[]) => LitElement) & typeof LitElement;
4
+ export declare class ApprovalLineBrief extends ApprovalLineBrief_base {
5
+ static styles: import("lit").CSSResult[];
6
+ model: ApprovalLineItem[];
7
+ current: number;
8
+ render(): TemplateResult<1>;
9
+ renderItem(item: ApprovalLineItem, order: number): TemplateResult;
10
+ }
11
+ export {};
@@ -0,0 +1,114 @@
1
+ import { __decorate, __metadata } from "tslib";
2
+ import { css, html, LitElement } from 'lit';
3
+ import { customElement, property } from 'lit/decorators.js';
4
+ import { i18next, localize } from '@operato/i18n';
5
+ import { OrgMemberTargetType } from '../types/org-member';
6
+ let ApprovalLineBrief = class ApprovalLineBrief extends localize(i18next)(LitElement) {
7
+ constructor() {
8
+ super(...arguments);
9
+ this.model = [];
10
+ this.current = -1;
11
+ }
12
+ render() {
13
+ const items = this.model || [];
14
+ const current = this.current;
15
+ return html `
16
+ <ol>
17
+ ${this.model
18
+ ? html ` <li approver ?current=${this.current <= 0} ?past=${this.current > 0}><span>1</span>ME</li> `
19
+ : html ``}
20
+ ${items.map((item, order) => this.renderItem(item, order + 1))}
21
+ </ol>
22
+ `;
23
+ }
24
+ renderItem(item, order) {
25
+ const { type, approver } = item;
26
+ const { name } = approver || {
27
+ name: [OrgMemberTargetType.Myself, OrgMemberTargetType.MySupervisor, OrgMemberTargetType.MyDepartment].includes(type)
28
+ ? i18next.t(`label.${type}`)
29
+ : ''
30
+ };
31
+ return html `
32
+ <li approver ?current=${this.current == order} ?past=${this.current > order}><span>${order + 1}</span>${name}</li>
33
+ `;
34
+ }
35
+ };
36
+ ApprovalLineBrief.styles = [
37
+ css `
38
+ :host {
39
+ display: block;
40
+ }
41
+
42
+ ol {
43
+ list-style: none;
44
+ margin: 0;
45
+ padding: 0;
46
+ display: flex;
47
+ }
48
+
49
+ li {
50
+ width: 85px;
51
+ text-align: center;
52
+ color: rgba(255, 255, 255, 0.7);
53
+ }
54
+
55
+ span:before {
56
+ content: '';
57
+ height: 2px;
58
+ width: 70px;
59
+ display: block;
60
+ position: absolute;
61
+ margin-left: -70px;
62
+ margin-top: 6px;
63
+ background-color: rgba(0, 0, 0, 0.4);
64
+ }
65
+
66
+ span {
67
+ display: block;
68
+ width: 15px;
69
+ height: 15px;
70
+ margin: auto;
71
+ background-color: rgba(0, 0, 0, 0.4);
72
+ border-radius: 50%;
73
+ color: var(--theme-white-color);
74
+ line-height: 1.2;
75
+ }
76
+
77
+ [past] span {
78
+ background-color: rgba(255, 255, 255, 0.9);
79
+ color: var(--primary-text-color);
80
+ }
81
+
82
+ [current] span {
83
+ background-color: #84d600;
84
+ color: var(--theme-white-color);
85
+ }
86
+
87
+ [current] {
88
+ font-weight: bold;
89
+ color: var(--theme-white-color);
90
+ }
91
+
92
+ [past] span:before,
93
+ [current] span:before {
94
+ background-color: rgba(255, 255, 255, 0.9);
95
+ }
96
+
97
+ li:first-child span:before {
98
+ display: none;
99
+ }
100
+ `
101
+ ];
102
+ __decorate([
103
+ property({ type: Array }),
104
+ __metadata("design:type", Array)
105
+ ], ApprovalLineBrief.prototype, "model", void 0);
106
+ __decorate([
107
+ property({ type: Number }),
108
+ __metadata("design:type", Number)
109
+ ], ApprovalLineBrief.prototype, "current", void 0);
110
+ ApprovalLineBrief = __decorate([
111
+ customElement('approval-line-brief')
112
+ ], ApprovalLineBrief);
113
+ export { ApprovalLineBrief };
114
+ //# sourceMappingURL=approval-line-brief.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"approval-line-brief.js","sourceRoot":"","sources":["../../client/component/approval-line-brief.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAA;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAEjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAGlD,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAA7D;;QAoEsB,UAAK,GAAuB,EAAE,CAAA;QAC7B,YAAO,GAAW,CAAC,CAAC,CAAA;IA8BlD,CAAC;IA5BC,MAAM;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QAC9B,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAA;QAE5B,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,KAAK;YACV,CAAC,CAAC,IAAI,CAAA,0BAA0B,IAAI,CAAC,OAAO,IAAI,CAAC,UAAU,IAAI,CAAC,OAAO,GAAG,CAAC,yBAAyB;YACpG,CAAC,CAAC,IAAI,CAAA,EAAE;UACR,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;;KAEjE,CAAA;IACH,CAAC;IAED,UAAU,CAAC,IAAsB,EAAE,KAAa;QAC9C,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAA;QAC/B,MAAM,EAAE,IAAI,EAAE,GAAG,QAAQ,IAAI;YAC3B,IAAI,EAAE,CAAC,mBAAmB,CAAC,MAAM,EAAE,mBAAmB,CAAC,YAAY,EAAE,mBAAmB,CAAC,YAAY,CAAC,CAAC,QAAQ,CAC7G,IAAK,CACN;gBACC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC;gBAC5B,CAAC,CAAC,EAAE;SACP,CAAA;QAED,OAAO,IAAI,CAAA;8BACe,IAAI,CAAC,OAAO,IAAI,KAAK,UAAU,IAAI,CAAC,OAAO,GAAG,KAAK,UAAU,KAAK,GAAG,CAAC,UAAU,IAAI;KAC7G,CAAA;IACH,CAAC;;AAjGM,wBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+DF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;gDAA+B;AACzD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;kDAAqB;AArErC,iBAAiB;IAD7B,aAAa,CAAC,qBAAqB,CAAC;GACxB,iBAAiB,CAmG7B;SAnGY,iBAAiB","sourcesContent":["import { css, html, LitElement, TemplateResult } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { ApprovalLineItem } from '../types/approval-line'\nimport { OrgMemberTargetType } from '../types/org-member'\n\n@customElement('approval-line-brief')\nexport class ApprovalLineBrief extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n display: block;\n }\n\n ol {\n list-style: none;\n margin: 0;\n padding: 0;\n display: flex;\n }\n\n li {\n width: 85px;\n text-align: center;\n color: rgba(255, 255, 255, 0.7);\n }\n\n span:before {\n content: '';\n height: 2px;\n width: 70px;\n display: block;\n position: absolute;\n margin-left: -70px;\n margin-top: 6px;\n background-color: rgba(0, 0, 0, 0.4);\n }\n\n span {\n display: block;\n width: 15px;\n height: 15px;\n margin: auto;\n background-color: rgba(0, 0, 0, 0.4);\n border-radius: 50%;\n color: var(--theme-white-color);\n line-height: 1.2;\n }\n\n [past] span {\n background-color: rgba(255, 255, 255, 0.9);\n color: var(--primary-text-color);\n }\n\n [current] span {\n background-color: #84d600;\n color: var(--theme-white-color);\n }\n\n [current] {\n font-weight: bold;\n color: var(--theme-white-color);\n }\n\n [past] span:before,\n [current] span:before {\n background-color: rgba(255, 255, 255, 0.9);\n }\n\n li:first-child span:before {\n display: none;\n }\n `\n ]\n\n @property({ type: Array }) model: ApprovalLineItem[] = []\n @property({ type: Number }) current: number = -1\n\n render() {\n const items = this.model || []\n const current = this.current\n\n return html`\n <ol>\n ${this.model\n ? html` <li approver ?current=${this.current <= 0} ?past=${this.current > 0}><span>1</span>ME</li> `\n : html``}\n ${items.map((item, order) => this.renderItem(item, order + 1))}\n </ol>\n `\n }\n\n renderItem(item: ApprovalLineItem, order: number): TemplateResult {\n const { type, approver } = item\n const { name } = approver || {\n name: [OrgMemberTargetType.Myself, OrgMemberTargetType.MySupervisor, OrgMemberTargetType.MyDepartment].includes(\n type!\n )\n ? i18next.t(`label.${type}`)\n : ''\n }\n\n return html`\n <li approver ?current=${this.current == order} ?past=${this.current > order}><span>${order + 1}</span>${name}</li>\n `\n }\n}\n"]}
@@ -2,6 +2,7 @@ import { __decorate, __metadata } from "tslib";
2
2
  import { css, html, LitElement } from 'lit';
3
3
  import { customElement, property } from 'lit/decorators.js';
4
4
  import { i18next, localize } from '@operato/i18n';
5
+ import { OrgMemberTargetType } from '../types/org-member';
5
6
  let ApprovalLineView = class ApprovalLineView extends localize(i18next)(LitElement) {
6
7
  constructor() {
7
8
  super(...arguments);
@@ -11,24 +12,21 @@ let ApprovalLineView = class ApprovalLineView extends localize(i18next)(LitEleme
11
12
  const items = this.model || [];
12
13
  return html `
13
14
  <ol>
14
- ${this.model
15
- ? html `
16
- <li approver>
17
- <span>ME</span>myself
18
- </span>
19
- `
20
- : html ``}
15
+ ${this.model ? html ` <li approver><span>ME</span>${i18next.t('label.myself')}</li> ` : html ``}
21
16
  ${items.map((item, order) => this.renderItem(item, order + 1))}
22
17
  </ol>
23
18
  `;
24
19
  }
25
20
  renderItem(item, order) {
26
21
  const { type, approver } = item;
27
- const { name, description, controlNo } = approver || {};
28
- const subname = (description || controlNo) && `(${description || controlNo})`;
22
+ const { name } = approver || {
23
+ name: [OrgMemberTargetType.Myself, OrgMemberTargetType.MySupervisor, OrgMemberTargetType.MyDepartment].includes(type)
24
+ ? i18next.t(`label.${type}`)
25
+ : ''
26
+ };
29
27
  return html `
30
28
  <li approver ?current=${this.current == order}>
31
- <span>${type}</span>
29
+ <span>${i18next.t('label.' + type)}</span>
32
30
  ${name}
33
31
  </li>
34
32
  `;
@@ -54,15 +52,16 @@ ApprovalLineView.styles = [
54
52
  margin: 0;
55
53
  padding: 0;
56
54
  display: flex;
57
- gap:15px;
55
+ gap: 15px;
58
56
  list-style-type: none;
59
57
  }
60
58
 
61
59
  li {
62
60
  text-align: center;
63
- font-size:var(--fontsize-default);
61
+ font-size: var(--fontsize-default);
64
62
  }
65
- span:before {
63
+
64
+ li:before {
66
65
  content: '';
67
66
  height: 2px;
68
67
  width: 15px;
@@ -73,6 +72,10 @@ ApprovalLineView.styles = [
73
72
  background-color: rgba(0, 0, 0, 0.4);
74
73
  }
75
74
 
75
+ li:first-child:before {
76
+ display: none;
77
+ }
78
+
76
79
  span {
77
80
  display: block;
78
81
  height: 15px;
@@ -80,12 +83,10 @@ ApprovalLineView.styles = [
80
83
  margin-bottom: var(--margin-narrow);
81
84
  background-color: rgba(0, 0, 0, 0.5);
82
85
  border-radius: 10px;
83
- font-size:var(--fontsize-small);
86
+ font-size: var(--fontsize-small);
84
87
  color: var(--theme-white-color);
85
88
  line-height: 1.2;
86
- }
87
- li:first-child span:before {
88
- display: none;
89
+ padding: 0 10px;
89
90
  }
90
91
 
91
92
  [approver][current] {
@@ -1 +1 @@
1
- {"version":3,"file":"approval-line-view.js","sourceRoot":"","sources":["../../client/component/approval-line-view.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAA;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAI1C,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAA5D;;QAkEuB,YAAO,GAAY,CAAC,CAAC,CAAA;IA+BnD,CAAC;IA7BC,MAAM;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QAE9B,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,KAAK;YACV,CAAC,CAAC,IAAI,CAAA;;;;aAIH;YACH,CAAC,CAAC,IAAI,CAAA,EAAE;UACR,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;;KAEjE,CAAA;IACH,CAAC;IAED,UAAU,CAAC,IAAsB,EAAE,KAAa;QAC9C,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAA;QAC/B,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,QAAQ,IAAI,EAAE,CAAA;QACvD,MAAM,OAAO,GAAG,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,IAAI,SAAS,GAAG,CAAA;QAE7E,OAAO,IAAI,CAAA;8BACe,IAAI,CAAC,OAAO,IAAI,KAAK;gBACnC,IAAI;UACV,IAAI;;KAET,CAAA;IACH,CAAC;;AA/FM,uBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4DF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+CAA2B;AACtD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;iDAAsB;AAlEtC,gBAAgB;IAD5B,aAAa,CAAC,oBAAoB,CAAC;GACvB,gBAAgB,CAiG5B;SAjGY,gBAAgB","sourcesContent":["import { css, html, LitElement, TemplateResult } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { ApprovalLineItem } from '../types/approval-line'\n\n@customElement('approval-line-view')\nexport class ApprovalLineView extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n padding: 10px;\n justify-content: center;\n align-items: center;\n\n background-color: #fff;\n\n --mdc-icon-size: 3em;\n color: var(--secondary-color, black);\n }\n\n ol {\n margin: 0;\n padding: 0;\n display: flex;\n gap:15px;\n list-style-type: none;\n }\n\n li {\n text-align: center;\n font-size:var(--fontsize-default);\n }\n span:before {\n content: '';\n height: 2px;\n width: 15px;\n display: block;\n position: absolute;\n margin-left: -15px;\n margin-top: 6px;\n background-color: rgba(0, 0, 0, 0.4);\n }\n\n span {\n display: block;\n height: 15px;\n margin: auto;\n margin-bottom: var(--margin-narrow);\n background-color: rgba(0, 0, 0, 0.5);\n border-radius: 10px;\n font-size:var(--fontsize-small);\n color: var(--theme-white-color);\n line-height: 1.2;\n }\n li:first-child span:before {\n display: none;\n }\n\n [approver][current] {\n font-weight: bold;\n }\n [approver][current] span {\n background-color: #84d600;\n color: var(--theme-white-color);\n }\n `\n ]\n\n @property({ type: Object }) model?: ApprovalLineItem[]\n @property({ type: Number }) current?: number = -1\n\n render() {\n const items = this.model || []\n\n return html`\n <ol>\n ${this.model\n ? html`\n <li approver>\n <span>ME</span>myself\n </span>\n `\n : html``}\n ${items.map((item, order) => this.renderItem(item, order + 1))}\n </ol>\n `\n }\n\n renderItem(item: ApprovalLineItem, order: number): TemplateResult {\n const { type, approver } = item\n const { name, description, controlNo } = approver || {}\n const subname = (description || controlNo) && `(${description || controlNo})`\n\n return html`\n <li approver ?current=${this.current == order}>\n <span>${type}</span>\n ${name}\n </li>\n `\n }\n}\n"]}
1
+ {"version":3,"file":"approval-line-view.js","sourceRoot":"","sources":["../../client/component/approval-line-view.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAA;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAEjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAGlD,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAA5D;;QAqEuB,YAAO,GAAY,CAAC,CAAC,CAAA;IA8BnD,CAAC;IA5BC,MAAM;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QAE9B,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,gCAAgC,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE;UAC3F,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;;KAEjE,CAAA;IACH,CAAC;IAED,UAAU,CAAC,IAAsB,EAAE,KAAa;QAC9C,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAA;QAC/B,MAAM,EAAE,IAAI,EAAE,GAAG,QAAQ,IAAI;YAC3B,IAAI,EAAE,CAAC,mBAAmB,CAAC,MAAM,EAAE,mBAAmB,CAAC,YAAY,EAAE,mBAAmB,CAAC,YAAY,CAAC,CAAC,QAAQ,CAC7G,IAAK,CACN;gBACC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC;gBAC5B,CAAC,CAAC,EAAE;SACP,CAAA;QAED,OAAO,IAAI,CAAA;8BACe,IAAI,CAAC,OAAO,IAAI,KAAK;gBACnC,OAAO,CAAC,CAAC,CAAC,QAAQ,GAAG,IAAI,CAAC;UAChC,IAAI;;KAET,CAAA;IACH,CAAC;;AAjGM,uBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+DF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+CAA2B;AACtD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;iDAAsB;AArEtC,gBAAgB;IAD5B,aAAa,CAAC,oBAAoB,CAAC;GACvB,gBAAgB,CAmG5B;SAnGY,gBAAgB","sourcesContent":["import { css, html, LitElement, TemplateResult } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { ApprovalLineItem } from '../types/approval-line'\nimport { OrgMemberTargetType } from '../types/org-member'\n\n@customElement('approval-line-view')\nexport class ApprovalLineView extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n padding: 10px;\n justify-content: center;\n align-items: center;\n\n background-color: #fff;\n\n --mdc-icon-size: 3em;\n color: var(--secondary-color, black);\n }\n\n ol {\n margin: 0;\n padding: 0;\n display: flex;\n gap: 15px;\n list-style-type: none;\n }\n\n li {\n text-align: center;\n font-size: var(--fontsize-default);\n }\n\n li:before {\n content: '';\n height: 2px;\n width: 15px;\n display: block;\n position: absolute;\n margin-left: -15px;\n margin-top: 6px;\n background-color: rgba(0, 0, 0, 0.4);\n }\n\n li:first-child:before {\n display: none;\n }\n\n span {\n display: block;\n height: 15px;\n margin: auto;\n margin-bottom: var(--margin-narrow);\n background-color: rgba(0, 0, 0, 0.5);\n border-radius: 10px;\n font-size: var(--fontsize-small);\n color: var(--theme-white-color);\n line-height: 1.2;\n padding: 0 10px;\n }\n\n [approver][current] {\n font-weight: bold;\n }\n [approver][current] span {\n background-color: #84d600;\n color: var(--theme-white-color);\n }\n `\n ]\n\n @property({ type: Object }) model?: ApprovalLineItem[]\n @property({ type: Number }) current?: number = -1\n\n render() {\n const items = this.model || []\n\n return html`\n <ol>\n ${this.model ? html` <li approver><span>ME</span>${i18next.t('label.myself')}</li> ` : html``}\n ${items.map((item, order) => this.renderItem(item, order + 1))}\n </ol>\n `\n }\n\n renderItem(item: ApprovalLineItem, order: number): TemplateResult {\n const { type, approver } = item\n const { name } = approver || {\n name: [OrgMemberTargetType.Myself, OrgMemberTargetType.MySupervisor, OrgMemberTargetType.MyDepartment].includes(\n type!\n )\n ? i18next.t(`label.${type}`)\n : ''\n }\n\n return html`\n <li approver ?current=${this.current == order}>\n <span>${i18next.t('label.' + type)}</span>\n ${name}\n </li>\n `\n }\n}\n"]}