@dssp/project 0.0.29 → 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 (6) hide show
  1. package/client/pages/project/project-setting-list.ts +5 -5
  2. package/dist-client/pages/project/project-setting-list.js +5 -5
  3. package/dist-client/pages/project/project-setting-list.js.map +1 -1
  4. package/dist-client/tsconfig.tsbuildinfo +1 -1
  5. package/dist-server/tsconfig.tsbuildinfo +1 -1
  6. package/package.json +3 -3
package/client/pages/project/project-setting-list.ts CHANGED
@@ -75,7 +75,6 @@ export class ProjectSettingList extends ScopedElementsMixin(PageView) {
75
75
 
76
76
  div[header] {
77
77
  display: flex;
78
- height: 100px;
79
78
  align-items: center;
80
79
  background-color: #2ea4df1a;
81
80
  border: 1px solid #2ea4df33;
@@ -193,7 +192,7 @@ export class ProjectSettingList extends ScopedElementsMixin(PageView) {
193
192
  }
194
193
 
195
194
  div[filled] div {
196
- margin-right: 18px;
195
+ margin-right: var(--spacing-large, 12px);
197
196
  display: inline-block;
198
197
  }
199
198
 
@@ -206,11 +205,12 @@ export class ProjectSettingList extends ScopedElementsMixin(PageView) {
206
205
 
207
206
  md-outlined-button {
208
207
  min-height: 33px;
209
- padding: 0px 13px;
210
- margin-right: 2px;
211
- box-shadow: 1px 1px 1px #0000001a;
208
+ padding: 0 var(--spacing-large, 12px);
209
+ margin-right: var(--spacing-tiny, 2px);
210
+ box-shadow: 1px 1px 1px 1px #0000001a;
212
211
  --md-outlined-button-label-text-color: #586878;
213
212
  --md-outlined-button-label-text-weight: bold;
213
+ --md-sys-color-outline: rgba(51,51,51,.20);
214
214
  }
215
215
  }
216
216
  }
package/dist-client/pages/project/project-setting-list.js CHANGED
@@ -240,7 +240,6 @@ ProjectSettingList.styles = [
240
240
 
241
241
  div[header] {
242
242
  display: flex;
243
- height: 100px;
244
243
  align-items: center;
245
244
  background-color: #2ea4df1a;
246
245
  border: 1px solid #2ea4df33;
@@ -358,7 +357,7 @@ ProjectSettingList.styles = [
358
357
  }
359
358
 
360
359
  div[filled] div {
361
- margin-right: 18px;
360
+ margin-right: var(--spacing-large, 12px);
362
361
  display: inline-block;
363
362
  }
364
363
 
@@ -371,11 +370,12 @@ ProjectSettingList.styles = [
371
370
 
372
371
  md-outlined-button {
373
372
  min-height: 33px;
374
- padding: 0px 13px;
375
- margin-right: 2px;
376
- 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;
377
376
  --md-outlined-button-label-text-color: #586878;
378
377
  --md-outlined-button-label-text-weight: bold;
378
+ --md-sys-color-outline: rgba(51,51,51,.20);
379
379
  }
380
380
  }
381
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: 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 height: 100px;\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: 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>도면타입/검측부위<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"]}
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"]}