npm - @dssp/supervision - Versions diffs - 1.0.0-alpha.5 → 1.0.0-alpha.8 - Mend

@dssp/supervision 1.0.0-alpha.5 → 1.0.0-alpha.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/dist-client/pages/building-inspection-grid/component/plan-preview-popup.js ADDED Viewed

@@ -0,0 +1,430 @@
+import { __decorate, __metadata } from "tslib";
+import { css, html, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import { openPopup } from '@operato/layout';
+import { client } from '@operato/graphql';
+import gql from 'graphql-tag';
+let PlanPreviewPopup = class PlanPreviewPopup extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.buildingLevelId = '';
+        this.buildingLevel = {};
+    }
+    async connectedCallback() {
+        super.connectedCallback();
+        await this._loadBuildingLevel();
+    }
+    render() {
+        const { mainDrawing, elevationDrawing, rebarDistributionDrawing, etcDrawings } = this.buildingLevel;
+        // 메인 도면 파일들
+        const mainFiles = [];
+        if (mainDrawing === null || mainDrawing === void 0 ? void 0 : mainDrawing.id) {
+            mainFiles.push(Object.assign(Object.assign({}, mainDrawing), { type: '평면도' }));
+        }
+        if (elevationDrawing === null || elevationDrawing === void 0 ? void 0 : elevationDrawing.id) {
+            mainFiles.push(Object.assign(Object.assign({}, elevationDrawing), { type: '입면도' }));
+        }
+        if (rebarDistributionDrawing === null || rebarDistributionDrawing === void 0 ? void 0 : rebarDistributionDrawing.id) {
+            mainFiles.push(Object.assign(Object.assign({}, rebarDistributionDrawing), { type: '철근배근도' }));
+        }
+        // 기타 도면 파일들
+        const etcFiles = (etcDrawings === null || etcDrawings === void 0 ? void 0 : etcDrawings.map(drawing => (Object.assign(Object.assign({}, drawing), { type: '기타 도면' })))) || [];
+        return html `
+      <div body>
+        <div file-list-container>
+          ${mainFiles.length > 0
+            ? html `
+                <div section-title>주요 도면</div>
+                ${mainFiles.map(file => html `
+                    <div file-item @click=${() => this._openPreview(file)}>
+                      <div file-info>
+                        <md-icon>description</md-icon>
+                        <span file-name>${file.name || ''}</span>
+                        <span file-type>${file.type}</span>
+                      </div>
+                      <md-icon slot="action">visibility</md-icon>
+                    </div>
+                  `)}
+              `
+            : ''}
+          ${etcFiles.length > 0
+            ? html `
+                <div section-title>기타 도면</div>
+                ${etcFiles.map(file => html `
+                    <div file-item @click=${() => this._openPreview(file)}>
+                      <div file-info>
+                        <md-icon>attachment</md-icon>
+                        <span file-name>${file.name || ''}</span>
+                        <span file-type>${file.type}</span>
+                      </div>
+                      <md-icon slot="action">visibility</md-icon>
+                    </div>
+                  `)}
+              `
+            : ''}
+          ${mainFiles.length === 0 && etcFiles.length === 0
+            ? html `
+                <div empty-state>
+                  <md-icon>insert_drive_file</md-icon>
+                  <div>미리보기할 도면 파일이 없습니다.</div>
+                </div>
+              `
+            : ''}
+        </div>
+        <div button-container>
+          <md-outlined-button @click=${this._close}><md-icon slot="icon">cancel</md-icon>닫기</md-outlined-button>
+        </div>
+      </div>
+    `;
+    }
+    async _loadBuildingLevel() {
+        var _a;
+        try {
+            const response = await client.query({
+                query: gql `
+          query BuildingLevel($buildingLevelId: String!) {
+            buildingLevel(id: $buildingLevelId) {
+              id
+              floor
+              building {
+                id
+                name
+              }
+              mainDrawing {
+                id
+                name
+                fullpath
+              }
+              elevationDrawing {
+                id
+                name
+                fullpath
+              }
+              rebarDistributionDrawing {
+                id
+                name
+                fullpath
+              }
+              etcDrawings {
+                id
+                name
+                fullpath
+              }
+            }
+          }
+        `,
+                variables: {
+                    buildingLevelId: this.buildingLevelId
+                }
+            });
+            this.buildingLevel = ((_a = response.data) === null || _a === void 0 ? void 0 : _a.buildingLevel) || {};
+        }
+        catch (error) {
+            console.error('Building level 정보를 불러오는 중 오류 발생:', error);
+        }
+    }
+    _openPreview(file) {
+        if (!file.fullpath) {
+            return;
+        }
+        // 파일 확장자로 타입 판단
+        const fileExtension = file.fullpath.toLowerCase().split('.').pop();
+        const isImage = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg'].includes(fileExtension || '');
+        const isPdf = fileExtension === 'pdf';
+        if (isImage) {
+            this._openImagePreview(file);
+        }
+        else if (isPdf) {
+            this._openPdfPreview(file);
+        }
+        else {
+            // 기타 파일은 다운로드 또는 기본 뷰어
+            this._openGenericPreview(file);
+        }
+    }
+    _openImagePreview(file) {
+        openPopup(html `
+        <div style="display: flex; flex-direction: column;">
+          <div style="flex: 1; overflow: hidden; position: relative; touch-action: none;">
+            <img
+              id="zoomable-image"
+              src="${ifDefined(file.fullpath)}"
+              alt="${ifDefined(file.name)}"
+              style="
+                width: 100%;
+                height: 100%;
+                object-fit: contain;
+                transform-origin: center center;
+                transition: transform 0.1s ease-out;
+                user-select: none;
+                -webkit-user-select: none;
+              "
+              @load=${this._initImageZoom}
+              @error=${(e) => {
+            const target = e.target;
+            target.style.display = 'none';
+            target.parentElement.innerHTML +=
+                '<div style="padding: 40px; text-align: center; color: #666;">이미지를 불러올 수 없습니다.</div>';
+        }}
+            />
+          </div>
+        </div>
+      `, { backdrop: true, size: 'large', title: `[이미지 미리보기] ${file.name} (${file.type})` });
+    }
+    _openPdfPreview(file) {
+        openPopup(html `
+        <div style="display: flex; flex-direction: column;">
+          <div style="flex: 1; overflow: hidden; touch-action: pan-x pan-y;">
+            <iframe
+              src="${file.fullpath}#toolbar=1&navpanes=0&scrollbar=1&zoom=page-fit"
+              style="
+                width: 100%;
+                height: 100%;
+                border: none;
+                touch-action: pan-x pan-y;
+              "
+              @error=${() => {
+            // PDF 로드 실패시 새 탭에서 열기
+            window.open(file.fullpath, '_blank');
+        }}
+            ></iframe>
+          </div>
+        </div>
+      `, { backdrop: true, size: 'large', title: `[PDF 미리보기] ${file.name} (${file.type})` });
+    }
+    // 기타 파일 타입은 새 탭에서 열기
+    _openGenericPreview(file) {
+        window.open(file.fullpath, '_blank');
+    }
+    _close() {
+        history.back();
+    }
+    _initImageZoom(e) {
+        const img = e.target;
+        let scale = 1;
+        let translateX = 0;
+        let translateY = 0;
+        let isDragging = false;
+        let lastTouchDistance = 0;
+        let lastTouchX = 0;
+        let lastTouchY = 0;
+        const updateTransform = () => {
+            img.style.transform = `scale(${scale}) translate(${translateX}px, ${translateY}px)`;
+        };
+        const resetTransform = () => {
+            scale = 1;
+            translateX = 0;
+            translateY = 0;
+            updateTransform();
+        };
+        // 터치 시작
+        img.addEventListener('touchstart', event => {
+            event.preventDefault();
+            if (event.touches.length === 1) {
+                // 단일 터치 - 드래그 시작
+                isDragging = true;
+                lastTouchX = event.touches[0].clientX;
+                lastTouchY = event.touches[0].clientY;
+            }
+            else if (event.touches.length === 2) {
+                // 멀티 터치 - 핀치 줌 시작
+                isDragging = false;
+                const touch1 = event.touches[0];
+                const touch2 = event.touches[1];
+                lastTouchDistance = Math.sqrt(Math.pow(touch2.clientX - touch1.clientX, 2) + Math.pow(touch2.clientY - touch1.clientY, 2));
+            }
+        });
+        // 터치 이동
+        img.addEventListener('touchmove', event => {
+            event.preventDefault();
+            if (event.touches.length === 1 && isDragging && scale > 1) {
+                // 드래그
+                const currentX = event.touches[0].clientX;
+                const currentY = event.touches[0].clientY;
+                const deltaX = currentX - lastTouchX;
+                const deltaY = currentY - lastTouchY;
+                translateX += deltaX / scale;
+                translateY += deltaY / scale;
+                lastTouchX = currentX;
+                lastTouchY = currentY;
+                updateTransform();
+            }
+            else if (event.touches.length === 2) {
+                // 핀치 줌
+                const touch1 = event.touches[0];
+                const touch2 = event.touches[1];
+                const currentDistance = Math.sqrt(Math.pow(touch2.clientX - touch1.clientX, 2) + Math.pow(touch2.clientY - touch1.clientY, 2));
+                if (lastTouchDistance > 0) {
+                    const scaleChange = currentDistance / lastTouchDistance;
+                    const newScale = scale * scaleChange;
+                    // 최소/최대 배율 제한
+                    if (newScale >= 0.5 && newScale <= 5) {
+                        scale = newScale;
+                        updateTransform();
+                    }
+                }
+                lastTouchDistance = currentDistance;
+            }
+        });
+        // 터치 끝
+        img.addEventListener('touchend', event => {
+            event.preventDefault();
+            isDragging = false;
+            if (event.touches.length === 0) {
+                // 모든 터치가 끝났을 때 - 경계 체크 및 보정
+                if (scale < 1) {
+                    resetTransform();
+                }
+            }
+        });
+        // 더블 탭으로 줌 토글
+        let lastTapTime = 0;
+        img.addEventListener('touchend', event => {
+            const currentTime = new Date().getTime();
+            const tapLength = currentTime - lastTapTime;
+            if (tapLength < 500 && tapLength > 0 && event.touches.length === 0) {
+                if (scale === 1) {
+                    scale = 2;
+                    updateTransform();
+                }
+                else {
+                    resetTransform();
+                }
+            }
+            lastTapTime = currentTime;
+        });
+        // 마우스 휠 지원 (데스크톱)
+        img.addEventListener('wheel', event => {
+            event.preventDefault();
+            const delta = event.deltaY > 0 ? 0.9 : 1.1;
+            const newScale = scale * delta;
+            if (newScale >= 0.5 && newScale <= 5) {
+                scale = newScale;
+                updateTransform();
+            }
+        });
+    }
+};
+PlanPreviewPopup.styles = [
+    css `
+      :host {
+        display: flex;
+        flex-direction: column;
+        background-color: #fff;
+        width: 100%;
+        max-height: 80vh;
+      }
+      div[body] {
+        flex: 1;
+        overflow-y: auto;
+        padding: 20px;
+        div[file-list-container] {
+          display: flex;
+          flex-direction: column;
+          gap: 15px;
+          background-color: #f7f7f7;
+          padding: 20px;
+          border-radius: 8px;
+          margin-bottom: 20px;
+          div[file-item] {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            padding: 12px;
+            background-color: #fff;
+            border-radius: 6px;
+            border: 1px solid #ddd;
+            cursor: pointer;
+            transition: all 0.2s ease;
+            &:hover {
+              background-color: #e3f2fd;
+              border-color: #2196f3;
+              transform: translateY(-1px);
+              box-shadow: 0 2px 8px rgba(33, 150, 243, 0.15);
+            }
+            div[file-info] {
+              flex: 1;
+              display: flex;
+              align-items: center;
+              gap: 10px;
+              md-icon {
+                --md-icon-size: 24px;
+                color: #666;
+              }
+              span[file-name] {
+                font-size: 14px;
+                font-weight: 500;
+                color: #333;
+              }
+              span[file-type] {
+                font-size: 12px;
+                color: #666;
+                background-color: #f0f0f0;
+                padding: 2px 6px;
+                border-radius: 4px;
+              }
+            }
+            md-icon[slot='action'] {
+              --md-icon-size: 20px;
+              color: #2196f3;
+              opacity: 0.7;
+            }
+          }
+          div[section-title] {
+            font-size: 16px;
+            font-weight: 600;
+            color: #333;
+            margin-top: 10px;
+            margin-bottom: 5px;
+            border-bottom: 2px solid #ddd;
+            padding-bottom: 5px;
+          }
+        }
+        div[empty-state] {
+          text-align: center;
+          color: #666;
+          padding: 40px;
+          md-icon {
+            --md-icon-size: 48px;
+            color: #ccc;
+            margin-bottom: 16px;
+          }
+        }
+        div[button-container] {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          gap: 10px;
+          margin-top: 20px;
+        }
+      }
+    `
+];
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], PlanPreviewPopup.prototype, "buildingLevelId", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], PlanPreviewPopup.prototype, "buildingLevel", void 0);
+PlanPreviewPopup = __decorate([
+    customElement('plan-preview-popup')
+], PlanPreviewPopup);
+export { PlanPreviewPopup };
+//# sourceMappingURL=plan-preview-popup.js.map

