@dssp/supervision 0.0.27 → 0.0.28

package/client/bootstrap.ts

@@ -1,8 +1 @@
-import { store } from '@operato/shell'
-import supervision from './reducers/main'
-
-export default function bootstrap() {
-  store.addReducers({
-    supervision
-  })
-}
+export default function bootstrap() {}

package/client/index.ts

@@ -1 +0,0 @@
-export * from './actions/main'

package/client/pages/building-inspection/building-inspection-detail-drawing.ts

@@ -1,16 +1,23 @@
 import '@material/web/icon/icon.js'
-import { CommonGristStyles, ScrollbarStyles } from '@operato/styles'
-import { PageView } from '@operato/shell'
-import { css, html } from 'lit'
-import { PageLifecycle } from '@operato/shell/dist/src/app/pages/page-view'
+import '@operato/image-marker/ox-image-marker.js'
+import '@operato/image-marker/ox-image-marker-view.js'
+
+import gql from 'graphql-tag'
+import { css, html, PropertyValues } from 'lit'
 import { customElement, query, state } from 'lit/decorators.js'
+import { consume } from '@lit/context'
 import { ScopedElementsMixin } from '@open-wc/scoped-elements'
+
+import { PageView } from '@operato/shell'
+import { CommonGristStyles, ScrollbarStyles } from '@operato/styles'
+import { PageLifecycle } from '@operato/shell/dist/src/app/pages/page-view'
 import { client } from '@operato/graphql'
 import { notify } from '@operato/layout'
-import gql from 'graphql-tag'
+import { ImageProvider, Shape } from '@operato/image-marker'
+
+import { DrawingImageProvider } from '@dssp/drawing/dist-client/drawing-management/drawing-image-provider.js'
+
 import './component/building-inspection-detail-header'
-import '@operato/image-marker/ox-image-marker.js'
-import '@operato/image-marker/ox-image-marker-view.js'
 import { BuildingInspectionStatus } from './building-inspection-list'
 
 @customElement('building-inspection-detail-drawing')
@@ -40,12 +47,28 @@ export class BuildingInspectionDetailDrawing extends ScopedElementsMixin(PageVie
           width: 100%;
         }
       }
+
+      dialog ox-image-marker-view {
+        width: 80vw;
+        height: 80vh;
+      }
     `
   ]
 
   @state() project: any = {}
   @state() buildingInspection: any = {}
   @state() buildingInspectionId: string = ''
+  @state() imageUrl?: string
+  @state() shapes: Shape[] = []
+  @state() linkUrl?: string
+  @state() linkShapes: Shape[] = []
+
+  @state() drawingImageProvider: DrawingImageProvider = new DrawingImageProvider()
+  // @consume({ context: OxUserPreferencesContext, subscribe: true })
+
+  @query('#image-marker') imageMarker!: any
+  @query('#link-viewer') linkViewer!: any
+  @query('dialog') dialog!: HTMLDialogElement
 
   get context() {
     return {
@@ -53,10 +76,34 @@ export class BuildingInspectionDetailDrawing extends ScopedElementsMixin(PageVie
     }
   }
 
-  render() {
-    const imageUrl = this.buildingInspection?.buildingLevel?.mainDrawingImage || '/assets/images/img-drawing-default.png'
-    const shapes = JSON.parse(this.buildingInspection?.drawingMarker || null) || []
+  connectedCallback(): void {
+    super.connectedCallback()
+
+    requestAnimationFrame(() => {
+      this.imageMarker.setImageProvider(this.drawingImageProvider)
+      this.linkViewer.setImageProvider(this.drawingImageProvider)
 
+      this.dialog.addEventListener('click', event => {
+        const rect = this.dialog.getBoundingClientRect()
+        const isInDialog =
+          rect.top <= event.clientY && event.clientY <= rect.bottom && rect.left <= event.clientX && event.clientX <= rect.right
+
+        // 다이아로그 내부를 클릭한 것이 아니면 다이아로그 닫기
+        if (!isInDialog) {
+          this.dialog.close()
+        }
+      })
+    })
+  }
+
+  disconnectedCallback(): void {
+    this.imageMarker?.setImageProvider(null)
+    this.linkViewer?.setImageProvider(null)
+
+    super.disconnectedCallback()
+  }
+
+  render() {
     return html`
       <building-inspection-detail-header
         .buildingInspectionId=${this.buildingInspection?.id}
