@things-factory/meta-ui 7.0.1-alpha.42 → 7.0.1-alpha.44
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/actions/main.js +3 -4
- package/client/component/popup/record-based-code-editor-popup.ts +1 -1
- package/client/mixin/meta-tab-mixin.js +1 -1
- package/client/pages/menu/{dynamic-menu-setting-let.js → dynamic-menu-setting-let.ts} +26 -32
- package/client/utils/meta-ui-util.js +1 -1
- package/client/viewparts/{dynamic-menu-part.js → dynamic-menu-part.ts} +50 -51
- package/dist-client/actions/main.js +2 -3
- package/dist-client/actions/main.js.map +1 -1
- package/dist-client/component/popup/record-based-code-editor-popup.d.ts +1 -1
- package/dist-client/component/popup/record-based-code-editor-popup.js +2 -2
- package/dist-client/component/popup/record-based-code-editor-popup.js.map +1 -1
- package/dist-client/mixin/meta-tab-mixin.js +1 -1
- package/dist-client/mixin/meta-tab-mixin.js.map +1 -1
- package/dist-client/pages/menu/dynamic-menu-setting-let.d.ts +9 -7
- package/dist-client/pages/menu/dynamic-menu-setting-let.js +35 -33
- package/dist-client/pages/menu/dynamic-menu-setting-let.js.map +1 -1
- package/dist-client/tsconfig.tsbuildinfo +1 -1
- package/dist-client/utils/meta-ui-util.js +1 -1
- package/dist-client/utils/meta-ui-util.js.map +1 -1
- package/dist-client/viewparts/dynamic-menu-part.d.ts +17 -21
- package/dist-client/viewparts/dynamic-menu-part.js +72 -46
- package/dist-client/viewparts/dynamic-menu-part.js.map +1 -1
- package/package.json +9 -9
package/client/actions/main.js
CHANGED
|
@@ -1,16 +1,15 @@
|
|
|
1
1
|
import '@material/web/icon/icon.js'
|
|
2
|
-
|
|
3
|
-
import '../viewparts/dynamic-menu-part'
|
|
2
|
+
import '../viewparts/dynamic-menu-part.js'
|
|
4
3
|
|
|
5
4
|
import gql from 'graphql-tag'
|
|
6
5
|
import { html } from 'lit'
|
|
7
6
|
|
|
7
|
+
import { store, clientSettingStore } from '@operato/shell'
|
|
8
8
|
import { client } from '@operato/graphql'
|
|
9
9
|
import { appendViewpart, toggleOverlay, TOOL_POSITION, VIEWPART_POSITION } from '@operato/layout'
|
|
10
|
-
import { store } from '@operato/shell'
|
|
11
10
|
import { isMobileDevice } from '@operato/utils'
|
|
11
|
+
|
|
12
12
|
import { APPEND_APP_TOOL, REMOVE_APP_TOOL } from '@things-factory/apptool-base'
|
|
13
|
-
import { clientSettingStore } from '@things-factory/shell'
|
|
14
13
|
|
|
15
14
|
export const UPDATE_META_UI = 'UPDATE_META_UI'
|
|
16
15
|
export const UPDATE_META_MENU_TEMPLATE = 'UPDATE_META_MENU_TEMPLATE'
|
|
@@ -57,7 +57,7 @@ export class RecordBasedCodeEditorPopup extends LitElement {
|
|
|
57
57
|
"value_field": "template", -> 코드 에디터에 표시할 레코드 필드 정보 (변수값)
|
|
58
58
|
"menu": "code-editor", -> 코드 에디터 이름 정보 (고정값)
|
|
59
59
|
"tagname": "record-code-editor-popup", -> 코드 에디터 태그 명 (고정값)
|
|
60
|
-
"location": "@things-factory/meta-ui/client/component/popup/record-code-editor-popup", -> 코드 에디터 파일 위치 (고정값)
|
|
60
|
+
"location": "@things-factory/meta-ui/dist-client/component/popup/record-code-editor-popup", -> 코드 에디터 파일 위치 (고정값)
|
|
61
61
|
"save_action": {
|
|
62
62
|
"func_name": "updateDocTemplate", -> 업데이트 함수 명
|
|
63
63
|
"func_type": "DocTemplatePatch"
|
|
@@ -123,7 +123,7 @@ export const MetaTabMixin = baseElement =>
|
|
|
123
123
|
name: mainInfo.name,
|
|
124
124
|
display: mainInfo.display,
|
|
125
125
|
tagname: 'meta-grist-element',
|
|
126
|
-
location: '@things-factory/meta-ui/client/pages/meta-grist-element',
|
|
126
|
+
location: '@things-factory/meta-ui/dist-client/pages/meta-grist-element',
|
|
127
127
|
parent_field: 'id',
|
|
128
128
|
param_field: 'param_field',
|
|
129
129
|
menu: this.route_name,
|
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
import '@material/mwc-formfield'
|
|
2
|
-
import '@material/mwc-checkbox'
|
|
3
1
|
import '@operato/i18n/ox-i18n.js'
|
|
2
|
+
import '@material/web/checkbox/checkbox.js'
|
|
4
3
|
|
|
5
4
|
import { css, html, LitElement } from 'lit'
|
|
5
|
+
import { customElement, property } from 'lit/decorators.js'
|
|
6
6
|
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
7
|
+
import { clientSettingStore } from '@operato/shell'
|
|
8
|
+
import { i18next, localize } from '@operato/i18n'
|
|
9
9
|
|
|
10
|
-
import { setupMenuPart } from '
|
|
10
|
+
import { setupMenuPart } from '../../actions/main'
|
|
11
11
|
|
|
12
|
+
// TODO @things-factory/lite-menu/lite-menu-setting-let를 사용하도록 통합되어야 한다.
|
|
13
|
+
@customElement('dynamic-menu-setting-let')
|
|
12
14
|
export class DynamicMenuSettingLet extends localize(i18next)(LitElement) {
|
|
13
|
-
static
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
text-transform: var(--label-text-transform);
|
|
20
|
-
}
|
|
21
|
-
`
|
|
22
|
-
]
|
|
23
|
-
}
|
|
15
|
+
static styles = [
|
|
16
|
+
css`
|
|
17
|
+
label {
|
|
18
|
+
display: flex;
|
|
19
|
+
gap: 10px;
|
|
20
|
+
align-items: center;
|
|
24
21
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
22
|
+
font: var(--label-font);
|
|
23
|
+
color: var(--label-color);
|
|
24
|
+
text-transform: var(--label-text-transform);
|
|
25
|
+
}
|
|
26
|
+
`
|
|
27
|
+
]
|
|
28
|
+
|
|
29
|
+
@property({ type: Boolean }) hovering?: boolean
|
|
30
30
|
|
|
31
31
|
render() {
|
|
32
32
|
const checked = this.hovering === true
|
|
@@ -37,14 +37,10 @@ export class DynamicMenuSettingLet extends localize(i18next)(LitElement) {
|
|
|
37
37
|
<ox-i18n slot="title" msgid="title.lite-menu-setting"></ox-i18n>
|
|
38
38
|
|
|
39
39
|
<div slot="content">
|
|
40
|
-
<
|
|
41
|
-
<
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
?checked=${checked}
|
|
45
|
-
?indeterminate=${indeterminate}
|
|
46
|
-
></mwc-checkbox>
|
|
47
|
-
</mwc-formfield>
|
|
40
|
+
<label>
|
|
41
|
+
<md-checkbox id="hovering" @change=${e => this.onChange(e)} ?checked=${checked} ?indeterminate=${indeterminate}></md-checkbox>
|
|
42
|
+
hovering
|
|
43
|
+
</label>
|
|
48
44
|
</div>
|
|
49
45
|
</setting-let>
|
|
50
46
|
`
|
|
@@ -54,7 +50,7 @@ export class DynamicMenuSettingLet extends localize(i18next)(LitElement) {
|
|
|
54
50
|
this.hovering = ((await clientSettingStore.get('dynamic-menu'))?.value || {}).hovering
|
|
55
51
|
}
|
|
56
52
|
|
|
57
|
-
async
|
|
53
|
+
async onChange(e: Event) {
|
|
58
54
|
if (this.hovering === true) {
|
|
59
55
|
this.hovering = false
|
|
60
56
|
} else if (this.hovering === false) {
|
|
@@ -84,5 +80,3 @@ export class DynamicMenuSettingLet extends localize(i18next)(LitElement) {
|
|
|
84
80
|
})
|
|
85
81
|
}
|
|
86
82
|
}
|
|
87
|
-
|
|
88
|
-
customElements.define('dynamic-menu-setting-let', DynamicMenuSettingLet)
|
|
@@ -229,7 +229,7 @@ export class MetaUiUtil {
|
|
|
229
229
|
if (menuMetaData.search && menuMetaData.search.length > 0) {
|
|
230
230
|
menuMetaData.search.forEach(c => {
|
|
231
231
|
let value = c.value
|
|
232
|
-
if (c.operator == 'in' && value.indexOf(',') > 0) {
|
|
232
|
+
if (value && c.operator == 'in' && value.indexOf(',') > 0) {
|
|
233
233
|
c.value = value.split(',')
|
|
234
234
|
}
|
|
235
235
|
})
|
|
@@ -1,57 +1,58 @@
|
|
|
1
|
+
import '@material/web/icon/icon.js'
|
|
1
2
|
import '@operato/menu/ox-menu-portrait.js'
|
|
2
3
|
import '@operato/menu/ox-menu-landscape.js'
|
|
3
4
|
|
|
4
|
-
import { css, html, LitElement } from 'lit'
|
|
5
|
+
import { css, html, LitElement, PropertyValues } from 'lit'
|
|
6
|
+
import { customElement, property, state } from 'lit/decorators.js'
|
|
5
7
|
import { connect } from 'pwa-helpers'
|
|
6
8
|
|
|
7
9
|
import { store } from '@operato/shell'
|
|
8
10
|
import { ScrollbarStyles } from '@operato/styles'
|
|
9
11
|
|
|
10
|
-
|
|
12
|
+
import { Menu } from '@operato/menu/dist/src/types'
|
|
13
|
+
|
|
14
|
+
function isActiveMenu(menu: Menu, path: string) {
|
|
11
15
|
return menu.path?.split('?')[0] === path || (menu.active && typeof menu.active === 'function' && menu.active.call(menu, { path }))
|
|
12
16
|
}
|
|
13
17
|
|
|
18
|
+
// TODO @operato/menu/ox-menu-part를 사용하도록 통합되어야 한다.
|
|
19
|
+
@customElement('dynamic-menu-part')
|
|
14
20
|
export class DynamicMenuPart extends connect(store)(LitElement) {
|
|
15
|
-
static
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
}
|
|
21
|
+
static styles = [
|
|
22
|
+
ScrollbarStyles,
|
|
23
|
+
css`
|
|
24
|
+
:host {
|
|
25
|
+
display: flex;
|
|
26
|
+
overflow-y: auto;
|
|
27
|
+
flex-direction: column;
|
|
28
|
+
height: 100%;
|
|
29
|
+
min-width: 200px;
|
|
30
|
+
background-color: var(--theme-white-color);
|
|
31
|
+
}
|
|
27
32
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
:
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
}
|
|
52
|
-
`
|
|
53
|
-
]
|
|
54
|
-
}
|
|
33
|
+
:host([landscape]) {
|
|
34
|
+
overflow-x: auto;
|
|
35
|
+
flex-direction: row;
|
|
36
|
+
width: 100%;
|
|
37
|
+
min-height: 20px;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
ox-menu-portrait,
|
|
41
|
+
ox-menu-landscape {
|
|
42
|
+
flex: 1;
|
|
43
|
+
}
|
|
44
|
+
`
|
|
45
|
+
]
|
|
46
|
+
|
|
47
|
+
@property({ type: String }) page!: string
|
|
48
|
+
@property({ type: String }) resourceId?: string
|
|
49
|
+
@property({ type: Array }) menus?: Menu[]
|
|
50
|
+
@property({ type: String }) orientation?: 'landscape' | 'portrait'
|
|
51
|
+
|
|
52
|
+
@state() slotTemplate: any
|
|
53
|
+
@state() _activeTopLevel?: Menu
|
|
54
|
+
@state() _activeMenu?: Menu
|
|
55
|
+
@state() _path?: string
|
|
55
56
|
|
|
56
57
|
render() {
|
|
57
58
|
return html`
|
|
@@ -64,40 +65,40 @@ export class DynamicMenuPart extends connect(store)(LitElement) {
|
|
|
64
65
|
}
|
|
65
66
|
|
|
66
67
|
firstUpdated() {
|
|
67
|
-
this.renderRoot.addEventListener('active-toplevel', e => {
|
|
68
|
+
this.renderRoot.addEventListener('active-toplevel', (e: Event) => {
|
|
68
69
|
e.stopPropagation()
|
|
69
70
|
e.preventDefault()
|
|
70
71
|
|
|
71
|
-
this._activeTopLevel = e.detail
|
|
72
|
+
this._activeTopLevel = (e as CustomEvent).detail
|
|
72
73
|
})
|
|
73
74
|
}
|
|
74
75
|
|
|
75
|
-
updated(changes) {
|
|
76
|
+
updated(changes: PropertyValues<this>) {
|
|
76
77
|
if (changes.has('menus') || changes.has('page') || changes.has('resourceId')) {
|
|
77
|
-
this.
|
|
78
|
+
this.findActivePage()
|
|
78
79
|
}
|
|
79
80
|
|
|
80
81
|
if (changes.has('orientation')) {
|
|
81
82
|
if (this.orientation == 'portrait') {
|
|
82
83
|
this.removeAttribute('landscape')
|
|
83
84
|
} else {
|
|
84
|
-
this.setAttribute('landscape',
|
|
85
|
+
this.setAttribute('landscape', '')
|
|
85
86
|
}
|
|
86
87
|
}
|
|
87
88
|
|
|
88
89
|
if (changes.has('slotTemplate')) {
|
|
89
|
-
this.replaceChild(this.slotTemplate)
|
|
90
|
+
this.replaceChild(this.slotTemplate, this.renderRoot)
|
|
90
91
|
}
|
|
91
92
|
}
|
|
92
93
|
|
|
93
|
-
stateChanged(state) {
|
|
94
|
+
stateChanged(state: any): void {
|
|
94
95
|
this.page = state.route.page
|
|
95
96
|
this.resourceId = state.route.resourceId
|
|
96
97
|
this.menus = state.metaUI.menus || []
|
|
97
98
|
this.slotTemplate = state.metaUI.slotTemplate
|
|
98
99
|
}
|
|
99
100
|
|
|
100
|
-
|
|
101
|
+
private findActivePage() {
|
|
101
102
|
var path = this.resourceId ? `${this.page}/${this.resourceId}` : this.page
|
|
102
103
|
var menus = this.menus || []
|
|
103
104
|
var activeMenu
|
|
@@ -116,5 +117,3 @@ export class DynamicMenuPart extends connect(store)(LitElement) {
|
|
|
116
117
|
this._activeMenu = activeMenu || this._activeTopLevel
|
|
117
118
|
}
|
|
118
119
|
}
|
|
119
|
-
|
|
120
|
-
customElements.define('dynamic-menu-part', DynamicMenuPart)
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import '@material/web/icon/icon.js';
|
|
2
|
-
import '../viewparts/dynamic-menu-part';
|
|
2
|
+
import '../viewparts/dynamic-menu-part.js';
|
|
3
3
|
import gql from 'graphql-tag';
|
|
4
4
|
import { html } from 'lit';
|
|
5
|
+
import { store, clientSettingStore } from '@operato/shell';
|
|
5
6
|
import { client } from '@operato/graphql';
|
|
6
7
|
import { appendViewpart, toggleOverlay, TOOL_POSITION, VIEWPART_POSITION } from '@operato/layout';
|
|
7
|
-
import { store } from '@operato/shell';
|
|
8
8
|
import { isMobileDevice } from '@operato/utils';
|
|
9
9
|
import { APPEND_APP_TOOL, REMOVE_APP_TOOL } from '@things-factory/apptool-base';
|
|
10
|
-
import { clientSettingStore } from '@things-factory/shell';
|
|
11
10
|
export const UPDATE_META_UI = 'UPDATE_META_UI';
|
|
12
11
|
export const UPDATE_META_MENU_TEMPLATE = 'UPDATE_META_MENU_TEMPLATE';
|
|
13
12
|
var HAMBURGER;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.js","sourceRoot":"","sources":["../../client/actions/main.js"],"names":[],"mappings":"AAAA,OAAO,4BAA4B,CAAA;
|
|
1
|
+
{"version":3,"file":"main.js","sourceRoot":"","sources":["../../client/actions/main.js"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '../viewparts/dynamic-menu-part.js'\n\nimport gql from 'graphql-tag'\nimport { html } from 'lit'\n\nimport { store, clientSettingStore } from '@operato/shell'\nimport { client } from '@operato/graphql'\nimport { appendViewpart, toggleOverlay, TOOL_POSITION, VIEWPART_POSITION } from '@operato/layout'\nimport { isMobileDevice } from '@operato/utils'\n\nimport { APPEND_APP_TOOL, REMOVE_APP_TOOL } from '@things-factory/apptool-base'\n\nexport const UPDATE_META_UI = 'UPDATE_META_UI'\nexport const UPDATE_META_MENU_TEMPLATE = 'UPDATE_META_MENU_TEMPLATE'\n\nvar HAMBURGER\n\nexport async function setupMenuPart(options) {\n var { hovering = isMobileDevice() ? true : false, slotTemplate, portraitSlotTemplate, landscapeSlotTemplate, position = VIEWPART_POSITION.NAVBAR } = options || {}\n\n const { hovering: hoveringSetting } = (await clientSettingStore.get('dynamic-menu'))?.value || {}\n if (hoveringSetting !== undefined) {\n hovering = hoveringSetting\n }\n\n const orientation = position == VIEWPART_POSITION.HEADERBAR ? 'landscape' : 'portrait'\n const orientatedSlotTemplate = (orientation == 'landscape' ? landscapeSlotTemplate : portraitSlotTemplate) || slotTemplate || html``\n\n appendViewpart({\n name: 'dynamic-menu-part',\n viewpart: {\n show: !hovering,\n resizable: true,\n hovering: isMobileDevice() ? true : hovering,\n template: html`<dynamic-menu-part .orientation=${orientation}>${orientatedSlotTemplate}</dynamic-menu-part>`\n },\n position\n })\n\n if ((hovering || isMobileDevice()) && orientation == 'portrait') {\n if (!HAMBURGER) {\n HAMBURGER = {\n name: 'hamburger',\n template: html`\n <md-icon\n @click=${e =>\n toggleOverlay('dynamic-menu-part', {\n backdrop: true\n })}\n >view_headline</md-icon\n >\n `,\n position: TOOL_POSITION.FRONT_END\n }\n\n store.dispatch({\n /* incase of mobile : add hamburger tool */\n type: APPEND_APP_TOOL,\n tool: HAMBURGER\n })\n }\n } else {\n if (HAMBURGER) {\n store.dispatch({\n type: REMOVE_APP_TOOL,\n name: 'hamburger'\n })\n\n HAMBURGER = null\n }\n }\n}\n\nexport async function updateMenuTemplate(template) {\n var applicationName = document.querySelector('meta[name=\"application-name\"]')?.content\n\n var liteMenus = (\n await client.query({\n query: gql`\n query ($filters: [Filter!], $sortings: [Sorting!]) {\n liteMenus: myLiteMenus(filters: $filters, sortings: $sortings) {\n items {\n id\n name\n description\n appName\n parent\n rank\n active\n type\n value\n icon\n }\n total\n }\n }\n `,\n variables: {\n filters: [\n {\n name: 'active',\n operator: 'eq',\n value: true\n },\n {\n name: 'appName',\n operator: 'in',\n value: ['', applicationName]\n }\n ],\n sortings: [\n {\n name: 'rank',\n desc: false\n }\n ]\n }\n })\n ).data.liteMenus.items\n\n store.dispatch({\n type: UPDATE_META_MENU_TEMPLATE,\n addon: liteMenus.filter(menu => !menu.appName || menu.appName === applicationName),\n template\n })\n}\n"]}
|
|
@@ -23,7 +23,7 @@ export declare class RecordBasedCodeEditorPopup extends LitElement {
|
|
|
23
23
|
"value_field": "template", -> 코드 에디터에 표시할 레코드 필드 정보 (변수값)
|
|
24
24
|
"menu": "code-editor", -> 코드 에디터 이름 정보 (고정값)
|
|
25
25
|
"tagname": "record-code-editor-popup", -> 코드 에디터 태그 명 (고정값)
|
|
26
|
-
"location": "@things-factory/meta-ui/client/component/popup/record-code-editor-popup", -> 코드 에디터 파일 위치 (고정값)
|
|
26
|
+
"location": "@things-factory/meta-ui/dist-client/component/popup/record-code-editor-popup", -> 코드 에디터 파일 위치 (고정값)
|
|
27
27
|
"save_action": {
|
|
28
28
|
"func_name": "updateDocTemplate", -> 업데이트 함수 명
|
|
29
29
|
"func_type": "DocTemplatePatch"
|
|
@@ -25,7 +25,7 @@ let RecordBasedCodeEditorPopup = class RecordBasedCodeEditorPopup extends LitEle
|
|
|
25
25
|
"value_field": "template", -> 코드 에디터에 표시할 레코드 필드 정보 (변수값)
|
|
26
26
|
"menu": "code-editor", -> 코드 에디터 이름 정보 (고정값)
|
|
27
27
|
"tagname": "record-code-editor-popup", -> 코드 에디터 태그 명 (고정값)
|
|
28
|
-
"location": "@things-factory/meta-ui/client/component/popup/record-code-editor-popup", -> 코드 에디터 파일 위치 (고정값)
|
|
28
|
+
"location": "@things-factory/meta-ui/dist-client/component/popup/record-code-editor-popup", -> 코드 에디터 파일 위치 (고정값)
|
|
29
29
|
"save_action": {
|
|
30
30
|
"func_name": "updateDocTemplate", -> 업데이트 함수 명
|
|
31
31
|
"func_type": "DocTemplatePatch"
|
|
@@ -150,7 +150,7 @@ __decorate([
|
|
|
150
150
|
"value_field": "template", -> 코드 에디터에 표시할 레코드 필드 정보 (변수값)
|
|
151
151
|
"menu": "code-editor", -> 코드 에디터 이름 정보 (고정값)
|
|
152
152
|
"tagname": "record-code-editor-popup", -> 코드 에디터 태그 명 (고정값)
|
|
153
|
-
"location": "@things-factory/meta-ui/client/component/popup/record-code-editor-popup", -> 코드 에디터 파일 위치 (고정값)
|
|
153
|
+
"location": "@things-factory/meta-ui/dist-client/component/popup/record-code-editor-popup", -> 코드 에디터 파일 위치 (고정값)
|
|
154
154
|
"save_action": {
|
|
155
155
|
"func_name": "updateDocTemplate", -> 업데이트 함수 명
|
|
156
156
|
"func_type": "DocTemplatePatch"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"record-based-code-editor-popup.js","sourceRoot":"","sources":["../../../client/component/popup/record-based-code-editor-popup.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/input/ox-input-code.js'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, query, state } from 'lit/decorators.js'\nimport { OxInputCode } from '@operato/input'\nimport { closePopup } from '@operato/popup'\nimport { ButtonContainerStyles } from '@operato/styles'\n\nimport { TermsUtil } from '../../utils/terms-util'\nimport { MetaApi } from '../../utils/meta-api'\nimport { ServiceUtil } from '../../utils/service-util'\n\n/**\n * 레코드 기반 코드 편집기 팝업\n */\n\n@customElement('record-based-code-editor-popup')\nexport class RecordBasedCodeEditorPopup 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-input-code {\n margin: 10px;\n overflow-y: auto;\n flex: 1;\n }\n `\n ]\n\n @state() private config?: any\n @state() private record?: any\n @state() private value?: any\n @state() private codeValue?: any\n\n @query('ox-input-code') private codeEditor!: OxInputCode\n\n /**\n * 그리드 버튼 (grid-custom) 선택시 코드 편집기 팝업을 띄우는 버튼 로직\n {\n \"type\": \"popup\", -> 팝업 표시 (고정값)\n \"title\": \"template\", -> 코드 에디터에서 팝업 타이틀에 표시할 타이틀 정보 (변수값)\n \"title_detail\": \"name\", -> 코드 에디터에서 팝업 타이틀에 표시할 레코드의 필드 정보 (변수값)\n \"size\": \"large\", -> 팝업 사이즈 (full, large, medium, small)\n \"popup_field\": \"record\", -> 코드 에디터에서 레코드를 받을 필드명 (고정값)\n \"parent_field\": \"id\", -> 부모 레코드 ID 필드 값 (고정값)\n \"value_field\": \"template\", -> 코드 에디터에 표시할 레코드 필드 정보 (변수값)\n \"menu\": \"code-editor\", -> 코드 에디터 이름 정보 (고정값)\n \"tagname\": \"record-code-editor-popup\", -> 코드 에디터 태그 명 (고정값)\n \"location\": \"@things-factory/meta-ui/client/component/popup/record-code-editor-popup\", -> 코드 에디터 파일 위치 (고정값)\n \"save_action\": {\n \"func_name\": \"updateDocTemplate\", -> 업데이트 함수 명\n \"func_type\": \"DocTemplatePatch\"\n },\n \"param\": [\n \"grist_one\" -> 파라미터 전달 모드 - 그리드 선택 값 전달 (고정값)\n ],\n \"after\": \"fetch\" -> 팝업 닫기 후 액션 (Optional)\n }\n */\n async connectedCallback() {\n this.value = this.record[this.config.value_field] ? this.record[this.config.value_field] : ''\n\n if (typeof this.value === 'object') {\n this.codeValue = JSON.stringify(this.value, null, 2)\n } else {\n this.codeValue = this.value\n }\n\n await super.connectedCallback()\n }\n\n async firstUpdated(changes: PropertyValues<this>) {\n await super.firstUpdated(changes)\n }\n\n render() {\n let addSaveBtn = this.config.save_action ? true : false\n\n if (addSaveBtn) {\n return html`\n <ox-input-code mode=\"javascript\" value=${this.codeValue} tab-size=\"2\" tab-as-space=\"true\"></ox-input-code>\n\n <div class=\"button-container\">\n <button @click=${this.clickCancel.bind(this)}><md-icon>cancel</md-icon>${TermsUtil.tButton('cancel')}</button>\n <button @click=${this.clickSave.bind(this)}><md-icon>save</md-icon>${TermsUtil.tButton('save')}</button>\n </div>\n `\n } else {\n return html`\n <ox-input-code mode=\"javascript\" value=${this.codeValue} tab-size=\"2\" tab-as-space=\"true\"></ox-input-code>\n <div class=\"button-container\">\n <button @click=${this.clickCancel.bind(this)}><md-icon>cancel</md-icon>${TermsUtil.tButton('cancel')}</button>\n </div>\n `\n }\n }\n\n /**\n * @description 저장\n ***************************\n * @returns\n */\n async clickSave(e) {\n if (this.codeValue === this.codeEditor.value) {\n MetaApi.showToast('info', TermsUtil.tText('NOTHING_CHANGED'))\n } else {\n let saveAction = this.config.save_action\n let saveFuncName = saveAction.func_name\n let patch = { id: this.record.id, cuFlag: 'M' }\n patch[this.config.value_field] = this.codeEditor.value\n let response = await ServiceUtil.updateOne(saveFuncName, this.record.id, patch)\n if (response) {\n closePopup(this)\n }\n }\n }\n\n /**\n * @description 취소\n ***************************\n * @returns\n */\n async clickCancel(e) {\n closePopup(this)\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"record-based-code-editor-popup.js","sourceRoot":"","sources":["../../../client/component/popup/record-based-code-editor-popup.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/input/ox-input-code.js'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, query, state } from 'lit/decorators.js'\nimport { OxInputCode } from '@operato/input'\nimport { closePopup } from '@operato/popup'\nimport { ButtonContainerStyles } from '@operato/styles'\n\nimport { TermsUtil } from '../../utils/terms-util'\nimport { MetaApi } from '../../utils/meta-api'\nimport { ServiceUtil } from '../../utils/service-util'\n\n/**\n * 레코드 기반 코드 편집기 팝업\n */\n\n@customElement('record-based-code-editor-popup')\nexport class RecordBasedCodeEditorPopup 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-input-code {\n margin: 10px;\n overflow-y: auto;\n flex: 1;\n }\n `\n ]\n\n @state() private config?: any\n @state() private record?: any\n @state() private value?: any\n @state() private codeValue?: any\n\n @query('ox-input-code') private codeEditor!: OxInputCode\n\n /**\n * 그리드 버튼 (grid-custom) 선택시 코드 편집기 팝업을 띄우는 버튼 로직\n {\n \"type\": \"popup\", -> 팝업 표시 (고정값)\n \"title\": \"template\", -> 코드 에디터에서 팝업 타이틀에 표시할 타이틀 정보 (변수값)\n \"title_detail\": \"name\", -> 코드 에디터에서 팝업 타이틀에 표시할 레코드의 필드 정보 (변수값)\n \"size\": \"large\", -> 팝업 사이즈 (full, large, medium, small)\n \"popup_field\": \"record\", -> 코드 에디터에서 레코드를 받을 필드명 (고정값)\n \"parent_field\": \"id\", -> 부모 레코드 ID 필드 값 (고정값)\n \"value_field\": \"template\", -> 코드 에디터에 표시할 레코드 필드 정보 (변수값)\n \"menu\": \"code-editor\", -> 코드 에디터 이름 정보 (고정값)\n \"tagname\": \"record-code-editor-popup\", -> 코드 에디터 태그 명 (고정값)\n \"location\": \"@things-factory/meta-ui/dist-client/component/popup/record-code-editor-popup\", -> 코드 에디터 파일 위치 (고정값)\n \"save_action\": {\n \"func_name\": \"updateDocTemplate\", -> 업데이트 함수 명\n \"func_type\": \"DocTemplatePatch\"\n },\n \"param\": [\n \"grist_one\" -> 파라미터 전달 모드 - 그리드 선택 값 전달 (고정값)\n ],\n \"after\": \"fetch\" -> 팝업 닫기 후 액션 (Optional)\n }\n */\n async connectedCallback() {\n this.value = this.record[this.config.value_field] ? this.record[this.config.value_field] : ''\n\n if (typeof this.value === 'object') {\n this.codeValue = JSON.stringify(this.value, null, 2)\n } else {\n this.codeValue = this.value\n }\n\n await super.connectedCallback()\n }\n\n async firstUpdated(changes: PropertyValues<this>) {\n await super.firstUpdated(changes)\n }\n\n render() {\n let addSaveBtn = this.config.save_action ? true : false\n\n if (addSaveBtn) {\n return html`\n <ox-input-code mode=\"javascript\" value=${this.codeValue} tab-size=\"2\" tab-as-space=\"true\"></ox-input-code>\n\n <div class=\"button-container\">\n <button @click=${this.clickCancel.bind(this)}><md-icon>cancel</md-icon>${TermsUtil.tButton('cancel')}</button>\n <button @click=${this.clickSave.bind(this)}><md-icon>save</md-icon>${TermsUtil.tButton('save')}</button>\n </div>\n `\n } else {\n return html`\n <ox-input-code mode=\"javascript\" value=${this.codeValue} tab-size=\"2\" tab-as-space=\"true\"></ox-input-code>\n <div class=\"button-container\">\n <button @click=${this.clickCancel.bind(this)}><md-icon>cancel</md-icon>${TermsUtil.tButton('cancel')}</button>\n </div>\n `\n }\n }\n\n /**\n * @description 저장\n ***************************\n * @returns\n */\n async clickSave(e) {\n if (this.codeValue === this.codeEditor.value) {\n MetaApi.showToast('info', TermsUtil.tText('NOTHING_CHANGED'))\n } else {\n let saveAction = this.config.save_action\n let saveFuncName = saveAction.func_name\n let patch = { id: this.record.id, cuFlag: 'M' }\n patch[this.config.value_field] = this.codeEditor.value\n let response = await ServiceUtil.updateOne(saveFuncName, this.record.id, patch)\n if (response) {\n closePopup(this)\n }\n }\n }\n\n /**\n * @description 취소\n ***************************\n * @returns\n */\n async clickCancel(e) {\n closePopup(this)\n }\n}\n"]}
|
|
@@ -110,7 +110,7 @@ export const MetaTabMixin = baseElement => class extends MetaButtonMixin(baseEle
|
|
|
110
110
|
name: mainInfo.name,
|
|
111
111
|
display: mainInfo.display,
|
|
112
112
|
tagname: 'meta-grist-element',
|
|
113
|
-
location: '@things-factory/meta-ui/client/pages/meta-grist-element',
|
|
113
|
+
location: '@things-factory/meta-ui/dist-client/pages/meta-grist-element',
|
|
114
114
|
parent_field: 'id',
|
|
115
115
|
param_field: 'param_field',
|
|
116
116
|
menu: this.route_name,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"meta-tab-mixin.js","sourceRoot":"","sources":["../../client/mixin/meta-tab-mixin.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAA;AAElD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAErD;;;;;GAKG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,WAAW,CAAC,EAAE,CACxC,KAAM,SAAQ,eAAe,CAAC,WAAW,CAAC;IACxC;;;;OAIG;IACH,MAAM,KAAK,MAAM;QACf,OAAO,OAAO,CAAC,iBAAiB,EAAE,CAAA;IACpC,CAAC;IAED;;;;OAIG;IACH,MAAM,KAAK,UAAU;QACnB,OAAO;YACL;;;;eAIG;YACH,eAAe,EAAE,KAAK;YACtB;;;;eAIG;YACH,aAAa,EAAE,MAAM;YACrB;;;;eAIG;YACH,WAAW,EAAE,MAAM;SACpB,CAAA;IACH,CAAC;IAED;;;;OAIG;IACH,IAAI,OAAO;QACT,OAAO,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAA;IAC1C,CAAC;IAED;;4DAEwD;IAExD;;;OAGG;IACH,KAAK,CAAC,iBAAiB;QACrB,IAAI,CAAC,aAAa,GAAG,SAAS,CAAA;QAC9B,sBAAsB;QACtB,MAAM,IAAI,CAAC,mBAAmB,EAAE,CAAA;QAEhC,IAAI,IAAI,CAAC,eAAe,EAAE;YACxB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,eAAe,CAAA;SACpC;QAED,IAAI,KAAK,CAAC,iBAAiB,EAAE;YAC3B,MAAM,KAAK,CAAC,iBAAiB,EAAE,CAAA;SAChC;IACH,CAAC;IAED;;;OAGG;IACH,KAAK,CAAC,YAAY;QAChB,IAAI,KAAK,CAAC,YAAY,EAAE;YACtB,MAAM,KAAK,CAAC,YAAY,EAAE,CAAA;SAC3B;IACH,CAAC;IAED;;;OAGG;IACH,KAAK,CAAC,eAAe;QACnB,IAAI,KAAK,CAAC,eAAe,EAAE;YACzB,MAAM,KAAK,CAAC,eAAe,EAAE,CAAA;SAC9B;IACH,CAAC;IAED;;;;OAIG;IACH,MAAM;QACJ,OAAO,OAAO,CAAC,eAAe,CAAC,IAAI,CAAC,CAAA;IACtC,CAAC;IAED;;;;OAIG;IACH,oBAAoB,CAAC,QAAQ;QAC3B,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,EAAE;YACjC,IAAI,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC,aAAa,CAAA;YAC9C,IAAI,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,IAAI,yEAAyE,CAAC,CAAA;YACnH,IAAI,QAAQ,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,MAAM;gBAAE,QAAQ,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAA;YAE9E,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC,EAAE;gBACrC,IAAI,EAAE,QAAQ,CAAC,IAAI;gBACnB,OAAO,EAAE,QAAQ,CAAC,OAAO;gBACzB,OAAO,EAAE,oBAAoB;gBAC7B,QAAQ,EAAE,
|
|
1
|
+
{"version":3,"file":"meta-tab-mixin.js","sourceRoot":"","sources":["../../client/mixin/meta-tab-mixin.js"],"names":[],"mappings":"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","sourcesContent":["import { MetaApi } from '../utils/meta-api'\nimport { MetaUiUtil } from '../utils/meta-ui-util'\n\nimport { MetaButtonMixin } from './meta-button-mixin'\n\n/**\n * @license\n * Copyright © HatioLab Inc. All rights reserved.\n * @author Shortstop shortstop@hatiolab.com\n * @description 메뉴 메타 정보를 기반으로 탭 구성\n */\nexport const MetaTabMixin = baseElement =>\n class extends MetaButtonMixin(baseElement) {\n /**\n * @description 스타일 정의\n **************************\n * @returns {Array} 스타일\n */\n static get styles() {\n return MetaApi.getBasicTabStyles()\n }\n\n /**\n * @description 프로퍼티 정의\n **************************\n * @returns {Object} 프로퍼티\n */\n static get properties() {\n return {\n /**\n * @description 탭 상세 렌터링 정보\n *******************************\n * @type {Object}\n */\n tabRenderConfig: Array,\n /**\n * @description 현재 선택된 탭\n ****************************\n * @type {String}\n */\n currentTabKey: String,\n /**\n * @description 렌더링 된 탭 객체\n ******************************\n * @type {Array}\n */\n tabElements: Object\n }\n }\n\n /**\n * @description 컨텍스트\n ***********************\n * @returns {HTMLElement}\n */\n get context() {\n return MetaUiUtil.getContextObject(this)\n }\n\n /******************************************************\n * LifeCycle\n ******************************************************/\n\n /**\n * @override connectedCallback\n *******************************\n */\n async connectedCallback() {\n this.currentTabKey = undefined\n // 메뉴 메타 정보 조회 및 기본 파싱\n await this.getAndParseMenuMeta()\n\n if (this.activityDataSet) {\n this.dataSet = this.activityDataSet\n }\n\n if (super.connectedCallback) {\n await super.connectedCallback()\n }\n }\n\n /**\n * @override firstUpdated\n **************************\n */\n async firstUpdated() {\n if (super.firstUpdated) {\n await super.firstUpdated()\n }\n }\n\n /**\n * @override pageInitialized\n *****************************\n */\n async pageInitialized() {\n if (super.pageInitialized) {\n await super.pageInitialized()\n }\n }\n\n /**\n * @description 화면 그리기\n **************************\n * @returns {HTMLElement}\n */\n render() {\n return MetaApi.getBasicTabHtml(this)\n }\n\n /**\n * @descrtiption 메뉴 메타 정보로 부터 기본 그리드 정보 파싱 처리\n ************************************************\n * @param {Object} menuMeta 메뉴 메타 정보\n */\n parseBasicTabConfigs(menuMeta) {\n if (this.includeMainList === true) {\n let mainInfoTxt = this.etcConfig.main_tab_info\n let mainInfo = JSON.parse(mainInfoTxt || '{ \"name\": \"general\", \"display\": \"general\", \"icon\": \"list\", \"index\": 0 }')\n if (mainInfo.index > menuMeta.tab.length) mainInfo.index = menuMeta.tab.length\n\n menuMeta.tab.splice(mainInfo.index, 0, {\n name: mainInfo.name,\n display: mainInfo.display,\n tagname: 'meta-grist-element',\n location: '@things-factory/meta-ui/dist-client/pages/meta-grist-element',\n parent_field: 'id',\n param_field: 'param_field',\n menu: this.route_name,\n icon: mainInfo.icon,\n filter_from: false,\n main_filter_form: this.mainFilterForm\n })\n }\n\n this.tabRenderConfig = menuMeta.tab\n menuMeta.button = []\n }\n\n /********************************************************************\n * Data Handling\n ********************************************************************/\n\n /**\n * @descrtiption 모든 탭 별 데이터 클리어\n ************************************\n */\n async clear() {\n if (this.tabElements) {\n let tabKeys = Object.keys(this.tabElements)\n\n for (var i = 0; i < tabKeys.length; i++) {\n await this.tabElements[tabKeys[i]].clear()\n }\n }\n }\n\n /**\n * @descrtiption 탭 별로 데이터 수집 후 리턴\n ***************************************\n * @returns {Object} 탭 화면 데이터\n */\n getData() {\n let data = {}\n\n if (this.tabElements) {\n let tabKeys = Object.keys(this.tabElements)\n\n tabKeys.forEach(tabKey => {\n data[tabKey] = this.tabElements[tabKey].getData()\n })\n }\n\n return data\n }\n\n /**\n * @descrtiption 메인 그리드\n **************************\n * @returns {Object} grist\n */\n getMainGrist() {\n if (this.tabElements) {\n let tabKeys = Object.keys(this.tabElements)\n return this.tabElements[tabKeys[0]].grist\n }\n\n return undefined\n }\n }\n"]}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import '@operato/i18n/ox-i18n.js';
|
|
2
|
+
import '@material/web/checkbox/checkbox.js';
|
|
3
|
+
import { LitElement } from 'lit';
|
|
4
|
+
declare const DynamicMenuSettingLet_base: (new (...args: any[]) => LitElement) & typeof LitElement;
|
|
5
|
+
export declare class DynamicMenuSettingLet extends DynamicMenuSettingLet_base {
|
|
6
|
+
static styles: import("lit").CSSResult[];
|
|
7
|
+
hovering?: boolean;
|
|
6
8
|
render(): import("lit").TemplateResult<1>;
|
|
7
9
|
firstUpdated(): Promise<void>;
|
|
8
|
-
|
|
9
|
-
onchange(e: any): Promise<void>;
|
|
10
|
+
onChange(e: Event): Promise<void>;
|
|
10
11
|
}
|
|
12
|
+
export {};
|
|
@@ -1,27 +1,13 @@
|
|
|
1
|
-
import
|
|
2
|
-
import '@material/mwc-checkbox';
|
|
1
|
+
import { __decorate, __metadata } from "tslib";
|
|
3
2
|
import '@operato/i18n/ox-i18n.js';
|
|
3
|
+
import '@material/web/checkbox/checkbox.js';
|
|
4
4
|
import { css, html, LitElement } from 'lit';
|
|
5
|
-
import {
|
|
6
|
-
import { clientSettingStore } from '@
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
css `
|
|
12
|
-
label {
|
|
13
|
-
font: var(--label-font);
|
|
14
|
-
color: var(--label-color);
|
|
15
|
-
text-transform: var(--label-text-transform);
|
|
16
|
-
}
|
|
17
|
-
`
|
|
18
|
-
];
|
|
19
|
-
}
|
|
20
|
-
static get properties() {
|
|
21
|
-
return {
|
|
22
|
-
hovering: Boolean
|
|
23
|
-
};
|
|
24
|
-
}
|
|
5
|
+
import { customElement, property } from 'lit/decorators.js';
|
|
6
|
+
import { clientSettingStore } from '@operato/shell';
|
|
7
|
+
import { i18next, localize } from '@operato/i18n';
|
|
8
|
+
import { setupMenuPart } from '../../actions/main';
|
|
9
|
+
// TODO @things-factory/lite-menu/lite-menu-setting-let를 사용하도록 통합되어야 한다.
|
|
10
|
+
let DynamicMenuSettingLet = class DynamicMenuSettingLet extends localize(i18next)(LitElement) {
|
|
25
11
|
render() {
|
|
26
12
|
const checked = this.hovering === true;
|
|
27
13
|
const indeterminate = this.hovering === undefined;
|
|
@@ -30,14 +16,10 @@ export class DynamicMenuSettingLet extends localize(i18next)(LitElement) {
|
|
|
30
16
|
<ox-i18n slot="title" msgid="title.lite-menu-setting"></ox-i18n>
|
|
31
17
|
|
|
32
18
|
<div slot="content">
|
|
33
|
-
<
|
|
34
|
-
<
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
?checked=${checked}
|
|
38
|
-
?indeterminate=${indeterminate}
|
|
39
|
-
></mwc-checkbox>
|
|
40
|
-
</mwc-formfield>
|
|
19
|
+
<label>
|
|
20
|
+
<md-checkbox id="hovering" @change=${e => this.onChange(e)} ?checked=${checked} ?indeterminate=${indeterminate}></md-checkbox>
|
|
21
|
+
hovering
|
|
22
|
+
</label>
|
|
41
23
|
</div>
|
|
42
24
|
</setting-let>
|
|
43
25
|
`;
|
|
@@ -46,7 +28,7 @@ export class DynamicMenuSettingLet extends localize(i18next)(LitElement) {
|
|
|
46
28
|
var _a;
|
|
47
29
|
this.hovering = (((_a = (await clientSettingStore.get('dynamic-menu'))) === null || _a === void 0 ? void 0 : _a.value) || {}).hovering;
|
|
48
30
|
}
|
|
49
|
-
async
|
|
31
|
+
async onChange(e) {
|
|
50
32
|
var _a;
|
|
51
33
|
if (this.hovering === true) {
|
|
52
34
|
this.hovering = false;
|
|
@@ -76,6 +58,26 @@ export class DynamicMenuSettingLet extends localize(i18next)(LitElement) {
|
|
|
76
58
|
hovering: this.hovering
|
|
77
59
|
});
|
|
78
60
|
}
|
|
79
|
-
}
|
|
80
|
-
|
|
61
|
+
};
|
|
62
|
+
DynamicMenuSettingLet.styles = [
|
|
63
|
+
css `
|
|
64
|
+
label {
|
|
65
|
+
display: flex;
|
|
66
|
+
gap: 10px;
|
|
67
|
+
align-items: center;
|
|
68
|
+
|
|
69
|
+
font: var(--label-font);
|
|
70
|
+
color: var(--label-color);
|
|
71
|
+
text-transform: var(--label-text-transform);
|
|
72
|
+
}
|
|
73
|
+
`
|
|
74
|
+
];
|
|
75
|
+
__decorate([
|
|
76
|
+
property({ type: Boolean }),
|
|
77
|
+
__metadata("design:type", Boolean)
|
|
78
|
+
], DynamicMenuSettingLet.prototype, "hovering", void 0);
|
|
79
|
+
DynamicMenuSettingLet = __decorate([
|
|
80
|
+
customElement('dynamic-menu-setting-let')
|
|
81
|
+
], DynamicMenuSettingLet);
|
|
82
|
+
export { DynamicMenuSettingLet };
|
|
81
83
|
//# sourceMappingURL=dynamic-menu-setting-let.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dynamic-menu-setting-let.js","sourceRoot":"","sources":["../../../client/pages/menu/dynamic-menu-setting-let.
|
|
1
|
+
{"version":3,"file":"dynamic-menu-setting-let.js","sourceRoot":"","sources":["../../../client/pages/menu/dynamic-menu-setting-let.ts"],"names":[],"mappings":";AAAA,OAAO,0BAA0B,CAAA;AACjC,OAAO,oCAAoC,CAAA;AAE3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AACnD,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAEjD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAElD,wEAAwE;AAEjE,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAiBtE,MAAM;QACJ,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAA;QACtC,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,KAAK,SAAS,CAAA;QAEjD,OAAO,IAAI,CAAA;;;;;;iDAMkC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAa,OAAO,mBAAmB,aAAa;;;;;KAKrH,CAAA;IACH,CAAC;IAED,KAAK,CAAC,YAAY;;QAChB,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAA,MAAA,CAAC,MAAM,kBAAkB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,QAAQ,CAAA;IACxF,CAAC;IAED,KAAK,CAAC,QAAQ,CAAC,CAAQ;;QACrB,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,EAAE;YAC1B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAA;SACtB;aAAM,IAAI,IAAI,CAAC,QAAQ,KAAK,KAAK,EAAE;YAClC,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAA;SAC1B;aAAM;YACL,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAA;SACrB;QAED,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,GAAG,CAAA,MAAA,CAAC,MAAM,kBAAkB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,0CAAE,KAAK,KAAI,EAAE,CAAA;QAChG,IAAI,IAAI,CAAC,QAAQ,KAAK,cAAc,EAAE;YACpC,OAAM;SACP;QAED,IAAI;YACF,MAAM,kBAAkB,CAAC,GAAG,CAAC;gBAC3B,GAAG,EAAE,cAAc;gBACnB,KAAK,EAAE;oBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;iBACxB;aACF,CAAC,CAAA;SACH;QAAC,OAAO,CAAC,EAAE;YACV,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;SACjB;QAED,aAAa,CAAC;YACZ,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB,CAAC,CAAA;IACJ,CAAC;;AAlEM,4BAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;KAUF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;;uDAAmB;AAfpC,qBAAqB;IADjC,aAAa,CAAC,0BAA0B,CAAC;GAC7B,qBAAqB,CAoEjC;SApEY,qBAAqB","sourcesContent":["import '@operato/i18n/ox-i18n.js'\nimport '@material/web/checkbox/checkbox.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { clientSettingStore } from '@operato/shell'\nimport { i18next, localize } from '@operato/i18n'\n\nimport { setupMenuPart } from '../../actions/main'\n\n// TODO @things-factory/lite-menu/lite-menu-setting-let를 사용하도록 통합되어야 한다.\n@customElement('dynamic-menu-setting-let')\nexport class DynamicMenuSettingLet extends localize(i18next)(LitElement) {\n static styles = [\n css`\n label {\n display: flex;\n gap: 10px;\n align-items: center;\n\n font: var(--label-font);\n color: var(--label-color);\n text-transform: var(--label-text-transform);\n }\n `\n ]\n\n @property({ type: Boolean }) hovering?: boolean\n\n render() {\n const checked = this.hovering === true\n const indeterminate = this.hovering === undefined\n\n return html`\n <setting-let>\n <ox-i18n slot=\"title\" msgid=\"title.lite-menu-setting\"></ox-i18n>\n\n <div slot=\"content\">\n <label>\n <md-checkbox id=\"hovering\" @change=${e => this.onChange(e)} ?checked=${checked} ?indeterminate=${indeterminate}></md-checkbox>\n hovering\n </label>\n </div>\n </setting-let>\n `\n }\n\n async firstUpdated() {\n this.hovering = ((await clientSettingStore.get('dynamic-menu'))?.value || {}).hovering\n }\n\n async onChange(e: Event) {\n if (this.hovering === true) {\n this.hovering = false\n } else if (this.hovering === false) {\n this.hovering = undefined\n } else {\n this.hovering = true\n }\n\n const { hovering: valueFromStore } = (await clientSettingStore.get('dynamic-menu'))?.value || {}\n if (this.hovering === valueFromStore) {\n return\n }\n\n try {\n await clientSettingStore.put({\n key: 'dynamic-menu',\n value: {\n hovering: this.hovering\n }\n })\n } catch (e) {\n console.error(e)\n }\n\n setupMenuPart({\n hovering: this.hovering\n })\n }\n}\n"]}
|