@dssp/supervision 1.0.0-alpha.97 → 1.0.0

package/dist-client/pages/checklist-database/checklist-database.js

@@ -1,540 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import '@material/web/icon/icon.js';
-import '@material/web/textfield/filled-text-field.js';
-import '@operato/data-grist';
-import '../checklist/checklist-view';
-import { CommonGristStyles, ScrollbarStyles } from '@operato/styles';
-import { PageView } from '@operato/shell';
-import { css, html } from 'lit';
-import { customElement, query, state } from 'lit/decorators.js';
-import { DataGrist } from '@operato/data-grist';
-import { client } from '@operato/graphql';
-import { openPopup } from '@operato/layout';
-import gql from 'graphql-tag';
-import { BuildingInspectionStatus } from '../building-inspection/building-inspection-list';
-let ChecklistDatabase = class ChecklistDatabase extends PageView {
-    constructor() {
-        super(...arguments);
-        this.projects = [];
-        this.projectCount = 0;
-        this.searchKeyword = '';
-        this.selectedProjectId = '';
-        this.selectedProjectName = '';
-        this.constructionTypes = [];
-        this.allDetailTypes = [];
-    }
-    get context() {
-        return {
-            title: '체크리스트 DB'
-        };
-    }
-    render() {
-        return html `
-      <div header>
-        <h2>
-          <md-icon slot="icon" back @click=${() => history.back()}>arrow_back</md-icon>
-          체크리스트 DB
-        </h2>
-      </div>
-
-      <div body>
-        <div left>
-          <div section-header>
-            <md-icon>apartment</md-icon>
-            프로젝트 목록
-            <span count>(${this.projectCount})</span>
-          </div>
-
-          <md-filled-text-field
-            type="search"
-            label="프로젝트 검색"
-            .value=${this.searchKeyword}
-            @input=${this._onSearchInput}
-            @keypress=${this._onSearchKeypress}
-          >
-            <md-icon slot="leading-icon">search</md-icon>
-          </md-filled-text-field>
-
-          <div project-list>
-            ${this.projects.map(project => {
-            var _a, _b, _c, _d;
-            return html `
-                <div project-card ?selected=${project.id === this.selectedProjectId} @click=${() => this._selectProject(project)}>
-                  <img
-                    project-img
-                    ?no-image=${!((_a = project.mainPhoto) === null || _a === void 0 ? void 0 : _a.fullpath)}
-                    src=${((_b = project.mainPhoto) === null || _b === void 0 ? void 0 : _b.fullpath) || '/assets/images/no-image.png'}
-                  />
-                  <div project-info>
-                    <div project-name>${project.name}</div>
-                    <div project-address>${((_c = project.buildingComplex) === null || _c === void 0 ? void 0 : _c.address) || ''}</div>
-                    <div project-company>${((_d = project.buildingComplex) === null || _d === void 0 ? void 0 : _d.clientCompany) || ''}</div>
-                  </div>
-                </div>
-              `;
-        })}
-          </div>
-        </div>
-
-        <div right>
-          <div section-header>
-            <md-icon>checklist</md-icon>
-            체크리스트 목록
-            ${this.selectedProjectName ? html `<span project-label>- ${this.selectedProjectName}</span>` : ''}
-          </div>
-
-          ${this.selectedProjectId
-            ? html `
-                <ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this._fetchChecklists.bind(this)}></ox-grist>
-              `
-            : html `
-                <div empty-state>
-                  <md-icon>touch_app</md-icon>
-                  <p>프로젝트를 선택해주세요</p>
-                </div>
-              `}
-        </div>
-      </div>
-    `;
-    }
-    async pageInitialized(lifecycle) {
-        await this._init();
-    }
-    async pageUpdated(changes, lifecycle) {
-        if (this.active) {
-            await this._init();
-        }
-    }
-    async _init() {
-        await this._fetchConstructionTypes();
-        this._buildGristConfig();
-        await this._fetchProjects();
-    }
-    async _fetchProjects() {
-        var _a, _b, _c, _d;
-        const response = await client.query({
-            query: gql `
-        query Projects($filters: [Filter!], $sortings: [Sorting!]) {
-          projects(filters: $filters, sortings: $sortings) {
-            items {
-              id
-              name
-              mainPhoto {
-                fullpath
-              }
-              buildingComplex {
-                address
-                clientCompany
-              }
-            }
-            total
-          }
-        }
-      `,
-            variables: {
-                filters: this.searchKeyword ? [{ name: 'name', operator: 'search', value: `%${this.searchKeyword}%` }] : [],
-                sortings: [{ name: 'createdAt', desc: true }]
-            }
-        });
-        this.projects = ((_b = (_a = response.data) === null || _a === void 0 ? void 0 : _a.projects) === null || _b === void 0 ? void 0 : _b.items) || [];
-        this.projectCount = ((_d = (_c = response.data) === null || _c === void 0 ? void 0 : _c.projects) === null || _d === void 0 ? void 0 : _d.total) || 0;
-    }
-    async _fetchConstructionTypes() {
-        var _a, _b;
-        const response = await client.query({
-            query: gql `
-        query {
-          constructionTypes {
-            items {
-              id
-              name
-              projectType
-              constructionDetailTypes {
-                id
-                name
-                sequence
-              }
-            }
-          }
-        }
-      `
-        });
-        const items = ((_b = (_a = response.data) === null || _a === void 0 ? void 0 : _a.constructionTypes) === null || _b === void 0 ? void 0 : _b.items) || [];
-        this.constructionTypes = items;
-        this.allDetailTypes = items.flatMap(ct => (ct.constructionDetailTypes || []).map(dt => (Object.assign(Object.assign({}, dt), { constructionTypeId: ct.id }))));
-    }
-    _buildGristConfig() {
-        this.gristConfig = {
-            columns: [
-                { type: 'gutter', gutterName: 'sequence' },
-                {
-                    type: 'gutter',
-                    gutterName: 'button',
-                    fixed: true,
-                    icon: 'preview',
-                    handlers: {
-                        click: async (columns, data, column, record, rowIndex) => {
-                            if (!record.id)
-                                return;
-                            await this._openPreview(record);
-                        }
-                    }
-                },
-                {
-                    type: 'string',
-                    name: 'constructionTypeName',
-                    header: '공종',
-                    width: 120
-                },
-                {
-                    type: 'string',
-                    name: 'constructionDetailTypeName',
-                    header: '세부공종',
-                    width: 120
-                },
-                {
-                    type: 'string',
-                    name: 'name',
-                    header: '체크리스트명',
-                    width: 200
-                }
-            ],
-            rows: {
-                selectable: { multiple: false },
-                appendable: false
-            },
-            pagination: { infinite: true }
-        };
-    }
-    async _fetchChecklists() {
-        var _a, _b, _c, _d;
-        if (!this.selectedProjectId)
-            return { total: 0, records: [] };
-        const response = await client.query({
-            query: gql `
-        query ($filters: [Filter!], $sortings: [Sorting!]) {
-          projectChecklists(filters: $filters, sortings: $sortings) {
-            items {
-              id
-              projectId
-              constructionTypeId
-              constructionDetailTypeId
-              name
-              updatedAt
-            }
-            total
-          }
-        }
-      `,
-            variables: {
-                filters: [{ name: 'projectId', value: this.selectedProjectId, operator: 'eq' }],
-                sortings: [{ name: 'updatedAt', desc: true }]
-            }
-        });
-        const items = ((_b = (_a = response.data) === null || _a === void 0 ? void 0 : _a.projectChecklists) === null || _b === void 0 ? void 0 : _b.items) || [];
-        const records = items.map(item => {
-            var _a, _b;
-            return (Object.assign(Object.assign({}, item), { constructionTypeName: ((_a = this.constructionTypes.find(ct => ct.id === item.constructionTypeId)) === null || _a === void 0 ? void 0 : _a.name) || '', constructionDetailTypeName: ((_b = this.allDetailTypes.find(dt => dt.id === item.constructionDetailTypeId)) === null || _b === void 0 ? void 0 : _b.name) || '' }));
-        });
-        return {
-            total: ((_d = (_c = response.data) === null || _c === void 0 ? void 0 : _c.projectChecklists) === null || _d === void 0 ? void 0 : _d.total) || 0,
-            records
-        };
-    }
-    async _fetchChecklistItems(checklistId) {
-        var _a, _b, _c, _d;
-        const response = await client.query({
-            query: gql `
-        query ($filters: [Filter!]) {
-          projectChecklists(filters: $filters) {
-            items {
-              projectChecklistItems {
-                id
-                mainType
-                name
-                kcsCriteria
-                siteSpecCriteria
-                sequence
-              }
-            }
-          }
-        }
-      `,
-            variables: {
-                filters: [{ name: 'id', value: checklistId, operator: 'eq' }]
-            }
-        });
-        return ((_d = (_c = (_b = (_a = response.data) === null || _a === void 0 ? void 0 : _a.projectChecklists) === null || _b === void 0 ? void 0 : _b.items) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.projectChecklistItems) || [];
-    }
-    async _openPreview(record) {
-        var _a, _b;
-        const items = await this._fetchChecklistItems(record.id);
-        const ctName = ((_a = this.constructionTypes.find(ct => ct.id === record.constructionTypeId)) === null || _a === void 0 ? void 0 : _a.name) || '';
-        const cdtName = ((_b = this.allDetailTypes.find(dt => dt.id === record.constructionDetailTypeId)) === null || _b === void 0 ? void 0 : _b.name) || '';
-        const checklist = {
-            name: record.name,
-            constructionType: ctName,
-            constructionDetailType: cdtName,
-            location: '',
-            documentNo: '',
-            inspectionParts: [],
-            buildingInspection: {
-                status: BuildingInspectionStatus.WAIT
-            },
-            checklistItems: items.map(item => (Object.assign(Object.assign({}, item), { detailType: '' })))
-        };
-        openPopup(html `
-        <div style="overflow-y: auto;">
-          <checklist-view .mode=${"VIEWER" /* ChecklistMode.VIEWER */} .checklist=${checklist}></checklist-view>
-        </div>
-      `, {
-            backdrop: true,
-            size: 'large',
-            title: `체크리스트 미리보기 - ${record.name}`
-        });
-    }
-    _selectProject(project) {
-        this.selectedProjectId = project.id;
-        this.selectedProjectName = project.name;
-        // grist가 이미 렌더링된 상태면 refetch
-        this.updateComplete.then(() => {
-            var _a;
-            (_a = this.grist) === null || _a === void 0 ? void 0 : _a.fetch();
-        });
-    }
-    _onSearchInput(e) {
-        this.searchKeyword = e.target.value;
-    }
-    _onSearchKeypress(e) {
-        if (e.code === 'Enter') {
-            this._fetchProjects();
-        }
-    }
-};
-ChecklistDatabase.styles = [
-    ScrollbarStyles,
-    CommonGristStyles,
-    css `
-      :host {
-        display: flex;
-        flex-direction: column;
-        width: 100%;
-        height: 100%;
-        background-color: var(--md-sys-color-surface);
-      }
-
-      div[header] {
-        display: flex;
-        align-items: center;
-        padding: 0px 12px;
-
-        h2 {
-          display: flex;
-          gap: 7px;
-          flex: 1;
-          margin-bottom: 8px;
-          color: #3f71a0;
-          font-size: 18px;
-
-          md-icon[back] {
-            background: linear-gradient(135deg, #3f71a0 0%, #5a8cc7 100%);
-            color: white;
-            padding: 8px;
-            border-radius: 50%;
-            cursor: pointer;
-            box-shadow: 0 2px 8px rgba(63, 113, 160, 0.3);
-            width: 14px;
-            height: 14px;
-            --md-icon-size: 20px;
-          }
-
-          md-icon[back]:hover {
-            background: linear-gradient(135deg, #2e5c89 0%, #4a7bb0 100%);
-            box-shadow: 0 4px 12px rgba(63, 113, 160, 0.4);
-          }
-        }
-      }
-
-      div[body] {
-        display: grid;
-        grid-template-columns: 2fr 3fr;
-        gap: 15px;
-        flex: 1;
-        padding: 15px;
-        overflow: hidden;
-      }
-
-      div[left],
-      div[right] {
-        display: flex;
-        flex-direction: column;
-        overflow: hidden;
-        border: 1px solid #ddd;
-        border-radius: 8px;
-        padding: 15px;
-      }
-
-      div[section-header] {
-        font-size: 16px;
-        font-weight: 600;
-        margin-bottom: 10px;
-        color: #0595e5;
-        display: flex;
-        align-items: center;
-        gap: 6px;
-
-        span[count] {
-          font-size: 13px;
-          color: #999;
-          font-weight: 400;
-        }
-
-        span[project-label] {
-          font-size: 14px;
-          color: #666;
-          font-weight: 400;
-        }
-      }
-
-      md-filled-text-field {
-        width: 100%;
-        margin-bottom: 10px;
-        --md-filled-text-field-container-color: transparent;
-        --md-filled-text-field-active-indicator-color: #999;
-        --md-filled-text-field-input-text-size: 14px;
-      }
-
-      div[project-list] {
-        flex: 1;
-        overflow-y: auto;
-      }
-
-      div[project-card] {
-        display: flex;
-        gap: 10px;
-        padding: 8px;
-        border: 1px solid #e0e0e0;
-        border-radius: 6px;
-        margin-bottom: 8px;
-        cursor: pointer;
-        transition: all 0.2s;
-        overflow: hidden;
-      }
-
-      div[project-card]:hover {
-        border-color: #0595e5;
-        background-color: #f0f7ff;
-      }
-
-      div[project-card][selected] {
-        border-color: #0595e5;
-        background-color: #e3f2fd;
-        box-shadow: 0 2px 4px rgba(5, 149, 229, 0.2);
-      }
-
-      img[project-img] {
-        width: 80px;
-        height: 60px;
-        object-fit: cover;
-        border-radius: 4px;
-        background-color: #cccccc80;
-        flex-shrink: 0;
-      }
-
-      img[project-img][no-image] {
-        object-fit: contain;
-        opacity: 0.5;
-      }
-
-      div[project-info] {
-        flex: 1;
-        min-width: 0;
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-      }
-
-      div[project-name] {
-        font-weight: 600;
-        color: #2e79be;
-        margin-bottom: 4px;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-
-      div[project-address],
-      div[project-company] {
-        font-size: 12px;
-        color: #888;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-
-      ox-grist {
-        flex: 1;
-        overflow-y: auto;
-      }
-
-      div[empty-state] {
-        flex: 1;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        color: #aaa;
-
-        md-icon {
-          font-size: 64px;
-          margin-bottom: 16px;
-          color: #ddd;
-        }
-
-        p {
-          font-size: 16px;
-        }
-      }
-    `
-];
-__decorate([
-    state(),
-    __metadata("design:type", Array)
-], ChecklistDatabase.prototype, "projects", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Number)
-], ChecklistDatabase.prototype, "projectCount", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", String)
-], ChecklistDatabase.prototype, "searchKeyword", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", String)
-], ChecklistDatabase.prototype, "selectedProjectId", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", String)
-], ChecklistDatabase.prototype, "selectedProjectName", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Array)
-], ChecklistDatabase.prototype, "constructionTypes", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Array)
-], ChecklistDatabase.prototype, "allDetailTypes", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], ChecklistDatabase.prototype, "gristConfig", void 0);
-__decorate([
-    query('ox-grist'),
-    __metadata("design:type", DataGrist)
-], ChecklistDatabase.prototype, "grist", void 0);
-ChecklistDatabase = __decorate([
-    customElement('checklist-database')
-], ChecklistDatabase);
-export { ChecklistDatabase };
-//# sourceMappingURL=checklist-database.js.map