@@ -66,23 +113,72 @@ export class BuildingInspectionDetailDrawing extends ScopedElementsMixin(PageVie
         .buildingLevelFloor=${this.buildingInspection?.buildingLevel?.floor}
       ></building-inspection-detail-header>
 
-      <div body>
+      <div
+        body
+        @link-clicked=${async (e: CustomEvent) => {
+          this.linkViewer.reset()
+
+          const { link } = e.detail
+          const { id, type, symbol, box, dwgId } = JSON.parse(link)
+          const [x, y, width, height] = box?.split(',').map(Number) || []
+
+          this.linkUrl = dwgId
+          this.linkShapes = [
+            {
+              id: id!,
+              type: 'link',
+              x,
+              y,
+              width,
+              height,
+              link: '{}'
+            }
+          ]
+
+          if (this.dialog) {
+            this.dialog.showModal()
+          }
+        }}
+      >
         ${this.buildingInspection?.status == BuildingInspectionStatus.PASS
-          ? html`<ox-image-marker-view .imageUrl=${imageUrl} .shapes=${shapes}></ox-image-marker-view>`
+          ? html`<ox-image-marker-view
+              id="image-marker"
+              .imageUrl=${this.imageUrl}
+              .shapes=${this.shapes}
+            ></ox-image-marker-view>`
           : html` <ox-image-marker
-              .imageUrl=${imageUrl}
-              .shapes=${shapes}
+              id="image-marker"
+              .imageUrl=${this.imageUrl}
+              .shapes=${this.shapes}
               @shapes-changed=${this.onClickMarkerSave}
               .currentMode=${'view'}
             ></ox-image-marker>`}
       </div>
+
+      <dialog>
+        <ox-image-marker-view id="link-viewer" .imageUrl=${this.linkUrl} .shapes=${this.linkShapes}></ox-image-marker-view>
+      </dialog>
     `
   }
 
+  protected async updated(changes: PropertyValues): Promise<void> {
+    if (changes.has('buildingInspection')) {
+      const dwgId = 'GA-3006' // this.buildingInspection?.buildingLevel?.mainDrawingImage || '/assets/images/img-drawing-default.png'
+
+      const shapes = JSON.parse(this.buildingInspection?.drawingMarker || null) || []
+      const markers = await this.drawingImageProvider.getMarkers(dwgId)
+
+      this.imageUrl = dwgId
+      this.shapes = [...shapes, ...markers]
+    }
+  }
+
   async pageUpdated(changes: any, lifecycle: PageLifecycle) {
     if (this.active) {
       this.buildingInspectionId = lifecycle.resourceId || ''
       await this.initBuildingInspection(this.buildingInspectionId)
+
+      this.imageMarker.reset()
     }
   }
 

package/client/pages/building-inspection/component/building-inspection-detail-header.ts

@@ -4,7 +4,7 @@ import { customElement, property, state } from 'lit/decorators.js'
 import { ButtonContainerStyles, ScrollbarStyles } from '@operato/styles'
 
 @customElement('building-inspection-detail-header')
-class buildingInspectionDetailHeader extends LitElement {
+class BuildingInspectionDetailHeader extends LitElement {
   static styles = [
     ButtonContainerStyles,
     ScrollbarStyles,

package/dist-client/bootstrap.js

@@ -1,8 +1,2 @@
-import { store } from '@operato/shell';
-import supervision from './reducers/main';
-export default function bootstrap() {
-    store.addReducers({
-        supervision
-    });
-}
+export default function bootstrap() { }
 //# sourceMappingURL=bootstrap.js.map

package/dist-client/bootstrap.js.map

@@ -1 +1 @@
-{"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../client/bootstrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AACtC,OAAO,WAAW,MAAM,iBAAiB,CAAA;AAEzC,MAAM,CAAC,OAAO,UAAU,SAAS;IAC/B,KAAK,CAAC,WAAW,CAAC;QAChB,WAAW;KACZ,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import { store } from '@operato/shell'\nimport supervision from './reducers/main'\n\nexport default function bootstrap() {\n  store.addReducers({\n    supervision\n  })\n}\n"]}
+{"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../client/bootstrap.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,UAAU,SAAS,KAAI,CAAC","sourcesContent":["export default function bootstrap() {}\n"]}

package/dist-client/index.d.ts

@@ -1 +0,0 @@
-export * from './actions/main';

package/dist-client/index.js

@@ -1,2 +1,2 @@
-export * from './actions/main';
+"use strict";
 //# sourceMappingURL=index.js.map

package/dist-client/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../client/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA","sourcesContent":["export * from './actions/main'"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../client/index.ts"],"names":[],"mappings":"","sourcesContent":[""]}

package/dist-client/pages/building-inspection/building-inspection-detail-drawing.d.ts

@@ -1,19 +1,33 @@
 import '@material/web/icon/icon.js';
+import '@operato/image-marker/ox-image-marker.js';
+import '@operato/image-marker/ox-image-marker-view.js';
+import { PropertyValues } from 'lit';
 import { PageView } from '@operato/shell';
 import { PageLifecycle } from '@operato/shell/dist/src/app/pages/page-view';
+import { Shape } from '@operato/image-marker';
+import { DrawingImageProvider } from '@dssp/drawing/dist-client/drawing-management/drawing-image-provider.js';
 import './component/building-inspection-detail-header';
-import '@operato/image-marker/ox-image-marker.js';
-import '@operato/image-marker/ox-image-marker-view.js';
 declare const BuildingInspectionDetailDrawing_base: typeof PageView & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/types/src/types").ScopedElementsHost>;
 export declare class BuildingInspectionDetailDrawing extends BuildingInspectionDetailDrawing_base {
     static styles: import("lit").CSSResult[];
     project: any;
     buildingInspection: any;
     buildingInspectionId: string;
+    imageUrl?: string;
+    shapes: Shape[];
+    linkUrl?: string;
+    linkShapes: Shape[];
+    drawingImageProvider: DrawingImageProvider;
+    imageMarker: any;
+    linkViewer: any;
+    dialog: HTMLDialogElement;
     get context(): {
         title: string;
     };
+    connectedCallback(): void;
+    disconnectedCallback(): void;
     render(): import("lit-html").TemplateResult<1>;
+    protected updated(changes: PropertyValues): Promise<void>;
     pageUpdated(changes: any, lifecycle: PageLifecycle): Promise<void>;
     initBuildingInspection(buildingInspectionId?: string): Promise<void>;
     private _getProjectByBuildingComplexId;

package/dist-client/pages/building-inspection/building-inspection-detail-drawing.js

@@ -1,16 +1,17 @@
 import { __decorate, __metadata } from "tslib";
 import '@material/web/icon/icon.js';
-import { CommonGristStyles, ScrollbarStyles } from '@operato/styles';
-import { PageView } from '@operato/shell';
+import '@operato/image-marker/ox-image-marker.js';
+import '@operato/image-marker/ox-image-marker-view.js';
+import gql from 'graphql-tag';
 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 { PageView } from '@operato/shell';
+import { CommonGristStyles, ScrollbarStyles } from '@operato/styles';
 import { client } from '@operato/graphql';
 import { notify } from '@operato/layout';
-import gql from 'graphql-tag';
+import { DrawingImageProvider } from '@dssp/drawing/dist-client/drawing-management/drawing-image-provider.js';
 import './component/building-inspection-detail-header';
-import '@operato/image-marker/ox-image-marker.js';
-import '@operato/image-marker/ox-image-marker-view.js';
 import { BuildingInspectionStatus } from './building-inspection-list';
 let BuildingInspectionDetailDrawing = class BuildingInspectionDetailDrawing extends ScopedElementsMixin(PageView) {
     constructor() {
@@ -18,41 +19,106 @@ let BuildingInspectionDetailDrawing = class BuildingInspectionDetailDrawing exte
         this.project = {};
         this.buildingInspection = {};
         this.buildingInspectionId = '';
+        this.shapes = [];
+        this.linkShapes = [];
+        this.drawingImageProvider = new DrawingImageProvider();
     }
     get context() {
         return {
             title: '검측 관리 상세 - 검측 도면'
         };
     }
+    connectedCallback() {
+        super.connectedCallback();
+        requestAnimationFrame(() => {
+            this.imageMarker.setImageProvider(this.drawingImageProvider);
+            this.linkViewer.setImageProvider(this.drawingImageProvider);
+            this.dialog.addEventListener('click', event => {
+                const rect = this.dialog.getBoundingClientRect();
+                const isInDialog = rect.top <= event.clientY && event.clientY <= rect.bottom && rect.left <= event.clientX && event.clientX <= rect.right;
+                // 다이아로그 내부를 클릭한 것이 아니면 다이아로그 닫기
+                if (!isInDialog) {
+                    this.dialog.close();
+                }
+            });
+        });
+    }
+    disconnectedCallback() {
+        var _a, _b;
+        (_a = this.imageMarker) === null || _a === void 0 ? void 0 : _a.setImageProvider(null);
+        (_b = this.linkViewer) === null || _b === void 0 ? void 0 : _b.setImageProvider(null);
+        super.disconnectedCallback();
+    }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-        const imageUrl = ((_b = (_a = this.buildingInspection) === null || _a === void 0 ? void 0 : _a.buildingLevel) === null || _b === void 0 ? void 0 : _b.mainDrawingImage) || '/assets/images/img-drawing-default.png';
-        const shapes = JSON.parse(((_c = this.buildingInspection) === null || _c === void 0 ? void 0 : _c.drawingMarker) || null) || [];
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
         return html `
       <building-inspection-detail-header
-        .buildingInspectionId=${(_d = this.buildingInspection) === null || _d === void 0 ? void 0 : _d.id}
-        .buildingLevelId=${(_f = (_e = this.buildingInspection) === null || _e === void 0 ? void 0 : _e.buildingLevel) === null || _f === void 0 ? void 0 : _f.id}
+        .buildingInspectionId=${(_a = this.buildingInspection) === null || _a === void 0 ? void 0 : _a.id}
+        .buildingLevelId=${(_c = (_b = this.buildingInspection) === null || _b === void 0 ? void 0 : _b.buildingLevel) === null || _c === void 0 ? void 0 : _c.id}
         .projectName=${this.project.name}
-        .buildingName=${(_j = (_h = (_g = this.buildingInspection) === null || _g === void 0 ? void 0 : _g.buildingLevel) === null || _h === void 0 ? void 0 : _h.building) === null || _j === void 0 ? void 0 : _j.name}
-        .buildingLevelFloor=${(_l = (_k = this.buildingInspection) === null || _k === void 0 ? void 0 : _k.buildingLevel) === null || _l === void 0 ? void 0 : _l.floor}
+        .buildingName=${(_f = (_e = (_d = this.buildingInspection) === null || _d === void 0 ? void 0 : _d.buildingLevel) === null || _e === void 0 ? void 0 : _e.building) === null || _f === void 0 ? void 0 : _f.name}
+        .buildingLevelFloor=${(_h = (_g = this.buildingInspection) === null || _g === void 0 ? void 0 : _g.buildingLevel) === null || _h === void 0 ? void 0 : _h.floor}
       ></building-inspection-detail-header>
 
-      <div body>
-        ${((_m = this.buildingInspection) === null || _m === void 0 ? void 0 : _m.status) == BuildingInspectionStatus.PASS
-            ? html `<ox-image-marker-view .imageUrl=${imageUrl} .shapes=${shapes}></ox-image-marker-view>`
+      <div
+        body
+        @link-clicked=${async (e) => {
+            this.linkViewer.reset();
+            const { link } = e.detail;
+            const { id, type, symbol, box, dwgId } = JSON.parse(link);
+            const [x, y, width, height] = (box === null || box === void 0 ? void 0 : box.split(',').map(Number)) || [];
+            this.linkUrl = dwgId;
+            this.linkShapes = [
+                {
+                    id: id,
+                    type: 'link',
+                    x,
+                    y,
+                    width,
+                    height,
+                    link: '{}'
+                }
+            ];
+            if (this.dialog) {
+                this.dialog.showModal();
+            }
+        }}
+      >
+        ${((_j = this.buildingInspection) === null || _j === void 0 ? void 0 : _j.status) == BuildingInspectionStatus.PASS
+            ? html `<ox-image-marker-view
+              id="image-marker"
+              .imageUrl=${this.imageUrl}
+              .shapes=${this.shapes}
+            ></ox-image-marker-view>`
             : html ` <ox-image-marker
-              .imageUrl=${imageUrl}
-              .shapes=${shapes}
+              id="image-marker"
+              .imageUrl=${this.imageUrl}
+              .shapes=${this.shapes}
               @shapes-changed=${this.onClickMarkerSave}
               .currentMode=${'view'}
             ></ox-image-marker>`}
       </div>
+
+      <dialog>
+        <ox-image-marker-view id="link-viewer" .imageUrl=${this.linkUrl} .shapes=${this.linkShapes}></ox-image-marker-view>
+      </dialog>
     `;
     }
+    async updated(changes) {
+        var _a;
+        if (changes.has('buildingInspection')) {
+            const dwgId = 'GA-3006'; // this.buildingInspection?.buildingLevel?.mainDrawingImage || '/assets/images/img-drawing-default.png'
+            const shapes = JSON.parse(((_a = this.buildingInspection) === null || _a === void 0 ? void 0 : _a.drawingMarker) || null) || [];
+            const markers = await this.drawingImageProvider.getMarkers(dwgId);
+            this.imageUrl = dwgId;
+            this.shapes = [...shapes, ...markers];
+        }
+    }
     async pageUpdated(changes, lifecycle) {
         if (this.active) {
             this.buildingInspectionId = lifecycle.resourceId || '';
             await this.initBuildingInspection(this.buildingInspectionId);
+            this.imageMarker.reset();
         }
     }
     async initBuildingInspection(buildingInspectionId = '') {
@@ -159,6 +225,11 @@ BuildingInspectionDetailDrawing.styles = [
           width: 100%;
         }
       }
+
+      dialog ox-image-marker-view {
+        width: 80vw;
+        height: 80vh;
+      }
     `
 ];
 __decorate([
@@ -173,6 +244,38 @@ __decorate([
     state(),
     __metadata("design:type", String)
 ], BuildingInspectionDetailDrawing.prototype, "buildingInspectionId", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", String)
+], BuildingInspectionDetailDrawing.prototype, "imageUrl", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], BuildingInspectionDetailDrawing.prototype, "shapes", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", String)
+], BuildingInspectionDetailDrawing.prototype, "linkUrl", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], BuildingInspectionDetailDrawing.prototype, "linkShapes", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", DrawingImageProvider)
+], BuildingInspectionDetailDrawing.prototype, "drawingImageProvider", void 0);
+__decorate([
+    query('#image-marker'),
+    __metadata("design:type", Object)
+], BuildingInspectionDetailDrawing.prototype, "imageMarker", void 0);
+__decorate([
+    query('#link-viewer'),
+    __metadata("design:type", Object)
+], BuildingInspectionDetailDrawing.prototype, "linkViewer", void 0);
+__decorate([
+    query('dialog'),
+    __metadata("design:type", HTMLDialogElement)
+], BuildingInspectionDetailDrawing.prototype, "dialog", void 0);
 BuildingInspectionDetailDrawing = __decorate([
     customElement('building-inspection-detail-drawing')
 ], BuildingInspectionDetailDrawing);

