@dssp/project 0.0.8 → 0.0.10

package/dist-client/pages/project/project-schedule.js

@@ -6,11 +6,28 @@ import '@material/web/button/filled-button.js';
 import '@material/web/button/outlined-button.js';
 import { PageView } from '@operato/shell';
 import { css, html } from 'lit';
-import { customElement, state } from 'lit/decorators.js';
+import { customElement, query, state } from 'lit/decorators.js';
 import { ScopedElementsMixin } from '@open-wc/scoped-elements';
 import { client } from '@operato/graphql';
+import { i18next } from '@operato/i18n';
 import gql from 'graphql-tag';
 import '@operato/gantt/ox-gantt.js';
+const TaskFragment = gql `
+  fragment TaskFragment on Task {
+    type
+    title: name
+    id: code
+    duration
+    startDate
+    endDate
+    dependsOn
+    progress
+    resources {
+      type
+      allocated
+    }
+  }
+`;
 let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView) {
     constructor() {
         super(...arguments);
@@ -30,270 +47,36 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
         this.projectId = '';
         this.project = Object.assign({}, this.defaultProject);
         this.selectedBuildingIdx = 0;
-        this.fromDate = '2022-12-27';
+        this.fromDate = '2024-01-01';
         this.toDate = '2024-12-31';
         this.timeScale = 'week-day';
         this.extendGridLines = false;
-        this.tasks = [
-            {
-                id: '1',
-                title: 'Design',
-                type: 'task',
-                // section: developmentSection,
-                startDate: '2023-01-01',
-                endDate: '2023-01-05',
-                progress: 60,
-                dependsOn: '',
-                length: '5d',
-                tags: ['active'],
-                children: []
-            },
-            {
-                id: '2',
-                title: 'Development',
-                type: 'milestone',
-                // section: developmentSection,
-                startDate: '2023-01-06',
-                endDate: '2023-01-06',
-                progress: 30,
-                dependsOn: '1',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            },
-            {
-                id: '3',
-                title: 'Coding',
-                type: 'phase',
-                // section: developmentSection,
-                startDate: '2023-01-07',
-                endDate: '2023-01-15',
-                progress: 10,
-                dependsOn: '2',
-                length: '9d',
-                tags: ['critical'],
-                children: [
-                    {
-                        id: '3-1',
-                        title: 'Coding-A',
-                        type: 'task',
-                        // section: developmentSection,
-                        startDate: '2023-01-07',
-                        endDate: '2023-01-10',
-                        progress: 60,
-                        dependsOn: '',
-                        length: '4d',
-                        tags: ['done'],
-                        children: []
-                    },
-                    {
-                        id: '3-2',
-                        title: 'Coding-B',
-                        type: 'task',
-                        // section: developmentSection,
-                        startDate: '2023-01-11',
-                        endDate: '2023-01-15',
-                        dependsOn: '3-1',
-                        length: '5d',
-                        tags: ['active'],
-                        children: []
-                    }
-                ]
-            },
-            {
-                id: '4',
-                title: 'Test',
-                type: 'milestone',
-                // section: developmentSection,
-                startDate: '2023-01-07',
-                endDate: '2023-01-10',
-                progress: 100,
-                dependsOn: '1',
-                length: '1d',
-                tags: ['done'],
-                children: []
-            },
-            {
-                id: '5',
-                title: 'Deploy',
-                type: 'milestone',
-                // section: developmentSection,
-                startDate: '2023-01-15',
-                endDate: '2023-01-21',
-                dependsOn: '4',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            },
-            {
-                id: '6',
-                title: 'Publishing',
-                type: 'milestone',
-                // section: developmentSection,
-                startDate: '2023-01-11',
-                endDate: '2023-01-15',
-                dependsOn: '5',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            },
-            {
-                id: '7',
-                title: 'Provisioning',
-                type: 'milestone',
-                // section: developmentSection,
-                startDate: '2023-01-12',
-                endDate: '2023-01-15',
-                dependsOn: '6',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            },
-            {
-                id: '8',
-                title: 'Alpha Test',
-                type: 'milestone',
-                // section: testSection,
-                startDate: '2023-01-15',
-                endDate: '2023-01-17',
-                dependsOn: '7',
-                length: '1d',
-                tags: ['critical'],
-                children: []
-            },
-            {
-                id: '9',
-                title: 'Beta Task',
-                type: 'milestone',
-                // section: testSection,
-                startDate: '2023-01-15',
-                endDate: '2023-01-18',
-                dependsOn: '8',
-                length: '1d',
-                tags: ['active'],
-                children: []
-            },
-            {
-                id: '10',
-                title: 'Gamma Test',
-                type: 'milestone',
-                // section: testSection,
-                startDate: '2023-01-18',
-                endDate: '2023-01-19',
-                dependsOn: '9',
-                length: '1d',
-                tags: ['critical'],
-                children: []
-            },
-            {
-                id: '11',
-                title: 'Zeta Test',
-                type: 'milestone',
-                // section: testSection,
-                startDate: '2023-01-18',
-                endDate: '2023-01-22',
-                dependsOn: '9',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            },
-            {
-                id: '12',
-                title: 'Release',
-                type: 'milestone',
-                // section: releaseSection,
-                startDate: '2023-01-18',
-                endDate: '2023-01-23',
-                dependsOn: '9',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            },
-            {
-                id: '13',
-                title: 'Release',
-                type: 'milestone',
-                // section: releaseSection,
-                startDate: '2023-01-22',
-                endDate: '2023-01-27',
-                dependsOn: '12',
-                length: '1d',
-                tags: ['done'],
-                children: []
-            },
-            {
-                id: '14',
-                title: 'Release',
-                type: 'milestone',
-                // section: releaseSection,
-                startDate: '2023-01-27',
-                endDate: '2023-01-30',
-                dependsOn: '13',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            },
-            {
-                id: '15',
-                title: 'Release',
-                type: 'milestone',
-                // section: releaseSection,
-                startDate: '2023-01-30',
-                endDate: '2023-01-31',
-                dependsOn: '14',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            },
-            {
-                id: '16',
-                title: 'Release',
-                type: 'milestone',
-                // section: releaseSection,
-                startDate: '2023-01-31',
-                endDate: '2023-02-05',
-                dependsOn: '15',
-                length: '1d',
-                tags: ['active'],
-                children: []
-            },
-            {
-                id: '17',
-                title: 'Release',
-                type: 'milestone',
-                // section: releaseSection,
-                startDate: '2023-02-06',
-                endDate: '2023-02-07',
-                dependsOn: '16',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            },
-            {
-                id: '18',
-                title: 'Release',
-                type: 'milestone',
-                // section: releaseSection,
-                startDate: '2023-02-08',
-                endDate: '2023-02-09',
-                dependsOn: '17',
-                length: '1d',
-                tags: ['critical'],
-                children: []
-            },
-            {
-                id: '19',
-                title: 'Release',
-                type: 'milestone',
-                // section: releaseSection,
-                startDate: '2023-02-10',
-                endDate: '2023-02-25',
-                dependsOn: '18',
-                length: '1d',
-                tags: ['milestone'],
-                children: []
-            }
-        ];
+        this.columnConfigProvider = function () {
+            return [
+                { name: 'title', label: i18next.t('label.gantt-task-title') || 'title', visible: true, width: 150, order: 1 },
+                {
+                    name: 'startDate',
+                    label: i18next.t('label.gantt-task-start-date') || 'start date',
+                    visible: true,
+                    width: 100,
+                    order: 2
+                },
+                {
+                    name: 'resources',
+                    label: i18next.t('label.gantt-task-resources') || 'resources',
+                    visible: true,
+                    width: 100,
+                    order: 3
+                },
+                {
+                    name: 'duration',
+                    label: i18next.t('label.gantt-task-duration') || 'duration',
+                    visible: true,
+                    width: 30,
+                    order: 4
+                }
+            ];
+        };
     }
     get context() {
         return {
@@ -318,31 +101,28 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
       </div>
 
       <div body>
-        <div chart-container>
-          <div chart>
-            <ox-gantt
-              from-date=${new Date(this.fromDate).toISOString().split('T')[0]}
-              to-date=${new Date(this.toDate).toISOString().split('T')[0]}
-              .timeScale=${this.timeScale}
-              .tasks=${this.tasks}
-              @date-range-selected=${(e) => {
+        <ox-gantt
+          from-date=${new Date(this.fromDate).toISOString().split('T')[0]}
+          to-date=${new Date(this.toDate).toISOString().split('T')[0]}
+          .timeScale=${this.timeScale}
+          .tasks=${this.tasks}
+          @date-range-selected=${(e) => {
             console.log('date-range-selected', e.detail);
         }}
-              @task-clicked=${(e) => {
+          @task-clicked=${(e) => {
             console.log('task-clicked', e.detail);
         }}
-              ?extend-grid-lines=${this.extendGridLines}
-            >
-            </ox-gantt>
-          </div>
-          <div table>
-            <table></table>
-          </div>
-        </div>
+          ?extend-grid-lines=${this.extendGridLines}
+          .columnConfigProvider=${this.columnConfigProvider}
+          .colorProvider=${task => {
+            return task.type == 'group' ? 'green' : 'orange';
+        }}
+        >
+        </ox-gantt>
         <div select-container>
           <div date>
             <span name>기간선택</span>
-            <div>
+            <div @change=${() => this.onChangePeriodRange()}>
               <input type="date" name="startDate" project .value=${this.project.startDate || ''} max="9999-12-31" />
               ~
               <input type="date" name="endDate" project .value=${this.project.endDate || ''} max="9999-12-31" />
@@ -361,13 +141,24 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
         }
     }
     async initProject(projectId = '') {
-        var _a;
+        var _a, _b;
         const response = await client.query({
             query: gql `
-        query Project($id: String!) {
+        query Project($id: String!, $sortings: [Sorting!]) {
           project(id: $id) {
             id
             name
+            startDate
+            endDate
+            rootTasks {
+              ...TaskFragment
+              children(sortings: $sortings) {
+                ...TaskFragment
+                children(sortings: $sortings) {
+                  ...TaskFragment
+                }
+              }
+            }
             buildingComplex {
               id
               planXScale
@@ -391,20 +182,33 @@ let ProjectSchedule = class ProjectSchedule extends ScopedElementsMixin(PageView
             }
           }
         }
+
+        ${TaskFragment}
       `,
             variables: {
-                id: projectId
+                id: projectId,
+                sortings: [{ name: 'startDate' }]
             }
         });
         this.project = (_a = response.data) === null || _a === void 0 ? void 0 : _a.project;
+        this.tasks = (_b = response.data) === null || _b === void 0 ? void 0 : _b.project.rootTasks;
+        if (this.project) {
+            this.fromDate = this.project.startDate || '2024-01-01'; /* TODO default: start date of this year - 3 */
+            this.toDate = this.project.endDate || '2024-12-31'; /* TODO defaule: end date of this year + 3 */
+        }
         console.log('init project : ', this.project);
     }
+    onChangePeriodRange() {
+        this.fromDate = this.inputStartDate.value;
+        this.toDate = this.inputEndDate.value;
+    }
 };
 ProjectSchedule.styles = [
     css `
       :host {
-        display: grid;
-        grid-template-rows: 75px auto;
+        display: flex;
+        flex-direction: column;
+
         color: #4e5055;
 
         width: 100%;
@@ -454,10 +258,13 @@ ProjectSchedule.styles = [
       }
 
       div[body] {
+        flex: 1;
+
         display: flex;
         flex-direction: column;
         margin: 0px 25px 25px 25px;
         gap: 15px;
+        overflow: hidden;
 
         h3 {
           color: #2e79be;
@@ -470,29 +277,13 @@ ProjectSchedule.styles = [
           border-radius: 5px;
         }
 
-        div[chart-container] {
+        ox-gantt {
           flex: 1;
-          flex-direction: column;
-          border: 1px solid #cccccc80;
+          box-sizing: border-box;
+          overflow: hidden;
 
-          div[chart] {
-            flex: 0.7;
-            background: #03a9f44d;
-
-            ox-gantt {
-              max-width: 91vw;
-              aspect-ratio: 3 / 1;
-              box-sizing: border-box;
-
-              background-color: var(--md-sys-color-primary-container);
-              color: var(--md-sys-color-on-primary-container);
-            }
-          }
-
-          div[table] {
-            flex: 0.3;
-            background: #8fd170b8;
-          }
+          background-color: var(--md-sys-color-primary-container);
+          color: var(--md-sys-color-on-primary-container);
         }
 
         div[select-container] {
@@ -536,6 +327,26 @@ __decorate([
     state(),
     __metadata("design:type", Number)
 ], ProjectSchedule.prototype, "selectedBuildingIdx", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], ProjectSchedule.prototype, "tasks", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], ProjectSchedule.prototype, "fromDate", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], ProjectSchedule.prototype, "toDate", void 0);
+__decorate([
+    query('input[name="startDate"]'),
+    __metadata("design:type", HTMLInputElement)
+], ProjectSchedule.prototype, "inputStartDate", void 0);
+__decorate([
+    query('input[name="endDate"]'),
+    __metadata("design:type", HTMLInputElement)
+], ProjectSchedule.prototype, "inputEndDate", void 0);
 ProjectSchedule = __decorate([
     customElement('project-schedule')
 ], ProjectSchedule);

package/dist-client/pages/project/project-schedule.js.map

@@ -1 +1 @@
-{"version":3,"file":"project-schedule.js","sourceRoot":"","sources":["../../../client/pages/project/project-schedule.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/filled-button.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'\nimport { notify } from '@operato/layout'\n\nimport gql from 'graphql-tag'\nimport { Building, Project } from './project-list'\nimport '@operato/gantt/ox-gantt.js'\n\n@customElement('project-schedule')\nexport class ProjectSchedule 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      *[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        flex-direction: column;\n        margin: 0px 25px 25px 25px;\n        gap: 15px;\n\n        h3 {\n          color: #2e79be;\n          font-size: 18px;\n          margin: 0px;\n        }\n\n        & > div {\n          display: flex;\n          border-radius: 5px;\n        }\n\n        div[chart-container] {\n          flex: 1;\n          flex-direction: column;\n          border: 1px solid #cccccc80;\n\n          div[chart] {\n            flex: 0.7;\n            background: #03a9f44d;\n\n            ox-gantt {\n              max-width: 91vw;\n              aspect-ratio: 3 / 1;\n              box-sizing: border-box;\n\n              background-color: var(--md-sys-color-primary-container);\n              color: var(--md-sys-color-on-primary-container);\n            }\n          }\n\n          div[table] {\n            flex: 0.3;\n            background: #8fd170b8;\n          }\n        }\n\n        div[select-container] {\n          gap: 15px;\n\n          div[date] {\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            background-color: #2ea4df1a;\n            border: 1px solid #2ea4df33;\n            border-radius: 5px;\n            gap: 12px;\n            padding: 12px 36px 12px 15px;\n\n            span[name] {\n              font-size: 16px;\n              font-weight: bold;\n            }\n          }\n\n          div[button] {\n            flex: 1;\n            border-radius: 5px;\n            border: 1px solid #cccccc80;\n            background-color: #fff;\n          }\n        }\n      }\n    `\n  ]\n\n  get context() {\n    return {\n      title: '공정표'\n    }\n  }\n\n  private defaultProject = {\n    name: '',\n    buildingComplex: {\n      address: '',\n      area: 0,\n      constructionCompany: '',\n      clientCompany: '',\n      supervisoryCompany: '',\n      designCompany: '',\n      constructionType: '',\n      buildings: []\n    }\n  }\n  @state() projectId: string = ''\n  @state() project: Project = { ...this.defaultProject }\n  @state() selectedBuildingIdx: number = 0\n\n  private fromDate = '2022-12-27'\n  private toDate = '2024-12-31'\n  private timeScale = 'week-day'\n  private extendGridLines = false\n  private tasks = [\n    {\n      id: '1',\n      title: 'Design',\n      type: 'task',\n      // section: developmentSection,\n      startDate: '2023-01-01',\n      endDate: '2023-01-05',\n      progress: 60,\n      dependsOn: '',\n      length: '5d',\n      tags: ['active'],\n      children: []\n    },\n    {\n      id: '2',\n      title: 'Development',\n      type: 'milestone',\n      // section: developmentSection,\n      startDate: '2023-01-06',\n      endDate: '2023-01-06',\n      progress: 30,\n      dependsOn: '1',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    },\n    {\n      id: '3',\n      title: 'Coding',\n      type: 'phase',\n      // section: developmentSection,\n      startDate: '2023-01-07',\n      endDate: '2023-01-15',\n      progress: 10,\n      dependsOn: '2',\n      length: '9d',\n      tags: ['critical'],\n      children: [\n        {\n          id: '3-1',\n          title: 'Coding-A',\n          type: 'task',\n          // section: developmentSection,\n          startDate: '2023-01-07',\n          endDate: '2023-01-10',\n          progress: 60,\n          dependsOn: '',\n          length: '4d',\n          tags: ['done'],\n          children: []\n        },\n        {\n          id: '3-2',\n          title: 'Coding-B',\n          type: 'task',\n          // section: developmentSection,\n          startDate: '2023-01-11',\n          endDate: '2023-01-15',\n          dependsOn: '3-1',\n          length: '5d',\n          tags: ['active'],\n          children: []\n        }\n      ]\n    },\n    {\n      id: '4',\n      title: 'Test',\n      type: 'milestone',\n      // section: developmentSection,\n      startDate: '2023-01-07',\n      endDate: '2023-01-10',\n      progress: 100,\n      dependsOn: '1',\n      length: '1d',\n      tags: ['done'],\n      children: []\n    },\n    {\n      id: '5',\n      title: 'Deploy',\n      type: 'milestone',\n      // section: developmentSection,\n      startDate: '2023-01-15',\n      endDate: '2023-01-21',\n      dependsOn: '4',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    },\n    {\n      id: '6',\n      title: 'Publishing',\n      type: 'milestone',\n      // section: developmentSection,\n      startDate: '2023-01-11',\n      endDate: '2023-01-15',\n      dependsOn: '5',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    },\n    {\n      id: '7',\n      title: 'Provisioning',\n      type: 'milestone',\n      // section: developmentSection,\n      startDate: '2023-01-12',\n      endDate: '2023-01-15',\n      dependsOn: '6',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    },\n    {\n      id: '8',\n      title: 'Alpha Test',\n      type: 'milestone',\n      // section: testSection,\n      startDate: '2023-01-15',\n      endDate: '2023-01-17',\n      dependsOn: '7',\n      length: '1d',\n      tags: ['critical'],\n      children: []\n    },\n    {\n      id: '9',\n      title: 'Beta Task',\n      type: 'milestone',\n      // section: testSection,\n      startDate: '2023-01-15',\n      endDate: '2023-01-18',\n      dependsOn: '8',\n      length: '1d',\n      tags: ['active'],\n      children: []\n    },\n    {\n      id: '10',\n      title: 'Gamma Test',\n      type: 'milestone',\n      // section: testSection,\n      startDate: '2023-01-18',\n      endDate: '2023-01-19',\n      dependsOn: '9',\n      length: '1d',\n      tags: ['critical'],\n      children: []\n    },\n    {\n      id: '11',\n      title: 'Zeta Test',\n      type: 'milestone',\n      // section: testSection,\n      startDate: '2023-01-18',\n      endDate: '2023-01-22',\n      dependsOn: '9',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    },\n    {\n      id: '12',\n      title: 'Release',\n      type: 'milestone',\n      // section: releaseSection,\n      startDate: '2023-01-18',\n      endDate: '2023-01-23',\n      dependsOn: '9',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    },\n    {\n      id: '13',\n      title: 'Release',\n      type: 'milestone',\n      // section: releaseSection,\n      startDate: '2023-01-22',\n      endDate: '2023-01-27',\n      dependsOn: '12',\n      length: '1d',\n      tags: ['done'],\n      children: []\n    },\n    {\n      id: '14',\n      title: 'Release',\n      type: 'milestone',\n      // section: releaseSection,\n      startDate: '2023-01-27',\n      endDate: '2023-01-30',\n      dependsOn: '13',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    },\n    {\n      id: '15',\n      title: 'Release',\n      type: 'milestone',\n      // section: releaseSection,\n      startDate: '2023-01-30',\n      endDate: '2023-01-31',\n      dependsOn: '14',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    },\n    {\n      id: '16',\n      title: 'Release',\n      type: 'milestone',\n      // section: releaseSection,\n      startDate: '2023-01-31',\n      endDate: '2023-02-05',\n      dependsOn: '15',\n      length: '1d',\n      tags: ['active'],\n      children: []\n    },\n    {\n      id: '17',\n      title: 'Release',\n      type: 'milestone',\n      // section: releaseSection,\n      startDate: '2023-02-06',\n      endDate: '2023-02-07',\n      dependsOn: '16',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    },\n    {\n      id: '18',\n      title: 'Release',\n      type: 'milestone',\n      // section: releaseSection,\n      startDate: '2023-02-08',\n      endDate: '2023-02-09',\n      dependsOn: '17',\n      length: '1d',\n      tags: ['critical'],\n      children: []\n    },\n    {\n      id: '19',\n      title: 'Release',\n      type: 'milestone',\n      // section: releaseSection,\n      startDate: '2023-02-10',\n      endDate: '2023-02-25',\n      dependsOn: '18',\n      length: '1d',\n      tags: ['milestone'],\n      children: []\n    }\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 chart-container>\n          <div chart>\n            <ox-gantt\n              from-date=${new Date(this.fromDate).toISOString().split('T')[0]}\n              to-date=${new Date(this.toDate).toISOString().split('T')[0]}\n              .timeScale=${this.timeScale}\n              .tasks=${this.tasks}\n              @date-range-selected=${(e: CustomEvent) => {\n                console.log('date-range-selected', e.detail)\n              }}\n              @task-clicked=${(e: CustomEvent) => {\n                console.log('task-clicked', e.detail)\n              }}\n              ?extend-grid-lines=${this.extendGridLines}\n            >\n            </ox-gantt>\n          </div>\n          <div table>\n            <table></table>\n          </div>\n        </div>\n        <div select-container>\n          <div date>\n            <span name>기간선택</span>\n            <div>\n              <input type=\"date\" name=\"startDate\" project .value=${this.project.startDate || ''} max=\"9999-12-31\" />\n              ~\n              <input type=\"date\" name=\"endDate\" project .value=${this.project.endDate || ''} max=\"9999-12-31\" />\n            </div>\n          </div>\n          <div button></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!) {\n          project(id: $id) {\n            id\n            name\n            buildingComplex {\n              id\n              planXScale\n              planYScale\n              buildings {\n                id\n                name\n                drawing {\n                  id\n                  name\n                }\n                buildingLevels {\n                  id\n                  floor\n                  mainDrawing {\n                    id\n                    name\n                  }\n                }\n              }\n            }\n          }\n        }\n      `,\n      variables: {\n        id: projectId\n      }\n    })\n\n    this.project = response.data?.project\n\n    console.log('init project : ', this.project)\n  }\n}\n"]}
+{"version":3,"file":"project-schedule.js","sourceRoot":"","sources":["../../../client/pages/project/project-schedule.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/filled-button.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, query, state } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { client } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\n\nimport gql from 'graphql-tag'\nimport { Project } from './project-list'\nimport '@operato/gantt/ox-gantt.js'\n\nconst TaskFragment = gql`\n  fragment TaskFragment on Task {\n    type\n    title: name\n    id: code\n    duration\n    startDate\n    endDate\n    dependsOn\n    progress\n    resources {\n      type\n      allocated\n    }\n  }\n`\n\n@customElement('project-schedule')\nexport class ProjectSchedule extends ScopedElementsMixin(PageView) {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n\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      *[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        flex: 1;\n\n        display: flex;\n        flex-direction: column;\n        margin: 0px 25px 25px 25px;\n        gap: 15px;\n        overflow: hidden;\n\n        h3 {\n          color: #2e79be;\n          font-size: 18px;\n          margin: 0px;\n        }\n\n        & > div {\n          display: flex;\n          border-radius: 5px;\n        }\n\n        ox-gantt {\n          flex: 1;\n          box-sizing: border-box;\n          overflow: hidden;\n\n          background-color: var(--md-sys-color-primary-container);\n          color: var(--md-sys-color-on-primary-container);\n        }\n\n        div[select-container] {\n          gap: 15px;\n\n          div[date] {\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            background-color: #2ea4df1a;\n            border: 1px solid #2ea4df33;\n            border-radius: 5px;\n            gap: 12px;\n            padding: 12px 36px 12px 15px;\n\n            span[name] {\n              font-size: 16px;\n              font-weight: bold;\n            }\n          }\n\n          div[button] {\n            flex: 1;\n            border-radius: 5px;\n            border: 1px solid #cccccc80;\n            background-color: #fff;\n          }\n        }\n      }\n    `\n  ]\n\n  get context() {\n    return {\n      title: '공정표'\n    }\n  }\n\n  private defaultProject = {\n    name: '',\n    buildingComplex: {\n      address: '',\n      area: 0,\n      constructionCompany: '',\n      clientCompany: '',\n      supervisoryCompany: '',\n      designCompany: '',\n      constructionType: '',\n      buildings: []\n    }\n  }\n  @state() projectId: string = ''\n  @state() project: Project = { ...this.defaultProject }\n  @state() selectedBuildingIdx: number = 0\n  @state() tasks\n\n  @state() private fromDate = '2024-01-01'\n  @state() private toDate = '2024-12-31'\n\n  @query('input[name=\"startDate\"]') inputStartDate!: HTMLInputElement\n  @query('input[name=\"endDate\"]') inputEndDate!: HTMLInputElement\n\n  private timeScale = 'week-day'\n  private extendGridLines = false\n\n  private columnConfigProvider = function () {\n    return [\n      { name: 'title', label: i18next.t('label.gantt-task-title') || 'title', visible: true, width: 150, order: 1 },\n      {\n        name: 'startDate',\n        label: i18next.t('label.gantt-task-start-date') || 'start date',\n        visible: true,\n        width: 100,\n        order: 2\n      },\n      {\n        name: 'resources',\n        label: i18next.t('label.gantt-task-resources') || 'resources',\n        visible: true,\n        width: 100,\n        order: 3\n      },\n      {\n        name: 'duration',\n        label: i18next.t('label.gantt-task-duration') || 'duration',\n        visible: true,\n        width: 30,\n        order: 4\n      }\n    ]\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        <ox-gantt\n          from-date=${new Date(this.fromDate).toISOString().split('T')[0]}\n          to-date=${new Date(this.toDate).toISOString().split('T')[0]}\n          .timeScale=${this.timeScale}\n          .tasks=${this.tasks}\n          @date-range-selected=${(e: CustomEvent) => {\n            console.log('date-range-selected', e.detail)\n          }}\n          @task-clicked=${(e: CustomEvent) => {\n            console.log('task-clicked', e.detail)\n          }}\n          ?extend-grid-lines=${this.extendGridLines}\n          .columnConfigProvider=${this.columnConfigProvider}\n          .colorProvider=${task => {\n            return task.type == 'group' ? 'green' : 'orange'\n          }}\n        >\n        </ox-gantt>\n        <div select-container>\n          <div date>\n            <span name>기간선택</span>\n            <div @change=${() => this.onChangePeriodRange()}>\n              <input type=\"date\" name=\"startDate\" project .value=${this.project.startDate || ''} max=\"9999-12-31\" />\n              ~\n              <input type=\"date\" name=\"endDate\" project .value=${this.project.endDate || ''} max=\"9999-12-31\" />\n            </div>\n          </div>\n          <div button></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!, $sortings: [Sorting!]) {\n          project(id: $id) {\n            id\n            name\n            startDate\n            endDate\n            rootTasks {\n              ...TaskFragment\n              children(sortings: $sortings) {\n                ...TaskFragment\n                children(sortings: $sortings) {\n                  ...TaskFragment\n                }\n              }\n            }\n            buildingComplex {\n              id\n              planXScale\n              planYScale\n              buildings {\n                id\n                name\n                drawing {\n                  id\n                  name\n                }\n                buildingLevels {\n                  id\n                  floor\n                  mainDrawing {\n                    id\n                    name\n                  }\n                }\n              }\n            }\n          }\n        }\n\n        ${TaskFragment}\n      `,\n      variables: {\n        id: projectId,\n        sortings: [{ name: 'startDate' }]\n      }\n    })\n\n    this.project = response.data?.project\n    this.tasks = response.data?.project.rootTasks\n\n    if (this.project) {\n      this.fromDate = this.project.startDate || '2024-01-01' /* TODO default: start date of this year - 3 */\n      this.toDate = this.project.endDate || '2024-12-31' /* TODO defaule: end date of this year + 3 */\n    }\n\n    console.log('init project : ', this.project)\n  }\n\n  onChangePeriodRange() {\n    this.fromDate = this.inputStartDate.value\n    this.toDate = this.inputEndDate.value\n  }\n}\n"]}

package/dist-client/pages/project/project-setting-list.js

@@ -98,8 +98,8 @@ let ProjectSettingList = class ProjectSettingList extends ScopedElementsMixin(Pa
         var _a, _b;
         const response = await client.query({
             query: gql `
-        query Projects($projectName: String!) {
-          projects(projectName: $projectName) {
+        query Projects($filters: [Filter!]) {
+          projects(filters: $filters) {
             items {
               id
               name
@@ -120,7 +120,15 @@ let ProjectSettingList = class ProjectSettingList extends ScopedElementsMixin(Pa
         }
       `,
             variables: {
-                projectName: this.projectName || ''
+                filters: this.projectName
+                    ? [
+                        {
+                            name: 'name',
+                            operator: 'search',
+                            value: `%${this.projectName}%`
+                        }
+                    ]
+                    : []
             }
         });
         this.projectList = ((_a = response.data.projects) === null || _a === void 0 ? void 0 : _a.items) || [];