@things-factory/contact 7.0.0-alpha.8 → 7.0.0
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.
- package/client/components/contact-popup.ts +16 -9
- package/client/components/contact-selector.ts +11 -7
- package/client/pages/contact-importer.ts +8 -19
- package/client/pages/contact-list-page.ts +5 -9
- package/dist-client/components/contact-popup.d.ts +1 -0
- package/dist-client/components/contact-popup.js +16 -9
- package/dist-client/components/contact-popup.js.map +1 -1
- package/dist-client/components/contact-selector.d.ts +1 -0
- package/dist-client/components/contact-selector.js +10 -6
- package/dist-client/components/contact-selector.js.map +1 -1
- package/dist-client/pages/contact-importer.d.ts +1 -0
- package/dist-client/pages/contact-importer.js +5 -12
- package/dist-client/pages/contact-importer.js.map +1 -1
- package/dist-client/pages/contact-list-page.d.ts +10 -2
- package/dist-client/pages/contact-list-page.js +5 -9
- package/dist-client/pages/contact-list-page.js.map +1 -1
- package/dist-client/route.js.map +1 -1
- package/dist-client/tsconfig.tsbuildinfo +1 -1
- package/dist-server/controllers/index.d.ts +0 -0
- package/dist-server/index.d.ts +4 -0
- package/dist-server/middlewares/index.d.ts +1 -0
- package/dist-server/middlewares/index.js +1 -2
- package/dist-server/middlewares/index.js.map +1 -1
- package/dist-server/migrations/index.d.ts +1 -0
- package/dist-server/routes.d.ts +1 -0
- package/dist-server/service/contact/contact-item.d.ts +11 -0
- package/dist-server/service/contact/contact-item.js +4 -4
- package/dist-server/service/contact/contact-item.js.map +1 -1
- package/dist-server/service/contact/contact-mutation.d.ts +10 -0
- package/dist-server/service/contact/contact-mutation.js +2 -2
- package/dist-server/service/contact/contact-mutation.js.map +1 -1
- package/dist-server/service/contact/contact-query.d.ts +19 -0
- package/dist-server/service/contact/contact-query.js +3 -3
- package/dist-server/service/contact/contact-query.js.map +1 -1
- package/dist-server/service/contact/contact-type.d.ts +31 -0
- package/dist-server/service/contact/contact-type.js +6 -6
- package/dist-server/service/contact/contact-type.js.map +1 -1
- package/dist-server/service/contact/contact.d.ts +38 -0
- package/dist-server/service/contact/contact.js +6 -6
- package/dist-server/service/contact/contact.js.map +1 -1
- package/dist-server/service/contact/index.d.ts +6 -0
- package/dist-server/service/contact/profile.d.ts +14 -0
- package/dist-server/service/contact/profile.js +4 -4
- package/dist-server/service/contact/profile.js.map +1 -1
- package/dist-server/service/index.d.ts +8 -0
- package/dist-server/tsconfig.tsbuildinfo +1 -1
- package/package.json +10 -10
- package/server/service/contact/contact-query.ts +1 -1
- package/server/service/contact/contact.ts +3 -3
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import '@material/web/icon/icon.js'
|
|
1
2
|
import '@operato/contact/ox-contact-view.js'
|
|
2
3
|
import '@operato/contact/ox-contact-edit.js'
|
|
3
4
|
|
|
@@ -20,12 +21,13 @@ export class ContactPopup extends LitElement {
|
|
|
20
21
|
:host {
|
|
21
22
|
display: flex;
|
|
22
23
|
flex-direction: column;
|
|
24
|
+
color: var(--popup-content-color);
|
|
23
25
|
background-color: var(--popup-content-background-color);
|
|
24
26
|
}
|
|
25
27
|
|
|
26
28
|
[content] {
|
|
27
29
|
flex: 1;
|
|
28
|
-
padding: var(--
|
|
30
|
+
padding: var(--spacing-medium);
|
|
29
31
|
overflow: auto;
|
|
30
32
|
}
|
|
31
33
|
`
|
|
@@ -57,24 +59,29 @@ export class ContactPopup extends LitElement {
|
|
|
57
59
|
? html`
|
|
58
60
|
${this.detachable
|
|
59
61
|
? html`
|
|
60
|
-
<
|
|
61
|
-
raised
|
|
62
|
+
<button
|
|
62
63
|
danger
|
|
63
64
|
@click=${() => {
|
|
64
65
|
this.dispatchEvent(new CustomEvent('detach'))
|
|
65
66
|
history.back()
|
|
66
67
|
}}
|
|
67
|
-
>${i18next.t('button.detach')}</mwc-button
|
|
68
68
|
>
|
|
69
|
+
<md-icon>link_off</md-icon>
|
|
70
|
+
${i18next.t('button.detach')}
|
|
71
|
+
</button>
|
|
69
72
|
`
|
|
70
73
|
: html``}
|
|
71
|
-
<
|
|
72
|
-
<
|
|
74
|
+
<button @click=${() => (this.editMode = true)}><md-icon>edit</md-icon>${i18next.t('button.edit')}</button>
|
|
75
|
+
<button @click=${() => history.back()}><md-icon>close</md-icon>${i18next.t('button.close')}</button>
|
|
73
76
|
`
|
|
74
77
|
: html`
|
|
75
|
-
<
|
|
76
|
-
<
|
|
77
|
-
|
|
78
|
+
<button @click=${() => this.editor.save()}><md-icon>save</md-icon>${i18next.t('button.save')}</button>
|
|
79
|
+
<button @click=${() => this.editor.cancel()}>
|
|
80
|
+
<md-icon>cancel</md-icon>${i18next.t('button.cancel')}
|
|
81
|
+
</button>
|
|
82
|
+
<button @click=${() => this.editor.reset()}>
|
|
83
|
+
<md-icon>restart_alt</md-icon>${i18next.t('button.reset')}
|
|
84
|
+
</button>
|
|
78
85
|
`}
|
|
79
86
|
</div>
|
|
80
87
|
`
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import '@material/web/icon/icon.js'
|
|
1
2
|
import '@operato/data-grist'
|
|
2
3
|
|
|
3
4
|
import gql from 'graphql-tag'
|
|
@@ -20,7 +21,7 @@ export class ContactSelector extends LitElement {
|
|
|
20
21
|
display: flex;
|
|
21
22
|
flex-direction: column;
|
|
22
23
|
|
|
23
|
-
background-color:
|
|
24
|
+
background-color: var(--md-sys-color-surface);
|
|
24
25
|
|
|
25
26
|
width: var(--overlay-center-normal-width, 50%);
|
|
26
27
|
height: var(--overlay-center-normal-height, 50%);
|
|
@@ -37,7 +38,7 @@ export class ContactSelector extends LitElement {
|
|
|
37
38
|
}
|
|
38
39
|
|
|
39
40
|
#filters > * {
|
|
40
|
-
padding: var(--
|
|
41
|
+
padding: var(--spacing-medium) var(--spacing-large);
|
|
41
42
|
}
|
|
42
43
|
`
|
|
43
44
|
]
|
|
@@ -66,10 +67,13 @@ export class ContactSelector extends LitElement {
|
|
|
66
67
|
</div>
|
|
67
68
|
</ox-grist>
|
|
68
69
|
|
|
69
|
-
<div class="button-container">
|
|
70
|
-
<
|
|
71
|
-
|
|
72
|
-
|
|
70
|
+
<div class="button-container" style="margin-left:unset;">
|
|
71
|
+
<button @click=${this.onEmpty.bind(this)}>
|
|
72
|
+
<md-icon>check_box_outline_blank</md-icon>${i18next.t('button.empty')}
|
|
73
|
+
</button>
|
|
74
|
+
<div filler></div>
|
|
75
|
+
<button @click=${this.onCancel.bind(this)}><md-icon>cancel</md-icon>${i18next.t('button.cancel')}</button>
|
|
76
|
+
<button @click=${this.onConfirm.bind(this)}><md-icon>done</md-icon>${i18next.t('button.confirm')}</button>
|
|
73
77
|
</div>
|
|
74
78
|
`
|
|
75
79
|
}
|
|
@@ -148,7 +152,7 @@ export class ContactSelector extends LitElement {
|
|
|
148
152
|
|
|
149
153
|
async firstUpdated() {
|
|
150
154
|
this.config = {
|
|
151
|
-
pagination: { pages
|
|
155
|
+
pagination: { pages: [100, 200, 500] },
|
|
152
156
|
list: {
|
|
153
157
|
thumbnail: 'profile',
|
|
154
158
|
fields: ['name', 'company'],
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import '@material/web/icon/icon.js'
|
|
1
2
|
import '@operato/data-grist'
|
|
2
3
|
|
|
3
4
|
import gql from 'graphql-tag'
|
|
@@ -7,30 +8,22 @@ import { property } from 'lit/decorators.js'
|
|
|
7
8
|
import { client } from '@operato/graphql'
|
|
8
9
|
import { i18next } from '@operato/i18n'
|
|
9
10
|
import { isMobileDevice } from '@operato/utils'
|
|
11
|
+
import { ButtonContainerStyles } from '@operato/styles'
|
|
10
12
|
|
|
11
13
|
export class ContactImporter extends LitElement {
|
|
12
14
|
static styles = [
|
|
15
|
+
ButtonContainerStyles,
|
|
13
16
|
css`
|
|
14
17
|
:host {
|
|
15
18
|
display: flex;
|
|
16
19
|
flex-direction: column;
|
|
17
20
|
|
|
18
|
-
background-color:
|
|
21
|
+
background-color: var(--md-sys-color-surface);
|
|
19
22
|
}
|
|
20
23
|
|
|
21
24
|
ox-grist {
|
|
22
25
|
flex: 1;
|
|
23
26
|
}
|
|
24
|
-
|
|
25
|
-
.button-container {
|
|
26
|
-
display: flex;
|
|
27
|
-
margin-left: auto;
|
|
28
|
-
padding: var(--padding-default);
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
mwc-button {
|
|
32
|
-
margin-left: var(--margin-default);
|
|
33
|
-
}
|
|
34
27
|
`
|
|
35
28
|
]
|
|
36
29
|
|
|
@@ -60,21 +53,18 @@ export class ContactImporter extends LitElement {
|
|
|
60
53
|
]
|
|
61
54
|
}
|
|
62
55
|
|
|
63
|
-
|
|
64
56
|
render() {
|
|
65
57
|
return html`
|
|
66
58
|
<ox-grist
|
|
67
59
|
.mode=${isMobileDevice() ? 'LIST' : 'GRID'}
|
|
68
60
|
.config=${this.columns}
|
|
69
|
-
.data=${
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
}
|
|
73
|
-
}
|
|
61
|
+
.data=${{
|
|
62
|
+
records: this.contacts
|
|
63
|
+
}}
|
|
74
64
|
></ox-grist>
|
|
75
65
|
|
|
76
66
|
<div class="button-container">
|
|
77
|
-
<
|
|
67
|
+
<button @click="${this.save.bind(this)}"><md-icon>save</md-icon>${i18next.t('button.save')}</button>
|
|
78
68
|
</div>
|
|
79
69
|
`
|
|
80
70
|
}
|
|
@@ -94,4 +84,3 @@ export class ContactImporter extends LitElement {
|
|
|
94
84
|
this.dispatchEvent(new CustomEvent('imported'))
|
|
95
85
|
}
|
|
96
86
|
}
|
|
97
|
-
|
|
@@ -80,7 +80,10 @@ export class ContactListPage extends connect(store)(localize(i18next)(ScopedElem
|
|
|
80
80
|
{
|
|
81
81
|
icon: 'delete',
|
|
82
82
|
title: i18next.t('button.delete'),
|
|
83
|
-
action: this._deleteContact.bind(this)
|
|
83
|
+
action: this._deleteContact.bind(this),
|
|
84
|
+
emphasis: {
|
|
85
|
+
danger: true
|
|
86
|
+
}
|
|
84
87
|
}
|
|
85
88
|
],
|
|
86
89
|
exportable: {
|
|
@@ -100,14 +103,7 @@ export class ContactListPage extends connect(store)(localize(i18next)(ScopedElem
|
|
|
100
103
|
return html`
|
|
101
104
|
<ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
|
|
102
105
|
<div slot="headroom" class="header">
|
|
103
|
-
<div class="title">
|
|
104
|
-
<mwc-icon>summarize</mwc-icon>
|
|
105
|
-
${i18next.t('title.contact list')}
|
|
106
|
-
</div>
|
|
107
|
-
|
|
108
|
-
<!-- <div class="filters">
|
|
109
|
-
<ox-filters-form class="filter" autofocus without-search></ox-filters-form>
|
|
110
|
-
</div> -->
|
|
106
|
+
<div class="title">${i18next.t('title.contact list')}</div>
|
|
111
107
|
|
|
112
108
|
<ox-context-page-toolbar class="actions" .context=${this.context}></ox-context-page-toolbar>
|
|
113
109
|
</div>
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { __decorate, __metadata, __rest } from "tslib";
|
|
2
|
+
import '@material/web/icon/icon.js';
|
|
2
3
|
import '@operato/contact/ox-contact-view.js';
|
|
3
4
|
import '@operato/contact/ox-contact-edit.js';
|
|
4
5
|
import { html, css, LitElement } from 'lit';
|
|
@@ -35,24 +36,29 @@ let ContactPopup = class ContactPopup extends LitElement {
|
|
|
35
36
|
? html `
|
|
36
37
|
${this.detachable
|
|
37
38
|
? html `
|
|
38
|
-
<
|
|
39
|
-
raised
|
|
39
|
+
<button
|
|
40
40
|
danger
|
|
41
41
|
@click=${() => {
|
|
42
42
|
this.dispatchEvent(new CustomEvent('detach'));
|
|
43
43
|
history.back();
|
|
44
44
|
}}
|
|
45
|
-
>${i18next.t('button.detach')}</mwc-button
|
|
46
45
|
>
|
|
46
|
+
<md-icon>link_off</md-icon>
|
|
47
|
+
${i18next.t('button.detach')}
|
|
48
|
+
</button>
|
|
47
49
|
`
|
|
48
50
|
: html ``}
|
|
49
|
-
<
|
|
50
|
-
<
|
|
51
|
+
<button @click=${() => (this.editMode = true)}><md-icon>edit</md-icon>${i18next.t('button.edit')}</button>
|
|
52
|
+
<button @click=${() => history.back()}><md-icon>close</md-icon>${i18next.t('button.close')}</button>
|
|
51
53
|
`
|
|
52
54
|
: html `
|
|
53
|
-
<
|
|
54
|
-
<
|
|
55
|
-
|
|
55
|
+
<button @click=${() => this.editor.save()}><md-icon>save</md-icon>${i18next.t('button.save')}</button>
|
|
56
|
+
<button @click=${() => this.editor.cancel()}>
|
|
57
|
+
<md-icon>cancel</md-icon>${i18next.t('button.cancel')}
|
|
58
|
+
</button>
|
|
59
|
+
<button @click=${() => this.editor.reset()}>
|
|
60
|
+
<md-icon>restart_alt</md-icon>${i18next.t('button.reset')}
|
|
61
|
+
</button>
|
|
56
62
|
`}
|
|
57
63
|
</div>
|
|
58
64
|
`;
|
|
@@ -137,12 +143,13 @@ ContactPopup.styles = [
|
|
|
137
143
|
:host {
|
|
138
144
|
display: flex;
|
|
139
145
|
flex-direction: column;
|
|
146
|
+
color: var(--popup-content-color);
|
|
140
147
|
background-color: var(--popup-content-background-color);
|
|
141
148
|
}
|
|
142
149
|
|
|
143
150
|
[content] {
|
|
144
151
|
flex: 1;
|
|
145
|
-
padding: var(--
|
|
152
|
+
padding: var(--spacing-medium);
|
|
146
153
|
overflow: auto;
|
|
147
154
|
}
|
|
148
155
|
`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"contact-popup.js","sourceRoot":"","sources":["../../client/components/contact-popup.ts"],"names":[],"mappings":";AAAA,OAAO,qCAAqC,CAAA;AAC5C,OAAO,qCAAqC,CAAA;AAE5C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAS,MAAM,mBAAmB,CAAA;AACzE,OAAO,GAAG,MAAM,aAAa,CAAA;AAE7B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AAEzC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,qBAAqB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAA;AAG5D,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;
|
|
1
|
+
{"version":3,"file":"contact-popup.js","sourceRoot":"","sources":["../../client/components/contact-popup.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/contact/ox-contact-view.js'\nimport '@operato/contact/ox-contact-edit.js'\n\nimport { html, css, LitElement } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport gql from 'graphql-tag'\n\nimport { client } from '@operato/graphql'\nimport { Contact } from '@operato/contact/ox-contact.js'\nimport { i18next } from '@operato/i18n'\nimport { ButtonContainerStyles, ScrollbarStyles } from '@operato/styles'\nimport { OxContactEdit } from '@operato/contact/ox-contact-edit.js'\n\n@customElement('contact-popup')\nexport class ContactPopup extends LitElement {\n static styles = [\n ScrollbarStyles,\n ButtonContainerStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n color: var(--popup-content-color);\n background-color: var(--popup-content-background-color);\n }\n\n [content] {\n flex: 1;\n padding: var(--spacing-medium);\n overflow: auto;\n }\n `\n ]\n\n @property({ type: Object }) contact: Contact = {}\n @property({ type: Boolean, attribute: 'edit-mode' }) editMode?: boolean = false\n @property({ type: Boolean }) detachable?: boolean = false\n\n @query('ox-contact-edit') editor!: OxContactEdit\n\n render() {\n return html`\n <div content>\n ${this.editMode\n ? html`<ox-contact-edit\n .contact=${this.contact}\n @edit-cancel=${() => (this.editMode = false)}\n @edit-done=${(e: CustomEvent) => {\n this.updateContact(e.detail)\n this.editMode = false\n }}\n ></ox-contact-edit>`\n : html` <ox-contact-view .contact=${this.contact}></ox-contact-view>`}\n </div>\n\n <div class=\"button-container\">\n ${!this.editMode\n ? html`\n ${this.detachable\n ? html`\n <button\n danger\n @click=${() => {\n this.dispatchEvent(new CustomEvent('detach'))\n history.back()\n }}\n >\n <md-icon>link_off</md-icon>\n ${i18next.t('button.detach')}\n </button>\n `\n : html``}\n <button @click=${() => (this.editMode = true)}><md-icon>edit</md-icon>${i18next.t('button.edit')}</button>\n <button @click=${() => history.back()}><md-icon>close</md-icon>${i18next.t('button.close')}</button>\n `\n : html`\n <button @click=${() => this.editor.save()}><md-icon>save</md-icon>${i18next.t('button.save')}</button>\n <button @click=${() => this.editor.cancel()}>\n <md-icon>cancel</md-icon>${i18next.t('button.cancel')}\n </button>\n <button @click=${() => this.editor.reset()}>\n <md-icon>restart_alt</md-icon>${i18next.t('button.reset')}\n </button>\n `}\n </div>\n `\n }\n\n async updateContact(contact: Contact) {\n if (contact.id) {\n var { id, ...patch } = contact\n\n var response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $patch: ContactPatch!) {\n contact: updateContact(id: $id, patch: $patch) {\n id\n name\n company\n email\n note\n items {\n label\n type\n value\n }\n profile {\n left\n top\n zoom\n picture\n }\n }\n }\n `,\n variables: {\n id,\n patch\n },\n context: {\n hasUpload: true\n }\n })\n } else {\n var response = await client.mutate({\n mutation: gql`\n mutation ($contact: NewContact!) {\n contact: createContact(contact: $contact) {\n id\n name\n company\n email\n note\n items {\n label\n type\n value\n }\n profile {\n left\n top\n zoom\n picture\n }\n }\n }\n `,\n variables: {\n contact\n },\n context: {\n hasUpload: true\n }\n })\n }\n\n this.contact = response.data.contact\n\n this.dispatchEvent(\n new CustomEvent('change', {\n detail: this.contact\n })\n )\n }\n}\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { __decorate, __metadata } from "tslib";
|
|
2
|
+
import '@material/web/icon/icon.js';
|
|
2
3
|
import '@operato/data-grist';
|
|
3
4
|
import gql from 'graphql-tag';
|
|
4
5
|
import { css, html, LitElement } from 'lit';
|
|
@@ -83,10 +84,13 @@ let ContactSelector = class ContactSelector extends LitElement {
|
|
|
83
84
|
</div>
|
|
84
85
|
</ox-grist>
|
|
85
86
|
|
|
86
|
-
<div class="button-container">
|
|
87
|
-
<
|
|
88
|
-
|
|
89
|
-
|
|
87
|
+
<div class="button-container" style="margin-left:unset;">
|
|
88
|
+
<button @click=${this.onEmpty.bind(this)}>
|
|
89
|
+
<md-icon>check_box_outline_blank</md-icon>${i18next.t('button.empty')}
|
|
90
|
+
</button>
|
|
91
|
+
<div filler></div>
|
|
92
|
+
<button @click=${this.onCancel.bind(this)}><md-icon>cancel</md-icon>${i18next.t('button.cancel')}</button>
|
|
93
|
+
<button @click=${this.onConfirm.bind(this)}><md-icon>done</md-icon>${i18next.t('button.confirm')}</button>
|
|
90
94
|
</div>
|
|
91
95
|
`;
|
|
92
96
|
}
|
|
@@ -245,7 +249,7 @@ ContactSelector.styles = [
|
|
|
245
249
|
display: flex;
|
|
246
250
|
flex-direction: column;
|
|
247
251
|
|
|
248
|
-
background-color:
|
|
252
|
+
background-color: var(--md-sys-color-surface);
|
|
249
253
|
|
|
250
254
|
width: var(--overlay-center-normal-width, 50%);
|
|
251
255
|
height: var(--overlay-center-normal-height, 50%);
|
|
@@ -262,7 +266,7 @@ ContactSelector.styles = [
|
|
|
262
266
|
}
|
|
263
267
|
|
|
264
268
|
#filters > * {
|
|
265
|
-
padding: var(--
|
|
269
|
+
padding: var(--spacing-medium) var(--spacing-large);
|
|
266
270
|
}
|
|
267
271
|
`
|
|
268
272
|
];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"contact-selector.js","sourceRoot":"","sources":["../../client/components/contact-selector.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/data-grist'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { DataGrist, FetchHandler, GristData, GristEventHandler, GristRecord, ZERO_DATA } from '@operato/data-grist'\nimport { client, gqlContext } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { closePopup } from '@operato/popup'\nimport { isMobileDevice } from '@operato/utils'\nimport { ButtonContainerStyles } from '@operato/styles'\n\n@customElement('contact-selector')\nexport class ContactSelector extends LitElement {\n static styles = [\n ButtonContainerStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: #fff;\n\n width: var(--overlay-center-normal-width, 50%);\n height: var(--overlay-center-normal-height, 50%);\n }\n\n ox-grist {\n flex: 1;\n }\n\n #filters {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n }\n\n #filters > * {\n padding: var(--padding-default) var(--padding-wide);\n }\n `\n ]\n\n @property({ type: String }) value?: string\n @property({ type: Object }) config: any\n @property({ type: Object }) data: GristData = ZERO_DATA\n @property({ type: Object }) confirmCallback?: (record?: GristRecord | null) => void\n @property({ type: Array }) selectedRecords: GristRecord[] = []\n\n @property({ type: Object }) list: any\n\n @query('ox-grist') grist!: DataGrist\n\n render() {\n return html`\n <ox-grist\n .mode=${isMobileDevice() ? 'LIST' : 'GRID'}\n .config=${this.config}\n .data=${this.data}\n .fetchHandler=${this.fetchHandler.bind(this)}\n .selectedRecords=${this.selectedRecords}\n >\n <div id=\"filters\" slot=\"headroom\">\n <ox-filters-form autofocus></ox-filters-form>\n </div>\n </ox-grist>\n\n <div class=\"button-container\">\n <mwc-button @click=${this.onEmpty.bind(this)}>${i18next.t('button.empty')}</mwc-button>\n <mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>\n <mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>\n </div>\n `\n }\n\n onEmpty() {\n this.confirmCallback && this.confirmCallback()\n closePopup(this)\n }\n\n onCancel() {\n closePopup(this)\n }\n\n onConfirm() {\n this.confirmCallback && this.confirmCallback(this.selected)\n closePopup(this)\n }\n\n fetchHandler: FetchHandler = async ({ page = 1, limit = 100, sortings = [], filters = [] }) => {\n const response = await client.query({\n query: gql`\n query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {\n fetch: contacts(filters: $filters, pagination: $pagination, sortings: $sortings) {\n items {\n id\n name\n company\n email\n phone\n address\n department\n note\n profile {\n left\n top\n zoom\n picture\n }\n updater {\n id\n name\n }\n updatedAt\n }\n total\n }\n }\n `,\n variables: {\n filters,\n pagination: { page, limit },\n sortings\n },\n context: gqlContext()\n })\n\n if (!response.errors) {\n const records = response.data.fetch.items.map((item: any) => {\n if (this.value && this.value === item.id) {\n this.selectedRecords = [item]\n item['__selected__'] = true\n }\n\n return item\n })\n const total = response.data.fetch.total\n\n return {\n records,\n total,\n limit,\n page\n }\n }\n }\n\n async firstUpdated() {\n this.config = {\n pagination: { pages : [100, 200, 500] },\n list: {\n thumbnail: 'profile',\n fields: ['name', 'company'],\n details: ['email', 'updatedAt']\n },\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: false },\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n record: {\n editable: false\n },\n filter: 'search',\n sortable: true,\n width: 100\n },\n {\n type: 'string',\n name: 'company',\n header: i18next.t('field.company'),\n record: {\n editable: false\n },\n filter: 'search',\n sortable: true,\n width: 135\n },\n {\n type: 'string',\n name: 'department',\n header: i18next.t('field.department'),\n record: {\n editable: false\n },\n // filter: 'search',\n sortable: true,\n width: 135\n },\n {\n type: 'string',\n name: 'email',\n header: i18next.t('field.email'),\n record: {\n editable: false\n },\n // filter: 'search',\n sortable: true,\n width: 190\n },\n {\n type: 'string',\n name: 'phone',\n header: i18next.t('field.phone'),\n record: {\n editable: false\n },\n // filter: 'search',\n sortable: true,\n width: 120\n },\n {\n type: 'string',\n name: 'address',\n header: i18next.t('field.address'),\n record: {\n editable: false\n },\n // filter: 'search',\n sortable: true,\n width: 375\n },\n /*{\n type: 'resource-object',\n name: 'updater',\n header: i18next.t('field.updater'),\n record: {\n editable: false\n },\n sortable: true,\n width: 90\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: i18next.t('field.updated_at'),\n record: {\n editable: false\n },\n sortable: true,\n width: 180\n },*/\n {\n type: 'image',\n name: 'profile',\n record: {\n renderer: function (value, column, record, rowIndex, field) {\n return html`<ox-pfp-view\n style=\"height:90%; width: unset; aspect-ratio: 1 / 1;\"\n .profile=${record.profile}\n .name=${record.name}\n ></ox-pfp-view>`\n }\n },\n hidden: true\n }\n ],\n rows: {\n selectable: {\n multiple: false\n },\n handlers: {\n click: 'select-row'\n },\n appendable: false\n },\n sorters: [\n {\n name: 'name'\n },\n {\n name: 'company'\n }\n ]\n }\n }\n\n get selected() {\n var grist = this.renderRoot.querySelector('ox-grist') as DataGrist\n\n var selected = grist.selected\n\n return selected && selected.length > 0 ? selected[0] : undefined\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"contact-selector.js","sourceRoot":"","sources":["../../client/components/contact-selector.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/data-grist'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { DataGrist, FetchHandler, GristData, GristEventHandler, GristRecord, ZERO_DATA } from '@operato/data-grist'\nimport { client, gqlContext } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { closePopup } from '@operato/popup'\nimport { isMobileDevice } from '@operato/utils'\nimport { ButtonContainerStyles } from '@operato/styles'\n\n@customElement('contact-selector')\nexport class ContactSelector 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 width: var(--overlay-center-normal-width, 50%);\n height: var(--overlay-center-normal-height, 50%);\n }\n\n ox-grist {\n flex: 1;\n }\n\n #filters {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n }\n\n #filters > * {\n padding: var(--spacing-medium) var(--spacing-large);\n }\n `\n ]\n\n @property({ type: String }) value?: string\n @property({ type: Object }) config: any\n @property({ type: Object }) data: GristData = ZERO_DATA\n @property({ type: Object }) confirmCallback?: (record?: GristRecord | null) => void\n @property({ type: Array }) selectedRecords: GristRecord[] = []\n\n @property({ type: Object }) list: any\n\n @query('ox-grist') grist!: DataGrist\n\n render() {\n return html`\n <ox-grist\n .mode=${isMobileDevice() ? 'LIST' : 'GRID'}\n .config=${this.config}\n .data=${this.data}\n .fetchHandler=${this.fetchHandler.bind(this)}\n .selectedRecords=${this.selectedRecords}\n >\n <div id=\"filters\" slot=\"headroom\">\n <ox-filters-form autofocus></ox-filters-form>\n </div>\n </ox-grist>\n\n <div class=\"button-container\" style=\"margin-left:unset;\">\n <button @click=${this.onEmpty.bind(this)}>\n <md-icon>check_box_outline_blank</md-icon>${i18next.t('button.empty')}\n </button>\n <div filler></div>\n <button @click=${this.onCancel.bind(this)}><md-icon>cancel</md-icon>${i18next.t('button.cancel')}</button>\n <button @click=${this.onConfirm.bind(this)}><md-icon>done</md-icon>${i18next.t('button.confirm')}</button>\n </div>\n `\n }\n\n onEmpty() {\n this.confirmCallback && this.confirmCallback()\n closePopup(this)\n }\n\n onCancel() {\n closePopup(this)\n }\n\n onConfirm() {\n this.confirmCallback && this.confirmCallback(this.selected)\n closePopup(this)\n }\n\n fetchHandler: FetchHandler = async ({ page = 1, limit = 100, sortings = [], filters = [] }) => {\n const response = await client.query({\n query: gql`\n query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {\n fetch: contacts(filters: $filters, pagination: $pagination, sortings: $sortings) {\n items {\n id\n name\n company\n email\n phone\n address\n department\n note\n profile {\n left\n top\n zoom\n picture\n }\n updater {\n id\n name\n }\n updatedAt\n }\n total\n }\n }\n `,\n variables: {\n filters,\n pagination: { page, limit },\n sortings\n },\n context: gqlContext()\n })\n\n if (!response.errors) {\n const records = response.data.fetch.items.map((item: any) => {\n if (this.value && this.value === item.id) {\n this.selectedRecords = [item]\n item['__selected__'] = true\n }\n\n return item\n })\n const total = response.data.fetch.total\n\n return {\n records,\n total,\n limit,\n page\n }\n }\n }\n\n async firstUpdated() {\n this.config = {\n pagination: { pages: [100, 200, 500] },\n list: {\n thumbnail: 'profile',\n fields: ['name', 'company'],\n details: ['email', 'updatedAt']\n },\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: false },\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n record: {\n editable: false\n },\n filter: 'search',\n sortable: true,\n width: 100\n },\n {\n type: 'string',\n name: 'company',\n header: i18next.t('field.company'),\n record: {\n editable: false\n },\n filter: 'search',\n sortable: true,\n width: 135\n },\n {\n type: 'string',\n name: 'department',\n header: i18next.t('field.department'),\n record: {\n editable: false\n },\n // filter: 'search',\n sortable: true,\n width: 135\n },\n {\n type: 'string',\n name: 'email',\n header: i18next.t('field.email'),\n record: {\n editable: false\n },\n // filter: 'search',\n sortable: true,\n width: 190\n },\n {\n type: 'string',\n name: 'phone',\n header: i18next.t('field.phone'),\n record: {\n editable: false\n },\n // filter: 'search',\n sortable: true,\n width: 120\n },\n {\n type: 'string',\n name: 'address',\n header: i18next.t('field.address'),\n record: {\n editable: false\n },\n // filter: 'search',\n sortable: true,\n width: 375\n },\n /*{\n type: 'resource-object',\n name: 'updater',\n header: i18next.t('field.updater'),\n record: {\n editable: false\n },\n sortable: true,\n width: 90\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: i18next.t('field.updated_at'),\n record: {\n editable: false\n },\n sortable: true,\n width: 180\n },*/\n {\n type: 'image',\n name: 'profile',\n record: {\n renderer: function (value, column, record, rowIndex, field) {\n return html`<ox-pfp-view\n style=\"height:90%; width: unset; aspect-ratio: 1 / 1;\"\n .profile=${record.profile}\n .name=${record.name}\n ></ox-pfp-view>`\n }\n },\n hidden: true\n }\n ],\n rows: {\n selectable: {\n multiple: false\n },\n handlers: {\n click: 'select-row'\n },\n appendable: false\n },\n sorters: [\n {\n name: 'name'\n },\n {\n name: 'company'\n }\n ]\n }\n }\n\n get selected() {\n var grist = this.renderRoot.querySelector('ox-grist') as DataGrist\n\n var selected = grist.selected\n\n return selected && selected.length > 0 ? selected[0] : undefined\n }\n}\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { __decorate, __metadata } from "tslib";
|
|
2
|
+
import '@material/web/icon/icon.js';
|
|
2
3
|
import '@operato/data-grist';
|
|
3
4
|
import gql from 'graphql-tag';
|
|
4
5
|
import { css, html, LitElement } from 'lit';
|
|
@@ -6,6 +7,7 @@ import { property } from 'lit/decorators.js';
|
|
|
6
7
|
import { client } from '@operato/graphql';
|
|
7
8
|
import { i18next } from '@operato/i18n';
|
|
8
9
|
import { isMobileDevice } from '@operato/utils';
|
|
10
|
+
import { ButtonContainerStyles } from '@operato/styles';
|
|
9
11
|
export class ContactImporter extends LitElement {
|
|
10
12
|
constructor() {
|
|
11
13
|
super(...arguments);
|
|
@@ -46,7 +48,7 @@ export class ContactImporter extends LitElement {
|
|
|
46
48
|
></ox-grist>
|
|
47
49
|
|
|
48
50
|
<div class="button-container">
|
|
49
|
-
<
|
|
51
|
+
<button @click="${this.save.bind(this)}"><md-icon>save</md-icon>${i18next.t('button.save')}</button>
|
|
50
52
|
</div>
|
|
51
53
|
`;
|
|
52
54
|
}
|
|
@@ -66,27 +68,18 @@ export class ContactImporter extends LitElement {
|
|
|
66
68
|
}
|
|
67
69
|
}
|
|
68
70
|
ContactImporter.styles = [
|
|
71
|
+
ButtonContainerStyles,
|
|
69
72
|
css `
|
|
70
73
|
:host {
|
|
71
74
|
display: flex;
|
|
72
75
|
flex-direction: column;
|
|
73
76
|
|
|
74
|
-
background-color:
|
|
77
|
+
background-color: var(--md-sys-color-surface);
|
|
75
78
|
}
|
|
76
79
|
|
|
77
80
|
ox-grist {
|
|
78
81
|
flex: 1;
|
|
79
82
|
}
|
|
80
|
-
|
|
81
|
-
.button-container {
|
|
82
|
-
display: flex;
|
|
83
|
-
margin-left: auto;
|
|
84
|
-
padding: var(--padding-default);
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
mwc-button {
|
|
88
|
-
margin-left: var(--margin-default);
|
|
89
|
-
}
|
|
90
83
|
`
|
|
91
84
|
];
|
|
92
85
|
__decorate([
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"contact-importer.js","sourceRoot":"","sources":["../../client/pages/contact-importer.ts"],"names":[],"mappings":";AAAA,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;
|
|
1
|
+
{"version":3,"file":"contact-importer.js","sourceRoot":"","sources":["../../client/pages/contact-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,eAAgB,SAAQ,UAAU;IAA/C;;QAiB6B,aAAQ,GAAU,EAAE,CAAA;QACnB,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,QAAQ;SACvB;;;;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,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE;SACvC,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,sBAAM,GAAG;IACd,qBAAqB;IACrB,GAAG,CAAA;;;;;;;;;;;KAWF;CACF,AAdY,CAcZ;AAE0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;iDAAqB;AACnB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;gDAuB1B","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 ContactImporter 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 }) contacts: 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.contacts\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 importContacts($contacts: [ContactPatch!]!) {\n importContacts(contacts: $contacts)\n }\n `,\n variables: { contacts: this.contacts }\n })\n\n if (response.errors?.length) return\n\n this.dispatchEvent(new CustomEvent('imported'))\n }\n}\n"]}
|
|
@@ -29,11 +29,19 @@ export declare class ContactListPage extends ContactListPage_base {
|
|
|
29
29
|
handler: () => void;
|
|
30
30
|
};
|
|
31
31
|
help: string;
|
|
32
|
-
actions: {
|
|
32
|
+
actions: ({
|
|
33
33
|
icon: string;
|
|
34
34
|
title: string;
|
|
35
35
|
action: () => Promise<void>;
|
|
36
|
-
|
|
36
|
+
emphasis?: undefined;
|
|
37
|
+
} | {
|
|
38
|
+
icon: string;
|
|
39
|
+
title: string;
|
|
40
|
+
action: () => Promise<void>;
|
|
41
|
+
emphasis: {
|
|
42
|
+
danger: boolean;
|
|
43
|
+
};
|
|
44
|
+
})[];
|
|
37
45
|
exportable: {
|
|
38
46
|
name: string;
|
|
39
47
|
data: () => Promise<{}[]>;
|
|
@@ -55,7 +55,10 @@ let ContactListPage = class ContactListPage extends connect(store)(localize(i18n
|
|
|
55
55
|
{
|
|
56
56
|
icon: 'delete',
|
|
57
57
|
title: i18next.t('button.delete'),
|
|
58
|
-
action: this._deleteContact.bind(this)
|
|
58
|
+
action: this._deleteContact.bind(this),
|
|
59
|
+
emphasis: {
|
|
60
|
+
danger: true
|
|
61
|
+
}
|
|
59
62
|
}
|
|
60
63
|
],
|
|
61
64
|
exportable: {
|
|
@@ -73,14 +76,7 @@ let ContactListPage = class ContactListPage extends connect(store)(localize(i18n
|
|
|
73
76
|
return html `
|
|
74
77
|
<ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
|
|
75
78
|
<div slot="headroom" class="header">
|
|
76
|
-
<div class="title">
|
|
77
|
-
<mwc-icon>summarize</mwc-icon>
|
|
78
|
-
${i18next.t('title.contact list')}
|
|
79
|
-
</div>
|
|
80
|
-
|
|
81
|
-
<!-- <div class="filters">
|
|
82
|
-
<ox-filters-form class="filter" autofocus without-search></ox-filters-form>
|
|
83
|
-
</div> -->
|
|
79
|
+
<div class="title">${i18next.t('title.contact list')}</div>
|
|
84
80
|
|
|
85
81
|
<ox-context-page-toolbar class="actions" .context=${this.context}></ox-context-page-toolbar>
|
|
86
82
|
</div>
|