package/dist-client/pages/building-inspection/building-inspection-detail-drawing.js.map

@@ -1 +1 @@
-{"version":3,"file":"building-inspection-detail-drawing.js","sourceRoot":"","sources":["../../../client/pages/building-inspection/building-inspection-detail-drawing.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport { CommonGristStyles, ScrollbarStyles } from '@operato/styles'\nimport { PageView } from '@operato/shell'\nimport { css, html } from 'lit'\nimport { PageLifecycle } from '@operato/shell/dist/src/app/pages/page-view'\nimport { customElement, query, state } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { client } from '@operato/graphql'\nimport { notify } from '@operato/layout'\nimport gql from 'graphql-tag'\nimport './component/building-inspection-detail-header'\nimport '@operato/image-marker/ox-image-marker.js'\nimport '@operato/image-marker/ox-image-marker-view.js'\nimport { BuildingInspectionStatus } from './building-inspection-list'\n\n@customElement('building-inspection-detail-drawing')\nexport class BuildingInspectionDetailDrawing extends ScopedElementsMixin(PageView) {\n  static styles = [\n    ScrollbarStyles,\n    CommonGristStyles,\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      div[body] {\n        display: flex;\n        justify-content: center;\n\n        ox-image-marker-view {\n          width: 100%;\n        }\n      }\n    `\n  ]\n\n  @state() project: any = {}\n  @state() buildingInspection: any = {}\n  @state() buildingInspectionId: string = ''\n\n  get context() {\n    return {\n      title: '검측 관리 상세 - 검측 도면'\n    }\n  }\n\n  render() {\n    const imageUrl = this.buildingInspection?.buildingLevel?.mainDrawingImage || '/assets/images/img-drawing-default.png'\n    const shapes = JSON.parse(this.buildingInspection?.drawingMarker || null) || []\n\n    return html`\n      <building-inspection-detail-header\n        .buildingInspectionId=${this.buildingInspection?.id}\n        .buildingLevelId=${this.buildingInspection?.buildingLevel?.id}\n        .projectName=${this.project.name}\n        .buildingName=${this.buildingInspection?.buildingLevel?.building?.name}\n        .buildingLevelFloor=${this.buildingInspection?.buildingLevel?.floor}\n      ></building-inspection-detail-header>\n\n      <div body>\n        ${this.buildingInspection?.status == BuildingInspectionStatus.PASS\n          ? html`<ox-image-marker-view .imageUrl=${imageUrl} .shapes=${shapes}></ox-image-marker-view>`\n          : html` <ox-image-marker\n              .imageUrl=${imageUrl}\n              .shapes=${shapes}\n              @shapes-changed=${this.onClickMarkerSave}\n              .currentMode=${'view'}\n            ></ox-image-marker>`}\n      </div>\n    `\n  }\n\n  async pageUpdated(changes: any, lifecycle: PageLifecycle) {\n    if (this.active) {\n      this.buildingInspectionId = lifecycle.resourceId || ''\n      await this.initBuildingInspection(this.buildingInspectionId)\n    }\n  }\n\n  async initBuildingInspection(buildingInspectionId: string = '') {\n    const response = await client.query({\n      query: gql`\n        query BuildingInspection($buildingInspectionId: String!) {\n          buildingInspection(id: $buildingInspectionId) {\n            id\n            status\n            requestDate\n            drawingMarker\n            buildingLevel {\n              id\n              floor\n              mainDrawing {\n                id\n                name\n                fullpath\n              }\n              mainDrawingImage\n              building {\n                id\n                name\n                buildingComplex {\n                  id\n                }\n              }\n            }\n          }\n        }\n      `,\n      variables: {\n        buildingInspectionId\n      }\n    })\n\n    if (response.errors) return\n\n    this.buildingInspection = response.data.buildingInspection\n\n    await this._getProjectByBuildingComplexId(this.buildingInspection?.buildingLevel?.building?.buildingComplex?.id)\n  }\n\n  private async _getProjectByBuildingComplexId(buildingComplexId) {\n    const response = await client.query({\n      query: gql`\n        query ProjectByBuildingComplexId($buildingComplexId: String!) {\n          project: projectByBuildingComplexId(buildingComplexId: $buildingComplexId) {\n            id\n            name\n          }\n        }\n      `,\n      variables: {\n        buildingComplexId\n      }\n    })\n\n    if (response.errors) return\n\n    this.project = response.data.project\n  }\n\n  private async onClickMarkerSave(e) {\n    const response = await client.query({\n      query: gql`\n        mutation UpdateBuildingInspection($patch: UpdateBuildingInspectionDrawingMarker!) {\n          updateBuildingInspection(patch: $patch) {\n            id\n            drawingMarker\n          }\n        }\n      `,\n      variables: {\n        patch: {\n          id: this.buildingInspectionId,\n          drawingMarker: JSON.stringify(e.detail)\n        }\n      }\n    })\n\n    if (response.errors) return\n\n    notify({ message: '저장되었습니다.' })\n  }\n}\n"]}
+{"version":3,"file":"building-inspection-detail-drawing.js","sourceRoot":"","sources":["../../../client/pages/building-inspection/building-inspection-detail-drawing.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/image-marker/ox-image-marker.js'\nimport '@operato/image-marker/ox-image-marker-view.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, PropertyValues } from 'lit'\nimport { customElement, query, state } from 'lit/decorators.js'\nimport { consume } from '@lit/context'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\n\nimport { PageView } from '@operato/shell'\nimport { CommonGristStyles, ScrollbarStyles } from '@operato/styles'\nimport { PageLifecycle } from '@operato/shell/dist/src/app/pages/page-view'\nimport { client } from '@operato/graphql'\nimport { notify } from '@operato/layout'\nimport { ImageProvider, Shape } from '@operato/image-marker'\n\nimport { DrawingImageProvider } from '@dssp/drawing/dist-client/drawing-management/drawing-image-provider.js'\n\nimport './component/building-inspection-detail-header'\nimport { BuildingInspectionStatus } from './building-inspection-list'\n\n@customElement('building-inspection-detail-drawing')\nexport class BuildingInspectionDetailDrawing extends ScopedElementsMixin(PageView) {\n  static styles = [\n    ScrollbarStyles,\n    CommonGristStyles,\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      div[body] {\n        display: flex;\n        justify-content: center;\n\n        ox-image-marker-view {\n          width: 100%;\n        }\n      }\n\n      dialog ox-image-marker-view {\n        width: 80vw;\n        height: 80vh;\n      }\n    `\n  ]\n\n  @state() project: any = {}\n  @state() buildingInspection: any = {}\n  @state() buildingInspectionId: string = ''\n  @state() imageUrl?: string\n  @state() shapes: Shape[] = []\n  @state() linkUrl?: string\n  @state() linkShapes: Shape[] = []\n\n  @state() drawingImageProvider: DrawingImageProvider = new DrawingImageProvider()\n  // @consume({ context: OxUserPreferencesContext, subscribe: true })\n\n  @query('#image-marker') imageMarker!: any\n  @query('#link-viewer') linkViewer!: any\n  @query('dialog') dialog!: HTMLDialogElement\n\n  get context() {\n    return {\n      title: '검측 관리 상세 - 검측 도면'\n    }\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback()\n\n    requestAnimationFrame(() => {\n      this.imageMarker.setImageProvider(this.drawingImageProvider)\n      this.linkViewer.setImageProvider(this.drawingImageProvider)\n\n      this.dialog.addEventListener('click', event => {\n        const rect = this.dialog.getBoundingClientRect()\n        const isInDialog =\n          rect.top <= event.clientY && event.clientY <= rect.bottom && rect.left <= event.clientX && event.clientX <= rect.right\n\n        // 다이아로그 내부를 클릭한 것이 아니면 다이아로그 닫기\n        if (!isInDialog) {\n          this.dialog.close()\n        }\n      })\n    })\n  }\n\n  disconnectedCallback(): void {\n    this.imageMarker?.setImageProvider(null)\n    this.linkViewer?.setImageProvider(null)\n\n    super.disconnectedCallback()\n  }\n\n  render() {\n    return html`\n      <building-inspection-detail-header\n        .buildingInspectionId=${this.buildingInspection?.id}\n        .buildingLevelId=${this.buildingInspection?.buildingLevel?.id}\n        .projectName=${this.project.name}\n        .buildingName=${this.buildingInspection?.buildingLevel?.building?.name}\n        .buildingLevelFloor=${this.buildingInspection?.buildingLevel?.floor}\n      ></building-inspection-detail-header>\n\n      <div\n        body\n        @link-clicked=${async (e: CustomEvent) => {\n          this.linkViewer.reset()\n\n          const { link } = e.detail\n          const { id, type, symbol, box, dwgId } = JSON.parse(link)\n          const [x, y, width, height] = box?.split(',').map(Number) || []\n\n          this.linkUrl = dwgId\n          this.linkShapes = [\n            {\n              id: id!,\n              type: 'link',\n              x,\n              y,\n              width,\n              height,\n              link: '{}'\n            }\n          ]\n\n          if (this.dialog) {\n            this.dialog.showModal()\n          }\n        }}\n      >\n        ${this.buildingInspection?.status == BuildingInspectionStatus.PASS\n          ? html`<ox-image-marker-view\n              id=\"image-marker\"\n              .imageUrl=${this.imageUrl}\n              .shapes=${this.shapes}\n            ></ox-image-marker-view>`\n          : html` <ox-image-marker\n              id=\"image-marker\"\n              .imageUrl=${this.imageUrl}\n              .shapes=${this.shapes}\n              @shapes-changed=${this.onClickMarkerSave}\n              .currentMode=${'view'}\n            ></ox-image-marker>`}\n      </div>\n\n      <dialog>\n        <ox-image-marker-view id=\"link-viewer\" .imageUrl=${this.linkUrl} .shapes=${this.linkShapes}></ox-image-marker-view>\n      </dialog>\n    `\n  }\n\n  protected async updated(changes: PropertyValues): Promise<void> {\n    if (changes.has('buildingInspection')) {\n      const dwgId = 'GA-3006' // this.buildingInspection?.buildingLevel?.mainDrawingImage || '/assets/images/img-drawing-default.png'\n\n      const shapes = JSON.parse(this.buildingInspection?.drawingMarker || null) || []\n      const markers = await this.drawingImageProvider.getMarkers(dwgId)\n\n      this.imageUrl = dwgId\n      this.shapes = [...shapes, ...markers]\n    }\n  }\n\n  async pageUpdated(changes: any, lifecycle: PageLifecycle) {\n    if (this.active) {\n      this.buildingInspectionId = lifecycle.resourceId || ''\n      await this.initBuildingInspection(this.buildingInspectionId)\n\n      this.imageMarker.reset()\n    }\n  }\n\n  async initBuildingInspection(buildingInspectionId: string = '') {\n    const response = await client.query({\n      query: gql`\n        query BuildingInspection($buildingInspectionId: String!) {\n          buildingInspection(id: $buildingInspectionId) {\n            id\n            status\n            requestDate\n            drawingMarker\n            buildingLevel {\n              id\n              floor\n              mainDrawing {\n                id\n                name\n                fullpath\n              }\n              mainDrawingImage\n              building {\n                id\n                name\n                buildingComplex {\n                  id\n                }\n              }\n            }\n          }\n        }\n      `,\n      variables: {\n        buildingInspectionId\n      }\n    })\n\n    if (response.errors) return\n\n    this.buildingInspection = response.data.buildingInspection\n\n    await this._getProjectByBuildingComplexId(this.buildingInspection?.buildingLevel?.building?.buildingComplex?.id)\n  }\n\n  private async _getProjectByBuildingComplexId(buildingComplexId) {\n    const response = await client.query({\n      query: gql`\n        query ProjectByBuildingComplexId($buildingComplexId: String!) {\n          project: projectByBuildingComplexId(buildingComplexId: $buildingComplexId) {\n            id\n            name\n          }\n        }\n      `,\n      variables: {\n        buildingComplexId\n      }\n    })\n\n    if (response.errors) return\n\n    this.project = response.data.project\n  }\n\n  private async onClickMarkerSave(e) {\n    const response = await client.query({\n      query: gql`\n        mutation UpdateBuildingInspection($patch: UpdateBuildingInspectionDrawingMarker!) {\n          updateBuildingInspection(patch: $patch) {\n            id\n            drawingMarker\n          }\n        }\n      `,\n      variables: {\n        patch: {\n          id: this.buildingInspectionId,\n          drawingMarker: JSON.stringify(e.detail)\n        }\n      }\n    })\n\n    if (response.errors) return\n\n    notify({ message: '저장되었습니다.' })\n  }\n}\n"]}