package/dist-client/pages/checklist-database/checklist-database.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"checklist-database.js","sourceRoot":"","sources":["../../../client/pages/checklist-database/checklist-database.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,8CAA8C,CAAA;AACrD,OAAO,qBAAqB,CAAA;AAC5B,OAAO,6BAA6B,CAAA;AAEpC,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACpE,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAEzC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAC3C,OAAO,GAAG,MAAM,aAAa,CAAA;AAE7B,OAAO,EAAE,wBAAwB,EAAE,MAAM,iDAAiD,CAAA;AAGnF,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,QAAQ;IAAxC;;QA4LY,aAAQ,GAAU,EAAE,CAAA;QACpB,iBAAY,GAAW,CAAC,CAAA;QACxB,kBAAa,GAAW,EAAE,CAAA;QAC1B,sBAAiB,GAAW,EAAE,CAAA;QAC9B,wBAAmB,GAAW,EAAE,CAAA;QAChC,sBAAiB,GAAU,EAAE,CAAA;QAC7B,mBAAc,GAAU,EAAE,CAAA;IA6T7C,CAAC;IAxTC,IAAI,OAAO;QACT,OAAO;YACL,KAAK,EAAE,UAAU;SAClB,CAAA;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;6CAG8B,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE;;;;;;;;;;2BAUtC,IAAI,CAAC,YAAY;;;;;;qBAMvB,IAAI,CAAC,aAAa;qBAClB,IAAI,CAAC,cAAc;wBAChB,IAAI,CAAC,iBAAiB;;;;;;cAMhC,IAAI,CAAC,QAAQ,CAAC,GAAG,CACjB,OAAO,CAAC,EAAE;;YAAC,OAAA,IAAI,CAAA;8CACiB,OAAO,CAAC,EAAE,KAAK,IAAI,CAAC,iBAAiB,WAAW,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC;;;gCAGhG,CAAC,CAAA,MAAA,OAAO,CAAC,SAAS,0CAAE,QAAQ,CAAA;0BAClC,CAAA,MAAA,OAAO,CAAC,SAAS,0CAAE,QAAQ,KAAI,6BAA6B;;;wCAG9C,OAAO,CAAC,IAAI;2CACT,CAAA,MAAA,OAAO,CAAC,eAAe,0CAAE,OAAO,KAAI,EAAE;2CACtC,CAAA,MAAA,OAAO,CAAC,eAAe,0CAAE,aAAa,KAAI,EAAE;;;eAGxE,CAAA;SAAA,CACF;;;;;;;;cAQC,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC,IAAI,CAAA,yBAAyB,IAAI,CAAC,mBAAmB,SAAS,CAAC,CAAC,CAAC,EAAE;;;YAGhG,IAAI,CAAC,iBAAiB;YACtB,CAAC,CAAC,IAAI,CAAA;kCACgB,MAAM,YAAY,IAAI,CAAC,WAAW,kBAAkB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC;eACvG;YACH,CAAC,CAAC,IAAI,CAAA;;;;;eAKH;;;KAGV,CAAA;IACH,CAAC;IAED,KAAK,CAAC,eAAe,CAAC,SAAwB;QAC5C,MAAM,IAAI,CAAC,KAAK,EAAE,CAAA;IACpB,CAAC;IAED,KAAK,CAAC,WAAW,CAAC,OAAY,EAAE,SAAwB;QACtD,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,MAAM,IAAI,CAAC,KAAK,EAAE,CAAA;QACpB,CAAC;IACH,CAAC;IAEO,KAAK,CAAC,KAAK;QACjB,MAAM,IAAI,CAAC,uBAAuB,EAAE,CAAA;QACpC,IAAI,CAAC,iBAAiB,EAAE,CAAA;QACxB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAA;IAC7B,CAAC;IAEO,KAAK,CAAC,cAAc;;QAC1B,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;OAiBT;YACD,SAAS,EAAE;gBACT,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE;gBAC3G,QAAQ,EAAE,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;aAC9C;SACF,CAAC,CAAA;QAEF,IAAI,CAAC,QAAQ,GAAG,CAAA,MAAA,MAAA,QAAQ,CAAC,IAAI,0CAAE,QAAQ,0CAAE,KAAK,KAAI,EAAE,CAAA;QACpD,IAAI,CAAC,YAAY,GAAG,CAAA,MAAA,MAAA,QAAQ,CAAC,IAAI,0CAAE,QAAQ,0CAAE,KAAK,KAAI,CAAC,CAAA;IACzD,CAAC;IAEO,KAAK,CAAC,uBAAuB;;QACnC,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;OAeT;SACF,CAAC,CAAA;QAEF,MAAM,KAAK,GAAG,CAAA,MAAA,MAAA,QAAQ,CAAC,IAAI,0CAAE,iBAAiB,0CAAE,KAAK,KAAI,EAAE,CAAA;QAC3D,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAA;QAC9B,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CACvC,CAAC,EAAE,CAAC,uBAAuB,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,iCACxC,EAAE,KACL,kBAAkB,EAAE,EAAE,CAAC,EAAE,IACzB,CAAC,CACJ,CAAA;IACH,CAAC;IAEO,iBAAiB;QACvB,IAAI,CAAC,WAAW,GAAG;YACjB,OAAO,EAAE;gBACP,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE;gBAC1C;oBACE,IAAI,EAAE,QAAQ;oBACd,UAAU,EAAE,QAAQ;oBACpB,KAAK,EAAE,IAAI;oBACX,IAAI,EAAE,SAAS;oBACf,QAAQ,EAAE;wBACR,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE;4BACvD,IAAI,CAAC,MAAM,CAAC,EAAE;gCAAE,OAAM;4BACtB,MAAM,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAA;wBACjC,CAAC;qBACF;iBACF;gBACD;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,sBAAsB;oBAC5B,MAAM,EAAE,IAAI;oBACZ,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,4BAA4B;oBAClC,MAAM,EAAE,MAAM;oBACd,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,MAAM;oBACZ,MAAM,EAAE,QAAQ;oBAChB,KAAK,EAAE,GAAG;iBACX;aACF;YACD,IAAI,EAAE;gBACJ,UAAU,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;gBAC/B,UAAU,EAAE,KAAK;aAClB;YACD,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;SAC/B,CAAA;IACH,CAAC;IAEO,KAAK,CAAC,gBAAgB;;QAC5B,IAAI,CAAC,IAAI,CAAC,iBAAiB;YAAE,OAAO,EAAE,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAA;QAE7D,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;OAcT;YACD,SAAS,EAAE;gBACT,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;gBAC/E,QAAQ,EAAE,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;aAC9C;SACF,CAAC,CAAA;QAEF,MAAM,KAAK,GAAG,CAAA,MAAA,MAAA,QAAQ,CAAC,IAAI,0CAAE,iBAAiB,0CAAE,KAAK,KAAI,EAAE,CAAA;QAC3D,MAAM,OAAO,GAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;;YAAC,OAAA,iCAC7B,IAAI,KACP,oBAAoB,EAAE,CAAA,MAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,kBAAkB,CAAC,0CAAE,IAAI,KAAI,EAAE,EACtG,0BAA0B,EAAE,CAAA,MAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,wBAAwB,CAAC,0CAAE,IAAI,KAAI,EAAE,IAC/G,CAAA;SAAA,CAAC,CAAA;QAEH,OAAO;YACL,KAAK,EAAE,CAAA,MAAA,MAAA,QAAQ,CAAC,IAAI,0CAAE,iBAAiB,0CAAE,KAAK,KAAI,CAAC;YACnD,OAAO;SACR,CAAA;IACH,CAAC;IAEO,KAAK,CAAC,oBAAoB,CAAC,WAAmB;;QACpD,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;OAeT;YACD,SAAS,EAAE;gBACT,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;aAC9D;SACF,CAAC,CAAA;QAEF,OAAO,CAAA,MAAA,MAAA,MAAA,MAAA,QAAQ,CAAC,IAAI,0CAAE,iBAAiB,0CAAE,KAAK,0CAAG,CAAC,CAAC,0CAAE,qBAAqB,KAAI,EAAE,CAAA;IAClF,CAAC;IAEO,KAAK,CAAC,YAAY,CAAC,MAAW;;QACpC,MAAM,KAAK,GAAG,MAAM,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA;QACxD,MAAM,MAAM,GAAG,CAAA,MAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,MAAM,CAAC,kBAAkB,CAAC,0CAAE,IAAI,KAAI,EAAE,CAAA;QACjG,MAAM,OAAO,GAAG,CAAA,MAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,MAAM,CAAC,wBAAwB,CAAC,0CAAE,IAAI,KAAI,EAAE,CAAA;QAErG,MAAM,SAAS,GAAG;YAChB,IAAI,EAAE,MAAM,CAAC,IAAI;YACjB,gBAAgB,EAAE,MAAM;YACxB,sBAAsB,EAAE,OAAO;YAC/B,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;YACd,eAAe,EAAE,EAAE;YACnB,kBAAkB,EAAE;gBAClB,MAAM,EAAE,wBAAwB,CAAC,IAAI;aACtC;YACD,cAAc,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,iCAC7B,IAAI,KACP,UAAU,EAAE,EAAE,IACd,CAAC;SACJ,CAAA;QAED,SAAS,CACP,IAAI,CAAA;;kCAEwB,mCAAoB,eAAe,SAAS;;OAEvE,EACD;YACE,QAAQ,EAAE,IAAI;YACd,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,gBAAgB,MAAM,CAAC,IAAI,EAAE;SACrC,CACF,CAAA;IACH,CAAC;IAEO,cAAc,CAAC,OAAY;QACjC,IAAI,CAAC,iBAAiB,GAAG,OAAO,CAAC,EAAE,CAAA;QACnC,IAAI,CAAC,mBAAmB,GAAG,OAAO,CAAC,IAAI,CAAA;QAEvC,6BAA6B;QAC7B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE;;YAC5B,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,EAAE,CAAA;QACrB,CAAC,CAAC,CAAA;IACJ,CAAC;IAEO,cAAc,CAAC,CAAa;QAClC,IAAI,CAAC,aAAa,GAAI,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAA;IAC3D,CAAC;IAEO,iBAAiB,CAAC,CAAgB;QACxC,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YACvB,IAAI,CAAC,cAAc,EAAE,CAAA;QACvB,CAAC;IACH,CAAC;;AA7fM,wBAAM,GAAG;IACd,eAAe;IACf,iBAAiB;IACjB,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAqLF;CACF,AAzLY,CAyLZ;AAEgB;IAAhB,KAAK,EAAE;;mDAA6B;AACpB;IAAhB,KAAK,EAAE;;uDAAiC;AACxB;IAAhB,KAAK,EAAE;;wDAAmC;AAC1B;IAAhB,KAAK,EAAE;;4DAAuC;AAC9B;IAAhB,KAAK,EAAE;;8DAAyC;AAChC;IAAhB,KAAK,EAAE;;4DAAsC;AAC7B;IAAhB,KAAK,EAAE;;yDAAmC;AAC1B;IAAhB,KAAK,EAAE;;sDAAyB;AAEd;IAAlB,KAAK,CAAC,UAAU,CAAC;8BAAS,SAAS;gDAAA;AArMzB,iBAAiB;IAD7B,aAAa,CAAC,oBAAoB,CAAC;GACvB,iBAAiB,CA+f7B","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@material/web/textfield/filled-text-field.js'\nimport '@operato/data-grist'\nimport '../checklist/checklist-view'\n\nimport { CommonGristStyles, ScrollbarStyles } from '@operato/styles'\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 { DataGrist } from '@operato/data-grist'\nimport { client } from '@operato/graphql'\nimport { openPopup } from '@operato/layout'\nimport gql from 'graphql-tag'\nimport { ChecklistMode } from '../checklist/checklist-view'\nimport { BuildingInspectionStatus } from '../building-inspection/building-inspection-list'\n\n@customElement('checklist-database')\nexport class ChecklistDatabase extends PageView {\n  static styles = [\n    ScrollbarStyles,\n    CommonGristStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        width: 100%;\n        height: 100%;\n        background-color: var(--md-sys-color-surface);\n      }\n\n      div[header] {\n        display: flex;\n        align-items: center;\n        padding: 0px 12px;\n\n        h2 {\n          display: flex;\n          gap: 7px;\n          flex: 1;\n          margin-bottom: 8px;\n          color: #3f71a0;\n          font-size: 18px;\n\n          md-icon[back] {\n            background: linear-gradient(135deg, #3f71a0 0%, #5a8cc7 100%);\n            color: white;\n            padding: 8px;\n            border-radius: 50%;\n            cursor: pointer;\n            box-shadow: 0 2px 8px rgba(63, 113, 160, 0.3);\n            width: 14px;\n            height: 14px;\n            --md-icon-size: 20px;\n          }\n\n          md-icon[back]:hover {\n            background: linear-gradient(135deg, #2e5c89 0%, #4a7bb0 100%);\n            box-shadow: 0 4px 12px rgba(63, 113, 160, 0.4);\n          }\n        }\n      }\n\n      div[body] {\n        display: grid;\n        grid-template-columns: 2fr 3fr;\n        gap: 15px;\n        flex: 1;\n        padding: 15px;\n        overflow: hidden;\n      }\n\n      div[left],\n      div[right] {\n        display: flex;\n        flex-direction: column;\n        overflow: hidden;\n        border: 1px solid #ddd;\n        border-radius: 8px;\n        padding: 15px;\n      }\n\n      div[section-header] {\n        font-size: 16px;\n        font-weight: 600;\n        margin-bottom: 10px;\n        color: #0595e5;\n        display: flex;\n        align-items: center;\n        gap: 6px;\n\n        span[count] {\n          font-size: 13px;\n          color: #999;\n          font-weight: 400;\n        }\n\n        span[project-label] {\n          font-size: 14px;\n          color: #666;\n          font-weight: 400;\n        }\n      }\n\n      md-filled-text-field {\n        width: 100%;\n        margin-bottom: 10px;\n        --md-filled-text-field-container-color: transparent;\n        --md-filled-text-field-active-indicator-color: #999;\n        --md-filled-text-field-input-text-size: 14px;\n      }\n\n      div[project-list] {\n        flex: 1;\n        overflow-y: auto;\n      }\n\n      div[project-card] {\n        display: flex;\n        gap: 10px;\n        padding: 8px;\n        border: 1px solid #e0e0e0;\n        border-radius: 6px;\n        margin-bottom: 8px;\n        cursor: pointer;\n        transition: all 0.2s;\n        overflow: hidden;\n      }\n\n      div[project-card]:hover {\n        border-color: #0595e5;\n        background-color: #f0f7ff;\n      }\n\n      div[project-card][selected] {\n        border-color: #0595e5;\n        background-color: #e3f2fd;\n        box-shadow: 0 2px 4px rgba(5, 149, 229, 0.2);\n      }\n\n      img[project-img] {\n        width: 80px;\n        height: 60px;\n        object-fit: cover;\n        border-radius: 4px;\n        background-color: #cccccc80;\n        flex-shrink: 0;\n      }\n\n      img[project-img][no-image] {\n        object-fit: contain;\n        opacity: 0.5;\n      }\n\n      div[project-info] {\n        flex: 1;\n        min-width: 0;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n      }\n\n      div[project-name] {\n        font-weight: 600;\n        color: #2e79be;\n        margin-bottom: 4px;\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n\n      div[project-address],\n      div[project-company] {\n        font-size: 12px;\n        color: #888;\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n\n      ox-grist {\n        flex: 1;\n        overflow-y: auto;\n      }\n\n      div[empty-state] {\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n        color: #aaa;\n\n        md-icon {\n          font-size: 64px;\n          margin-bottom: 16px;\n          color: #ddd;\n        }\n\n        p {\n          font-size: 16px;\n        }\n      }\n    `\n  ]\n\n  @state() private projects: any[] = []\n  @state() private projectCount: number = 0\n  @state() private searchKeyword: string = ''\n  @state() private selectedProjectId: string = ''\n  @state() private selectedProjectName: string = ''\n  @state() private constructionTypes: any[] = []\n  @state() private allDetailTypes: any[] = []\n  @state() private gristConfig: any\n\n  @query('ox-grist') grist!: DataGrist\n\n  get context() {\n    return {\n      title: '체크리스트 DB'\n    }\n  }\n\n  render() {\n    return html`\n      <div header>\n        <h2>\n          <md-icon slot=\"icon\" back @click=${() => history.back()}>arrow_back</md-icon>\n          체크리스트 DB\n        </h2>\n      </div>\n\n      <div body>\n        <div left>\n          <div section-header>\n            <md-icon>apartment</md-icon>\n            프로젝트 목록\n            <span count>(${this.projectCount})</span>\n          </div>\n\n          <md-filled-text-field\n            type=\"search\"\n            label=\"프로젝트 검색\"\n            .value=${this.searchKeyword}\n            @input=${this._onSearchInput}\n            @keypress=${this._onSearchKeypress}\n          >\n            <md-icon slot=\"leading-icon\">search</md-icon>\n          </md-filled-text-field>\n\n          <div project-list>\n            ${this.projects.map(\n              project => html`\n                <div project-card ?selected=${project.id === this.selectedProjectId} @click=${() => this._selectProject(project)}>\n                  <img\n                    project-img\n                    ?no-image=${!project.mainPhoto?.fullpath}\n                    src=${project.mainPhoto?.fullpath || '/assets/images/no-image.png'}\n                  />\n                  <div project-info>\n                    <div project-name>${project.name}</div>\n                    <div project-address>${project.buildingComplex?.address || ''}</div>\n                    <div project-company>${project.buildingComplex?.clientCompany || ''}</div>\n                  </div>\n                </div>\n              `\n            )}\n          </div>\n        </div>\n\n        <div right>\n          <div section-header>\n            <md-icon>checklist</md-icon>\n            체크리스트 목록\n            ${this.selectedProjectName ? html`<span project-label>- ${this.selectedProjectName}</span>` : ''}\n          </div>\n\n          ${this.selectedProjectId\n            ? html`\n                <ox-grist .mode=${'GRID'} .config=${this.gristConfig} .fetchHandler=${this._fetchChecklists.bind(this)}></ox-grist>\n              `\n            : html`\n                <div empty-state>\n                  <md-icon>touch_app</md-icon>\n                  <p>프로젝트를 선택해주세요</p>\n                </div>\n              `}\n        </div>\n      </div>\n    `\n  }\n\n  async pageInitialized(lifecycle: PageLifecycle) {\n    await this._init()\n  }\n\n  async pageUpdated(changes: any, lifecycle: PageLifecycle) {\n    if (this.active) {\n      await this._init()\n    }\n  }\n\n  private async _init() {\n    await this._fetchConstructionTypes()\n    this._buildGristConfig()\n    await this._fetchProjects()\n  }\n\n  private async _fetchProjects() {\n    const response = await client.query({\n      query: gql`\n        query Projects($filters: [Filter!], $sortings: [Sorting!]) {\n          projects(filters: $filters, sortings: $sortings) {\n            items {\n              id\n              name\n              mainPhoto {\n                fullpath\n              }\n              buildingComplex {\n                address\n                clientCompany\n              }\n            }\n            total\n          }\n        }\n      `,\n      variables: {\n        filters: this.searchKeyword ? [{ name: 'name', operator: 'search', value: `%${this.searchKeyword}%` }] : [],\n        sortings: [{ name: 'createdAt', desc: true }]\n      }\n    })\n\n    this.projects = response.data?.projects?.items || []\n    this.projectCount = response.data?.projects?.total || 0\n  }\n\n  private async _fetchConstructionTypes() {\n    const response = await client.query({\n      query: gql`\n        query {\n          constructionTypes {\n            items {\n              id\n              name\n              projectType\n              constructionDetailTypes {\n                id\n                name\n                sequence\n              }\n            }\n          }\n        }\n      `\n    })\n\n    const items = response.data?.constructionTypes?.items || []\n    this.constructionTypes = items\n    this.allDetailTypes = items.flatMap(ct =>\n      (ct.constructionDetailTypes || []).map(dt => ({\n        ...dt,\n        constructionTypeId: ct.id\n      }))\n    )\n  }\n\n  private _buildGristConfig() {\n    this.gristConfig = {\n      columns: [\n        { type: 'gutter', gutterName: 'sequence' },\n        {\n          type: 'gutter',\n          gutterName: 'button',\n          fixed: true,\n          icon: 'preview',\n          handlers: {\n            click: async (columns, data, column, record, rowIndex) => {\n              if (!record.id) return\n              await this._openPreview(record)\n            }\n          }\n        },\n        {\n          type: 'string',\n          name: 'constructionTypeName',\n          header: '공종',\n          width: 120\n        },\n        {\n          type: 'string',\n          name: 'constructionDetailTypeName',\n          header: '세부공종',\n          width: 120\n        },\n        {\n          type: 'string',\n          name: 'name',\n          header: '체크리스트명',\n          width: 200\n        }\n      ],\n      rows: {\n        selectable: { multiple: false },\n        appendable: false\n      },\n      pagination: { infinite: true }\n    }\n  }\n\n  private async _fetchChecklists() {\n    if (!this.selectedProjectId) return { total: 0, records: [] }\n\n    const response = await client.query({\n      query: gql`\n        query ($filters: [Filter!], $sortings: [Sorting!]) {\n          projectChecklists(filters: $filters, sortings: $sortings) {\n            items {\n              id\n              projectId\n              constructionTypeId\n              constructionDetailTypeId\n              name\n              updatedAt\n            }\n            total\n          }\n        }\n      `,\n      variables: {\n        filters: [{ name: 'projectId', value: this.selectedProjectId, operator: 'eq' }],\n        sortings: [{ name: 'updatedAt', desc: true }]\n      }\n    })\n\n    const items = response.data?.projectChecklists?.items || []\n    const records = items.map(item => ({\n      ...item,\n      constructionTypeName: this.constructionTypes.find(ct => ct.id === item.constructionTypeId)?.name || '',\n      constructionDetailTypeName: this.allDetailTypes.find(dt => dt.id === item.constructionDetailTypeId)?.name || ''\n    }))\n\n    return {\n      total: response.data?.projectChecklists?.total || 0,\n      records\n    }\n  }\n\n  private async _fetchChecklistItems(checklistId: string): Promise<any[]> {\n    const response = await client.query({\n      query: gql`\n        query ($filters: [Filter!]) {\n          projectChecklists(filters: $filters) {\n            items {\n              projectChecklistItems {\n                id\n                mainType\n                name\n                kcsCriteria\n                siteSpecCriteria\n                sequence\n              }\n            }\n          }\n        }\n      `,\n      variables: {\n        filters: [{ name: 'id', value: checklistId, operator: 'eq' }]\n      }\n    })\n\n    return response.data?.projectChecklists?.items?.[0]?.projectChecklistItems || []\n  }\n\n  private async _openPreview(record: any) {\n    const items = await this._fetchChecklistItems(record.id)\n    const ctName = this.constructionTypes.find(ct => ct.id === record.constructionTypeId)?.name || ''\n    const cdtName = this.allDetailTypes.find(dt => dt.id === record.constructionDetailTypeId)?.name || ''\n\n    const checklist = {\n      name: record.name,\n      constructionType: ctName,\n      constructionDetailType: cdtName,\n      location: '',\n      documentNo: '',\n      inspectionParts: [],\n      buildingInspection: {\n        status: BuildingInspectionStatus.WAIT\n      },\n      checklistItems: items.map(item => ({\n        ...item,\n        detailType: ''\n      }))\n    }\n\n    openPopup(\n      html`\n        <div style=\"overflow-y: auto;\">\n          <checklist-view .mode=${ChecklistMode.VIEWER} .checklist=${checklist}></checklist-view>\n        </div>\n      `,\n      {\n        backdrop: true,\n        size: 'large',\n        title: `체크리스트 미리보기 - ${record.name}`\n      }\n    )\n  }\n\n  private _selectProject(project: any) {\n    this.selectedProjectId = project.id\n    this.selectedProjectName = project.name\n\n    // grist가 이미 렌더링된 상태면 refetch\n    this.updateComplete.then(() => {\n      this.grist?.fetch()\n    })\n  }\n\n  private _onSearchInput(e: InputEvent) {\n    this.searchKeyword = (e.target as HTMLInputElement).value\n  }\n\n  private _onSearchKeypress(e: KeyboardEvent) {\n    if (e.code === 'Enter') {\n      this._fetchProjects()\n    }\n  }\n}\n"]}

package/dist-client/pages/checklist-template/checklist-template-item.d.ts

@@ -1,2 +0,0 @@
-import '@material/web/icon/icon.js';
-import '@operato/data-grist/ox-grist.js';