@dssp/project 0.0.5 → 0.0.6
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/pages/project/project-detail.ts +3 -4
- package/client/pages/resource/construction-type-management.ts +40 -21
- package/client/pages/resource/manager-management.ts +28 -7
- package/client/pages/resource/worker-type-management.ts +41 -9
- package/dist-client/pages/project/project-detail.js +2 -4
- package/dist-client/pages/project/project-detail.js.map +1 -1
- package/dist-client/pages/resource/construction-type-management.d.ts +0 -5
- package/dist-client/pages/resource/construction-type-management.js +40 -21
- package/dist-client/pages/resource/construction-type-management.js.map +1 -1
- package/dist-client/pages/resource/manager-management.js +28 -7
- package/dist-client/pages/resource/manager-management.js.map +1 -1
- package/dist-client/pages/resource/worker-type-management.d.ts +2 -1
- package/dist-client/pages/resource/worker-type-management.js +40 -9
- package/dist-client/pages/resource/worker-type-management.js.map +1 -1
- package/dist-client/route.d.ts +1 -1
- package/dist-client/tsconfig.tsbuildinfo +1 -1
- package/dist-server/service/project/project-query.js +3 -3
- package/dist-server/service/project/project-query.js.map +1 -1
- package/dist-server/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
- package/server/service/project/project-query.ts +4 -7
|
@@ -202,7 +202,7 @@ export class ProjectDetail extends ScopedElementsMixin(PageView) {
|
|
|
202
202
|
}
|
|
203
203
|
div[inspection] {
|
|
204
204
|
display: grid;
|
|
205
|
-
grid-template-columns: 1.4fr 0.9fr 0.9fr 0.9fr
|
|
205
|
+
grid-template-columns: 1.4fr 0.9fr 0.9fr 0.9fr;
|
|
206
206
|
margin-top: 5px;
|
|
207
207
|
background: #f6f6f6;
|
|
208
208
|
border-radius: 7px;
|
|
@@ -323,6 +323,7 @@ export class ProjectDetail extends ScopedElementsMixin(PageView) {
|
|
|
323
323
|
buildings: []
|
|
324
324
|
}
|
|
325
325
|
}
|
|
326
|
+
|
|
326
327
|
@state() projectId: string = ''
|
|
327
328
|
@state() project: Project = { ...this.defaultProject }
|
|
328
329
|
@state() inspectionSummary: InspectionSummary = {
|
|
@@ -416,9 +417,7 @@ export class ProjectDetail extends ScopedElementsMixin(PageView) {
|
|
|
416
417
|
<div subject bold>개별 단지 상세정보 바로가기</div>
|
|
417
418
|
<div building-container>
|
|
418
419
|
${this.project.buildingComplex?.buildings?.map(building => {
|
|
419
|
-
return html`<md-outlined-button
|
|
420
|
-
href=${`building-complex-detail/${this.project.id}?buildingId=${building.id}`}
|
|
421
|
-
>
|
|
420
|
+
return html`<md-outlined-button href=${`building-complex-detail/${this.project.id}?buildingId=${building.id}`}>
|
|
422
421
|
${building.name}
|
|
423
422
|
</md-outlined-button>`
|
|
424
423
|
})}
|
|
@@ -25,6 +25,32 @@ export class ConstructionTypeManagement extends PageView {
|
|
|
25
25
|
--grid-record-emphasized-background-color: red;
|
|
26
26
|
--grid-record-emphasized-color: yellow;
|
|
27
27
|
}
|
|
28
|
+
|
|
29
|
+
md-elevated-button {
|
|
30
|
+
margin: 0px 3px;
|
|
31
|
+
|
|
32
|
+
--md-elevated-button-container-height: 35px;
|
|
33
|
+
--md-elevated-button-label-text-size: 16px;
|
|
34
|
+
--md-elevated-button-container-color: #0595e5;
|
|
35
|
+
|
|
36
|
+
--md-elevated-button-label-text-color: #fff;
|
|
37
|
+
--md-elevated-button-hover-label-text-color: #fff;
|
|
38
|
+
--md-elevated-button-pressed-label-text-color: #fff;
|
|
39
|
+
--md-elevated-button-focus-label-text-color: #fff;
|
|
40
|
+
--md-elevated-button-icon-color: #fff;
|
|
41
|
+
--md-elevated-button-hover-icon-color: #fff;
|
|
42
|
+
--md-elevated-button-pressed-icon-color: #fff;
|
|
43
|
+
--md-elevated-button-focus-icon-color: #fff;
|
|
44
|
+
|
|
45
|
+
&[red] {
|
|
46
|
+
--md-elevated-button-container-color: #e15757;
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
div[button-container] {
|
|
51
|
+
padding: 0 5px 10px 0;
|
|
52
|
+
text-align: right;
|
|
53
|
+
}
|
|
28
54
|
`
|
|
29
55
|
]
|
|
30
56
|
|
|
@@ -33,32 +59,20 @@ export class ConstructionTypeManagement extends PageView {
|
|
|
33
59
|
|
|
34
60
|
get context() {
|
|
35
61
|
return {
|
|
36
|
-
title: '공종 관리'
|
|
37
|
-
actions: [
|
|
38
|
-
{
|
|
39
|
-
title: '저장',
|
|
40
|
-
action: this._updateConstructionTypes.bind(this),
|
|
41
|
-
icon: 'save'
|
|
42
|
-
},
|
|
43
|
-
{
|
|
44
|
-
title: '삭제',
|
|
45
|
-
action: this._deleteConstructionTypes.bind(this),
|
|
46
|
-
icon: 'delete'
|
|
47
|
-
}
|
|
48
|
-
]
|
|
62
|
+
title: '공종 관리'
|
|
49
63
|
}
|
|
50
64
|
}
|
|
51
65
|
|
|
52
66
|
render() {
|
|
53
67
|
return html`
|
|
54
|
-
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
68
|
+
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}> </ox-grist>
|
|
69
|
+
<div button-container>
|
|
70
|
+
<md-elevated-button @click=${this._updateConstructionTypes.bind(this)}>
|
|
71
|
+
<md-icon slot="icon">save</md-icon>저장</md-elevated-button
|
|
72
|
+
>
|
|
73
|
+
<md-elevated-button red @click=${this._deleteConstructionTypes.bind(this)}>
|
|
74
|
+
<md-icon slot="icon">delete</md-icon>삭제</md-elevated-button
|
|
75
|
+
>
|
|
62
76
|
</div>
|
|
63
77
|
`
|
|
64
78
|
}
|
|
@@ -99,6 +113,11 @@ export class ConstructionTypeManagement extends PageView {
|
|
|
99
113
|
width: 200
|
|
100
114
|
}
|
|
101
115
|
],
|
|
116
|
+
rows: {
|
|
117
|
+
selectable: {
|
|
118
|
+
multiple: true
|
|
119
|
+
}
|
|
120
|
+
},
|
|
102
121
|
pagination: { infinite: true }
|
|
103
122
|
}
|
|
104
123
|
}
|
|
@@ -24,6 +24,28 @@ export class ManagerManagement extends PageView {
|
|
|
24
24
|
--grid-record-emphasized-background-color: red;
|
|
25
25
|
--grid-record-emphasized-color: yellow;
|
|
26
26
|
}
|
|
27
|
+
|
|
28
|
+
md-elevated-button {
|
|
29
|
+
margin: 0px 3px;
|
|
30
|
+
|
|
31
|
+
--md-elevated-button-container-height: 35px;
|
|
32
|
+
--md-elevated-button-label-text-size: 16px;
|
|
33
|
+
--md-elevated-button-container-color: #0595e5;
|
|
34
|
+
|
|
35
|
+
--md-elevated-button-label-text-color: #fff;
|
|
36
|
+
--md-elevated-button-hover-label-text-color: #fff;
|
|
37
|
+
--md-elevated-button-pressed-label-text-color: #fff;
|
|
38
|
+
--md-elevated-button-focus-label-text-color: #fff;
|
|
39
|
+
--md-elevated-button-icon-color: #fff;
|
|
40
|
+
--md-elevated-button-hover-icon-color: #fff;
|
|
41
|
+
--md-elevated-button-pressed-icon-color: #fff;
|
|
42
|
+
--md-elevated-button-focus-icon-color: #fff;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
div[button-container] {
|
|
46
|
+
padding: 0 5px 10px 0;
|
|
47
|
+
text-align: right;
|
|
48
|
+
}
|
|
27
49
|
`
|
|
28
50
|
]
|
|
29
51
|
|
|
@@ -45,13 +67,12 @@ export class ManagerManagement extends PageView {
|
|
|
45
67
|
|
|
46
68
|
render() {
|
|
47
69
|
return html`
|
|
48
|
-
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
</ox-grist>
|
|
70
|
+
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}> </ox-grist>
|
|
71
|
+
<div button-container>
|
|
72
|
+
<md-elevated-button @click=${this._updateManagers.bind(this)}>
|
|
73
|
+
<md-icon slot="icon">save</md-icon>저장</md-elevated-button
|
|
74
|
+
>
|
|
75
|
+
</div>
|
|
55
76
|
`
|
|
56
77
|
}
|
|
57
78
|
|
|
@@ -9,6 +9,7 @@ import { DataGrist } from '@operato/data-grist'
|
|
|
9
9
|
import { client } from '@operato/graphql'
|
|
10
10
|
import { notify } from '@operato/layout'
|
|
11
11
|
import gql from 'graphql-tag'
|
|
12
|
+
import { FetchOption } from '@operato/data-grist'
|
|
12
13
|
|
|
13
14
|
@customElement('worker-type-management')
|
|
14
15
|
export class WorkerTypeManagement extends PageView {
|
|
@@ -25,6 +26,32 @@ export class WorkerTypeManagement extends PageView {
|
|
|
25
26
|
--grid-record-emphasized-background-color: red;
|
|
26
27
|
--grid-record-emphasized-color: yellow;
|
|
27
28
|
}
|
|
29
|
+
|
|
30
|
+
md-elevated-button {
|
|
31
|
+
margin: 0px 3px;
|
|
32
|
+
|
|
33
|
+
--md-elevated-button-container-height: 35px;
|
|
34
|
+
--md-elevated-button-label-text-size: 16px;
|
|
35
|
+
--md-elevated-button-container-color: #0595e5;
|
|
36
|
+
|
|
37
|
+
--md-elevated-button-label-text-color: #fff;
|
|
38
|
+
--md-elevated-button-hover-label-text-color: #fff;
|
|
39
|
+
--md-elevated-button-pressed-label-text-color: #fff;
|
|
40
|
+
--md-elevated-button-focus-label-text-color: #fff;
|
|
41
|
+
--md-elevated-button-icon-color: #fff;
|
|
42
|
+
--md-elevated-button-hover-icon-color: #fff;
|
|
43
|
+
--md-elevated-button-pressed-icon-color: #fff;
|
|
44
|
+
--md-elevated-button-focus-icon-color: #fff;
|
|
45
|
+
|
|
46
|
+
&[red] {
|
|
47
|
+
--md-elevated-button-container-color: #e15757;
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
div[button-container] {
|
|
52
|
+
padding: 0 5px 10px 0;
|
|
53
|
+
text-align: right;
|
|
54
|
+
}
|
|
28
55
|
`
|
|
29
56
|
]
|
|
30
57
|
|
|
@@ -51,14 +78,14 @@ export class WorkerTypeManagement extends PageView {
|
|
|
51
78
|
|
|
52
79
|
render() {
|
|
53
80
|
return html`
|
|
54
|
-
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
81
|
+
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}> </ox-grist>
|
|
82
|
+
<div button-container>
|
|
83
|
+
<md-elevated-button @click=${this._updateWorkerTypes.bind(this)}>
|
|
84
|
+
<md-icon slot="icon">save</md-icon>저장</md-elevated-button
|
|
85
|
+
>
|
|
86
|
+
<md-elevated-button red @click=${this._deleteWorkerTypes.bind(this)}>
|
|
87
|
+
<md-icon slot="icon">delete</md-icon>삭제</md-elevated-button
|
|
88
|
+
>
|
|
62
89
|
</div>
|
|
63
90
|
`
|
|
64
91
|
}
|
|
@@ -99,11 +126,16 @@ export class WorkerTypeManagement extends PageView {
|
|
|
99
126
|
width: 200
|
|
100
127
|
}
|
|
101
128
|
],
|
|
129
|
+
rows: {
|
|
130
|
+
selectable: {
|
|
131
|
+
multiple: true
|
|
132
|
+
}
|
|
133
|
+
},
|
|
102
134
|
pagination: { infinite: true }
|
|
103
135
|
}
|
|
104
136
|
}
|
|
105
137
|
|
|
106
|
-
async fetchHandler() {
|
|
138
|
+
async fetchHandler(_: FetchOption) {
|
|
107
139
|
const response = await client.query({
|
|
108
140
|
query: gql`
|
|
109
141
|
query WorkerTypes {
|
|
@@ -126,9 +126,7 @@ let ProjectDetail = class ProjectDetail extends ScopedElementsMixin(PageView) {
|
|
|
126
126
|
<div subject bold>개별 단지 상세정보 바로가기</div>
|
|
127
127
|
<div building-container>
|
|
128
128
|
${(_p = (_o = this.project.buildingComplex) === null || _o === void 0 ? void 0 : _o.buildings) === null || _p === void 0 ? void 0 : _p.map(building => {
|
|
129
|
-
return html `<md-outlined-button
|
|
130
|
-
href=${`building-complex-detail/${this.project.id}?buildingId=${building.id}`}
|
|
131
|
-
>
|
|
129
|
+
return html `<md-outlined-button href=${`building-complex-detail/${this.project.id}?buildingId=${building.id}`}>
|
|
132
130
|
${building.name}
|
|
133
131
|
</md-outlined-button>`;
|
|
134
132
|
})}
|
|
@@ -494,7 +492,7 @@ ProjectDetail.styles = [
|
|
|
494
492
|
}
|
|
495
493
|
div[inspection] {
|
|
496
494
|
display: grid;
|
|
497
|
-
grid-template-columns: 1.4fr 0.9fr 0.9fr 0.9fr
|
|
495
|
+
grid-template-columns: 1.4fr 0.9fr 0.9fr 0.9fr;
|
|
498
496
|
margin-top: 5px;
|
|
499
497
|
background: #f6f6f6;
|
|
500
498
|
border-radius: 7px;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"project-detail.js","sourceRoot":"","sources":["../../../client/pages/project/project-detail.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/button/elevated-button.js'\nimport '@material/web/textfield/outlined-text-field.js'\nimport '@material/web/button/outlined-button.js'\n\nimport { PageView } from '@operato/shell'\nimport { PageLifecycle } from '@operato/shell/dist/src/app/pages/page-view'\nimport { css, html } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { client } from '@operato/graphql'\n\nimport gql from 'graphql-tag'\nimport { Project } from './project-list'\nimport _getWeather from '../lib/waether'\nimport '@operato/chart/ox-progress-circle.js'\n\nexport interface InspectionSummary {\n request: number\n pass: number\n fail: number\n}\n\ninterface Weather {\n rain: number\n temperature: number\n humidity: number\n wind: string\n}\n\n@customElement('project-detail')\nexport class ProjectDetail extends ScopedElementsMixin(PageView) {\n static styles = [\n css`\n :host {\n display: grid;\n grid-template-rows: 75px auto;\n color: #4e5055;\n\n width: 100%;\n background-color: #f7f7f7;\n overflow-y: auto;\n\n --grid-record-emphasized-background-color: red;\n --grid-record-emphasized-color: yellow;\n }\n\n md-outlined-button {\n --md-outlined-button-container-height: 30px;\n --md-outlined-button-trailing-space: 15px;\n --md-outlined-button-leading-space: 15px;\n }\n\n *[bold] {\n font-weight: bold;\n }\n\n div[header] {\n display: flex;\n margin: 0px 20px;\n\n h2 {\n flex: 0.5;\n color: #3f71a0;\n }\n\n div[button-container] {\n display: flex;\n align-items: center;\n justify-content: end;\n flex: 0.5;\n\n md-elevated-button {\n margin: 0px 3px;\n\n --md-elevated-button-container-height: 35px;\n --md-elevated-button-label-text-size: 16px;\n --md-elevated-button-container-color: #0595e5;\n\n --md-elevated-button-label-text-color: #fff;\n --md-elevated-button-hover-label-text-color: #fff;\n --md-elevated-button-pressed-label-text-color: #fff;\n --md-elevated-button-focus-label-text-color: #fff;\n --md-elevated-button-icon-color: #fff;\n --md-elevated-button-hover-icon-color: #fff;\n --md-elevated-button-pressed-icon-color: #fff;\n --md-elevated-button-focus-icon-color: #fff;\n }\n }\n }\n\n div[body] {\n display: flex;\n margin: 0px 25px 25px 25px;\n gap: 10px;\n\n h3 {\n color: #2e79be;\n font-size: 18px;\n margin: 0px;\n }\n\n & > div {\n display: flex;\n flex: 1;\n gap: 10px;\n flex-direction: column;\n\n & > div {\n display: flex;\n flex-direction: column;\n background-color: #ffffff;\n border: 1px solid #cccccc80;\n gap: 10px;\n padding: 15px;\n border-radius: 5px;\n }\n\n div[left-top] {\n div[content-1] {\n display: flex;\n align-items: center;\n gap: 15px;\n\n img {\n width: 42%;\n height: fit-content;\n }\n\n div[row] {\n line-height: 25px;\n }\n }\n div[content-2] {\n height: 65px;\n overflow-y: auto;\n }\n }\n\n div[left-bottom] {\n img {\n width: 100%;\n aspect-ratio: 2 / 1;\n }\n\n div[subject] {\n margin-bottom: 7px;\n }\n div[building-container] {\n display: block;\n height: 40px;\n overflow-y: auto;\n\n & > * {\n margin-right: 10px;\n margin-bottom: 7px;\n }\n }\n }\n\n div[right-top] {\n flex: 3;\n\n div[state] {\n display: grid;\n grid-template-columns: 0.95fr 0.95fr 1.1fr;\n gap: 15px;\n\n span[progress] {\n max-width: 170px;\n text-align: center;\n display: flex;\n justify-self: center;\n flex-direction: column;\n width: 100%;\n\n & > div {\n font-weight: bold;\n color: #2e79be;\n font-size: 12px;\n margin-top: 5px;\n }\n & > div[week] {\n color: #06b5af;\n }\n }\n span[weather] {\n display: flex;\n flex-direction: column;\n gap: 5px;\n margin-left: 10px;\n\n & > div {\n display: flex;\n justify-content: space-between;\n\n & > span {\n display: flex;\n }\n }\n }\n }\n div[inspection] {\n display: grid;\n grid-template-columns: 1.4fr 0.9fr 0.9fr 0.9fr 0.9fr;\n margin-top: 5px;\n background: #f6f6f6;\n border-radius: 7px;\n padding: 7px 0px;\n\n & > span {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n\n div[pass] {\n color: #1bb401;\n }\n div[fail] {\n color: #ff4444;\n }\n }\n & > span[name] {\n flex-direction: row;\n text-align: right;\n gap: 10px;\n\n md-icon {\n width: 40px;\n height: 40px;\n border-radius: 7px;\n color: #fff;\n background: #f16154;\n }\n }\n }\n div[notice] {\n margin-top: 7px;\n\n div[name] {\n margin-left: 4px;\n }\n div[content] {\n background-color: #ebc8321a;\n border-radius: 10px;\n padding: 10px;\n font-size: 14px;\n margin-top: 6px;\n }\n }\n }\n\n div[right-bottom] {\n flex: 2;\n\n div[table-container] {\n width: 100%;\n height: 15rem;\n overflow-y: auto;\n overflow-x: hidden;\n position: relative;\n }\n\n hr {\n position: sticky;\n width: 100%;\n margin: 0;\n top: 0px;\n border: 1px solid #3295f1;\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n table-layout: fixed;\n }\n\n thead {\n position: sticky;\n top: 2px;\n background-color: #464651;\n color: #fff;\n z-index: 1;\n }\n\n thead th {\n padding: 5px;\n font-size: 15px;\n }\n\n tbody td {\n border-bottom: 1px solid #cccccc;\n padding: 5px 3px;\n text-align: center;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n font-size: 15px;\n }\n }\n }\n }\n `\n ]\n\n get context() {\n return {\n title: '진행 중 프로젝트 상세 정보'\n }\n }\n\n private defaultProject = {\n name: '',\n buildingComplex: {\n address: '',\n area: 0,\n constructionCompany: '',\n clientCompany: '',\n supervisoryCompany: '',\n designCompany: '',\n constructionType: '',\n buildings: []\n }\n }\n @state() projectId: string = ''\n @state() project: Project = { ...this.defaultProject }\n @state() inspectionSummary: InspectionSummary = {\n request: 0,\n pass: 0,\n fail: 0\n }\n @state() weather: Weather = {\n rain: 0,\n temperature: 0,\n humidity: 0,\n wind: ''\n }\n\n render() {\n return html`\n <div header>\n <h2>${this.project.name}</h2>\n <div button-container>\n <md-elevated-button href=${`project-update/${this.project.id}`}>\n <md-icon slot=\"icon\">assignment</md-icon>프로젝트 정보 수정\n </md-elevated-button>\n <md-elevated-button href=${`project-plan-management/${this.project.id}`}>\n <md-icon slot=\"icon\">description</md-icon>도면 관리\n </md-elevated-button>\n <md-elevated-button href=${`project-task-update/${this.project.id}`}>\n <md-icon slot=\"icon\">event_note</md-icon>공정표 관리\n </md-elevated-button>\n </div>\n </div>\n\n <div body>\n <div>\n <div left-top>\n <h3>기본 정보</h3>\n <div content-1>\n <img project-img src=${this.project.mainPhoto?.fullpath || ''} />\n\n <div>\n <div row>\n <span>- 면적 : </span>\n <span>${this.project.buildingComplex?.area}</span>\n </div>\n <div row>\n <span>- 착공 ~ 준공 : </span>\n <span bold>${this.project.startDate} ~ ${this.project.endDate}</span>\n </div>\n <div row>\n <span>- 발주처 : </span>\n <span>${this.project.buildingComplex?.clientCompany}</span>\n </div>\n <div row>\n <span>- 건설사 : </span>\n <span>${this.project.buildingComplex?.constructionCompany}</span>\n </div>\n <div row>\n <span>- 감리사 : </span>\n <span>${this.project.buildingComplex?.supervisoryCompany}</span>\n </div>\n <div row>\n <span>- 설계사 : </span>\n <span>${this.project.buildingComplex?.designCompany}</span>\n </div>\n </div>\n </div>\n\n <div content-2>\n <div row>\n <span>- 건설구분 : </span>\n <span>${this.project.buildingComplex?.constructionType}</span>\n </div>\n <div row>\n <span>- 공사금액 : </span>\n <span>${this.project.buildingComplex?.constructionCost}</span>\n </div>\n <div row>\n <span>- 세대수 : </span>\n <span>${this.project.buildingComplex?.householdCount}</span>\n </div>\n <div row>\n <span>- 기타 : </span>\n <span>${this.project.buildingComplex?.etc}</span>\n </div>\n </div>\n </div>\n\n <div left-bottom>\n <h3>조감도(BIM도면)</h3>\n <img src=${this.project.buildingComplex?.drawing?.fullpath || ''} />\n <div>\n <div subject bold>개별 단지 상세정보 바로가기</div>\n <div building-container>\n ${this.project.buildingComplex?.buildings?.map(building => {\n return html`<md-outlined-button\n href=${`building-complex-detail/${this.project.id}?buildingId=${building.id}`}\n >\n ${building.name}\n </md-outlined-button>`\n })}\n </div>\n </div>\n </div>\n </div>\n\n <div>\n <div right-top>\n <h3>프로젝트 현황</h3>\n <div state>\n <span progress>\n <ox-progress-circle\n .value=${70}\n titleText=\"전체\"\n suffix=\"%\"\n fontSize=\"27px\"\n fontColor=\"#4E5055\"\n borderStyle=\"none\"\n innerCircleSize=\"28%\"\n circleColor=\"#0595E5\"\n shadow=\"#00000026 4px 4px 4px\"\n background=\"#eaf5fd\"\n ></ox-progress-circle>\n <div>전체공정율(%)</div>\n </span>\n <span progress>\n <ox-progress-circle\n .value=${30.4}\n titleText=\"주간\"\n fontSize=\"27px\"\n fontColor=\"#4E5055\"\n borderStyle=\"none\"\n innerCircleSize=\"28%\"\n circleColor=\"#06B5AF\"\n shadow=\"#00000026 4px 4px 4px\"\n background=\"#eaf7f7\"\n ></ox-progress-circle>\n <div week>주간공정율(%)</div>\n </span>\n <span weather>\n <div bold>현장현황</div>\n <div>\n <span><md-icon slot=\"icon\">rainy</md-icon> 강수확률</span>\n <span bold>${this.weather.rain}%</span>\n </div>\n <div>\n <span><md-icon slot=\"icon\">humidity_percentage</md-icon> 습도</span>\n <span bold>${this.weather.humidity}%</span>\n </div>\n <div>\n <span><md-icon slot=\"icon\">thermostat</md-icon> 온도</span>\n <span bold>${this.weather.temperature}°C</span>\n </div>\n <div>\n <span><md-icon slot=\"icon\">air</md-icon> 풍향</span>\n <span bold>${this.weather.wind}</span>\n </div>\n </span>\n </div>\n <div inspection>\n <span name bold>\n <md-icon slot=\"icon\">list_alt_add</md-icon>\n 시공검측<br />현황\n </span>\n <span>\n <div>검측요청</div>\n <div bold>${this.inspectionSummary.request}</div>\n </span>\n <span>\n <div>합격</div>\n <div bold pass>${this.inspectionSummary.pass}</div>\n </span>\n <span>\n <div>불합격</div>\n <div bold fail>${this.inspectionSummary.fail}</div>\n </span>\n </div>\n <div notice>\n <div name bold>공지사항</div>\n <div content>${this.project.buildingComplex.notice}</div>\n </div>\n </div>\n\n <div right-bottom>\n <h3>기타 사항</h3>\n <div table-container>\n <hr />\n <table>\n <thead>\n <tr>\n <th width=\"20%\">검측 위치</th>\n <th width=\"20%\">공종</th>\n <th width=\"40%\">내용</th>\n <th width=\"20%\">검측결과</th>\n </tr>\n </thead>\n <tbody>\n ${[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1].map(inspection => {\n return html`<tr>\n <td>101동 3층</td>\n <td bold>단열공사</td>\n <td>단열재 시공 층간 차음재 시공 벽돌/블록 및 ALC 패널 공사</td>\n <td bold>검측완료</td>\n </tr>`\n })}\n </tbody>\n </table>\n </div>\n </div>\n </div>\n </div>\n `\n }\n\n async pageInitialized(lifecycle: PageLifecycle) {}\n\n async pageUpdated(changes: any, lifecycle: PageLifecycle) {\n if (this.active) {\n this.projectId = lifecycle.resourceId || ''\n await this.initProject(this.projectId)\n }\n }\n\n async initProject(projectId: string = '') {\n const response = await client.query({\n query: gql`\n query Project($id: String!, $projectId: String!) {\n project(id: $id) {\n id\n name\n startDate\n endDate\n mainPhoto {\n fullpath\n }\n totalProgress\n weeklyProgress\n kpi\n inspPassRate\n robotProgressRate\n structuralSafetyRate\n buildingComplex {\n id\n address\n latitude\n longitude\n area\n clientCompany\n constructionCompany\n supervisoryCompany\n designCompany\n drawing {\n id\n name\n fullpath\n }\n constructionType\n constructionCost\n etc\n notice\n householdCount\n buildingCount\n buildings {\n id\n name\n floorCount\n }\n }\n }\n\n inspectionSummary(projectId: $projectId) {\n request\n pass\n fail\n }\n }\n `,\n variables: {\n id: projectId,\n projectId\n }\n })\n\n if (response.errors) return\n\n this.project = response.data?.project || {}\n this.inspectionSummary = response.data?.inspectionSummary || {}\n\n const { latitude, longitude } = this.project?.buildingComplex\n if (latitude && longitude) {\n this.weather = await _getWeather(latitude, longitude)\n }\n\n console.log('init project : ', this.project)\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"project-detail.js","sourceRoot":"","sources":["../../../client/pages/project/project-detail.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/button/elevated-button.js'\nimport '@material/web/textfield/outlined-text-field.js'\nimport '@material/web/button/outlined-button.js'\n\nimport { PageView } from '@operato/shell'\nimport { PageLifecycle } from '@operato/shell/dist/src/app/pages/page-view'\nimport { css, html } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { client } from '@operato/graphql'\n\nimport gql from 'graphql-tag'\nimport { Project } from './project-list'\nimport _getWeather from '../lib/waether'\nimport '@operato/chart/ox-progress-circle.js'\n\nexport interface InspectionSummary {\n request: number\n pass: number\n fail: number\n}\n\ninterface Weather {\n rain: number\n temperature: number\n humidity: number\n wind: string\n}\n\n@customElement('project-detail')\nexport class ProjectDetail extends ScopedElementsMixin(PageView) {\n static styles = [\n css`\n :host {\n display: grid;\n grid-template-rows: 75px auto;\n color: #4e5055;\n\n width: 100%;\n background-color: #f7f7f7;\n overflow-y: auto;\n\n --grid-record-emphasized-background-color: red;\n --grid-record-emphasized-color: yellow;\n }\n\n md-outlined-button {\n --md-outlined-button-container-height: 30px;\n --md-outlined-button-trailing-space: 15px;\n --md-outlined-button-leading-space: 15px;\n }\n\n *[bold] {\n font-weight: bold;\n }\n\n div[header] {\n display: flex;\n margin: 0px 20px;\n\n h2 {\n flex: 0.5;\n color: #3f71a0;\n }\n\n div[button-container] {\n display: flex;\n align-items: center;\n justify-content: end;\n flex: 0.5;\n\n md-elevated-button {\n margin: 0px 3px;\n\n --md-elevated-button-container-height: 35px;\n --md-elevated-button-label-text-size: 16px;\n --md-elevated-button-container-color: #0595e5;\n\n --md-elevated-button-label-text-color: #fff;\n --md-elevated-button-hover-label-text-color: #fff;\n --md-elevated-button-pressed-label-text-color: #fff;\n --md-elevated-button-focus-label-text-color: #fff;\n --md-elevated-button-icon-color: #fff;\n --md-elevated-button-hover-icon-color: #fff;\n --md-elevated-button-pressed-icon-color: #fff;\n --md-elevated-button-focus-icon-color: #fff;\n }\n }\n }\n\n div[body] {\n display: flex;\n margin: 0px 25px 25px 25px;\n gap: 10px;\n\n h3 {\n color: #2e79be;\n font-size: 18px;\n margin: 0px;\n }\n\n & > div {\n display: flex;\n flex: 1;\n gap: 10px;\n flex-direction: column;\n\n & > div {\n display: flex;\n flex-direction: column;\n background-color: #ffffff;\n border: 1px solid #cccccc80;\n gap: 10px;\n padding: 15px;\n border-radius: 5px;\n }\n\n div[left-top] {\n div[content-1] {\n display: flex;\n align-items: center;\n gap: 15px;\n\n img {\n width: 42%;\n height: fit-content;\n }\n\n div[row] {\n line-height: 25px;\n }\n }\n div[content-2] {\n height: 65px;\n overflow-y: auto;\n }\n }\n\n div[left-bottom] {\n img {\n width: 100%;\n aspect-ratio: 2 / 1;\n }\n\n div[subject] {\n margin-bottom: 7px;\n }\n div[building-container] {\n display: block;\n height: 40px;\n overflow-y: auto;\n\n & > * {\n margin-right: 10px;\n margin-bottom: 7px;\n }\n }\n }\n\n div[right-top] {\n flex: 3;\n\n div[state] {\n display: grid;\n grid-template-columns: 0.95fr 0.95fr 1.1fr;\n gap: 15px;\n\n span[progress] {\n max-width: 170px;\n text-align: center;\n display: flex;\n justify-self: center;\n flex-direction: column;\n width: 100%;\n\n & > div {\n font-weight: bold;\n color: #2e79be;\n font-size: 12px;\n margin-top: 5px;\n }\n & > div[week] {\n color: #06b5af;\n }\n }\n span[weather] {\n display: flex;\n flex-direction: column;\n gap: 5px;\n margin-left: 10px;\n\n & > div {\n display: flex;\n justify-content: space-between;\n\n & > span {\n display: flex;\n }\n }\n }\n }\n div[inspection] {\n display: grid;\n grid-template-columns: 1.4fr 0.9fr 0.9fr 0.9fr;\n margin-top: 5px;\n background: #f6f6f6;\n border-radius: 7px;\n padding: 7px 0px;\n\n & > span {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n\n div[pass] {\n color: #1bb401;\n }\n div[fail] {\n color: #ff4444;\n }\n }\n & > span[name] {\n flex-direction: row;\n text-align: right;\n gap: 10px;\n\n md-icon {\n width: 40px;\n height: 40px;\n border-radius: 7px;\n color: #fff;\n background: #f16154;\n }\n }\n }\n div[notice] {\n margin-top: 7px;\n\n div[name] {\n margin-left: 4px;\n }\n div[content] {\n background-color: #ebc8321a;\n border-radius: 10px;\n padding: 10px;\n font-size: 14px;\n margin-top: 6px;\n }\n }\n }\n\n div[right-bottom] {\n flex: 2;\n\n div[table-container] {\n width: 100%;\n height: 15rem;\n overflow-y: auto;\n overflow-x: hidden;\n position: relative;\n }\n\n hr {\n position: sticky;\n width: 100%;\n margin: 0;\n top: 0px;\n border: 1px solid #3295f1;\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n table-layout: fixed;\n }\n\n thead {\n position: sticky;\n top: 2px;\n background-color: #464651;\n color: #fff;\n z-index: 1;\n }\n\n thead th {\n padding: 5px;\n font-size: 15px;\n }\n\n tbody td {\n border-bottom: 1px solid #cccccc;\n padding: 5px 3px;\n text-align: center;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n font-size: 15px;\n }\n }\n }\n }\n `\n ]\n\n get context() {\n return {\n title: '진행 중 프로젝트 상세 정보'\n }\n }\n\n private defaultProject = {\n name: '',\n buildingComplex: {\n address: '',\n area: 0,\n constructionCompany: '',\n clientCompany: '',\n supervisoryCompany: '',\n designCompany: '',\n constructionType: '',\n buildings: []\n }\n }\n\n @state() projectId: string = ''\n @state() project: Project = { ...this.defaultProject }\n @state() inspectionSummary: InspectionSummary = {\n request: 0,\n pass: 0,\n fail: 0\n }\n @state() weather: Weather = {\n rain: 0,\n temperature: 0,\n humidity: 0,\n wind: ''\n }\n\n render() {\n return html`\n <div header>\n <h2>${this.project.name}</h2>\n <div button-container>\n <md-elevated-button href=${`project-update/${this.project.id}`}>\n <md-icon slot=\"icon\">assignment</md-icon>프로젝트 정보 수정\n </md-elevated-button>\n <md-elevated-button href=${`project-plan-management/${this.project.id}`}>\n <md-icon slot=\"icon\">description</md-icon>도면 관리\n </md-elevated-button>\n <md-elevated-button href=${`project-task-update/${this.project.id}`}>\n <md-icon slot=\"icon\">event_note</md-icon>공정표 관리\n </md-elevated-button>\n </div>\n </div>\n\n <div body>\n <div>\n <div left-top>\n <h3>기본 정보</h3>\n <div content-1>\n <img project-img src=${this.project.mainPhoto?.fullpath || ''} />\n\n <div>\n <div row>\n <span>- 면적 : </span>\n <span>${this.project.buildingComplex?.area}</span>\n </div>\n <div row>\n <span>- 착공 ~ 준공 : </span>\n <span bold>${this.project.startDate} ~ ${this.project.endDate}</span>\n </div>\n <div row>\n <span>- 발주처 : </span>\n <span>${this.project.buildingComplex?.clientCompany}</span>\n </div>\n <div row>\n <span>- 건설사 : </span>\n <span>${this.project.buildingComplex?.constructionCompany}</span>\n </div>\n <div row>\n <span>- 감리사 : </span>\n <span>${this.project.buildingComplex?.supervisoryCompany}</span>\n </div>\n <div row>\n <span>- 설계사 : </span>\n <span>${this.project.buildingComplex?.designCompany}</span>\n </div>\n </div>\n </div>\n\n <div content-2>\n <div row>\n <span>- 건설구분 : </span>\n <span>${this.project.buildingComplex?.constructionType}</span>\n </div>\n <div row>\n <span>- 공사금액 : </span>\n <span>${this.project.buildingComplex?.constructionCost}</span>\n </div>\n <div row>\n <span>- 세대수 : </span>\n <span>${this.project.buildingComplex?.householdCount}</span>\n </div>\n <div row>\n <span>- 기타 : </span>\n <span>${this.project.buildingComplex?.etc}</span>\n </div>\n </div>\n </div>\n\n <div left-bottom>\n <h3>조감도(BIM도면)</h3>\n <img src=${this.project.buildingComplex?.drawing?.fullpath || ''} />\n <div>\n <div subject bold>개별 단지 상세정보 바로가기</div>\n <div building-container>\n ${this.project.buildingComplex?.buildings?.map(building => {\n return html`<md-outlined-button href=${`building-complex-detail/${this.project.id}?buildingId=${building.id}`}>\n ${building.name}\n </md-outlined-button>`\n })}\n </div>\n </div>\n </div>\n </div>\n\n <div>\n <div right-top>\n <h3>프로젝트 현황</h3>\n <div state>\n <span progress>\n <ox-progress-circle\n .value=${70}\n titleText=\"전체\"\n suffix=\"%\"\n fontSize=\"27px\"\n fontColor=\"#4E5055\"\n borderStyle=\"none\"\n innerCircleSize=\"28%\"\n circleColor=\"#0595E5\"\n shadow=\"#00000026 4px 4px 4px\"\n background=\"#eaf5fd\"\n ></ox-progress-circle>\n <div>전체공정율(%)</div>\n </span>\n <span progress>\n <ox-progress-circle\n .value=${30.4}\n titleText=\"주간\"\n fontSize=\"27px\"\n fontColor=\"#4E5055\"\n borderStyle=\"none\"\n innerCircleSize=\"28%\"\n circleColor=\"#06B5AF\"\n shadow=\"#00000026 4px 4px 4px\"\n background=\"#eaf7f7\"\n ></ox-progress-circle>\n <div week>주간공정율(%)</div>\n </span>\n <span weather>\n <div bold>현장현황</div>\n <div>\n <span><md-icon slot=\"icon\">rainy</md-icon> 강수확률</span>\n <span bold>${this.weather.rain}%</span>\n </div>\n <div>\n <span><md-icon slot=\"icon\">humidity_percentage</md-icon> 습도</span>\n <span bold>${this.weather.humidity}%</span>\n </div>\n <div>\n <span><md-icon slot=\"icon\">thermostat</md-icon> 온도</span>\n <span bold>${this.weather.temperature}°C</span>\n </div>\n <div>\n <span><md-icon slot=\"icon\">air</md-icon> 풍향</span>\n <span bold>${this.weather.wind}</span>\n </div>\n </span>\n </div>\n <div inspection>\n <span name bold>\n <md-icon slot=\"icon\">list_alt_add</md-icon>\n 시공검측<br />현황\n </span>\n <span>\n <div>검측요청</div>\n <div bold>${this.inspectionSummary.request}</div>\n </span>\n <span>\n <div>합격</div>\n <div bold pass>${this.inspectionSummary.pass}</div>\n </span>\n <span>\n <div>불합격</div>\n <div bold fail>${this.inspectionSummary.fail}</div>\n </span>\n </div>\n <div notice>\n <div name bold>공지사항</div>\n <div content>${this.project.buildingComplex.notice}</div>\n </div>\n </div>\n\n <div right-bottom>\n <h3>기타 사항</h3>\n <div table-container>\n <hr />\n <table>\n <thead>\n <tr>\n <th width=\"20%\">검측 위치</th>\n <th width=\"20%\">공종</th>\n <th width=\"40%\">내용</th>\n <th width=\"20%\">검측결과</th>\n </tr>\n </thead>\n <tbody>\n ${[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1].map(inspection => {\n return html`<tr>\n <td>101동 3층</td>\n <td bold>단열공사</td>\n <td>단열재 시공 층간 차음재 시공 벽돌/블록 및 ALC 패널 공사</td>\n <td bold>검측완료</td>\n </tr>`\n })}\n </tbody>\n </table>\n </div>\n </div>\n </div>\n </div>\n `\n }\n\n async pageInitialized(lifecycle: PageLifecycle) {}\n\n async pageUpdated(changes: any, lifecycle: PageLifecycle) {\n if (this.active) {\n this.projectId = lifecycle.resourceId || ''\n await this.initProject(this.projectId)\n }\n }\n\n async initProject(projectId: string = '') {\n const response = await client.query({\n query: gql`\n query Project($id: String!, $projectId: String!) {\n project(id: $id) {\n id\n name\n startDate\n endDate\n mainPhoto {\n fullpath\n }\n totalProgress\n weeklyProgress\n kpi\n inspPassRate\n robotProgressRate\n structuralSafetyRate\n buildingComplex {\n id\n address\n latitude\n longitude\n area\n clientCompany\n constructionCompany\n supervisoryCompany\n designCompany\n drawing {\n id\n name\n fullpath\n }\n constructionType\n constructionCost\n etc\n notice\n householdCount\n buildingCount\n buildings {\n id\n name\n floorCount\n }\n }\n }\n\n inspectionSummary(projectId: $projectId) {\n request\n pass\n fail\n }\n }\n `,\n variables: {\n id: projectId,\n projectId\n }\n })\n\n if (response.errors) return\n\n this.project = response.data?.project || {}\n this.inspectionSummary = response.data?.inspectionSummary || {}\n\n const { latitude, longitude } = this.project?.buildingComplex\n if (latitude && longitude) {\n this.weather = await _getWeather(latitude, longitude)\n }\n\n console.log('init project : ', this.project)\n }\n}\n"]}
|
|
@@ -7,11 +7,6 @@ export declare class ConstructionTypeManagement extends PageView {
|
|
|
7
7
|
private grist;
|
|
8
8
|
get context(): {
|
|
9
9
|
title: string;
|
|
10
|
-
actions: {
|
|
11
|
-
title: string;
|
|
12
|
-
action: () => Promise<void>;
|
|
13
|
-
icon: string;
|
|
14
|
-
}[];
|
|
15
10
|
};
|
|
16
11
|
render(): import("lit-html").TemplateResult<1>;
|
|
17
12
|
pageInitialized(lifecycle: any): Promise<void>;
|
|
@@ -12,31 +12,19 @@ import gql from 'graphql-tag';
|
|
|
12
12
|
let ConstructionTypeManagement = class ConstructionTypeManagement extends PageView {
|
|
13
13
|
get context() {
|
|
14
14
|
return {
|
|
15
|
-
title: '공종 관리'
|
|
16
|
-
actions: [
|
|
17
|
-
{
|
|
18
|
-
title: '저장',
|
|
19
|
-
action: this._updateConstructionTypes.bind(this),
|
|
20
|
-
icon: 'save'
|
|
21
|
-
},
|
|
22
|
-
{
|
|
23
|
-
title: '삭제',
|
|
24
|
-
action: this._deleteConstructionTypes.bind(this),
|
|
25
|
-
icon: 'delete'
|
|
26
|
-
}
|
|
27
|
-
]
|
|
15
|
+
title: '공종 관리'
|
|
28
16
|
};
|
|
29
17
|
}
|
|
30
18
|
render() {
|
|
31
19
|
return html `
|
|
32
|
-
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
20
|
+
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}> </ox-grist>
|
|
21
|
+
<div button-container>
|
|
22
|
+
<md-elevated-button @click=${this._updateConstructionTypes.bind(this)}>
|
|
23
|
+
<md-icon slot="icon">save</md-icon>저장</md-elevated-button
|
|
24
|
+
>
|
|
25
|
+
<md-elevated-button red @click=${this._deleteConstructionTypes.bind(this)}>
|
|
26
|
+
<md-icon slot="icon">delete</md-icon>삭제</md-elevated-button
|
|
27
|
+
>
|
|
40
28
|
</div>
|
|
41
29
|
`;
|
|
42
30
|
}
|
|
@@ -76,6 +64,11 @@ let ConstructionTypeManagement = class ConstructionTypeManagement extends PageVi
|
|
|
76
64
|
width: 200
|
|
77
65
|
}
|
|
78
66
|
],
|
|
67
|
+
rows: {
|
|
68
|
+
selectable: {
|
|
69
|
+
multiple: true
|
|
70
|
+
}
|
|
71
|
+
},
|
|
79
72
|
pagination: { infinite: true }
|
|
80
73
|
};
|
|
81
74
|
}
|
|
@@ -172,6 +165,32 @@ ConstructionTypeManagement.styles = [
|
|
|
172
165
|
--grid-record-emphasized-background-color: red;
|
|
173
166
|
--grid-record-emphasized-color: yellow;
|
|
174
167
|
}
|
|
168
|
+
|
|
169
|
+
md-elevated-button {
|
|
170
|
+
margin: 0px 3px;
|
|
171
|
+
|
|
172
|
+
--md-elevated-button-container-height: 35px;
|
|
173
|
+
--md-elevated-button-label-text-size: 16px;
|
|
174
|
+
--md-elevated-button-container-color: #0595e5;
|
|
175
|
+
|
|
176
|
+
--md-elevated-button-label-text-color: #fff;
|
|
177
|
+
--md-elevated-button-hover-label-text-color: #fff;
|
|
178
|
+
--md-elevated-button-pressed-label-text-color: #fff;
|
|
179
|
+
--md-elevated-button-focus-label-text-color: #fff;
|
|
180
|
+
--md-elevated-button-icon-color: #fff;
|
|
181
|
+
--md-elevated-button-hover-icon-color: #fff;
|
|
182
|
+
--md-elevated-button-pressed-icon-color: #fff;
|
|
183
|
+
--md-elevated-button-focus-icon-color: #fff;
|
|
184
|
+
|
|
185
|
+
&[red] {
|
|
186
|
+
--md-elevated-button-container-color: #e15757;
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
|
|
190
|
+
div[button-container] {
|
|
191
|
+
padding: 0 5px 10px 0;
|
|
192
|
+
text-align: right;
|
|
193
|
+
}
|
|
175
194
|
`
|
|
176
195
|
];
|
|
177
196
|
__decorate([
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"construction-type-management.js","sourceRoot":"","sources":["../../../client/pages/resource/construction-type-management.ts"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAA;AAC5B,OAAO,6CAA6C,CAAA;AAEpD,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACpE,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AACxC,OAAO,GAAG,MAAM,aAAa,CAAA;AAGtB,IAAM,0BAA0B,GAAhC,MAAM,0BAA2B,SAAQ,QAAQ;
|
|
1
|
+
{"version":3,"file":"construction-type-management.js","sourceRoot":"","sources":["../../../client/pages/resource/construction-type-management.ts"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAA;AAC5B,OAAO,6CAA6C,CAAA;AAEpD,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACpE,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AACxC,OAAO,GAAG,MAAM,aAAa,CAAA;AAGtB,IAAM,0BAA0B,GAAhC,MAAM,0BAA2B,SAAQ,QAAQ;IA8CtD,IAAI,OAAO;QACT,OAAO;YACL,KAAK,EAAE,OAAO;SACf,CAAA;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;wBACS,MAAM,YAAY,IAAI,CAAC,WAAW,kBAAkB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;;qCAEnE,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC;;;yCAGpC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC;;;;KAI5E,CAAA;IACH,CAAC;IAED,KAAK,CAAC,eAAe,CAAC,SAAc;QAClC,IAAI,CAAC,WAAW,GAAG;YACjB,OAAO,EAAE;gBACP,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE;gBAC1C,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,cAAc,EAAE,QAAQ,EAAE,IAAI,EAAE;gBAC9D;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,MAAM;oBACZ,MAAM,EAAE,IAAI;oBACZ,MAAM,EAAE;wBACN,QAAQ,EAAE,IAAI;qBACf;oBACD,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,aAAa;oBACnB,MAAM,EAAE,IAAI;oBACZ,MAAM,EAAE;wBACN,QAAQ,EAAE,IAAI;qBACf;oBACD,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,WAAW;oBACjB,MAAM,EAAE,OAAO;oBACf,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,WAAW;oBACjB,MAAM,EAAE,OAAO;oBACf,KAAK,EAAE,GAAG;iBACX;aACF;YACD,IAAI,EAAE;gBACJ,UAAU,EAAE;oBACV,QAAQ,EAAE,IAAI;iBACf;aACF;YACD,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;SAC/B,CAAA;IACH,CAAC;IAED,KAAK,CAAC,YAAY;QAChB,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;OAaT;SACF,CAAC,CAAA;QAEF,IAAI,QAAQ,CAAC,MAAM;YAAE,OAAO,EAAE,CAAA;QAE9B,OAAO;YACL,KAAK,EAAE,QAAQ,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;YACjD,OAAO,EAAE,QAAQ,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,IAAI,EAAE;SACrD,CAAA;IACH,CAAC;IAED,KAAK,CAAC,wBAAwB;QAC5B,IAAI,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAA;QACrC,IAAI,OAAO,IAAI,OAAO,CAAC,MAAM,EAAE;YAC7B,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBAC5B,IAAI,UAAU,GAAQ,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAA;gBACtD,MAAM,WAAW,GAAG,KAAK,CAAC,eAAe,CAAA;gBACzC,KAAK,IAAI,GAAG,IAAI,WAAW,EAAE;oBAC3B,UAAU,CAAC,GAAG,CAAC,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,CAAA;iBACzC;gBACD,UAAU,CAAC,MAAM,GAAG,KAAK,CAAC,SAAS,CAAA;gBAEnC,OAAO,UAAU,CAAA;YACnB,CAAC,CAAC,CAAA;YAEF,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;gBACnC,QAAQ,EAAE,GAAG,CAAA;;;;;;SAMZ;gBACD,SAAS,EAAE;oBACT,OAAO;iBACR;aACF,CAAC,CAAA;YAEF,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE;gBACpB,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;gBAClB,MAAM,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,CAAA;aAChC;iBAAM;gBACL,MAAM,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC,CAAA;aACpD;SACF;IACH,CAAC;IAED,KAAK,CAAC,wBAAwB;QAC5B,IAAI,OAAO,CAAC,WAAW,CAAC,EAAE;YACxB,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAA;YAEpB,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA;YACxD,IAAI,GAAG,IAAI,GAAG,CAAC,MAAM,GAAG,CAAC,EAAE;gBACzB,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;oBACnC,QAAQ,EAAE,GAAG,CAAA;;;;WAIZ;oBACD,SAAS,EAAE;wBACT,GAAG;qBACJ;iBACF,CAAC,CAAA;gBAEF,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE;oBACpB,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;oBAClB,MAAM,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,CAAA;iBAChC;aACF;SACF;IACH,CAAC;;AAnMM,iCAAM,GAAG;IACd,eAAe;IACf,iBAAiB;IACjB,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoCF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+DAAiB;AAC5C;IAAC,KAAK,CAAC,UAAU,CAAC;8BAAiB,SAAS;yDAAA;AA5CjC,0BAA0B;IADtC,aAAa,CAAC,8BAA8B,CAAC;GACjC,0BAA0B,CAqMtC;SArMY,0BAA0B","sourcesContent":["import '@operato/data-grist'\nimport '@operato/context/ox-context-page-toolbar.js'\n\nimport { CommonGristStyles, ScrollbarStyles } from '@operato/styles'\nimport { PageView } from '@operato/shell'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { DataGrist } from '@operato/data-grist'\nimport { client } from '@operato/graphql'\nimport { notify } from '@operato/layout'\nimport gql from 'graphql-tag'\n\n@customElement('construction-type-management')\nexport class ConstructionTypeManagement extends PageView {\n static styles = [\n ScrollbarStyles,\n CommonGristStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n width: 100%;\n\n --grid-record-emphasized-background-color: red;\n --grid-record-emphasized-color: yellow;\n }\n\n md-elevated-button {\n margin: 0px 3px;\n\n --md-elevated-button-container-height: 35px;\n --md-elevated-button-label-text-size: 16px;\n --md-elevated-button-container-color: #0595e5;\n\n --md-elevated-button-label-text-color: #fff;\n --md-elevated-button-hover-label-text-color: #fff;\n --md-elevated-button-pressed-label-text-color: #fff;\n --md-elevated-button-focus-label-text-color: #fff;\n --md-elevated-button-icon-color: #fff;\n --md-elevated-button-hover-icon-color: #fff;\n --md-elevated-button-pressed-icon-color: #fff;\n --md-elevated-button-focus-icon-color: #fff;\n\n &[red] {\n --md-elevated-button-container-color: #e15757;\n }\n }\n\n div[button-container] {\n padding: 0 5px 10px 0;\n text-align: right;\n }\n `\n ]\n\n @property({ type: Object }) gristConfig: any\n @query('ox-grist') private grist!: DataGrist\n\n get context() {\n return {\n title: '공종 관리'\n }\n }\n\n render() {\n return html`\n <ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}> </ox-grist>\n <div button-container>\n <md-elevated-button @click=${this._updateConstructionTypes.bind(this)}>\n <md-icon slot=\"icon\">save</md-icon>저장</md-elevated-button\n >\n <md-elevated-button red @click=${this._deleteConstructionTypes.bind(this)}>\n <md-icon slot=\"icon\">delete</md-icon>삭제</md-elevated-button\n >\n </div>\n `\n }\n\n async pageInitialized(lifecycle: any) {\n this.gristConfig = {\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'string',\n name: 'name',\n header: '이름',\n record: {\n editable: true\n },\n width: 150\n },\n {\n type: 'string',\n name: 'description',\n header: '설명',\n record: {\n editable: true\n },\n width: 200\n },\n {\n type: 'datetime',\n name: 'createdAt',\n header: '생성 시간',\n width: 200\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: '수정 시간',\n width: 200\n }\n ],\n rows: {\n selectable: {\n multiple: true\n }\n },\n pagination: { infinite: true }\n }\n }\n\n async fetchHandler() {\n const response = await client.query({\n query: gql`\n query ConstructionTypes {\n constructionTypes {\n items {\n id\n name\n description\n createdAt\n updatedAt\n }\n total\n }\n }\n `\n })\n\n if (response.errors) return {}\n\n return {\n total: response.data.constructionTypes.total || 0,\n records: response.data.constructionTypes.items || []\n }\n }\n\n async _updateConstructionTypes() {\n let patches = this.grist.dirtyRecords\n if (patches && patches.length) {\n patches = patches.map(patch => {\n let patchField: any = patch.id ? { id: patch.id } : {}\n const dirtyFields = patch.__dirtyfields__\n for (let key in dirtyFields) {\n patchField[key] = dirtyFields[key].after\n }\n patchField.cuFlag = patch.__dirty__\n\n return patchField\n })\n\n const response = await client.mutate({\n mutation: gql`\n mutation UpdateMultipleConstructionType($patches: [ConstructionTypePatch!]!) {\n updateMultipleConstructionType(patches: $patches) {\n id\n }\n }\n `,\n variables: {\n patches\n }\n })\n\n if (!response.errors) {\n this.grist.fetch()\n notify({ message: '저장되었습니다.' })\n } else {\n notify({ message: '저장에 실패하였습니다.', level: 'error' })\n }\n }\n }\n\n async _deleteConstructionTypes() {\n if (confirm('삭제하시겠습니까?')) {\n const a = this.grist\n\n const ids = this.grist.selected.map(record => record.id)\n if (ids && ids.length > 0) {\n const response = await client.mutate({\n mutation: gql`\n mutation DeleteConstructionTypes($ids: [String!]!) {\n deleteConstructionTypes(ids: $ids)\n }\n `,\n variables: {\n ids\n }\n })\n\n if (!response.errors) {\n this.grist.fetch()\n notify({ message: '삭제되었습니다.' })\n }\n }\n }\n }\n}\n"]}
|
|
@@ -19,13 +19,12 @@ let ManagerManagement = class ManagerManagement extends PageView {
|
|
|
19
19
|
}
|
|
20
20
|
render() {
|
|
21
21
|
return html `
|
|
22
|
-
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
</ox-grist>
|
|
22
|
+
<ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}> </ox-grist>
|
|
23
|
+
<div button-container>
|
|
24
|
+
<md-elevated-button @click=${this._updateManagers.bind(this)}>
|
|
25
|
+
<md-icon slot="icon">save</md-icon>저장</md-elevated-button
|
|
26
|
+
>
|
|
27
|
+
</div>
|
|
29
28
|
`;
|
|
30
29
|
}
|
|
31
30
|
async pageInitialized(lifecycle) {
|
|
@@ -158,6 +157,28 @@ ManagerManagement.styles = [
|
|
|
158
157
|
--grid-record-emphasized-background-color: red;
|
|
159
158
|
--grid-record-emphasized-color: yellow;
|
|
160
159
|
}
|
|
160
|
+
|
|
161
|
+
md-elevated-button {
|
|
162
|
+
margin: 0px 3px;
|
|
163
|
+
|
|
164
|
+
--md-elevated-button-container-height: 35px;
|
|
165
|
+
--md-elevated-button-label-text-size: 16px;
|
|
166
|
+
--md-elevated-button-container-color: #0595e5;
|
|
167
|
+
|
|
168
|
+
--md-elevated-button-label-text-color: #fff;
|
|
169
|
+
--md-elevated-button-hover-label-text-color: #fff;
|
|
170
|
+
--md-elevated-button-pressed-label-text-color: #fff;
|
|
171
|
+
--md-elevated-button-focus-label-text-color: #fff;
|
|
172
|
+
--md-elevated-button-icon-color: #fff;
|
|
173
|
+
--md-elevated-button-hover-icon-color: #fff;
|
|
174
|
+
--md-elevated-button-pressed-icon-color: #fff;
|
|
175
|
+
--md-elevated-button-focus-icon-color: #fff;
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
div[button-container] {
|
|
179
|
+
padding: 0 5px 10px 0;
|
|
180
|
+
text-align: right;
|
|
181
|
+
}
|
|
161
182
|
`
|
|
162
183
|
];
|
|
163
184
|
__decorate([
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"manager-management.js","sourceRoot":"","sources":["../../../client/pages/resource/manager-management.ts"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAA;AAE5B,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACxF,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AACxC,OAAO,GAAG,MAAM,aAAa,CAAA;AAGtB,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,QAAQ;
|
|
1
|
+
{"version":3,"file":"manager-management.js","sourceRoot":"","sources":["../../../client/pages/resource/manager-management.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/data-grist'\n\nimport { CommonButtonStyles, CommonGristStyles, ScrollbarStyles } from '@operato/styles'\nimport { PageView } from '@operato/shell'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { DataGrist } from '@operato/data-grist'\nimport { client } from '@operato/graphql'\nimport { notify } from '@operato/layout'\nimport gql from 'graphql-tag'\n\n@customElement('manager-management')\nexport class ManagerManagement extends PageView {\n static styles = [\n ScrollbarStyles,\n CommonGristStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n width: 100%;\n\n --grid-record-emphasized-background-color: red;\n --grid-record-emphasized-color: yellow;\n }\n\n md-elevated-button {\n margin: 0px 3px;\n\n --md-elevated-button-container-height: 35px;\n --md-elevated-button-label-text-size: 16px;\n --md-elevated-button-container-color: #0595e5;\n\n --md-elevated-button-label-text-color: #fff;\n --md-elevated-button-hover-label-text-color: #fff;\n --md-elevated-button-pressed-label-text-color: #fff;\n --md-elevated-button-focus-label-text-color: #fff;\n --md-elevated-button-icon-color: #fff;\n --md-elevated-button-hover-icon-color: #fff;\n --md-elevated-button-pressed-icon-color: #fff;\n --md-elevated-button-focus-icon-color: #fff;\n }\n\n div[button-container] {\n padding: 0 5px 10px 0;\n text-align: right;\n }\n `\n ]\n\n @property({ type: Object }) gristConfig: any\n @query('ox-grist') private grist!: DataGrist\n\n get context() {\n return {\n title: '담당자 관리',\n actions: [\n {\n title: '저장',\n action: this._updateManagers.bind(this),\n ...CommonButtonStyles.save\n }\n ]\n }\n }\n\n render() {\n return html`\n <ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}> </ox-grist>\n <div button-container>\n <md-elevated-button @click=${this._updateManagers.bind(this)}>\n <md-icon slot=\"icon\">save</md-icon>저장</md-elevated-button\n >\n </div>\n `\n }\n\n async pageInitialized(lifecycle: any) {\n this.gristConfig = {\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n {\n type: 'string',\n name: 'name',\n header: '이름',\n record: {\n editable: true\n },\n width: 150\n },\n {\n type: 'string',\n name: 'phone',\n header: '휴대폰 번호',\n record: {\n editable: true\n },\n width: 150\n },\n {\n type: 'string',\n name: 'position',\n header: '직위',\n record: {\n editable: true\n },\n width: 150\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: '수정 시간',\n record: {\n renderer: value => {\n const date = new Date(value + ' UTC')\n\n return new Intl.DateTimeFormat('ko-KR', {\n timeZone: 'Asia/Seoul',\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit'\n }).format(date)\n }\n },\n width: 200\n }\n ],\n rows: {\n appendable: false\n },\n sorters: [{ name: 'name' }],\n pagination: { infinite: true }\n }\n }\n\n async fetchHandler() {\n const response = await client.query({\n query: gql`\n query Managers {\n managers {\n id\n phone\n position\n userId\n name\n updatedAt\n }\n }\n `\n })\n\n console.log('response.data.managers :', response.data.managers)\n\n if (response.errors) return {}\n\n return {\n total: response.data.managers.length || 0,\n records: response.data.managers || []\n }\n }\n\n async _updateManagers() {\n let patches = this.grist.dirtyRecords\n if (patches && patches.length) {\n patches = patches.map(patch => {\n let patchField: any = patch.userId ? { userId: patch.userId } : {}\n if (patch.id) patchField['id'] = patch.id\n\n const dirtyFields = patch.__dirtyfields__\n for (let key in dirtyFields) {\n patchField[key] = dirtyFields[key].after\n }\n\n return patchField\n })\n\n const response = await client.mutate({\n mutation: gql`\n mutation UpdateMultipleManager($patches: [ManagerPatch!]!) {\n updateMultipleManager(patches: $patches) {\n id\n }\n }\n `,\n variables: {\n patches\n }\n })\n\n if (!response.errors) {\n this.grist.fetch()\n notify({ message: '저장되었습니다.' })\n } else {\n notify({ message: '저장에 실패하였습니다.', level: 'error' })\n }\n }\n }\n}\n"]}
|