package/dist-client/pages/building-inspection/component/building-inspection-detail-header.js

@@ -3,7 +3,7 @@ import '@material/web/icon/icon.js';
 import { css, html, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { ButtonContainerStyles, ScrollbarStyles } from '@operato/styles';
-let buildingInspectionDetailHeader = class buildingInspectionDetailHeader extends LitElement {
+let BuildingInspectionDetailHeader = class BuildingInspectionDetailHeader extends LitElement {
     constructor() {
         super(...arguments);
         this.buildingInspectionId = '';
@@ -55,7 +55,7 @@ let buildingInspectionDetailHeader = class buildingInspectionDetailHeader extend
     `;
     }
 };
-buildingInspectionDetailHeader.styles = [
+BuildingInspectionDetailHeader.styles = [
     ButtonContainerStyles,
     ScrollbarStyles,
     css `
@@ -113,24 +113,24 @@ buildingInspectionDetailHeader.styles = [
 __decorate([
     property({ type: String }),
     __metadata("design:type", String)
-], buildingInspectionDetailHeader.prototype, "buildingInspectionId", void 0);
+], BuildingInspectionDetailHeader.prototype, "buildingInspectionId", void 0);
 __decorate([
     property({ type: String }),
     __metadata("design:type", String)
-], buildingInspectionDetailHeader.prototype, "buildingLevelId", void 0);
+], BuildingInspectionDetailHeader.prototype, "buildingLevelId", void 0);
 __decorate([
     property({ type: String }),
     __metadata("design:type", String)
-], buildingInspectionDetailHeader.prototype, "projectName", void 0);
+], BuildingInspectionDetailHeader.prototype, "projectName", void 0);
 __decorate([
     property({ type: String }),
     __metadata("design:type", String)
-], buildingInspectionDetailHeader.prototype, "buildingName", void 0);
+], BuildingInspectionDetailHeader.prototype, "buildingName", void 0);
 __decorate([
     property({ type: String }),
     __metadata("design:type", String)
-], buildingInspectionDetailHeader.prototype, "buildingLevelFloor", void 0);
-buildingInspectionDetailHeader = __decorate([
+], BuildingInspectionDetailHeader.prototype, "buildingLevelFloor", void 0);
+BuildingInspectionDetailHeader = __decorate([
     customElement('building-inspection-detail-header')
-], buildingInspectionDetailHeader);
+], BuildingInspectionDetailHeader);
 //# sourceMappingURL=building-inspection-detail-header.js.map

