@dssp/project 0.0.28 → 0.0.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/client/pages/project/project-list.ts +30 -29
  2. package/client/pages/project/project-setting-list.ts +51 -45
  3. package/dist-client/pages/project/project-list.js +30 -29
  4. package/dist-client/pages/project/project-list.js.map +1 -1
  5. package/dist-client/pages/project/project-setting-list.js +51 -45
  6. package/dist-client/pages/project/project-setting-list.js.map +1 -1
  7. package/dist-client/route.d.ts +1 -1
  8. package/dist-client/tsconfig.tsbuildinfo +1 -1
  9. package/dist-server/tsconfig.tsbuildinfo +1 -1
  10. package/package.json +3 -3
package/dist-client/pages/project/project-setting-list.js CHANGED
@@ -43,7 +43,7 @@ let ProjectSettingList = class ProjectSettingList extends ScopedElementsMixin(Pa
43
43
  </a>
44
44
  <a href="inspection-drawing-type-management">
45
45
  <md-icon slot="leading-icon">stacks</md-icon>
46
- <div label>도면타입/검측부위 관리</div>
46
+ <div label>도면타입/검측부위<br/>관리</div>
47
47
  </a>
48
48
  <a href="checklist-type-management">
49
49
  <md-icon slot="leading-icon">rule</md-icon>
@@ -51,13 +51,12 @@ let ProjectSettingList = class ProjectSettingList extends ScopedElementsMixin(Pa
51
51
  </a>
52
52
  <a href="checklist-template-list">
53
53
  <md-icon slot="leading-icon">fact_check</md-icon>
54
- <div label>체크리스트 템플릿 관리</div>
54
+ <div label>체크리스트 템플릿<br/>관리</div>
55
55
  </a>
56
56
  </div>
57
57
  </div>
58
58
 
59
59
  <div header>
60
- <label>프로젝트 이름</label>
61
60
  <md-filled-text-field
62
61
  name="projectName"
63
62
  type="search"
@@ -192,7 +191,7 @@ ProjectSettingList.styles = [
192
191
 
193
192
  width: 100%;
194
193
  height: 100%;
195
- background-color: #f7f7f7;
194
+ background-color: var(--md-sys-color-background, #fcf8f8);
196
195
 
197
196
  --grid-record-emphasized-background-color: red;
198
197
  --grid-record-emphasized-color: yellow;
@@ -200,63 +199,66 @@ ProjectSettingList.styles = [
200
199
 
201
200
  div[management-header-container] {
202
201
  display: flex;
203
- margin: 15px 23px 0px 23px;
204
- gap: 13px;
202
+ margin: var(--spacing-large, 12px);
203
+ margin-bottom:0;
204
+ gap: var(--spacing-medium, 8px);
205
205
  overflow-x: auto;
206
206
 
207
207
  a {
208
- min-width: 140px;
208
+ flex:1;
209
209
  text-align: center;
210
- padding: 12px 15px;
211
- background-color: #fff;
212
- color: #586878;
210
+ padding: var(--spacing-medium, 8px);
211
+ background-color: var(--md-sys-color-on-primary);
212
+ color: var(--md-sys-color-tertiary);
213
213
  font-weight: 700;
214
- border-radius: 7px;
214
+ border-radius: var(--md-sys-shape-corner-small, 5px);
215
215
  display: flex;
216
216
  flex-direction: column;
217
217
  justify-content: center;
218
218
  align-items: center;
219
- gap: 5px;
219
+ gap: var(--spacing-small, 4px);
220
220
  border: solid 1px #0000004d;
221
221
  text-decoration: none;
222
222
  cursor: pointer;
223
223
 
224
224
  md-icon {
225
- font-size: 40px;
225
+ font-size: 35px;
226
226
  width: auto;
227
227
  height: auto;
228
228
  }
229
229
  div[label] {
230
- font-size: 15px;
230
+ font-size: 14px;
231
+ line-height:1.3;
231
232
  }
232
233
  }
233
234
 
234
235
  a[green] {
235
236
  background-color: #24be7b;
236
- color: #fff;
237
+ color: var(--md-sys-color-on-primary);
237
238
  }
238
239
  }
239
240
 
240
241
  div[header] {
241
242
  display: flex;
242
- height: 100px;
243
243
  align-items: center;
244
244
  background-color: #2ea4df1a;
245
245
  border: 1px solid #2ea4df33;
246
- margin: 15px 23px;
247
- font-size: 18px;
248
- padding: 7px;
249
- border-radius: 5px;
246
+ margin: var(--spacing-large, 12px);
247
+ margin-bottom:var(--spacing-small, 5px);
248
+ padding: var(--spacing-medium, 8px) var(--spacing-large, 12px);
249
+ border-radius: var(--md-sys-shape-corner-small, 5px);
250
250
 
251
251
  md-filled-text-field[type='search'] {
252
- margin-left: 5px;
253
- margin-right: 26px;
254
-
255
252
  --md-filled-text-field-container-shape: 0px;
256
253
  --md-filled-text-field-container-color: transparent;
257
254
  --md-filled-text-field-label-text-color: #999999;
258
255
  --md-filled-text-field-input-text-color: #4e5055;
259
256
  }
257
+ strong{
258
+ flex:1;
259
+ padding-right:var(--spacing-medium, 8px);
260
+ text-align:right
261
+ }
260
262
 
261
263
  md-elevated-button[add-project] {
262
264
  font-weight: bold;
@@ -282,15 +284,18 @@ ProjectSettingList.styles = [
282
284
  div[project-container] {
283
285
  display: flex;
284
286
  flex-direction: row;
285
- min-height: 140px;
286
- margin: 17px 23px;
287
- background-color: #ffffff;
287
+ min-height: 130px;
288
+ margin: var(--spacing-large, 12px);
289
+ background-color: var(--md-sys-color-on-primary);
288
290
  border: 1px solid #cccccc80;
289
- border-radius: 5px;
291
+ border-radius: var(--md-sys-shape-corner-small, 5px);
290
292
  align-items: center;
293
+ gap: var(--spacing-medium, 8px);
294
+ overflow:hidden;
291
295
 
292
296
  img[project-img] {
293
- width: 285px;
297
+ width: 240px;
298
+ height: 130px;
294
299
  aspect-ratio: 2;
295
300
  background-color: #cccccc80;
296
301
  }
@@ -300,9 +305,9 @@ ProjectSettingList.styles = [
300
305
  }
301
306
 
302
307
  span[project-info] {
303
- flex: 0.45;
304
- padding: 6px 15px;
305
- font-size: 16px;
308
+ flex: 0.5;
309
+ padding: var(--spacing-small, 4px);
310
+ font-size: 14px;
306
311
 
307
312
  white-space: nowrap;
308
313
  overflow: hidden;
@@ -311,48 +316,48 @@ ProjectSettingList.styles = [
311
316
  div[name] {
312
317
  color: #2e79be;
313
318
  font-weight: bold;
314
- font-size: 19px;
315
- margin-bottom: 2px;
319
+ font-size: 18px;
316
320
  }
317
321
  }
318
322
 
319
323
  span[project-state] {
320
- flex: 0.55;
321
- padding: 10px 20px;
322
- min-width: 350px;
324
+ flex: 0.5;
325
+ padding: var(--spacing-medium, 8px);
326
+ min-width: 340px;
323
327
 
324
328
  & > div {
325
- margin-bottom: 13px;
329
+ margin-bottom: var(--spacing-small, 4px);
326
330
  }
327
331
 
328
332
  div[progress] {
329
333
  position: relative;
330
334
 
331
335
  md-linear-progress {
336
+ margin:var(--spacing-tiny, 2px) 0;
332
337
  --md-linear-progress-track-height: 18px;
333
338
  --md-linear-progress-active-indicator-height: 18px;
334
339
  --md-linear-progress-track-shape: 5px;
335
- --md-linear-progress-active-indicator-color: #0595e51a;
336
- --md-linear-progress-track-color: #0595e533;
340
+ --md-linear-progress-active-indicator-color: #0595e526;
341
+ --md-linear-progress-track-color: #0595e52a;
337
342
  }
338
343
 
339
344
  span {
340
345
  position: absolute;
341
346
  top: 0;
342
- left: 12px;
347
+ left: var(--spacing-large, 12px);
343
348
  font-size: 12px;
344
349
  font-weight: bold;
345
350
  color: #2e79be;
346
351
 
347
352
  &:last-child {
348
353
  left: unset;
349
- right: 12px;
354
+ right: var(--spacing-large, 12px);
350
355
  }
351
356
  }
352
357
  }
353
358
 
354
359
  div[filled] div {
355
- margin-right: 18px;
360
+ margin-right: var(--spacing-large, 12px);
356
361
  display: inline-block;
357
362
  }
358
363
 
@@ -365,11 +370,12 @@ ProjectSettingList.styles = [
365
370
 
366
371
  md-outlined-button {
367
372
  min-height: 33px;
368
- padding: 0px 13px;
369
- margin-right: 2px;
370
- box-shadow: 1px 1px 1px #0000001a;
373
+ padding: 0 var(--spacing-large, 12px);
374
+ margin-right: var(--spacing-tiny, 2px);
375
+ box-shadow: 1px 1px 1px 1px #0000001a;
371
376
  --md-outlined-button-label-text-color: #586878;
372
377
  --md-outlined-button-label-text-weight: bold;
378
+ --md-sys-color-outline: rgba(51,51,51,.20);
373
379
  }
374
380
  }
375
381
  }
package/dist-client/pages/project/project-setting-list.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"project-setting-list.js","sourceRoot":"","sources":["../../../client/pages/project/project-setting-list.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/button/elevated-button.js'\nimport '@material/web/button/outlined-button.js'\nimport '@material/web/progress/linear-progress.js'\nimport '@material/web/textfield/filled-text-field.js'\n\nimport { PageView } from '@operato/shell'\nimport { css, html } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { client } from '@operato/graphql'\nimport { openPopup } from '@operato/layout'\n\nimport gql from 'graphql-tag'\nimport './popup/popup-project-create'\nimport { Project } from './project-list'\n\n@customElement('project-setting-list')\nexport class ProjectSettingList extends ScopedElementsMixin(PageView) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n\n width: 100%;\n height: 100%;\n background-color: #f7f7f7;\n\n --grid-record-emphasized-background-color: red;\n --grid-record-emphasized-color: yellow;\n }\n\n div[management-header-container] {\n display: flex;\n margin: 15px 23px 0px 23px;\n gap: 13px;\n overflow-x: auto;\n\n a {\n min-width: 140px;\n text-align: center;\n padding: 12px 15px;\n background-color: #fff;\n color: #586878;\n font-weight: 700;\n border-radius: 7px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 5px;\n border: solid 1px #0000004d;\n text-decoration: none;\n cursor: pointer;\n\n md-icon {\n font-size: 40px;\n width: auto;\n height: auto;\n }\n div[label] {\n font-size: 15px;\n }\n }\n\n a[green] {\n background-color: #24be7b;\n color: #fff;\n }\n }\n\n div[header] {\n display: flex;\n height: 100px;\n align-items: center;\n background-color: #2ea4df1a;\n border: 1px solid #2ea4df33;\n margin: 15px 23px;\n font-size: 18px;\n padding: 7px;\n border-radius: 5px;\n\n md-filled-text-field[type='search'] {\n margin-left: 5px;\n margin-right: 26px;\n\n --md-filled-text-field-container-shape: 0px;\n --md-filled-text-field-container-color: transparent;\n --md-filled-text-field-label-text-color: #999999;\n --md-filled-text-field-input-text-color: #4e5055;\n }\n\n md-elevated-button[add-project] {\n font-weight: bold;\n font-size: 16px;\n margin-left: 17px;\n padding: 13px 20px;\n\n --md-elevated-button-container-color: #24be7b;\n --md-elevated-button-label-text-color: #ffffff;\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 --md-elevated-button-container-shape: 7px;\n }\n }\n\n div[body] {\n div[project-container] {\n display: flex;\n flex-direction: row;\n min-height: 140px;\n margin: 17px 23px;\n background-color: #ffffff;\n border: 1px solid #cccccc80;\n border-radius: 5px;\n align-items: center;\n\n img[project-img] {\n width: 285px;\n aspect-ratio: 2;\n background-color: #cccccc80;\n }\n img[project-img][no-image] {\n object-fit: contain;\n opacity: 0.5;\n }\n\n span[project-info] {\n flex: 0.45;\n padding: 6px 15px;\n font-size: 16px;\n\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n div[name] {\n color: #2e79be;\n font-weight: bold;\n font-size: 19px;\n margin-bottom: 2px;\n }\n }\n\n span[project-state] {\n flex: 0.55;\n padding: 10px 20px;\n min-width: 350px;\n\n & > div {\n margin-bottom: 13px;\n }\n\n div[progress] {\n position: relative;\n\n md-linear-progress {\n --md-linear-progress-track-height: 18px;\n --md-linear-progress-active-indicator-height: 18px;\n --md-linear-progress-track-shape: 5px;\n --md-linear-progress-active-indicator-color: #0595e51a;\n --md-linear-progress-track-color: #0595e533;\n }\n\n span {\n position: absolute;\n top: 0;\n left: 12px;\n font-size: 12px;\n font-weight: bold;\n color: #2e79be;\n\n &:last-child {\n left: unset;\n right: 12px;\n }\n }\n }\n\n div[filled] div {\n margin-right: 18px;\n display: inline-block;\n }\n\n strong[filled] {\n color: #1bb401;\n }\n strong[not-filled] {\n color: #ff4444;\n }\n\n md-outlined-button {\n min-height: 33px;\n padding: 0px 13px;\n margin-right: 2px;\n box-shadow: 1px 1px 1px #0000001a;\n --md-outlined-button-label-text-color: #586878;\n --md-outlined-button-label-text-weight: bold;\n }\n }\n }\n }\n `\n ]\n\n get context() {\n return {\n title: '셋팅'\n }\n }\n\n @state() private projectName: string = ''\n @state() private projectList: Project[] = []\n @state() private projectCount: number = 0\n\n render() {\n return html`\n <div management-header>\n <div management-header-container>\n <a @click=${this._openCreateProjectPopup} green>\n <md-icon slot=\"leading-icon\">add</md-icon>\n <div label>신규 프로젝트 생성</div>\n </a>\n <a href=\"employee-list\">\n <md-icon slot=\"leading-icon\">badge</md-icon>\n <div label>인력 관리</div>\n </a>\n <a href=\"construction-type-management\">\n <md-icon slot=\"leading-icon\">construction</md-icon>\n <div label>공종 관리</div>\n </a>\n <a href=\"inspection-drawing-type-management\">\n <md-icon slot=\"leading-icon\">stacks</md-icon>\n <div label>도면타입/검측부위 관리</div>\n </a>\n <a href=\"checklist-type-management\">\n <md-icon slot=\"leading-icon\">rule</md-icon>\n <div label>체크리스트 구분 관리</div>\n </a>\n <a href=\"checklist-template-list\">\n <md-icon slot=\"leading-icon\">fact_check</md-icon>\n <div label>체크리스트 템플릿 관리</div>\n </a>\n </div>\n </div>\n\n <div header>\n <label>프로젝트 이름</label>\n <md-filled-text-field\n name=\"projectName\"\n type=\"search\"\n label=\"프로젝트 이름\"\n .value=${this.projectName}\n @input=${this._onInputChange}\n @keypress=${this._onKeypress}\n >\n <md-icon slot=\"leading-icon\">search</md-icon>\n </md-filled-text-field>\n\n <strong>총 ${this.projectCount}개</strong>\n </div>\n\n <div body>\n ${this.projectList?.map((project: Project) => {\n const filledText = html`<strong filled>등록완료</strong>`\n const nonFilledText = html`<strong not-filled>미등록</strong>`\n\n const projectFilledState = project.buildingComplex.address ? filledText : nonFilledText\n const supervisoryFilledState = true ? filledText : nonFilledText\n const taskFilledState = false ? filledText : nonFilledText\n\n return html`\n <div project-container>\n <img\n ?no-image=${!project.mainPhoto?.fullpath}\n project-img\n src=${project.mainPhoto?.fullpath || '/assets/images/no-image.png'}\n />\n\n <span project-info>\n <div name>${project.name}</div>\n <div content>${project.buildingComplex.address}</div>\n <div content>면적: ${project.buildingComplex?.area?.toLocaleString() || ''}㎡</div>\n <div content>착공~준공: ${project.startDate}~${project.endDate}</div>\n <div content>발주처: <strong>${project.buildingComplex.clientCompany}</strong></div>\n </span>\n\n <span project-state>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.totalProgress || 0}> </md-linear-progress>\n <span>${project.totalProgress == 100 ? '완료' : '진행중'}</span>\n <span>${project.totalProgress || 0}%</span>\n </div>\n <div filled>\n <div>프로젝트 정보 ${projectFilledState}</div>\n <div>시공감리 자료 ${supervisoryFilledState}</div>\n <div>공정표 ${taskFilledState}</div>\n </div>\n <div>\n <md-outlined-button href=\"project-update/${project.id}\">프로젝트 정보 수정</md-outlined-button>\n <md-outlined-button href=\"project-plan-management/${project.id}\">도면 관리</md-outlined-button>\n <md-outlined-button href=\"project-task-management/${project.id}\">공정표 관리</md-outlined-button>\n </div>\n </span>\n </div>\n `\n })}\n </div>\n `\n }\n\n async pageUpdated(changes: any, lifecycle: any) {\n if (this.active) {\n this.getProjectList()\n }\n }\n\n async getProjectList() {\n const response = await client.query({\n query: gql`\n query Projects($filters: [Filter!]) {\n projects(filters: $filters) {\n items {\n id\n name\n mainPhoto {\n fullpath\n }\n startDate\n endDate\n totalProgress\n buildingComplex {\n address\n area\n clientCompany\n }\n }\n total\n }\n }\n `,\n variables: {\n filters: this.projectName\n ? [\n {\n name: 'name',\n operator: 'search',\n value: `%${this.projectName}%`\n }\n ]\n : []\n }\n })\n\n this.projectList = response.data.projects?.items || []\n this.projectCount = response.data.projects?.total || 0\n }\n\n private _openCreateProjectPopup() {\n openPopup(html`<popup-project-create .refreshFn=${this.getProjectList.bind(this)}></popup-project-create>`, {\n backdrop: true,\n size: 'small',\n title: '신규 프로젝트 생성'\n })\n }\n\n // Input 요소의 값이 변경될 때 호출되는 콜백 함수\n private _onInputChange(event: InputEvent) {\n const target = event.target as HTMLInputElement\n this[target.name] = target.value\n }\n\n // 검색창에서 엔터입력시 검색\n private _onKeypress(event: KeyboardEvent) {\n if (event.code === 'Enter') {\n this.getProjectList()\n }\n }\n}\n"]}
1
+ {"version":3,"file":"project-setting-list.js","sourceRoot":"","sources":["../../../client/pages/project/project-setting-list.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/button/elevated-button.js'\nimport '@material/web/button/outlined-button.js'\nimport '@material/web/progress/linear-progress.js'\nimport '@material/web/textfield/filled-text-field.js'\n\nimport { PageView } from '@operato/shell'\nimport { css, html } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { client } from '@operato/graphql'\nimport { openPopup } from '@operato/layout'\n\nimport gql from 'graphql-tag'\nimport './popup/popup-project-create'\nimport { Project } from './project-list'\n\n@customElement('project-setting-list')\nexport class ProjectSettingList extends ScopedElementsMixin(PageView) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n\n width: 100%;\n height: 100%;\n background-color: var(--md-sys-color-background, #fcf8f8);\n\n --grid-record-emphasized-background-color: red;\n --grid-record-emphasized-color: yellow;\n }\n\n div[management-header-container] {\n display: flex;\n margin: var(--spacing-large, 12px);\n margin-bottom:0;\n gap: var(--spacing-medium, 8px);\n overflow-x: auto;\n\n a {\n flex:1;\n text-align: center;\n padding: var(--spacing-medium, 8px);\n background-color: var(--md-sys-color-on-primary);\n color: var(--md-sys-color-tertiary);\n font-weight: 700;\n border-radius: var(--md-sys-shape-corner-small, 5px);\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: var(--spacing-small, 4px);\n border: solid 1px #0000004d;\n text-decoration: none;\n cursor: pointer;\n\n md-icon {\n font-size: 35px;\n width: auto;\n height: auto;\n }\n div[label] {\n font-size: 14px;\n line-height:1.3;\n }\n }\n\n a[green] {\n background-color: #24be7b;\n color: var(--md-sys-color-on-primary);\n }\n }\n\n div[header] {\n display: flex;\n align-items: center;\n background-color: #2ea4df1a;\n border: 1px solid #2ea4df33;\n margin: var(--spacing-large, 12px);\n margin-bottom:var(--spacing-small, 5px);\n padding: var(--spacing-medium, 8px) var(--spacing-large, 12px);\n border-radius: var(--md-sys-shape-corner-small, 5px);\n\n md-filled-text-field[type='search'] {\n --md-filled-text-field-container-shape: 0px;\n --md-filled-text-field-container-color: transparent;\n --md-filled-text-field-label-text-color: #999999;\n --md-filled-text-field-input-text-color: #4e5055;\n }\n strong{\n flex:1;\n padding-right:var(--spacing-medium, 8px);\n text-align:right\n }\n\n md-elevated-button[add-project] {\n font-weight: bold;\n font-size: 16px;\n margin-left: 17px;\n padding: 13px 20px;\n\n --md-elevated-button-container-color: #24be7b;\n --md-elevated-button-label-text-color: #ffffff;\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 --md-elevated-button-container-shape: 7px;\n }\n }\n\n div[body] {\n div[project-container] {\n display: flex;\n flex-direction: row;\n min-height: 130px;\n margin: var(--spacing-large, 12px);\n background-color: var(--md-sys-color-on-primary);\n border: 1px solid #cccccc80;\n border-radius: var(--md-sys-shape-corner-small, 5px);\n align-items: center;\n gap: var(--spacing-medium, 8px);\n overflow:hidden;\n\n img[project-img] {\n width: 240px;\n height: 130px;\n aspect-ratio: 2;\n background-color: #cccccc80;\n }\n img[project-img][no-image] {\n object-fit: contain;\n opacity: 0.5;\n }\n\n span[project-info] {\n flex: 0.5;\n padding: var(--spacing-small, 4px);\n font-size: 14px;\n\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n div[name] {\n color: #2e79be;\n font-weight: bold;\n font-size: 18px;\n }\n }\n\n span[project-state] {\n flex: 0.5;\n padding: var(--spacing-medium, 8px);\n min-width: 340px;\n\n & > div {\n margin-bottom: var(--spacing-small, 4px);\n }\n\n div[progress] {\n position: relative;\n\n md-linear-progress {\n margin:var(--spacing-tiny, 2px) 0;\n --md-linear-progress-track-height: 18px;\n --md-linear-progress-active-indicator-height: 18px;\n --md-linear-progress-track-shape: 5px;\n --md-linear-progress-active-indicator-color: #0595e526;\n --md-linear-progress-track-color: #0595e52a;\n }\n\n span {\n position: absolute;\n top: 0;\n left: var(--spacing-large, 12px);\n font-size: 12px;\n font-weight: bold;\n color: #2e79be;\n\n &:last-child {\n left: unset;\n right: var(--spacing-large, 12px);\n }\n }\n }\n\n div[filled] div {\n margin-right: var(--spacing-large, 12px);\n display: inline-block;\n }\n\n strong[filled] {\n color: #1bb401;\n }\n strong[not-filled] {\n color: #ff4444;\n }\n\n md-outlined-button {\n min-height: 33px;\n padding: 0 var(--spacing-large, 12px);\n margin-right: var(--spacing-tiny, 2px);\n box-shadow: 1px 1px 1px 1px #0000001a;\n --md-outlined-button-label-text-color: #586878;\n --md-outlined-button-label-text-weight: bold;\n --md-sys-color-outline: rgba(51,51,51,.20);\n }\n }\n }\n }\n `\n ]\n\n get context() {\n return {\n title: '셋팅'\n }\n }\n\n @state() private projectName: string = ''\n @state() private projectList: Project[] = []\n @state() private projectCount: number = 0\n\n render() {\n return html`\n <div management-header>\n <div management-header-container>\n <a @click=${this._openCreateProjectPopup} green>\n <md-icon slot=\"leading-icon\">add</md-icon>\n <div label>신규 프로젝트 생성</div>\n </a>\n <a href=\"employee-list\">\n <md-icon slot=\"leading-icon\">badge</md-icon>\n <div label>인력 관리</div>\n </a>\n <a href=\"construction-type-management\">\n <md-icon slot=\"leading-icon\">construction</md-icon>\n <div label>공종 관리</div>\n </a>\n <a href=\"inspection-drawing-type-management\">\n <md-icon slot=\"leading-icon\">stacks</md-icon>\n <div label>도면타입/검측부위<br/>관리</div>\n </a>\n <a href=\"checklist-type-management\">\n <md-icon slot=\"leading-icon\">rule</md-icon>\n <div label>체크리스트 구분 관리</div>\n </a>\n <a href=\"checklist-template-list\">\n <md-icon slot=\"leading-icon\">fact_check</md-icon>\n <div label>체크리스트 템플릿<br/>관리</div>\n </a>\n </div>\n </div>\n\n <div header>\n <md-filled-text-field\n name=\"projectName\"\n type=\"search\"\n label=\"프로젝트 이름\"\n .value=${this.projectName}\n @input=${this._onInputChange}\n @keypress=${this._onKeypress}\n >\n <md-icon slot=\"leading-icon\">search</md-icon>\n </md-filled-text-field>\n\n <strong>총 ${this.projectCount}개</strong>\n </div>\n\n <div body>\n ${this.projectList?.map((project: Project) => {\n const filledText = html`<strong filled>등록완료</strong>`\n const nonFilledText = html`<strong not-filled>미등록</strong>`\n\n const projectFilledState = project.buildingComplex.address ? filledText : nonFilledText\n const supervisoryFilledState = true ? filledText : nonFilledText\n const taskFilledState = false ? filledText : nonFilledText\n\n return html`\n <div project-container>\n <img\n ?no-image=${!project.mainPhoto?.fullpath}\n project-img\n src=${project.mainPhoto?.fullpath || '/assets/images/no-image.png'}\n />\n\n <span project-info>\n <div name>${project.name}</div>\n <div content>${project.buildingComplex.address}</div>\n <div content>면적: ${project.buildingComplex?.area?.toLocaleString() || ''}㎡</div>\n <div content>착공~준공: ${project.startDate}~${project.endDate}</div>\n <div content>발주처: <strong>${project.buildingComplex.clientCompany}</strong></div>\n </span>\n\n <span project-state>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.totalProgress || 0}> </md-linear-progress>\n <span>${project.totalProgress == 100 ? '완료' : '진행중'}</span>\n <span>${project.totalProgress || 0}%</span>\n </div>\n <div filled>\n <div>프로젝트 정보 ${projectFilledState}</div>\n <div>시공감리 자료 ${supervisoryFilledState}</div>\n <div>공정표 ${taskFilledState}</div>\n </div>\n <div>\n <md-outlined-button href=\"project-update/${project.id}\">프로젝트 정보 수정</md-outlined-button>\n <md-outlined-button href=\"project-plan-management/${project.id}\">도면 관리</md-outlined-button>\n <md-outlined-button href=\"project-task-management/${project.id}\">공정표 관리</md-outlined-button>\n </div>\n </span>\n </div>\n `\n })}\n </div>\n `\n }\n\n async pageUpdated(changes: any, lifecycle: any) {\n if (this.active) {\n this.getProjectList()\n }\n }\n\n async getProjectList() {\n const response = await client.query({\n query: gql`\n query Projects($filters: [Filter!]) {\n projects(filters: $filters) {\n items {\n id\n name\n mainPhoto {\n fullpath\n }\n startDate\n endDate\n totalProgress\n buildingComplex {\n address\n area\n clientCompany\n }\n }\n total\n }\n }\n `,\n variables: {\n filters: this.projectName\n ? [\n {\n name: 'name',\n operator: 'search',\n value: `%${this.projectName}%`\n }\n ]\n : []\n }\n })\n\n this.projectList = response.data.projects?.items || []\n this.projectCount = response.data.projects?.total || 0\n }\n\n private _openCreateProjectPopup() {\n openPopup(html`<popup-project-create .refreshFn=${this.getProjectList.bind(this)}></popup-project-create>`, {\n backdrop: true,\n size: 'small',\n title: '신규 프로젝트 생성'\n })\n }\n\n // Input 요소의 값이 변경될 때 호출되는 콜백 함수\n private _onInputChange(event: InputEvent) {\n const target = event.target as HTMLInputElement\n this[target.name] = target.value\n }\n\n // 검색창에서 엔터입력시 검색\n private _onKeypress(event: KeyboardEvent) {\n if (event.code === 'Enter') {\n this.getProjectList()\n }\n }\n}\n"]}
package/dist-client/route.d.ts CHANGED
@@ -1 +1 @@
1
- export default function route(page: string): "project-schedule" | "project-list" | "project-detail" | "project-completed-list" | "project-schedule-list" | "project-setting-list" | "project-update" | "project-plan-management" | "worker-type-management" | "construction-type-management" | "inspection-drawing-type-management" | "resource-list" | "task-resource-list" | undefined;
1
+ export default function route(page: string): "project-list" | "project-detail" | "project-completed-list" | "project-schedule-list" | "project-schedule" | "project-setting-list" | "project-update" | "project-plan-management" | "worker-type-management" | "construction-type-management" | "inspection-drawing-type-management" | "resource-list" | "task-resource-list" | undefined;