@dssp/dkpi 1.0.0-alpha.87 → 1.0.0-alpha.89

package/dist-client/pages/sv-project-detail.js

@@ -13,6 +13,7 @@ import '../components/kpi-boxplot-chart';
 import '../components/kpi-single-boxplot-chart';
 import '../components/kpi-radar-chart';
 import '../components/kpi-lookup-chart';
+import '../components/kpi-step-lookup-chart';
 import '../components/kpi-2d-lookup-chart';
 let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(PageView) {
     constructor() {
@@ -35,7 +36,7 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
         };
     }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
         return html `
       <div content>
         <div left>
@@ -57,7 +58,7 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
                   <div class="value">${this.project.startDate} ~ ${this.project.endDate}</div>
                 </div>
                 <div class="row">
-                  <div class="label">• 현장상태</div>
+                  <div class="label">• 프로젝트 상태</div>
                   <div class="value status-value">${PROJECT_STATE[this.project.state]}</div>
                 </div>
                 <div class="row">
@@ -97,7 +98,7 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
                 <div class="value">${((_h = (_g = this.project.buildingComplex) === null || _g === void 0 ? void 0 : _g.floorAreaRatio) === null || _h === void 0 ? void 0 : _h.toLocaleString()) || '-'} %</div>
               </div>
               <div class="grid-item row">
-                <div class="label">• 투입인력</div>
+                <div class="label">• 총 투입인력(M/M)</div>
                 <div class="value">${((_k = (_j = this.project.buildingComplex) === null || _j === void 0 ? void 0 : _j.workerCount) === null || _k === void 0 ? void 0 : _k.toLocaleString()) || '-'} 명</div>
               </div>
             </div>
@@ -208,14 +209,13 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
           <div class="card group-box">
             <div class="kpi-header">
               <div>
-                <div>그룹별 분포</div>
+                <div>성과영역별 KPI</div>
                 <div class="triangle"></div>
               </div>
             </div>
             <div class="desc">
-              Boxplot(박스플롯)은 각 카테고리별로 값의 분포(최소, 1사분위, 중앙값, 3사분위, 최대, 평균, 이상치 등)를 보여줍니다.
-              박스는 중앙 50% 구간, 수염은 전체 범위, 굵은 검정색 가로선은 중앙값(메디안), 초록색 원은 평균값(Mean)을 의미합니다.
-              이 프로젝트의 값은 진한 오렌지색 원으로 별도 강조되어 표시되며, 중앙값/평균과 다를 수 있습니다.
+              Boxplot(박스플롯)은 박스는 중앙 50% 구간, 수염은 전체 범위, 굵은 파란색 가로선은 중앙값(median), 초록색 원은
+              평균값(Mean)을 의미합니다. 당해 프로젝트의 값은 붉은색 원으로 표시됩니다.
             </div>
             <div class="group-chart">
               <sv-kpi-boxplot-chart .data=${this.getYKpiBoxplotData()}></sv-kpi-boxplot-chart>
@@ -225,7 +225,7 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
           <div class="metrics-card">
             <div class="metrics-header">
               <div class="title">
-                <span>그룹별 상세 매트릭 데이터</span>
+                <span>성과영역별 KPI 측정값</span>
                 <div class="triangle"></div>
               </div>
             </div>
@@ -270,8 +270,7 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
                   ${this.selectedKpi.score !== undefined && this.selectedKpi.score !== null
                 ? html `
                         <div class="popup-score">