package/dist-client/pages/building-inspection-grid/component/plan-preview-popup.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"plan-preview-popup.js","sourceRoot":"","sources":["../../../../client/pages/building-inspection-grid/component/plan-preview-popup.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { openPopup } from '@operato/layout'\nimport { client } from '@operato/graphql'\nimport gql from 'graphql-tag'\n\ninterface FileItem {\n id?: string\n name?: string\n type: string\n fullpath?: string\n}\n\ninterface BuildingLevel {\n id?: string\n floor?: string\n building?: {\n id?: string\n name?: string\n }\n mainDrawing?: {\n id?: string\n name?: string\n fullpath?: string\n }\n elevationDrawing?: {\n id?: string\n name?: string\n fullpath?: string\n }\n rebarDistributionDrawing?: {\n id?: string\n name?: string\n fullpath?: string\n }\n etcDrawings?: Array<{\n id?: string\n name?: string\n fullpath?: string\n }>\n}\n\n@customElement('plan-preview-popup')\nexport class PlanPreviewPopup extends LitElement {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n background-color: #fff;\n width: 100%;\n max-height: 80vh;\n }\n\n div[body] {\n flex: 1;\n overflow-y: auto;\n padding: 20px;\n\n div[file-list-container] {\n display: flex;\n flex-direction: column;\n gap: 15px;\n background-color: #f7f7f7;\n padding: 20px;\n border-radius: 8px;\n margin-bottom: 20px;\n\n div[file-item] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px;\n background-color: #fff;\n border-radius: 6px;\n border: 1px solid #ddd;\n cursor: pointer;\n transition: all 0.2s ease;\n\n &:hover {\n background-color: #e3f2fd;\n border-color: #2196f3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(33, 150, 243, 0.15);\n }\n\n div[file-info] {\n flex: 1;\n display: flex;\n align-items: center;\n gap: 10px;\n\n md-icon {\n --md-icon-size: 24px;\n color: #666;\n }\n\n span[file-name] {\n font-size: 14px;\n font-weight: 500;\n color: #333;\n }\n\n span[file-type] {\n font-size: 12px;\n color: #666;\n background-color: #f0f0f0;\n padding: 2px 6px;\n border-radius: 4px;\n }\n }\n\n md-icon[slot='action'] {\n --md-icon-size: 20px;\n color: #2196f3;\n opacity: 0.7;\n }\n }\n\n div[section-title] {\n font-size: 16px;\n font-weight: 600;\n color: #333;\n margin-top: 10px;\n margin-bottom: 5px;\n border-bottom: 2px solid #ddd;\n padding-bottom: 5px;\n }\n }\n\n div[empty-state] {\n text-align: center;\n color: #666;\n padding: 40px;\n\n md-icon {\n --md-icon-size: 48px;\n color: #ccc;\n margin-bottom: 16px;\n }\n }\n\n div[button-container] {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 10px;\n margin-top: 20px;\n }\n }\n `\n ]\n\n @property({ type: String }) buildingLevelId: string = ''\n @property({ type: Object }) private buildingLevel: BuildingLevel = {}\n\n async connectedCallback() {\n super.connectedCallback()\n await this._loadBuildingLevel()\n }\n\n render() {\n const { mainDrawing, elevationDrawing, rebarDistributionDrawing, etcDrawings } = this.buildingLevel\n\n // 메인 도면 파일들\n const mainFiles: FileItem[] = []\n if (mainDrawing?.id) {\n mainFiles.push({ ...mainDrawing, type: '평면도' })\n }\n if (elevationDrawing?.id) {\n mainFiles.push({ ...elevationDrawing, type: '입면도' })\n }\n if (rebarDistributionDrawing?.id) {\n mainFiles.push({ ...rebarDistributionDrawing, type: '철근배근도' })\n }\n\n // 기타 도면 파일들\n const etcFiles: FileItem[] = etcDrawings?.map(drawing => ({ ...drawing, type: '기타 도면' })) || []\n\n return html`\n <div body>\n <div file-list-container>\n ${mainFiles.length > 0\n ? html`\n <div section-title>주요 도면</div>\n ${mainFiles.map(\n file => html`\n <div file-item @click=${() => this._openPreview(file)}>\n <div file-info>\n <md-icon>description</md-icon>\n <span file-name>${file.name || ''}</span>\n <span file-type>${file.type}</span>\n </div>\n <md-icon slot=\"action\">visibility</md-icon>\n </div>\n `\n )}\n `\n : ''}\n ${etcFiles.length > 0\n ? html`\n <div section-title>기타 도면</div>\n ${etcFiles.map(\n file => html`\n <div file-item @click=${() => this._openPreview(file)}>\n <div file-info>\n <md-icon>attachment</md-icon>\n <span file-name>${file.name || ''}</span>\n <span file-type>${file.type}</span>\n </div>\n <md-icon slot=\"action\">visibility</md-icon>\n </div>\n `\n )}\n `\n : ''}\n ${mainFiles.length === 0 && etcFiles.length === 0\n ? html`\n <div empty-state>\n <md-icon>insert_drive_file</md-icon>\n <div>미리보기할 도면 파일이 없습니다.</div>\n </div>\n `\n : ''}\n </div>\n\n <div button-container>\n <md-outlined-button @click=${this._close}><md-icon slot=\"icon\">cancel</md-icon>닫기</md-outlined-button>\n </div>\n </div>\n `\n }\n\n private async _loadBuildingLevel() {\n try {\n const response = await client.query({\n query: gql`\n query BuildingLevel($buildingLevelId: String!) {\n buildingLevel(id: $buildingLevelId) {\n id\n floor\n building {\n id\n name\n }\n mainDrawing {\n id\n name\n fullpath\n }\n elevationDrawing {\n id\n name\n fullpath\n }\n rebarDistributionDrawing {\n id\n name\n fullpath\n }\n etcDrawings {\n id\n name\n fullpath\n }\n }\n }\n `,\n variables: {\n buildingLevelId: this.buildingLevelId\n }\n })\n\n this.buildingLevel = response.data?.buildingLevel || {}\n } catch (error) {\n console.error('Building level 정보를 불러오는 중 오류 발생:', error)\n }\n }\n\n private _openPreview(file: FileItem) {\n if (!file.fullpath) {\n return\n }\n\n // 파일 확장자로 타입 판단\n const fileExtension = file.fullpath.toLowerCase().split('.').pop()\n const isImage = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg'].includes(fileExtension || '')\n const isPdf = fileExtension === 'pdf'\n\n if (isImage) {\n this._openImagePreview(file)\n } else if (isPdf) {\n this._openPdfPreview(file)\n } else {\n // 기타 파일은 다운로드 또는 기본 뷰어\n this._openGenericPreview(file)\n }\n }\n\n private _openImagePreview(file: FileItem) {\n openPopup(\n html`\n <div style=\"display: flex; flex-direction: column;\">\n <div style=\"flex: 1; overflow: hidden; position: relative; touch-action: none;\">\n <img\n id=\"zoomable-image\"\n src=\"${ifDefined(file.fullpath)}\"\n alt=\"${ifDefined(file.name)}\"\n style=\"\n width: 100%; \n height: 100%; \n object-fit: contain; \n transform-origin: center center;\n transition: transform 0.1s ease-out;\n user-select: none;\n -webkit-user-select: none;\n \"\n @load=${this._initImageZoom}\n @error=${(e: Event) => {\n const target = e.target as HTMLImageElement\n target.style.display = 'none'\n target.parentElement!.innerHTML +=\n '<div style=\"padding: 40px; text-align: center; color: #666;\">이미지를 불러올 수 없습니다.</div>'\n }}\n />\n </div>\n </div>\n `,\n { backdrop: true, size: 'large', title: `[이미지 미리보기] ${file.name} (${file.type})` }\n )\n }\n\n private _openPdfPreview(file: FileItem) {\n openPopup(\n html`\n <div style=\"display: flex; flex-direction: column;\">\n <div style=\"flex: 1; overflow: hidden; touch-action: pan-x pan-y;\">\n <iframe\n src=\"${file.fullpath}#toolbar=1&navpanes=0&scrollbar=1&zoom=page-fit\"\n style=\"\n width: 100%; \n height: 100%; \n border: none; \n touch-action: pan-x pan-y;\n \"\n @error=${() => {\n // PDF 로드 실패시 새 탭에서 열기\n window.open(file.fullpath, '_blank')\n }}\n ></iframe>\n </div>\n </div>\n `,\n { backdrop: true, size: 'large', title: `[PDF 미리보기] ${file.name} (${file.type})` }\n )\n }\n\n // 기타 파일 타입은 새 탭에서 열기\n private _openGenericPreview(file: FileItem) {\n window.open(file.fullpath, '_blank')\n }\n\n private _close() {\n history.back()\n }\n\n private _initImageZoom(e: Event) {\n const img = e.target as HTMLImageElement\n let scale = 1\n let translateX = 0\n let translateY = 0\n let isDragging = false\n let lastTouchDistance = 0\n let lastTouchX = 0\n let lastTouchY = 0\n\n const updateTransform = () => {\n img.style.transform = `scale(${scale}) translate(${translateX}px, ${translateY}px)`\n }\n\n const resetTransform = () => {\n scale = 1\n translateX = 0\n translateY = 0\n updateTransform()\n }\n\n // 터치 시작\n img.addEventListener('touchstart', event => {\n event.preventDefault()\n\n if (event.touches.length === 1) {\n // 단일 터치 - 드래그 시작\n isDragging = true\n lastTouchX = event.touches[0].clientX\n lastTouchY = event.touches[0].clientY\n } else if (event.touches.length === 2) {\n // 멀티 터치 - 핀치 줌 시작\n isDragging = false\n const touch1 = event.touches[0]\n const touch2 = event.touches[1]\n lastTouchDistance = Math.sqrt(Math.pow(touch2.clientX - touch1.clientX, 2) + Math.pow(touch2.clientY - touch1.clientY, 2))\n }\n })\n\n // 터치 이동\n img.addEventListener('touchmove', event => {\n event.preventDefault()\n\n if (event.touches.length === 1 && isDragging && scale > 1) {\n // 드래그\n const currentX = event.touches[0].clientX\n const currentY = event.touches[0].clientY\n const deltaX = currentX - lastTouchX\n const deltaY = currentY - lastTouchY\n\n translateX += deltaX / scale\n translateY += deltaY / scale\n\n lastTouchX = currentX\n lastTouchY = currentY\n updateTransform()\n } else if (event.touches.length === 2) {\n // 핀치 줌\n const touch1 = event.touches[0]\n const touch2 = event.touches[1]\n const currentDistance = Math.sqrt(\n Math.pow(touch2.clientX - touch1.clientX, 2) + Math.pow(touch2.clientY - touch1.clientY, 2)\n )\n\n if (lastTouchDistance > 0) {\n const scaleChange = currentDistance / lastTouchDistance\n const newScale = scale * scaleChange\n\n // 최소/최대 배율 제한\n if (newScale >= 0.5 && newScale <= 5) {\n scale = newScale\n updateTransform()\n }\n }\n\n lastTouchDistance = currentDistance\n }\n })\n\n // 터치 끝\n img.addEventListener('touchend', event => {\n event.preventDefault()\n isDragging = false\n\n if (event.touches.length === 0) {\n // 모든 터치가 끝났을 때 - 경계 체크 및 보정\n if (scale < 1) {\n resetTransform()\n }\n }\n })\n\n // 더블 탭으로 줌 토글\n let lastTapTime = 0\n img.addEventListener('touchend', event => {\n const currentTime = new Date().getTime()\n const tapLength = currentTime - lastTapTime\n\n if (tapLength < 500 && tapLength > 0 && event.touches.length === 0) {\n if (scale === 1) {\n scale = 2\n updateTransform()\n } else {\n resetTransform()\n }\n }\n\n lastTapTime = currentTime\n })\n\n // 마우스 휠 지원 (데스크톱)\n img.addEventListener('wheel', event => {\n event.preventDefault()\n const delta = event.deltaY > 0 ? 0.9 : 1.1\n const newScale = scale * delta\n\n if (newScale >= 0.5 && newScale <= 5) {\n scale = newScale\n updateTransform()\n }\n })\n }\n}\n"]}

