@dssp/project 0.0.7 → 0.0.9
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/assets/images/img-building-complex-default.jpg +0 -0
- package/assets/images/img-building-default.png +0 -0
- package/assets/images/no-image.png +0 -0
- package/client/pages/project/project-detail.ts +17 -4
- package/client/pages/project/project-list.ts +9 -1
- package/client/pages/project/project-schedule-list.ts +13 -9
- package/client/pages/project/project-schedule.ts +98 -46
- package/client/pages/project/project-setting-list.ts +9 -1
- package/dist-client/pages/project/project-detail.js +28 -15
- package/dist-client/pages/project/project-detail.js.map +1 -1
- package/dist-client/pages/project/project-list.js +10 -2
- package/dist-client/pages/project/project-list.js.map +1 -1
- package/dist-client/pages/project/project-schedule-list.js +14 -10
- package/dist-client/pages/project/project-schedule-list.js.map +1 -1
- package/dist-client/pages/project/project-schedule.js +94 -42
- package/dist-client/pages/project/project-schedule.js.map +1 -1
- package/dist-client/pages/project/project-setting-list.js +10 -2
- package/dist-client/pages/project/project-setting-list.js.map +1 -1
- package/dist-client/route.d.ts +1 -1
- package/dist-client/tsconfig.tsbuildinfo +1 -1
- package/dist-server/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
|
@@ -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;\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"]}
|
|
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: auto;\n aspect-ratio: 1920 / 1080;\n }\n img[no-image] {\n object-fit: contain;\n opacity: 0.5;\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 [building-complex-img] {\n width: 100%;\n aspect-ratio: 2 / 1;\n }\n img {\n opacity: 0.5;\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\n ?no-image=${!this.project.mainPhoto?.fullpath}\n src=${this.project.mainPhoto?.fullpath || '/assets/images/no-image.png'}\n />\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 ${this.project.buildingComplex?.drawing?.fullpath\n ? html`<div building-complex-img></div>`\n : html`<img building-complex-img src=\"/assets/images/img-building-complex-default.jpg\" />`}\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"]}
|
|
@@ -50,11 +50,15 @@ let ProjectListPage = class ProjectListPage extends ScopedElementsMixin(PageView
|
|
|
50
50
|
|
|
51
51
|
<div body>
|
|
52
52
|
${(_a = this.projectList) === null || _a === void 0 ? void 0 : _a.map((project) => {
|
|
53
|
-
var _a;
|
|
53
|
+
var _a, _b;
|
|
54
54
|
return html `
|
|
55
55
|
<div project-container>
|
|
56
56
|
<a href=${`project-detail/${project.id}`}>
|
|
57
|
-
<img
|
|
57
|
+
<img
|
|
58
|
+
?no-image=${!((_a = project.mainPhoto) === null || _a === void 0 ? void 0 : _a.fullpath)}
|
|
59
|
+
project-img
|
|
60
|
+
src=${((_b = project.mainPhoto) === null || _b === void 0 ? void 0 : _b.fullpath) || '/assets/images/no-image.png'}
|
|
61
|
+
/>
|
|
58
62
|
|
|
59
63
|
<span project-info>
|
|
60
64
|
<div name>${project.name}</div>
|
|
@@ -225,6 +229,10 @@ ProjectListPage.styles = [
|
|
|
225
229
|
width: 285px;
|
|
226
230
|
background-color: #cccccc80;
|
|
227
231
|
}
|
|
232
|
+
img[project-img][no-image] {
|
|
233
|
+
object-fit: contain;
|
|
234
|
+
opacity: 0.5;
|
|
235
|
+
}
|
|
228
236
|
|
|
229
237
|
span[project-info] {
|
|
230
238
|
flex: 0.45;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"project-list.js","sourceRoot":"","sources":["../../../client/pages/project/project-list.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.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 gql from 'graphql-tag'\nimport { Attachment } from '@things-factory/attachment-base'\nimport type { FileUpload } from 'graphql-upload/GraphQLUpload.js'\n\nexport enum ProjectStatus {\n 'PROCEEDING' = '10',\n 'COMPLICATED' = '20'\n}\nexport enum InspectionStatus {\n REQUEST = 'REQUEST',\n PASS = 'PASS',\n FAIL = 'FAIL'\n}\n\nexport interface Project {\n id?: string\n name: string\n startDate?: string\n endDate?: string\n mainPhoto?: Attachment\n mainPhotoUpload?: FileUpload\n totalProgress?: number\n weeklyProgress?: number\n kpi?: number\n inspPassRate?: number\n robotProgressRate?: number\n structuralSafetyRate?: number\n buildingComplex: BuildingComplex\n}\nexport interface BuildingComplex {\n id?: string\n address?: string\n latitude?: number\n longitude?: number\n area?: number\n constructionCompany?: string\n clientCompany?: string\n designCompany?: string\n supervisoryCompany?: string\n drawing?: Attachment\n drawingUpload?: FileUpload\n constructionType?: string\n constructionCost?: number\n etc?: string\n householdCount?: number\n buildingCount?: number\n notice?: string\n planXScale?: number\n planYScale?: number\n buildings?: Building[]\n}\nexport interface Building {\n id?: string\n name: string | undefined\n floorCount: number | undefined\n drawing?: Attachment\n drawingUpload?: FileUpload\n buildingLevels?: BuildingLevel[]\n}\n\nexport interface BuildingLevel {\n id?: string\n floor?: number\n mainDrawing?: Attachment\n mainDrawingImage?: string\n mainDrawingThumbnail?: string\n mainDrawingUpload?: FileUpload\n elevationDrawing?: Attachment\n elevationDrawingThumbnail?: string\n elevationDrawingUpload?: FileUpload\n rebarDistributionDrawing?: Attachment\n rebarDistributionDrawingThumbnail?: string\n rebarDistributionDrawingUpload?: FileUpload\n buildingInspections?: BuildingInspection[]\n}\n\nexport interface BuildingInspection {\n id?: string\n indexX?: number\n indexY?: number\n status?: InspectionStatus\n detail?: string\n attatchments?: Attachment[]\n // buildingInspectionAttachments?: BuildingInspectionAttachment[]\n}\n\n@customElement('project-list')\nexport class ProjectListPage 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[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-sys-color-primary: #006a6a;\n --md-sys-color-surface-container-highest: 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-sys-color-surface-container-low: #24be7b;\n --md-sys-color-primary: #ffffff;\n --md-elevated-button-container-shape: 7px;\n }\n }\n\n div[body] {\n div[project-container] {\n height: 140px;\n margin: 17px 23px;\n background-color: #ffffff;\n border: 1px solid #cccccc80;\n border-radius: 5px;\n\n & > a {\n display: flex;\n width: 100%;\n height: 100%;\n text-decoration: none;\n color: #000;\n }\n\n img[project-img] {\n width: 285px;\n background-color: #cccccc80;\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\n & > div {\n margin-bottom: 3px;\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-sys-color-primary: #0595e51a;\n --md-sys-color-surface-container-highest: #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 }\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 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 return html`\n <div project-container>\n <a href=${`project-detail/${project.id}`}>\n <img project-img src=${project.mainPhoto?.fullpath || ''} />\n\n <span project-info>\n <div name>${project.name}</div>\n <div content>${project.buildingComplex.address}</div>\n <div content>면적: ${project.buildingComplex.area}㎡</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>전체</span>\n <span>${project.totalProgress || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.weeklyProgress || 0}> </md-linear-progress>\n <span>주간</span>\n <span>${project.weeklyProgress || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.kpi || 0}> </md-linear-progress>\n <span>KPI</span>\n <span>${project.kpi || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.inspPassRate || 0}> </md-linear-progress>\n <span>Inspection Passing Rate</span>\n <span>${project.inspPassRate || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.robotProgressRate || 0}> </md-linear-progress>\n <span>Robot Progress</span>\n <span>${project.robotProgressRate || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.structuralSafetyRate || 0}> </md-linear-progress>\n <span>Structural safety</span>\n <span>${project.structuralSafetyRate || 0}%</span>\n </div>\n </span>\n </a>\n </div>\n `\n })}\n </div>\n `\n }\n\n async pageInitialized(lifecycle: any) {\n this.getProjectList()\n }\n\n async pageUpdated(changes: any, lifecycle: any) {}\n\n async getProjectList() {\n const response = await client.query({\n query: gql`\n query Projects($projectName: String!) {\n projects(projectName: $projectName) {\n items {\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 address\n area\n clientCompany\n }\n }\n total\n }\n }\n `,\n variables: {\n projectName: this.projectName || ''\n }\n })\n\n this.projectList = response.data.projects?.items || []\n this.projectCount = response.data.projects?.total || 0\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-list.js","sourceRoot":"","sources":["../../../client/pages/project/project-list.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AAEnC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACxD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,GAAG,MAAM,aAAa,CAAA;AAI7B,MAAM,CAAN,IAAY,aAGX;AAHD,WAAY,aAAa;IACvB,kCAAmB,CAAA;IACnB,mCAAoB,CAAA;AACtB,CAAC,EAHW,aAAa,KAAb,aAAa,QAGxB;AACD,MAAM,CAAN,IAAY,gBAIX;AAJD,WAAY,gBAAgB;IAC1B,uCAAmB,CAAA;IACnB,iCAAa,CAAA;IACb,iCAAa,CAAA;AACf,CAAC,EAJW,gBAAgB,KAAhB,gBAAgB,QAI3B;AA2EM,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,mBAAmB,CAAC,QAAQ,CAAC;IAA3D;;QAyIY,gBAAW,GAAW,EAAE,CAAA;QACxB,gBAAW,GAAc,EAAE,CAAA;QAC3B,iBAAY,GAAW,CAAC,CAAA;IAuI3C,CAAC;IA/IC,IAAI,OAAO;QACT,OAAO;YACL,KAAK,EAAE,UAAU;SAClB,CAAA;IACH,CAAC;IAMD,MAAM;;QACJ,OAAO,IAAI,CAAA;;;;;;;mBAOI,IAAI,CAAC,WAAW;mBAChB,IAAI,CAAC,cAAc;sBAChB,IAAI,CAAC,WAAW;;;;;oBAKlB,IAAI,CAAC,YAAY;;;;UAI3B,MAAA,IAAI,CAAC,WAAW,0CAAE,GAAG,CAAC,CAAC,OAAgB,EAAE,EAAE;;YAC3C,OAAO,IAAI,CAAA;;wBAEG,kBAAkB,OAAO,CAAC,EAAE,EAAE;;8BAExB,CAAC,CAAA,MAAA,OAAO,CAAC,SAAS,0CAAE,QAAQ,CAAA;;wBAElC,CAAA,MAAA,OAAO,CAAC,SAAS,0CAAE,QAAQ,KAAI,6BAA6B;;;;8BAItD,OAAO,CAAC,IAAI;iCACT,OAAO,CAAC,eAAe,CAAC,OAAO;qCAC3B,OAAO,CAAC,eAAe,CAAC,IAAI;wCACzB,OAAO,CAAC,SAAS,IAAI,OAAO,CAAC,OAAO;8CAC9B,OAAO,CAAC,eAAe,CAAC,aAAa;;;;;uEAKZ,OAAO,CAAC,aAAa,IAAI,CAAC;;4BAErE,OAAO,CAAC,aAAa,IAAI,CAAC;;;uEAGiB,OAAO,CAAC,cAAc,IAAI,CAAC;;4BAEtE,OAAO,CAAC,cAAc,IAAI,CAAC;;;uEAGgB,OAAO,CAAC,GAAG,IAAI,CAAC;;4BAE3D,OAAO,CAAC,GAAG,IAAI,CAAC;;;uEAG2B,OAAO,CAAC,YAAY,IAAI,CAAC;;4BAEpE,OAAO,CAAC,YAAY,IAAI,CAAC;;;uEAGkB,OAAO,CAAC,iBAAiB,IAAI,CAAC;;4BAEzE,OAAO,CAAC,iBAAiB,IAAI,CAAC;;;uEAGa,OAAO,CAAC,oBAAoB,IAAI,CAAC;;4BAE5E,OAAO,CAAC,oBAAoB,IAAI,CAAC;;;;;WAKlD,CAAA;QACH,CAAC,CAAC;;KAEL,CAAA;IACH,CAAC;IAED,KAAK,CAAC,eAAe,CAAC,SAAc;QAClC,IAAI,CAAC,cAAc,EAAE,CAAA;IACvB,CAAC;IAED,KAAK,CAAC,WAAW,CAAC,OAAY,EAAE,SAAc,IAAG,CAAC;IAElD,KAAK,CAAC,cAAc;;QAClB,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;OA0BT;YACD,SAAS,EAAE;gBACT,WAAW,EAAE,IAAI,CAAC,WAAW,IAAI,EAAE;aACpC;SACF,CAAC,CAAA;QAEF,IAAI,CAAC,WAAW,GAAG,CAAA,MAAA,QAAQ,CAAC,IAAI,CAAC,QAAQ,0CAAE,KAAK,KAAI,EAAE,CAAA;QACtD,IAAI,CAAC,YAAY,GAAG,CAAA,MAAA,QAAQ,CAAC,IAAI,CAAC,QAAQ,0CAAE,KAAK,KAAI,CAAC,CAAA;IACxD,CAAC;IAED,gCAAgC;IACxB,cAAc,CAAC,KAAiB;QACtC,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAA;QAC/C,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,KAAK,CAAA;IAClC,CAAC;IAED,iBAAiB;IACT,WAAW,CAAC,KAAoB;QACtC,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE;YAC1B,IAAI,CAAC,cAAc,EAAE,CAAA;SACtB;IACH,CAAC;;AAhRM,sBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8HF;CACF,CAAA;AAQD;IAAC,KAAK,EAAE;;oDAAiC;AACzC;IAAC,KAAK,EAAE;;oDAAoC;AAC5C;IAAC,KAAK,EAAE;;qDAAiC;AA3I9B,eAAe;IAD3B,aAAa,CAAC,cAAc,CAAC;GACjB,eAAe,CAkR3B;SAlRY,eAAe","sourcesContent":["import '@material/web/icon/icon.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 gql from 'graphql-tag'\nimport { Attachment } from '@things-factory/attachment-base'\nimport type { FileUpload } from 'graphql-upload/GraphQLUpload.js'\n\nexport enum ProjectStatus {\n 'PROCEEDING' = '10',\n 'COMPLICATED' = '20'\n}\nexport enum InspectionStatus {\n REQUEST = 'REQUEST',\n PASS = 'PASS',\n FAIL = 'FAIL'\n}\n\nexport interface Project {\n id?: string\n name: string\n startDate?: string\n endDate?: string\n mainPhoto?: Attachment\n mainPhotoUpload?: FileUpload\n totalProgress?: number\n weeklyProgress?: number\n kpi?: number\n inspPassRate?: number\n robotProgressRate?: number\n structuralSafetyRate?: number\n buildingComplex: BuildingComplex\n}\nexport interface BuildingComplex {\n id?: string\n address?: string\n latitude?: number\n longitude?: number\n area?: number\n constructionCompany?: string\n clientCompany?: string\n designCompany?: string\n supervisoryCompany?: string\n drawing?: Attachment\n drawingUpload?: FileUpload\n constructionType?: string\n constructionCost?: number\n etc?: string\n householdCount?: number\n buildingCount?: number\n notice?: string\n planXScale?: number\n planYScale?: number\n buildings?: Building[]\n}\nexport interface Building {\n id?: string\n name: string | undefined\n floorCount: number | undefined\n drawing?: Attachment\n drawingUpload?: FileUpload\n buildingLevels?: BuildingLevel[]\n}\n\nexport interface BuildingLevel {\n id?: string\n floor?: number\n mainDrawing?: Attachment\n mainDrawingImage?: string\n mainDrawingThumbnail?: string\n mainDrawingUpload?: FileUpload\n elevationDrawing?: Attachment\n elevationDrawingThumbnail?: string\n elevationDrawingUpload?: FileUpload\n rebarDistributionDrawing?: Attachment\n rebarDistributionDrawingThumbnail?: string\n rebarDistributionDrawingUpload?: FileUpload\n buildingInspections?: BuildingInspection[]\n}\n\nexport interface BuildingInspection {\n id?: string\n indexX?: number\n indexY?: number\n status?: InspectionStatus\n detail?: string\n attatchments?: Attachment[]\n // buildingInspectionAttachments?: BuildingInspectionAttachment[]\n}\n\n@customElement('project-list')\nexport class ProjectListPage 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[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-sys-color-primary: #006a6a;\n --md-sys-color-surface-container-highest: 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-sys-color-surface-container-low: #24be7b;\n --md-sys-color-primary: #ffffff;\n --md-elevated-button-container-shape: 7px;\n }\n }\n\n div[body] {\n div[project-container] {\n height: 140px;\n margin: 17px 23px;\n background-color: #ffffff;\n border: 1px solid #cccccc80;\n border-radius: 5px;\n\n & > a {\n display: flex;\n width: 100%;\n height: 100%;\n text-decoration: none;\n color: #000;\n }\n\n img[project-img] {\n width: 285px;\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\n & > div {\n margin-bottom: 3px;\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-sys-color-primary: #0595e51a;\n --md-sys-color-surface-container-highest: #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 }\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 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 return html`\n <div project-container>\n <a href=${`project-detail/${project.id}`}>\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}㎡</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>전체</span>\n <span>${project.totalProgress || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.weeklyProgress || 0}> </md-linear-progress>\n <span>주간</span>\n <span>${project.weeklyProgress || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.kpi || 0}> </md-linear-progress>\n <span>KPI</span>\n <span>${project.kpi || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.inspPassRate || 0}> </md-linear-progress>\n <span>Inspection Passing Rate</span>\n <span>${project.inspPassRate || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.robotProgressRate || 0}> </md-linear-progress>\n <span>Robot Progress</span>\n <span>${project.robotProgressRate || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.structuralSafetyRate || 0}> </md-linear-progress>\n <span>Structural safety</span>\n <span>${project.structuralSafetyRate || 0}%</span>\n </div>\n </span>\n </a>\n </div>\n `\n })}\n </div>\n `\n }\n\n async pageInitialized(lifecycle: any) {\n this.getProjectList()\n }\n\n async pageUpdated(changes: any, lifecycle: any) {}\n\n async getProjectList() {\n const response = await client.query({\n query: gql`\n query Projects($projectName: String!) {\n projects(projectName: $projectName) {\n items {\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 address\n area\n clientCompany\n }\n }\n total\n }\n }\n `,\n variables: {\n projectName: this.projectName || ''\n }\n })\n\n this.projectList = response.data.projects?.items || []\n this.projectCount = response.data.projects?.total || 0\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"]}
|
|
@@ -39,11 +39,15 @@ let ProjectScheduleListPage = class ProjectScheduleListPage extends ScopedElemen
|
|
|
39
39
|
|
|
40
40
|
<div body>
|
|
41
41
|
${(_a = this.projectList) === null || _a === void 0 ? void 0 : _a.map((project) => {
|
|
42
|
-
var _a;
|
|
42
|
+
var _a, _b;
|
|
43
43
|
return html `
|
|
44
44
|
<div project-container>
|
|
45
45
|
<a href=${`project-schedule/${project.id}`}>
|
|
46
|
-
<img
|
|
46
|
+
<img
|
|
47
|
+
?no-image=${!((_a = project.mainPhoto) === null || _a === void 0 ? void 0 : _a.fullpath)}
|
|
48
|
+
project-img
|
|
49
|
+
src=${((_b = project.mainPhoto) === null || _b === void 0 ? void 0 : _b.fullpath) || '/assets/images/no-image.png'}
|
|
50
|
+
/>
|
|
47
51
|
|
|
48
52
|
<span project-info>
|
|
49
53
|
<div name>${project.name}</div>
|
|
@@ -55,14 +59,12 @@ let ProjectScheduleListPage = class ProjectScheduleListPage extends ScopedElemen
|
|
|
55
59
|
|
|
56
60
|
<span project-state>
|
|
57
61
|
<div progress>
|
|
58
|
-
<md-linear-progress buffer="100" max="100" value=${project.totalProgress || 0}>
|
|
59
|
-
</md-linear-progress>
|
|
62
|
+
<md-linear-progress buffer="100" max="100" value=${project.totalProgress || 0}> </md-linear-progress>
|
|
60
63
|
<span>전체</span>
|
|
61
64
|
<span>${project.totalProgress || 0}%</span>
|
|
62
65
|
</div>
|
|
63
66
|
<div progress>
|
|
64
|
-
<md-linear-progress buffer="100" max="100" value=${project.weeklyProgress || 0}>
|
|
65
|
-
</md-linear-progress>
|
|
67
|
+
<md-linear-progress buffer="100" max="100" value=${project.weeklyProgress || 0}> </md-linear-progress>
|
|
66
68
|
<span>주간</span>
|
|
67
69
|
<span>${project.weeklyProgress || 0}%</span>
|
|
68
70
|
</div>
|
|
@@ -77,14 +79,12 @@ let ProjectScheduleListPage = class ProjectScheduleListPage extends ScopedElemen
|
|
|
77
79
|
<span>${project.inspPassRate || 0}%</span>
|
|
78
80
|
</div>
|
|
79
81
|
<div progress>
|
|
80
|
-
<md-linear-progress buffer="100" max="100" value=${project.robotProgressRate || 0}>
|
|
81
|
-
</md-linear-progress>
|
|
82
|
+
<md-linear-progress buffer="100" max="100" value=${project.robotProgressRate || 0}> </md-linear-progress>
|
|
82
83
|
<span>Robot Progress</span>
|
|
83
84
|
<span>${project.robotProgressRate || 0}%</span>
|
|
84
85
|
</div>
|
|
85
86
|
<div progress>
|
|
86
|
-
<md-linear-progress buffer="100" max="100" value=${project.structuralSafetyRate || 0}>
|
|
87
|
-
</md-linear-progress>
|
|
87
|
+
<md-linear-progress buffer="100" max="100" value=${project.structuralSafetyRate || 0}> </md-linear-progress>
|
|
88
88
|
<span>Structural safety</span>
|
|
89
89
|
<span>${project.structuralSafetyRate || 0}%</span>
|
|
90
90
|
</div>
|
|
@@ -218,6 +218,10 @@ ProjectScheduleListPage.styles = [
|
|
|
218
218
|
width: 285px;
|
|
219
219
|
background-color: #cccccc80;
|
|
220
220
|
}
|
|
221
|
+
img[project-img][no-image] {
|
|
222
|
+
object-fit: contain;
|
|
223
|
+
opacity: 0.5;
|
|
224
|
+
}
|
|
221
225
|
|
|
222
226
|
span[project-info] {
|
|
223
227
|
flex: 0.45;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"project-schedule-list.js","sourceRoot":"","sources":["../../../client/pages/project/project-schedule-list.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.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 gql from 'graphql-tag'\nimport { Project } from './project-list'\n\n@customElement('project-schedule-list')\nexport class ProjectScheduleListPage 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[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-sys-color-primary: #006a6a;\n --md-sys-color-surface-container-highest: 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-sys-color-surface-container-low: #24be7b;\n --md-sys-color-primary: #ffffff;\n --md-elevated-button-container-shape: 7px;\n }\n }\n\n div[body] {\n div[project-container] {\n height: 140px;\n margin: 17px 23px;\n background-color: #ffffff;\n border: 1px solid #cccccc80;\n border-radius: 5px;\n\n & > a {\n display: flex;\n width: 100%;\n height: 100%;\n text-decoration: none;\n color: #000;\n }\n\n img[project-img] {\n width: 285px;\n background-color: #cccccc80;\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\n & > div {\n margin-bottom: 3px;\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-sys-color-primary: #0595e51a;\n --md-sys-color-surface-container-highest: #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 }\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 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 return html`\n <div project-container>\n <a href=${`project-schedule/${project.id}`}>\n <img project-img src=${project.mainPhoto?.fullpath || ''} />\n\n <span project-info>\n <div name>${project.name}</div>\n <div content>${project.buildingComplex.address}</div>\n <div content>면적: ${project.buildingComplex.area}㎡</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}>\n </md-linear-progress>\n <span>전체</span>\n <span>${project.totalProgress || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.weeklyProgress || 0}>\n </md-linear-progress>\n <span>주간</span>\n <span>${project.weeklyProgress || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.kpi || 0}> </md-linear-progress>\n <span>KPI</span>\n <span>${project.kpi || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.inspPassRate || 0}> </md-linear-progress>\n <span>Inspection Passing Rate</span>\n <span>${project.inspPassRate || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.robotProgressRate || 0}>\n </md-linear-progress>\n <span>Robot Progress</span>\n <span>${project.robotProgressRate || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.structuralSafetyRate || 0}>\n </md-linear-progress>\n <span>Structural safety</span>\n <span>${project.structuralSafetyRate || 0}%</span>\n </div>\n </span>\n </a>\n </div>\n `\n })}\n </div>\n `\n }\n\n async pageInitialized(lifecycle: any) {\n this.getProjectList()\n }\n\n async pageUpdated(changes: any, lifecycle: any) {}\n\n async getProjectList() {\n const response = await client.query({\n query: gql`\n query Projects($projectName: String!) {\n projects(projectName: $projectName) {\n items {\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 address\n area\n clientCompany\n }\n }\n total\n }\n }\n `,\n variables: {\n projectName: this.projectName || ''\n }\n })\n\n this.projectList = response.data.projects?.items || []\n this.projectCount = response.data.projects?.total || 0\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-schedule-list.js","sourceRoot":"","sources":["../../../client/pages/project/project-schedule-list.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.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 gql from 'graphql-tag'\nimport { Project } from './project-list'\n\n@customElement('project-schedule-list')\nexport class ProjectScheduleListPage 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[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-sys-color-primary: #006a6a;\n --md-sys-color-surface-container-highest: 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-sys-color-surface-container-low: #24be7b;\n --md-sys-color-primary: #ffffff;\n --md-elevated-button-container-shape: 7px;\n }\n }\n\n div[body] {\n div[project-container] {\n height: 140px;\n margin: 17px 23px;\n background-color: #ffffff;\n border: 1px solid #cccccc80;\n border-radius: 5px;\n\n & > a {\n display: flex;\n width: 100%;\n height: 100%;\n text-decoration: none;\n color: #000;\n }\n\n img[project-img] {\n width: 285px;\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\n & > div {\n margin-bottom: 3px;\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-sys-color-primary: #0595e51a;\n --md-sys-color-surface-container-highest: #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 }\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 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 return html`\n <div project-container>\n <a href=${`project-schedule/${project.id}`}>\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}㎡</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>전체</span>\n <span>${project.totalProgress || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.weeklyProgress || 0}> </md-linear-progress>\n <span>주간</span>\n <span>${project.weeklyProgress || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.kpi || 0}> </md-linear-progress>\n <span>KPI</span>\n <span>${project.kpi || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.inspPassRate || 0}> </md-linear-progress>\n <span>Inspection Passing Rate</span>\n <span>${project.inspPassRate || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.robotProgressRate || 0}> </md-linear-progress>\n <span>Robot Progress</span>\n <span>${project.robotProgressRate || 0}%</span>\n </div>\n <div progress>\n <md-linear-progress buffer=\"100\" max=\"100\" value=${project.structuralSafetyRate || 0}> </md-linear-progress>\n <span>Structural safety</span>\n <span>${project.structuralSafetyRate || 0}%</span>\n </div>\n </span>\n </a>\n </div>\n `\n })}\n </div>\n `\n }\n\n async pageInitialized(lifecycle: any) {\n this.getProjectList()\n }\n\n async pageUpdated(changes: any, lifecycle: any) {}\n\n async getProjectList() {\n const response = await client.query({\n query: gql`\n query Projects($projectName: String!) {\n projects(projectName: $projectName) {\n items {\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 address\n area\n clientCompany\n }\n }\n total\n }\n }\n `,\n variables: {\n projectName: this.projectName || ''\n }\n })\n\n this.projectList = response.data.projects?.items || []\n this.projectCount = response.data.projects?.total || 0\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"]}
|
|
@@ -46,6 +46,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
46
46
|
dependsOn: '',
|
|
47
47
|
length: '5d',
|
|
48
48
|
tags: ['active'],
|
|
49
|
+
resources: [{ type: '철근/형틀공', allocated: 6 }],
|
|
49
50
|
children: []
|
|
50
51
|
},
|
|
51
52
|
{
|
|
@@ -59,6 +60,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
59
60
|
dependsOn: '1',
|
|
60
61
|
length: '1d',
|
|
61
62
|
tags: ['milestone'],
|
|
63
|
+
resources: [{ type: '철근/형틀공', allocated: 6 }],
|
|
62
64
|
children: []
|
|
63
65
|
},
|
|
64
66
|
{
|
|
@@ -84,7 +86,35 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
84
86
|
dependsOn: '',
|
|
85
87
|
length: '4d',
|
|
86
88
|
tags: ['done'],
|
|
87
|
-
children: [
|
|
89
|
+
children: [
|
|
90
|
+
{
|
|
91
|
+
id: '3-1-1',
|
|
92
|
+
title: 'Coding-A',
|
|
93
|
+
type: 'task',
|
|
94
|
+
// section: developmentSection,
|
|
95
|
+
startDate: '2023-01-07',
|
|
96
|
+
endDate: '2023-01-10',
|
|
97
|
+
progress: 60,
|
|
98
|
+
dependsOn: '',
|
|
99
|
+
length: '4d',
|
|
100
|
+
tags: ['active'],
|
|
101
|
+
resources: [{ type: '창호공', allocated: 5 }],
|
|
102
|
+
children: []
|
|
103
|
+
},
|
|
104
|
+
{
|
|
105
|
+
id: '3-1-2',
|
|
106
|
+
title: 'Coding-B',
|
|
107
|
+
type: 'task',
|
|
108
|
+
// section: developmentSection,
|
|
109
|
+
startDate: '2023-01-11',
|
|
110
|
+
endDate: '2023-01-15',
|
|
111
|
+
dependsOn: '3-1-1',
|
|
112
|
+
length: '5d',
|
|
113
|
+
tags: ['active'],
|
|
114
|
+
resources: [{ type: '창호공', allocated: 3 }],
|
|
115
|
+
children: []
|
|
116
|
+
}
|
|
117
|
+
]
|
|
88
118
|
},
|
|
89
119
|
{
|
|
90
120
|
id: '3-2',
|
|
@@ -96,6 +126,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
96
126
|
dependsOn: '3-1',
|
|
97
127
|
length: '5d',
|
|
98
128
|
tags: ['active'],
|
|
129
|
+
resources: [{ type: '창호공', allocated: 6 }],
|
|
99
130
|
children: []
|
|
100
131
|
}
|
|
101
132
|
]
|
|
@@ -111,6 +142,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
111
142
|
dependsOn: '1',
|
|
112
143
|
length: '1d',
|
|
113
144
|
tags: ['done'],
|
|
145
|
+
resources: [{ type: '방수공', allocated: 5 }],
|
|
114
146
|
children: []
|
|
115
147
|
},
|
|
116
148
|
{
|
|
@@ -123,6 +155,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
123
155
|
dependsOn: '4',
|
|
124
156
|
length: '1d',
|
|
125
157
|
tags: ['milestone'],
|
|
158
|
+
resources: [{ type: '목공', allocated: 3 }],
|
|
126
159
|
children: []
|
|
127
160
|
},
|
|
128
161
|
{
|
|
@@ -135,6 +168,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
135
168
|
dependsOn: '5',
|
|
136
169
|
length: '1d',
|
|
137
170
|
tags: ['milestone'],
|
|
171
|
+
resources: [{ type: '금속공', allocated: 1 }],
|
|
138
172
|
children: []
|
|
139
173
|
},
|
|
140
174
|
{
|
|
@@ -147,6 +181,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
147
181
|
dependsOn: '6',
|
|
148
182
|
length: '1d',
|
|
149
183
|
tags: ['milestone'],
|
|
184
|
+
resources: [{ type: '타일공', allocated: 6 }],
|
|
150
185
|
children: []
|
|
151
186
|
},
|
|
152
187
|
{
|
|
@@ -159,6 +194,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
159
194
|
dependsOn: '7',
|
|
160
195
|
length: '1d',
|
|
161
196
|
tags: ['critical'],
|
|
197
|
+
resources: [{ type: '창호공', allocated: 7 }],
|
|
162
198
|
children: []
|
|
163
199
|
},
|
|
164
200
|
{
|
|
@@ -171,6 +207,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
171
207
|
dependsOn: '8',
|
|
172
208
|
length: '1d',
|
|
173
209
|
tags: ['active'],
|
|
210
|
+
resources: [{ type: '도배공', allocated: 8 }],
|
|
174
211
|
children: []
|
|
175
212
|
},
|
|
176
213
|
{
|
|
@@ -183,6 +220,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
183
220
|
dependsOn: '9',
|
|
184
221
|
length: '1d',
|
|
185
222
|
tags: ['critical'],
|
|
223
|
+
resources: [{ type: '조적공', allocated: 6 }],
|
|
186
224
|
children: []
|
|
187
225
|
},
|
|
188
226
|
{
|
|
@@ -195,6 +233,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
195
233
|
dependsOn: '9',
|
|
196
234
|
length: '1d',
|
|
197
235
|
tags: ['milestone'],
|
|
236
|
+
resources: [{ type: '철근/형틀공', allocated: 6 }],
|
|
198
237
|
children: []
|
|
199
238
|
},
|
|
200
239
|
{
|
|
@@ -206,8 +245,37 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
206
245
|
endDate: '2023-01-23',
|
|
207
246
|
dependsOn: '9',
|
|
208
247
|
length: '1d',
|
|
248
|
+
resources: [{ type: '방수공', allocated: 6 }],
|
|
209
249
|
tags: ['milestone'],
|
|
210
|
-
children: [
|
|
250
|
+
children: [
|
|
251
|
+
{
|
|
252
|
+
id: '12-1',
|
|
253
|
+
title: 'Coding-A',
|
|
254
|
+
type: 'task',
|
|
255
|
+
// section: developmentSection,
|
|
256
|
+
startDate: '2023-01-07',
|
|
257
|
+
endDate: '2023-01-10',
|
|
258
|
+
progress: 60,
|
|
259
|
+
dependsOn: '',
|
|
260
|
+
length: '4d',
|
|
261
|
+
tags: ['done'],
|
|
262
|
+
resources: [{ type: '방수공', allocated: 6 }],
|
|
263
|
+
children: []
|
|
264
|
+
},
|
|
265
|
+
{
|
|
266
|
+
id: '12-2',
|
|
267
|
+
title: 'Coding-B',
|
|
268
|
+
type: 'task',
|
|
269
|
+
// section: developmentSection,
|
|
270
|
+
startDate: '2023-01-11',
|
|
271
|
+
endDate: '2023-01-15',
|
|
272
|
+
dependsOn: '12-1',
|
|
273
|
+
length: '5d',
|
|
274
|
+
tags: ['active'],
|
|
275
|
+
resources: [{ type: '조적공', allocated: 6 }],
|
|
276
|
+
children: []
|
|
277
|
+
}
|
|
278
|
+
]
|
|
211
279
|
},
|
|
212
280
|
{
|
|
213
281
|
id: '13',
|
|
@@ -231,6 +299,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
231
299
|
dependsOn: '13',
|
|
232
300
|
length: '1d',
|
|
233
301
|
tags: ['milestone'],
|
|
302
|
+
resources: [{ type: '금속공', allocated: 1 }],
|
|
234
303
|
children: []
|
|
235
304
|
},
|
|
236
305
|
{
|
|
@@ -254,6 +323,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
254
323
|
endDate: '2023-02-05',
|
|
255
324
|
dependsOn: '15',
|
|
256
325
|
length: '1d',
|
|
326
|
+
resources: [{ type: '창호공', allocated: 1 }],
|
|
257
327
|
tags: ['active'],
|
|
258
328
|
children: []
|
|
259
329
|
},
|
|
@@ -291,6 +361,7 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
291
361
|
dependsOn: '18',
|
|
292
362
|
length: '1d',
|
|
293
363
|
tags: ['milestone'],
|
|
364
|
+
resources: [{ type: '창호공', allocated: 7 }],
|
|
294
365
|
children: []
|
|
295
366
|
}
|
|
296
367
|
];
|
|
@@ -318,27 +389,20 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
318
389
|
</div>
|
|
319
390
|
|
|
320
391
|
<div body>
|
|
321
|
-
<
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
.tasks=${this.tasks}
|
|
328
|
-
@date-range-selected=${(e) => {
|
|
392
|
+
<ox-gantt
|
|
393
|
+
from-date=${new Date(this.fromDate).toISOString().split('T')[0]}
|
|
394
|
+
to-date=${new Date(this.toDate).toISOString().split('T')[0]}
|
|
395
|
+
.timeScale=${this.timeScale}
|
|
396
|
+
.tasks=${this.tasks}
|
|
397
|
+
@date-range-selected=${(e) => {
|
|
329
398
|
console.log('date-range-selected', e.detail);
|
|
330
399
|
}}
|
|
331
|
-
|
|
400
|
+
@task-clicked=${(e) => {
|
|
332
401
|
console.log('task-clicked', e.detail);
|
|
333
402
|
}}
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
</div>
|
|
338
|
-
<div table>
|
|
339
|
-
<table></table>
|
|
340
|
-
</div>
|
|
341
|
-
</div>
|
|
403
|
+
?extend-grid-lines=${this.extendGridLines}
|
|
404
|
+
>
|
|
405
|
+
</ox-gantt>
|
|
342
406
|
<div select-container>
|
|
343
407
|
<div date>
|
|
344
408
|
<span name>기간선택</span>
|
|
@@ -403,8 +467,9 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
|
|
|
403
467
|
ProjectSchedule.styles = [
|
|
404
468
|
css `
|
|
405
469
|
:host {
|
|
406
|
-
display:
|
|
407
|
-
|
|
470
|
+
display: flex;
|
|
471
|
+
flex-direction: column;
|
|
472
|
+
|
|
408
473
|
color: #4e5055;
|
|
409
474
|
|
|
410
475
|
width: 100%;
|
|
@@ -454,10 +519,13 @@ ProjectSchedule.styles = [
|
|
|
454
519
|
}
|
|
455
520
|
|
|
456
521
|
div[body] {
|
|
522
|
+
flex: 1;
|
|
523
|
+
|
|
457
524
|
display: flex;
|
|
458
525
|
flex-direction: column;
|
|
459
526
|
margin: 0px 25px 25px 25px;
|
|
460
527
|
gap: 15px;
|
|
528
|
+
overflow: hidden;
|
|
461
529
|
|
|
462
530
|
h3 {
|
|
463
531
|
color: #2e79be;
|
|
@@ -470,29 +538,13 @@ ProjectSchedule.styles = [
|
|
|
470
538
|
border-radius: 5px;
|
|
471
539
|
}
|
|
472
540
|
|
|
473
|
-
|
|
541
|
+
ox-gantt {
|
|
474
542
|
flex: 1;
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
div[chart] {
|
|
479
|
-
flex: 0.7;
|
|
480
|
-
background: #03a9f44d;
|
|
481
|
-
|
|
482
|
-
ox-gantt {
|
|
483
|
-
max-width: 91vw;
|
|
484
|
-
aspect-ratio: 3 / 1;
|
|
485
|
-
box-sizing: border-box;
|
|
543
|
+
box-sizing: border-box;
|
|
544
|
+
overflow: hidden;
|
|
486
545
|
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
}
|
|
490
|
-
}
|
|
491
|
-
|
|
492
|
-
div[table] {
|
|
493
|
-
flex: 0.3;
|
|
494
|
-
background: #8fd170b8;
|
|
495
|
-
}
|
|
546
|
+
background-color: var(--md-sys-color-primary-container);
|
|
547
|
+
color: var(--md-sys-color-on-primary-container);
|
|
496
548
|
}
|
|
497
549
|
|
|
498
550
|
div[select-container] {
|