-                          <span class="score-value">${parseFloat(Number(this.selectedKpi.score).toFixed(4))}</span>
-                          <span class="score-label">점</span>
+                          <span class="score-value">${parseFloat(Number(this.selectedKpi.score).toFixed(2))}</span>
                         </div>
                       `
                 : ''}
@@ -290,18 +289,29 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
              * ASSESSMENT: 5단계 게이지 (kpi-lookup-chart 자동 감지)
              */ ''}
                   ${
-            // 2D lookup KPI (X13 등) 는 항상 등급 기준 + 히트맵 함께 표시 (value 가
-            // 정수든 소수든 일관). _renderAssessmentGrades 안의 is2D 분기가 히트맵
-            // 같이 그림. 그 외 ASSESSMENT 도 등급 기준, LOOKUP 은 분포 커브.
-            this.selectedKpi.scoreType === 'CUSTOM' || ((_l = this.selectedKpi.grades) === null || _l === void 0 ? void 0 : _l.type) === 'PROGRESS_DEVIATION_LOOKUP'
-                ? this._renderAssessmentGrades()
-                : this._isAssessmentOrIntegerScore()
-                    ? this._renderAssessmentGrades()
-                    : html `
+            // SL-PA 결과(X34 품질, X43 안전) 만 계단형 등급 분포 차트로 표시.
+            // (다른 KPI 차트 경로에는 영향 없음)
+            this.selectedKpi.pattern === 'X34' || this.selectedKpi.pattern === 'X43'
+                ? html `
+                          <kpi-step-lookup-chart
+                            .grades=${this.selectedKpi.grades || []}
+                            .value=${this.selectedKpi.value}
+                            .score=${(_l = this.selectedKpi.score) !== null && _l !== void 0 ? _l : null}
+                            unit=${this.selectedKpi.unit || ''}
+                          ></kpi-step-lookup-chart>
+                        `
+                : // 2D lookup KPI (X13 등) 는 항상 등급 기준 + 히트맵 함께 표시 (value 가
+                    // 정수든 소수든 일관). _renderAssessmentGrades 안의 is2D 분기가 히트맵
+                    // 같이 그림. 그 외 ASSESSMENT 도 등급 기준, LOOKUP 은 분포 커브.
+                    this.selectedKpi.scoreType === 'CUSTOM' || ((_m = this.selectedKpi.grades) === null || _m === void 0 ? void 0 : _m.type) === 'PROGRESS_DEVIATION_LOOKUP'
+                        ? this._renderAssessmentGrades()
+                        : this._isAssessmentOrIntegerScore()
+                            ? this._renderAssessmentGrades()
+                            : html `
                             <kpi-lookup-chart
                               .grades=${this.selectedKpi.grades || []}
                               .value=${this.selectedKpi.value}
-                              .score=${(_m = this.selectedKpi.score) !== null && _m !== void 0 ? _m : null}
+                              .score=${(_o = this.selectedKpi.score) !== null && _o !== void 0 ? _o : null}
                               .scoreType=${this.selectedKpi.scoreType || ''}
                               .valueType=${this.selectedKpi.valueType || ''}
                               unit=${this.selectedKpi.unit || ''}
@@ -653,6 +663,7 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
             }
             this.selectedKpi = {
                 kpiName: displayName,
+                pattern: kpiNamePattern, // X34/X43 등 — 계단형 차트 라우팅용
                 grades: kpi.grades || [],
                 scoreType: kpi.scoreType || '',
                 valueType: kpi.valueType || '',
@@ -798,30 +809,30 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
         return {
             Y1: {
                 name: '일정성과 (Y1)',
-                score: this.getYKpiScoreFormatted('Y1. 일정성과'),
+                score: this.getYKpiScoreFormatted('일정성과(Y1)'),
                 metrics: [
                     { label: '연면적 대비 공사기간', pattern: 'X11', value: this.getMetricValue('X11') },
                     { label: '설계변경 공기 증감률', pattern: 'X12', value: this.getMetricValue('X12') },
                     { label: '일정 이탈 수준', pattern: 'X13', value: this.getMetricValue('X13') },
-                    { label: '일정성과 수준 평가', pattern: 'X14', value: this.getMetricValue('X14') }
+                    { label: '일정성과 정성 평가', pattern: 'X14', value: this.getMetricValue('X14') }
                 ]
             },
             Y2: {
                 name: '비용성과 (Y2)',
-                score: this.getYKpiScoreFormatted('Y2. 비용성과'),
+                score: this.getYKpiScoreFormatted('비용성과(Y2)'),
                 metrics: [
                     { label: '연면적 대비 공사비', pattern: 'X21', value: this.getMetricValue('X21') },
-                    { label: '설계변경 공사비 증감', pattern: 'X22', value: this.getMetricValue('X22') },
-                    { label: '비용성과 수준 평가', pattern: 'X23', value: this.getMetricValue('X23') }
+                    { label: '설계변경 공사비 증감률', pattern: 'X22', value: this.getMetricValue('X22') },
+                    { label: '비용성과 정성 평가', pattern: 'X23', value: this.getMetricValue('X23') }
                 ]
             },
             Y3: {
                 name: '품질성과 (Y3)',
-                score: this.getYKpiScoreFormatted('Y3. 품질성과'),
+                score: this.getYKpiScoreFormatted('품질성과(Y3)'),
                 metrics: [
                     { label: '검측 불합격률', pattern: 'X33', value: this.getMetricValue('X33') },
                     { label: '품질 SL-PA 결과', pattern: 'X34', value: this.getMetricValue('X34') },
-                    { label: '품질성과 수준 평가', pattern: 'X35', value: this.getMetricValue('X35') }
+                    { label: '품질성과 정성 평가', pattern: 'X35', value: this.getMetricValue('X35') }
                 ]
             },
             Y4: {
@@ -831,41 +842,43 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
                     { label: '재해율', pattern: 'X41', value: this.getMetricValue('X41') },
                     { label: '재해강도율', pattern: 'X42', value: this.getMetricValue('X42') },
                     { label: '안전 SL-PA 결과', pattern: 'X43', value: this.getMetricValue('X43') },
-                    { label: '안전성과 수준 평가', pattern: 'X44', value: this.getMetricValue('X44') }
+                    { label: '안전성과 정성 평가', pattern: 'X44', value: this.getMetricValue('X44') }
                 ]
             },
             Y5: {
                 name: '환경성과 (Y5)',
-                score: this.getYKpiScoreFormatted('Y5. 환경성과'),
+                score: this.getYKpiScoreFormatted('환경성과(Y5)'),
                 metrics: [
                     { label: '건설폐기물 발생량', pattern: 'X51', value: this.getMetricValue('X51') },
-                    { label: '환경성과 수준 평가', pattern: 'X52', value: this.getMetricValue('X52') }
+                    { label: '환경성과 정성 평가', pattern: 'X52', value: this.getMetricValue('X52') }
                 ]
             },
             Y6: {
                 name: '생산성 성과 (Y6)',
-                score: this.getYKpiScoreFormatted('Y6. 생산성성과'),
+                score: this.getYKpiScoreFormatted('생산성성과(Y6)'),
                 metrics: [
-                    { label: '투입인력 생산성', pattern: 'X61', value: this.getMetricValue('X61') },
-                    { label: '생산성성과 수준 평가', pattern: 'X62', value: this.getMetricValue('X62') }
+                    { label: '총 투입인력(M/M) 생산성', pattern: 'X61', value: this.getMetricValue('X61') },
+                    { label: '생산성성과 정성 평가', pattern: 'X62', value: this.getMetricValue('X62') }
                 ]
             }
         };
     }
     getYKpiBoxplotData() {
-        // KPI 카테고리 매핑 (Y-category KPI names to display categories)
-        const categoryMapping = {
-            Y01_productivity: '생산성과',
-            Y02_schedule: '일정성과',
-            Y03_cost: '비용성과',
-            Y04_quality: '품질성과',
-            Y05_safety: '안전성과',
-            Y06_environment: '환경성과'
+        // kpiName 표기가 환경마다 다양('Y1. 일정성과' / 'Y1. 일정' / '일정성과(Y1)' 등)하므로
+        // Y1~Y6 코드만 추출해 짧은 X축 라벨로 매핑 — 전체 문자열에 의존하지 않아 견고함.
+        const yLabelByCode = {
+            Y1: '일정',
+            Y2: '비용',
+            Y3: '품질',
+            Y4: '안전',
+            Y5: '환경',
+            Y6: '생산성'
         };
         const data = [];
         // Y-KPI 카테고리별로 통합된 통계 생성
         this.kpiYComprehensiveStats.forEach(stat => {
-            const category = categoryMapping[stat.kpiName] || stat.kpiName;
+            var _a, _b;
+            const category = yLabelByCode[(_b = (_a = (stat.kpiName || '').match(/Y[1-6]/)) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : ''] || stat.kpiName;
             data.push({
                 org: category, // org 필드 사용 (boxplot 차트가 기대하는 필드명)
                 min: stat.minVal * 100,
@@ -877,7 +890,9 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
                 value: this.getProjectYKpiValue(stat.kpiName) * 100 // 현재 프로젝트의 실제 Y-KPI 값 (0~1 → 0~20)
             });
         });
-        return data.sort((a, b) => a.org.localeCompare(b.org));
+        // 가나다순(localeCompare)이 아니라 Y1~Y6 고정 순서로 정렬 (일정·비용·품질·안전·환경·생산성)
+        const ORDER = ['일정', '비용', '품질', '안전', '환경', '생산성'];
+        return data.sort((a, b) => ORDER.indexOf(a.org) - ORDER.indexOf(b.org));
     }
     /**
      * KpiMetric.name 이 주어진 이름인 KpiMetricValue 중 가장 최근 valueDate 의 value.
@@ -906,26 +921,29 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
         return (_b = (_a = this.selectedKpi) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : null;
     }
     getProjectYKpiValue(kpiName) {
-        var _a, _b;
-        // 현재 프로젝트의 kpiValues 배열에서 해당 KPI 값을 찾습니다
-        const kpiValue = (_b = (_a = this.project) === null || _a === void 0 ? void 0 : _a.kpiValues) === null || _b === void 0 ? void 0 : _b.find(kv => kv.kpiName === kpiName);
+        var _a, _b, _c;
+        // kpiName 표기가 'Y1. 일정성과' / '일정성과(Y1)' 등으로 달라 정확 매칭은 자주 실패함.
+        // Y1~Y6 코드만 추출해 매칭 → 형식 차이와 무관하게 값 조회.
+        const code = (_a = (kpiName || '').match(/Y[1-6]/)) === null || _a === void 0 ? void 0 : _a[0];
+        const kpiValue = (_c = (_b = this.project) === null || _b === void 0 ? void 0 : _b.kpiValues) === null || _c === void 0 ? void 0 : _c.find(kv => { var _a; return code ? ((_a = (kv.kpiName || '').match(/Y[1-6]/)) === null || _a === void 0 ? void 0 : _a[0]) === code : kv.kpiName === kpiName; });
         return (kpiValue === null || kpiValue === void 0 ? void 0 : kpiValue.value) || 0;
     }
     getRadarChartData() {
-        // KPI 카테고리 매핑 (Y-category KPI names to display categories)
-        const categoryMapping = {
-            Y01_productivity: '생산성',
-            Y02_schedule: '일정',
-            Y03_cost: '비용',
-            Y04_quality: '품질',
-            Y05_safety: '안전',
-            Y06_environment: '환경'
+        // kpiName 표기가 다양하므로 Y1~Y6 코드만 추출해 짧은 라벨로 매핑 (박스플롯과 동일 방식).
+        const yLabelByCode = {
+            Y1: '일정',
+            Y2: '비용',
+            Y3: '품질',
+            Y4: '안전',
+            Y5: '환경',
+            Y6: '생산성'
         };
         const data = [];
         const categories = [];
         // Create baseline data from comprehensive stats (using avgVal as baseline)
         this.kpiYComprehensiveStats.forEach(stat => {
-            const category = categoryMapping[stat.kpiName] || stat.kpiName;
+            var _a, _b;
+            const category = yLabelByCode[(_b = (_a = (stat.kpiName || '').match(/Y[1-6]/)) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : ''] || stat.kpiName;
             if (!categories.includes(category)) {
                 categories.push(category);
             }
@@ -946,7 +964,7 @@ let SvProjectDetailPage = class SvProjectDetailPage extends ScopedElementsMixin(
             data,
             categories: categories.length > 0
                 ? categories
-                : ['Y1. 일정성과', 'Y2. 비용성과', 'Y3. 품질성과', 'Y4. 안전성과', 'Y5. 환경성과', 'Y6. 생산성성과']
+                : ['일정', '비용', '품질', '안전', '환경', '생산성']
         };
     }
     getBoxPlotDataForProject(project) {