package/dist-client/pages/building-inspection/component/building-inspection-detail-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"building-inspection-detail-header.js","sourceRoot":"","sources":["../../../../client/pages/building-inspection/component/building-inspection-detail-header.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,qBAAqB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAGxE,IAAM,8BAA8B,GAApC,MAAM,8BAA+B,SAAQ,UAAU;IAAvD;;QAyD8B,yBAAoB,GAAW,EAAE,CAAA;QACjC,oBAAe,GAAW,EAAE,CAAA;QAC5B,gBAAW,GAAW,EAAE,CAAA;QACxB,iBAAY,GAAW,EAAE,CAAA;QACzB,uBAAkB,GAAW,EAAE,CAAA;IA6C7D,CAAC;IA3CC,MAAM;QACJ,MAAM,IAAI,GAAG,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAA;QAErC,OAAO,IAAI,CAAA;;cAED,IAAI,CAAC,WAAW,IAAI,EAAE,IAAI,IAAI,CAAC,YAAY,IAAI,EAAE,IAAI,IAAI,CAAC,kBAAkB,IAAI,EAAE;;;wBAGxE,IAAI,CAAC,QAAQ,CAAC,2BAA2B,CAAC;mBAC/C,4BAA4B,IAAI,CAAC,eAAe,EAAE;;;;;wBAK7C,IAAI,CAAC,QAAQ,CAAC,qCAAqC,CAAC;mBACzD,sCAAsC,IAAI,CAAC,oBAAoB,EAAE;;;;;wBAK5D,IAAI,CAAC,QAAQ,CAAC,uCAAuC,CAAC;mBAC3D,wCAAwC,IAAI,CAAC,oBAAoB,EAAE;;;;;wBAK9D,IAAI,CAAC,QAAQ,CAAC,mCAAmC,CAAC;mBACvD,oCAAoC,IAAI,CAAC,oBAAoB,EAAE;;;;;;wBAM1D,IAAI,CAAC,QAAQ,CAAC,qCAAqC,CAAC;mBACzD,sCAAsC,IAAI,CAAC,oBAAoB,EAAE;;;;;;;KAO/E,CAAA;IACH,CAAC;;AAxGM,qCAAM,GAAG;IACd,qBAAqB;IACrB,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkDF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;4EAAkC;AAC7D;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;uEAA6B;AACxD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;mEAAyB;AACpD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;oEAA0B;AACrD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;0EAAgC;AA7DvD,8BAA8B;IADnC,aAAa,CAAC,mCAAmC,CAAC;GAC7C,8BAA8B,CA0GnC","sourcesContent":["import '@material/web/icon/icon.js'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { ButtonContainerStyles, ScrollbarStyles } from '@operato/styles'\n\n@customElement('building-inspection-detail-header')\nclass buildingInspectionDetailHeader extends LitElement {\n  static styles = [\n    ButtonContainerStyles,\n    ScrollbarStyles,\n    css`\n      md-filled-button {\n        --md-filled-button-container-color: #0595e5;\n        --md-filled-button-container-height: 30px;\n        --md-filled-button-trailing-space: 15px;\n        --md-filled-button-leading-space: 15px;\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\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\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  @property({ type: String }) buildingInspectionId: string = ''\n  @property({ type: String }) buildingLevelId: string = ''\n  @property({ type: String }) projectName: string = ''\n  @property({ type: String }) buildingName: string = ''\n  @property({ type: String }) buildingLevelFloor: string = ''\n\n  render() {\n    const path = window.location.pathname\n\n    return html`\n      <div header>\n        <h2>${this.projectName || ''} ${this.buildingName || ''} ${this.buildingLevelFloor || ''}층</h2>\n        <div button-container>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-list/')}\n            href=${`building-inspection-list/${this.buildingLevelId}`}\n          >\n            <md-icon slot=\"icon\">assignment</md-icon>검측 리스트\n          </md-elevated-button>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-detail-drawing/')}\n            href=${`building-inspection-detail-drawing/${this.buildingInspectionId}`}\n          >\n            <md-icon slot=\"icon\">assignment</md-icon>검측도면\n          </md-elevated-button>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-detail-checklist/')}\n            href=${`building-inspection-detail-checklist/${this.buildingInspectionId}`}\n          >\n            <md-icon slot=\"icon\">description</md-icon>검측 체크리스트\n          </md-elevated-button>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-detail-photo/')}\n            href=${`building-inspection-detail-photo/${this.buildingInspectionId}`}\n            disabled\n          >\n            <md-icon slot=\"icon\">description</md-icon>사진촬영\n          </md-elevated-button>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-detail-history/')}\n            href=${`building-inspection-detail-history/${this.buildingInspectionId}`}\n            disabled\n          >\n            <md-icon slot=\"icon\">description</md-icon>감리이력\n          </md-elevated-button>\n        </div>\n      </div>\n    `\n  }\n}\n"]}
+{"version":3,"file":"building-inspection-detail-header.js","sourceRoot":"","sources":["../../../../client/pages/building-inspection/component/building-inspection-detail-header.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,qBAAqB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAGxE,IAAM,8BAA8B,GAApC,MAAM,8BAA+B,SAAQ,UAAU;IAAvD;;QAyD8B,yBAAoB,GAAW,EAAE,CAAA;QACjC,oBAAe,GAAW,EAAE,CAAA;QAC5B,gBAAW,GAAW,EAAE,CAAA;QACxB,iBAAY,GAAW,EAAE,CAAA;QACzB,uBAAkB,GAAW,EAAE,CAAA;IA6C7D,CAAC;IA3CC,MAAM;QACJ,MAAM,IAAI,GAAG,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAA;QAErC,OAAO,IAAI,CAAA;;cAED,IAAI,CAAC,WAAW,IAAI,EAAE,IAAI,IAAI,CAAC,YAAY,IAAI,EAAE,IAAI,IAAI,CAAC,kBAAkB,IAAI,EAAE;;;wBAGxE,IAAI,CAAC,QAAQ,CAAC,2BAA2B,CAAC;mBAC/C,4BAA4B,IAAI,CAAC,eAAe,EAAE;;;;;wBAK7C,IAAI,CAAC,QAAQ,CAAC,qCAAqC,CAAC;mBACzD,sCAAsC,IAAI,CAAC,oBAAoB,EAAE;;;;;wBAK5D,IAAI,CAAC,QAAQ,CAAC,uCAAuC,CAAC;mBAC3D,wCAAwC,IAAI,CAAC,oBAAoB,EAAE;;;;;wBAK9D,IAAI,CAAC,QAAQ,CAAC,mCAAmC,CAAC;mBACvD,oCAAoC,IAAI,CAAC,oBAAoB,EAAE;;;;;;wBAM1D,IAAI,CAAC,QAAQ,CAAC,qCAAqC,CAAC;mBACzD,sCAAsC,IAAI,CAAC,oBAAoB,EAAE;;;;;;;KAO/E,CAAA;IACH,CAAC;;AAxGM,qCAAM,GAAG;IACd,qBAAqB;IACrB,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkDF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;4EAAkC;AAC7D;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;uEAA6B;AACxD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;mEAAyB;AACpD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;oEAA0B;AACrD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;0EAAgC;AA7DvD,8BAA8B;IADnC,aAAa,CAAC,mCAAmC,CAAC;GAC7C,8BAA8B,CA0GnC","sourcesContent":["import '@material/web/icon/icon.js'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { ButtonContainerStyles, ScrollbarStyles } from '@operato/styles'\n\n@customElement('building-inspection-detail-header')\nclass BuildingInspectionDetailHeader extends LitElement {\n  static styles = [\n    ButtonContainerStyles,\n    ScrollbarStyles,\n    css`\n      md-filled-button {\n        --md-filled-button-container-color: #0595e5;\n        --md-filled-button-container-height: 30px;\n        --md-filled-button-trailing-space: 15px;\n        --md-filled-button-leading-space: 15px;\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\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\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  @property({ type: String }) buildingInspectionId: string = ''\n  @property({ type: String }) buildingLevelId: string = ''\n  @property({ type: String }) projectName: string = ''\n  @property({ type: String }) buildingName: string = ''\n  @property({ type: String }) buildingLevelFloor: string = ''\n\n  render() {\n    const path = window.location.pathname\n\n    return html`\n      <div header>\n        <h2>${this.projectName || ''} ${this.buildingName || ''} ${this.buildingLevelFloor || ''}층</h2>\n        <div button-container>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-list/')}\n            href=${`building-inspection-list/${this.buildingLevelId}`}\n          >\n            <md-icon slot=\"icon\">assignment</md-icon>검측 리스트\n          </md-elevated-button>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-detail-drawing/')}\n            href=${`building-inspection-detail-drawing/${this.buildingInspectionId}`}\n          >\n            <md-icon slot=\"icon\">assignment</md-icon>검측도면\n          </md-elevated-button>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-detail-checklist/')}\n            href=${`building-inspection-detail-checklist/${this.buildingInspectionId}`}\n          >\n            <md-icon slot=\"icon\">description</md-icon>검측 체크리스트\n          </md-elevated-button>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-detail-photo/')}\n            href=${`building-inspection-detail-photo/${this.buildingInspectionId}`}\n            disabled\n          >\n            <md-icon slot=\"icon\">description</md-icon>사진촬영\n          </md-elevated-button>\n          <md-elevated-button\n            ?disabled=${path.includes('building-inspection-detail-history/')}\n            href=${`building-inspection-detail-history/${this.buildingInspectionId}`}\n            disabled\n          >\n            <md-icon slot=\"icon\">description</md-icon>감리이력\n          </md-elevated-button>\n        </div>\n      </div>\n    `\n  }\n}\n"]}

package/dist-client/route.d.ts

@@ -1 +1 @@
-export default function route(page: string): "building-inspection-list" | "checklist-template-list" | "checklist-type-management" | "building-inspection-detail-drawing" | "building-inspection-detail-checklist" | undefined;
+export default function route(page: string): "checklist-type-management" | "building-inspection-list" | "checklist-template-list" | "building-inspection-detail-drawing" | "building-inspection-detail-checklist" | undefined;