package/dist-client/pages/checklist/checklist-view.js CHANGED Viewed

@@ -76,7 +76,7 @@ let ChecklistView = class ChecklistView extends connect(store)(LitElement) {
         }
     }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
         const today = this._getDate(new Date());
         // 시공자 스탭 여부
         const isConstructorStep = this.status == BuildingInspectionStatus.WAIT ||
@@ -153,7 +153,7 @@ let ChecklistView = class ChecklistView extends connect(store)(LitElement) {
           <th>검측 부위</th>
           <td>${((_l = (_k = this.checklist) === null || _k === void 0 ? void 0 : _k.inspectionParts) === null || _l === void 0 ? void 0 : _l.join(', ')) || ''}</td>
           <th>검측 상태</th>
-          <td>${BUILDING_INSPECTION_STATUS_DISPLAY[(_o = (_m = this.checklist) === null || _m === void 0 ? void 0 : _m.buildingInspection) === null || _o === void 0 ? void 0 : _o.status]}</td>
+          <td>${BUILDING_INSPECTION_STATUS_DISPLAY[this.status]}</td>
         </tr>
       </table>
@@ -387,11 +387,7 @@ let ChecklistView = class ChecklistView extends connect(store)(LitElement) {
           .status=${this.status}
           @change-comment=${this._refreshItem.bind(this)}
         ></comment-list-popup>
-      `, {
-            backdrop: true,
-            size: 'medium',
-            title: '조치 사항'
-        });
+      `, { backdrop: true, size: 'medium', title: '조치 사항' });
     }
     _onClickAttachment(checklistItemId) {
         openPopup(html `
@@ -400,11 +396,7 @@ let ChecklistView = class ChecklistView extends connect(store)(LitElement) {
           .status=${this.status}
           @change-attachment=${this._refreshItem.bind(this)}
         ></attachment-list-popup>
-      `, {
-            backdrop: true,
-            size: 'medium',
-            title: '첨부 자료'
-        });
+      `, { backdrop: true, size: 'medium', title: '첨부 자료' });
     }
     async _refreshItem(e) {
         var _a;
@@ -629,6 +621,7 @@ ChecklistView.styles = [
         flex: 1;
         text-align: center;
       }
       @keyframes pulse {
         0% {
           filter: drop-shadow(0 0 0 #d32f2f);