npm - @dssp/dkpi - Versions diffs - 1.0.0-alpha.64 → 1.0.0-alpha.66 - Mend

@dssp/dkpi 1.0.0-alpha.64 → 1.0.0-alpha.66

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 (79) hide show

package/dist-client/pages/kpi-dashboard/cards/kpi-level3-comparison.d.ts CHANGED Viewed

@@ -3,6 +3,8 @@ import '../../components/kpi-radar-chart';
 import '../../components/kpi-boxplot-chart';
 export declare class KpiLevel3Comparison extends LitElement {
     static styles: import("lit").CSSResult;
+    sectorType: string;
+    buildingUsage: string;
     loading: boolean;
     error: string;
     radarData: any[];
@@ -10,12 +12,11 @@ export declare class KpiLevel3Comparison extends LitElement {
     kpis: string[];
     availableCategories: string[];
     selectedCategory: string;
-    currentMonth: string;
     totalKpis: number;
     averageScore: number;
     categoryStats: Map<string, any[]>;
     connectedCallback(): void;
-    private getCurrentMonth;
+    updated(changedProperties: Map<string, unknown>): void;
     fetchKpiComparison(): Promise<void>;
     private onCategoryChange;
     private generateKpiCharts;

package/dist-client/pages/kpi-dashboard/cards/kpi-level3-comparison.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { __decorate, __metadata } from "tslib";
 import { html, css, nothing } from 'lit';
-import { customElement, state } from 'lit/decorators.js';
+import { customElement, state, property } from 'lit/decorators.js';
 import { LitElement } from 'lit';
 import { client } from '@operato/graphql';
 import gql from 'graphql-tag';
@@ -9,6 +9,8 @@ import '../../components/kpi-boxplot-chart';
 let KpiLevel3Comparison = class KpiLevel3Comparison extends LitElement {
     constructor() {
         super(...arguments);
+        this.sectorType = '';
+        this.buildingUsage = '';
         this.loading = true;
         this.error = '';
         this.radarData = [];
@@ -16,82 +18,65 @@ let KpiLevel3Comparison = class KpiLevel3Comparison extends LitElement {
         this.kpis = [];
         this.availableCategories = [];
         this.selectedCategory = '';
-        this.currentMonth = '';
         this.totalKpis = 0;
         this.averageScore = 0;
         this.categoryStats = new Map();
     }
     connectedCallback() {
         super.connectedCallback();
-        this.currentMonth = this.getCurrentMonth();
         this.fetchKpiComparison();
     }
-    getCurrentMonth() {
-        const now = new Date();
-        const year = now.getFullYear();
-        const month = String(now.getMonth() + 1).padStart(2, '0');
-        return `${year}-${month}`;
+    updated(changedProperties) {
+        if (changedProperties.has('sectorType') || changedProperties.has('buildingUsage')) {
+            this.fetchKpiComparison();
+        }
     }
     async fetchKpiComparison() {
+        var _a;
         this.loading = true;
         this.error = '';
         try {
             const response = await client.query({
                 query: gql `
-          query {
-            kpiStatistics {
-              items {
-                id
-                valueDate
-                periodType
-                mean
-                median
-                standardDeviation
-                minimum
-                maximum
-                percentile25
-                percentile75
-                kpi {
-                  id
-                  name
-                  targetValue
-                  unit
-                  category: parent {
-                    id
-                    name
-                  }
-                }
-              }
+          query KpiLevel3Stats($sectorType: String, $buildingUsage: String) {
+            kpiProjectStats(kpiNamePattern: "X", sectorType: $sectorType, buildingUsage: $buildingUsage) {
+              kpiName
+              categoryName
+              minVal
+              q1Val
+              medVal
+              q3Val
+              maxVal
+              avgVal
+              stddevVal
+              projectCount
             }
           }
-        `
+        `,
+                variables: {
+                    sectorType: this.sectorType || null,
+                    buildingUsage: this.buildingUsage || null
+                }
             });
-            const statistics = response.data.kpiStatistics.items || [];
-            // MONTH 타입의 현재 월 데이터만 필터링
-            const currentMonthStats = statistics.filter(stat => stat.periodType === 'MONTH' && stat.valueDate === this.currentMonth);
-            if (currentMonthStats.length === 0) {
-                this.error = '현재 월의 데이터가 없습니다.';
+            const stats = response.data.kpiProjectStats || [];
+            if (stats.length === 0) {
+                this.error = '데이터가 없습니다.';
                 return;
             }
-            // 카테고리별로 데이터 그룹화
-            const categoryStats = new Map();
-            currentMonthStats.forEach(stat => {
-                var _a, _b;
-                if ((_b = (_a = stat.kpi) === null || _a === void 0 ? void 0 : _a.category) === null || _b === void 0 ? void 0 : _b.name) {
-                    const categoryName = stat.kpi.category.name;
-                    if (!categoryStats.has(categoryName)) {
-                        categoryStats.set(categoryName, []);
-                    }
-                    categoryStats.get(categoryName).push(stat);
-                }
+            // X-level KPIs를 categoryName(Y-level)으로 그룹화
+            const categoryMap = new Map();
+            stats.forEach(stat => {
+                const catName = stat.categoryName || '기타';
+                if (!categoryMap.has(catName))
+                    categoryMap.set(catName, []);
+                categoryMap.get(catName).push(stat);
             });
-            this.categoryStats = categoryStats;
-            this.availableCategories = Array.from(categoryStats.keys());
-            // 첫 번째 카테고리를 기본 선택
-            if (this.availableCategories.length > 0 && !this.selectedCategory) {
-                this.selectedCategory = this.availableCategories[0];
+            this.categoryStats = categoryMap;
+            this.availableCategories = Array.from(categoryMap.keys());
+            // 카테고리 변경 시 선택 초기화
+            if (!this.selectedCategory || !categoryMap.has(this.selectedCategory)) {
+                this.selectedCategory = (_a = this.availableCategories[0]) !== null && _a !== void 0 ? _a : '';
             }
-            // 선택된 카테고리의 데이터로 차트 생성
             if (this.selectedCategory) {
                 this.generateKpiCharts();
             }
@@ -119,41 +104,24 @@ let KpiLevel3Comparison = class KpiLevel3Comparison extends LitElement {
             return;
         }
         const categoryData = this.categoryStats.get(this.selectedCategory);
-        this.kpis = categoryData.map(stat => { var _a; return ((_a = stat.kpi) === null || _a === void 0 ? void 0 : _a.name) || ''; }).filter(Boolean);
+        this.kpis = categoryData.map(s => s.kpiName);
         this.totalKpis = this.kpis.length;
-        // 레이더 차트 데이터 생성
         this.generateRadarData(categoryData);
-        // 박스플롯 데이터 생성
         this.generateBoxplotData(categoryData);
-        // 평균 점수 계산
-        const scores = categoryData.map(stat => {
-            var _a;
-            const mean = stat.mean || 0;
-            const targetValue = ((_a = stat.kpi) === null || _a === void 0 ? void 0 : _a.targetValue) || 100;
-            if (targetValue === 0)
-                return 0;
-            const achievement = Math.min((mean / targetValue) * 100, 100);
-            return Math.max(achievement, 0);
-        });
-        this.averageScore = Math.round(scores.reduce((sum, score) => sum + score, 0) / scores.length);
+        const scores = categoryData.map(s => s.avgVal * 100);
+        this.averageScore = Math.round(scores.reduce((a, b) => a + b, 0) / scores.length);
     }
     generateRadarData(categoryData) {
         const result = [];
         this.kpis.forEach(kpiName => {
-            const stat = categoryData.find(s => { var _a; return ((_a = s.kpi) === null || _a === void 0 ? void 0 : _a.name) === kpiName; });
+            const stat = categoryData.find(s => s.kpiName === kpiName);
             if (stat) {
-                const mean = stat.mean || 0;
-                const median = stat.median || 0;
-                const stdDev = stat.standardDeviation || 0;
-                if (mean > 0) {
-                    result.push({ group: '평균', category: kpiName, value: mean });
-                }
-                if (median > 0) {
-                    result.push({ group: '중앙값', category: kpiName, value: median });
-                }
-                if (stdDev > 0) {
-                    result.push({ group: '표준편차', category: kpiName, value: stdDev });
-                }
+                if (stat.avgVal > 0)
+                    result.push({ group: '평균', category: kpiName, value: stat.avgVal });
+                if (stat.medVal > 0)
+                    result.push({ group: '중앙값', category: kpiName, value: stat.medVal });
+                if (stat.stddevVal > 0)
+                    result.push({ group: '표준편차', category: kpiName, value: stat.stddevVal });
             }
         });
         this.radarData = result;
@@ -161,26 +129,18 @@ let KpiLevel3Comparison = class KpiLevel3Comparison extends LitElement {
     generateBoxplotData(categoryData) {
         const result = [];
         this.kpis.forEach(kpiName => {
-            const stat = categoryData.find(s => { var _a; return ((_a = s.kpi) === null || _a === void 0 ? void 0 : _a.name) === kpiName; });
-            if (stat) {
-                const mean = stat.mean || 0;
-                const median = stat.median || 0;
-                const min = stat.minimum || 0;
-                const max = stat.maximum || 0;
-                const q1 = stat.percentile25 || 0;
-                const q3 = stat.percentile75 || 0;
-                if (mean > 0) {
-                    result.push({
-                        group: kpiName,
-                        min,
-                        q1,
-                        median,
-                        q3,
-                        max,
-                        mean,
-                        value: mean
-                    });
-                }
+            const stat = categoryData.find(s => s.kpiName === kpiName);
+            if (stat && stat.avgVal > 0) {
+                result.push({
+                    group: kpiName,
+                    min: stat.minVal,
+                    q1: stat.q1Val,
+                    median: stat.medVal,
+                    q3: stat.q3Val,
+                    max: stat.maxVal,
+                    mean: stat.avgVal,
+                    value: stat.avgVal
+                });
             }
         });
         this.boxplotData = result;
@@ -242,7 +202,7 @@ let KpiLevel3Comparison = class KpiLevel3Comparison extends LitElement {
         }
         return html `
       <div class="comparison-container">
-        <div class="comparison-title">KPI 상세 비교 분석 (${this.currentMonth})</div>
+        <div class="comparison-title">KPI 상세 비교 분석</div>
         <div class="category-selector">
           <div class="selector-label">카테고리:</div>
@@ -418,6 +378,14 @@ KpiLevel3Comparison.styles = css `
       color: #666;
     }
   `;
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], KpiLevel3Comparison.prototype, "sectorType", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], KpiLevel3Comparison.prototype, "buildingUsage", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)
@@ -446,10 +414,6 @@ __decorate([
     state(),
     __metadata("design:type", Object)
 ], KpiLevel3Comparison.prototype, "selectedCategory", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], KpiLevel3Comparison.prototype, "currentMonth", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)

package/dist-client/pages/kpi-dashboard/cards/kpi-level3-comparison.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"kpi-level3-comparison.js","sourceRoot":"","sources":["../../../../client/pages/kpi-dashboard/cards/kpi-level3-comparison.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,KAAK,CAAA;AACxC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAChC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,kCAAkC,CAAA;AACzC,OAAO,oCAAoC,CAAA;AAGpC,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,UAAU;IAA5C;;QAmHI,YAAO,GAAG,IAAI,CAAA;QACd,UAAK,GAAG,EAAE,CAAA;QACV,cAAS,GAAU,EAAE,CAAA;QACrB,gBAAW,GAAU,EAAE,CAAA;QACvB,SAAI,GAAa,EAAE,CAAA;QACnB,wBAAmB,GAAa,EAAE,CAAA;QAClC,qBAAgB,GAAG,EAAE,CAAA;QACrB,iBAAY,GAAG,EAAE,CAAA;QACjB,cAAS,GAAG,CAAC,CAAA;QACb,iBAAY,GAAG,CAAC,CAAA;QAChB,kBAAa,GAAG,IAAI,GAAG,EAAiB,CAAA;IAoTnD,CAAC;IAlTC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAA;QACzB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE,CAAA;QAC1C,IAAI,CAAC,kBAAkB,EAAE,CAAA;IAC3B,CAAC;IAEO,eAAe;QACrB,MAAM,GAAG,GAAG,IAAI,IAAI,EAAE,CAAA;QACtB,MAAM,IAAI,GAAG,GAAG,CAAC,WAAW,EAAE,CAAA;QAC9B,MAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAA;QACzD,OAAO,GAAG,IAAI,IAAI,KAAK,EAAE,CAAA;IAC3B,CAAC;IAED,KAAK,CAAC,kBAAkB;QACtB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;QACnB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA;QAEf,IAAI,CAAC;YACH,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;gBAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;SA2BT;aACF,CAAC,CAAA;YAEF,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,IAAI,EAAE,CAAA;YAE1D,0BAA0B;YAC1B,MAAM,iBAAiB,GAAG,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,UAAU,KAAK,OAAO,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,YAAY,CAAC,CAAA;YAExH,IAAI,iBAAiB,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBACnC,IAAI,CAAC,KAAK,GAAG,kBAAkB,CAAA;gBAC/B,OAAM;YACR,CAAC;YAED,iBAAiB;YACjB,MAAM,aAAa,GAAG,IAAI,GAAG,EAAiB,CAAA;YAE9C,iBAAiB,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;;gBAC/B,IAAI,MAAA,MAAA,IAAI,CAAC,GAAG,0CAAE,QAAQ,0CAAE,IAAI,EAAE,CAAC;oBAC7B,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAA;oBAC3C,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,YAAY,CAAC,EAAE,CAAC;wBACrC,aAAa,CAAC,GAAG,CAAC,YAAY,EAAE,EAAE,CAAC,CAAA;oBACrC,CAAC;oBACD,aAAa,CAAC,GAAG,CAAC,YAAY,CAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;gBAC7C,CAAC;YACH,CAAC,CAAC,CAAA;YAEF,IAAI,CAAC,aAAa,GAAG,aAAa,CAAA;YAClC,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,CAAA;YAE3D,mBAAmB;YACnB,IAAI,IAAI,CAAC,mBAAmB,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBAClE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAA;YACrD,CAAC;YAED,uBAAuB;YACvB,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBAC1B,IAAI,CAAC,iBAAiB,EAAE,CAAA;YAC1B,CAAC;QACH,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,OAAO,CAAC,KAAK,CAAC,yBAAyB,EAAE,CAAC,CAAC,CAAA;YAC3C,IAAI,CAAC,KAAK,GAAG,yBAAyB,CAAA;QACxC,CAAC;gBAAS,CAAC;YACT,IAAI,CAAC,OAAO,GAAG,KAAK,CAAA;QACtB,CAAC;IACH,CAAC;IAEO,gBAAgB,CAAC,KAAY;QACnC,MAAM,MAAM,GAAG,KAAK,CAAC,MAA2B,CAAA;QAChD,IAAI,CAAC,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAA;QACpC,IAAI,CAAC,iBAAiB,EAAE,CAAA;IAC1B,CAAC;IAEO,iBAAiB;QACvB,IAAI,CAAC,IAAI,CAAC,gBAAgB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC;YAC7E,IAAI,CAAC,SAAS,GAAG,EAAE,CAAA;YACnB,IAAI,CAAC,WAAW,GAAG,EAAE,CAAA;YACrB,IAAI,CAAC,IAAI,GAAG,EAAE,CAAA;YACd,IAAI,CAAC,SAAS,GAAG,CAAC,CAAA;YAClB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAA;YACrB,OAAM;QACR,CAAC;QAED,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,gBAAgB,CAAE,CAAA;QACnE,IAAI,CAAC,IAAI,GAAG,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,WAAC,OAAA,CAAA,MAAA,IAAI,CAAC,GAAG,0CAAE,IAAI,KAAI,EAAE,CAAA,EAAA,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;QAC1E,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,CAAA;QAEjC,gBAAgB;QAChB,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,CAAA;QAEpC,cAAc;QACd,IAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,CAAA;QAEtC,WAAW;QACX,MAAM,MAAM,GAAG,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;;YACrC,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,CAAA;YAC3B,MAAM,WAAW,GAAG,CAAA,MAAA,IAAI,CAAC,GAAG,0CAAE,WAAW,KAAI,GAAG,CAAA;YAChD,IAAI,WAAW,KAAK,CAAC;gBAAE,OAAO,CAAC,CAAA;YAC/B,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,WAAW,CAAC,GAAG,GAAG,EAAE,GAAG,CAAC,CAAA;YAC7D,OAAO,IAAI,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC,CAAA;QACjC,CAAC,CAAC,CAAA;QACF,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,GAAG,GAAG,KAAK,EAAE,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;IAC/F,CAAC;IAEO,iBAAiB,CAAC,YAAmB;QAC3C,MAAM,MAAM,GAAU,EAAE,CAAA;QAExB,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;YAC1B,MAAM,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,WAAC,OAAA,CAAA,MAAA,CAAC,CAAC,GAAG,0CAAE,IAAI,MAAK,OAAO,CAAA,EAAA,CAAC,CAAA;YAC5D,IAAI,IAAI,EAAE,CAAC;gBACT,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,CAAA;gBAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,IAAI,CAAC,CAAA;gBAC/B,MAAM,MAAM,GAAG,IAAI,CAAC,iBAAiB,IAAI,CAAC,CAAA;gBAE1C,IAAI,IAAI,GAAG,CAAC,EAAE,CAAC;oBACb,MAAM,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAA;gBAC9D,CAAC;gBACD,IAAI,MAAM,GAAG,CAAC,EAAE,CAAC;oBACf,MAAM,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAA;gBACjE,CAAC;gBACD,IAAI,MAAM,GAAG,CAAC,EAAE,CAAC;oBACf,MAAM,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAA;gBAClE,CAAC;YACH,CAAC;QACH,CAAC,CAAC,CAAA;QAEF,IAAI,CAAC,SAAS,GAAG,MAAM,CAAA;IACzB,CAAC;IAEO,mBAAmB,CAAC,YAAmB;QAC7C,MAAM,MAAM,GAAU,EAAE,CAAA;QAExB,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;YAC1B,MAAM,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,WAAC,OAAA,CAAA,MAAA,CAAC,CAAC,GAAG,0CAAE,IAAI,MAAK,OAAO,CAAA,EAAA,CAAC,CAAA;YAC5D,IAAI,IAAI,EAAE,CAAC;gBACT,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,CAAA;gBAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,IAAI,CAAC,CAAA;gBAC/B,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,IAAI,CAAC,CAAA;gBAC7B,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,IAAI,CAAC,CAAA;gBAC7B,MAAM,EAAE,GAAG,IAAI,CAAC,YAAY,IAAI,CAAC,CAAA;gBACjC,MAAM,EAAE,GAAG,IAAI,CAAC,YAAY,IAAI,CAAC,CAAA;gBAEjC,IAAI,IAAI,GAAG,CAAC,EAAE,CAAC;oBACb,MAAM,CAAC,IAAI,CAAC;wBACV,KAAK,EAAE,OAAO;wBACd,GAAG;wBACH,EAAE;wBACF,MAAM;wBACN,EAAE;wBACF,GAAG;wBACH,IAAI;wBACJ,KAAK,EAAE,IAAI;qBACZ,CAAC,CAAA;gBACJ,CAAC;YACH,CAAC;QACH,CAAC,CAAC,CAAA;QAEF,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA;IAC3B,CAAC;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,OAAO,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;;;OAwBV,CAAA;QACH,CAAC;QAED,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,OAAO,IAAI,CAAA;;;;;;;;;;;;;qCAaoB,IAAI,CAAC,KAAK;;;;;;qCAMV,IAAI,CAAC,KAAK;;;;;OAKxC,CAAA;QACH,CAAC;QAED,OAAO,IAAI,CAAA;;sDAEuC,IAAI,CAAC,YAAY;;;;mDAIpB,IAAI,CAAC,gBAAgB,YAAY,IAAI,CAAC,gBAAgB;cAC3F,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAA,kBAAkB,QAAQ,KAAK,QAAQ,WAAW,CAAC;;;;;;;;gBAQ9F,IAAI,CAAC,gBAAgB;YACrB,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC;gBACzB,CAAC,CAAC,IAAI,CAAA;8BACM,IAAI,CAAC,SAAS;oCACR,IAAI,CAAC,IAAI;sCACP,IAAI;2CACC;gBACzB,CAAC,CAAC,IAAI,CAAA,iDAAiD;YACzD,CAAC,CAAC,IAAI,CAAA,8CAA8C;;;;;;;gBAOpD,IAAI,CAAC,gBAAgB;YACrB,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC;gBAC3B,CAAC,CAAC,IAAI,CAAA;8BACM,IAAI,CAAC,WAAW;gCACd,IAAI,CAAC,IAAI;sCACH,IAAI;6CACG;gBAC3B,CAAC,CAAC,IAAI,CAAA,iDAAiD;YACzD,CAAC,CAAC,IAAI,CAAA,8CAA8C;;;;;UAK1D,IAAI,CAAC,gBAAgB;YACrB,CAAC,CAAC,IAAI,CAAA;;;+CAG+B,IAAI,CAAC,gBAAgB;;;;+CAIrB,IAAI,CAAC,SAAS;;;;+CAId,IAAI,CAAC,YAAY;;;;aAInD;YACH,CAAC,CAAC,OAAO;;KAEd,CAAA;IACH,CAAC;;AA/aM,0BAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgHlB,AAhHY,CAgHZ;AAEQ;IAAR,KAAK,EAAE;;oDAAe;AACd;IAAR,KAAK,EAAE;;kDAAW;AACV;IAAR,KAAK,EAAE;;sDAAsB;AACrB;IAAR,KAAK,EAAE;;wDAAwB;AACvB;IAAR,KAAK,EAAE;;iDAAoB;AACnB;IAAR,KAAK,EAAE;;gEAAmC;AAClC;IAAR,KAAK,EAAE;;6DAAsB;AACrB;IAAR,KAAK,EAAE;;yDAAkB;AACjB;IAAR,KAAK,EAAE;;sDAAc;AACb;IAAR,KAAK,EAAE;;yDAAiB;AAChB;IAAR,KAAK,EAAE;;0DAAyC;AA7HtC,mBAAmB;IAD/B,aAAa,CAAC,uBAAuB,CAAC;GAC1B,mBAAmB,CAib/B","sourcesContent":["import { html, css, nothing } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\nimport { LitElement } from 'lit'\nimport { client } from '@operato/graphql'\nimport gql from 'graphql-tag'\nimport '../../components/kpi-radar-chart'\nimport '../../components/kpi-boxplot-chart'\n\n@customElement('kpi-level3-comparison')\nexport class KpiLevel3Comparison extends LitElement {\n static styles = css`\n :host {\n display: block;\n }\n .comparison-container {\n background: #fff;\n border-radius: 16px;\n padding: 24px;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);\n border: 1px solid #e0e0e0;\n width: 100%;\n }\n .comparison-title {\n font-size: 1.3rem;\n font-weight: bold;\n margin-bottom: 20px;\n color: #333;\n text-align: center;\n }\n .category-selector {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 24px;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 8px;\n border: 1px solid #e9ecef;\n }\n .selector-label {\n font-weight: 600;\n color: #495057;\n min-width: 80px;\n }\n .category-select {\n padding: 8px 12px;\n border: 1px solid #ced4da;\n border-radius: 6px;\n background: white;\n font-size: 1rem;\n min-width: 200px;\n }\n .category-select:focus {\n outline: none;\n border-color: #667eea;\n box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.2);\n }\n .charts-section {\n display: flex;\n gap: 24px;\n margin-bottom: 20px;\n }\n .chart-card {\n flex: 1;\n background: #f8f9fa;\n border-radius: 12px;\n padding: 20px;\n border: 1px solid #e9ecef;\n }\n .chart-title {\n font-size: 1.1rem;\n font-weight: 600;\n margin-bottom: 16px;\n color: #495057;\n text-align: center;\n }\n .chart-container {\n height: 300px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n .loading {\n color: #666;\n font-size: 1rem;\n }\n .error {\n color: #d32f2f;\n font-size: 1rem;\n }\n .no-data {\n color: #666;\n font-size: 1rem;\n text-align: center;\n }\n .no-category {\n color: #666;\n font-size: 1rem;\n text-align: center;\n font-style: italic;\n }\n .summary-info {\n display: flex;\n justify-content: space-around;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 8px;\n margin-top: 16px;\n }\n .summary-item {\n text-align: center;\n }\n .summary-value {\n font-size: 1.2rem;\n font-weight: bold;\n color: #333;\n margin-bottom: 4px;\n }\n .summary-label {\n font-size: 0.9rem;\n color: #666;\n }\n `\n\n @state() loading = true\n @state() error = ''\n @state() radarData: any[] = []\n @state() boxplotData: any[] = []\n @state() kpis: string[] = []\n @state() availableCategories: string[] = []\n @state() selectedCategory = ''\n @state() currentMonth = ''\n @state() totalKpis = 0\n @state() averageScore = 0\n @state() categoryStats = new Map<string, any[]>()\n\n connectedCallback() {\n super.connectedCallback()\n this.currentMonth = this.getCurrentMonth()\n this.fetchKpiComparison()\n }\n\n private getCurrentMonth(): string {\n const now = new Date()\n const year = now.getFullYear()\n const month = String(now.getMonth() + 1).padStart(2, '0')\n return `${year}-${month}`\n }\n\n async fetchKpiComparison() {\n this.loading = true\n this.error = ''\n\n try {\n const response = await client.query({\n query: gql`\n query {\n kpiStatistics {\n items {\n id\n valueDate\n periodType\n mean\n median\n standardDeviation\n minimum\n maximum\n percentile25\n percentile75\n kpi {\n id\n name\n targetValue\n unit\n category: parent {\n id\n name\n }\n }\n }\n }\n }\n `\n })\n\n const statistics = response.data.kpiStatistics.items \|\| []\n\n // MONTH 타입의 현재 월 데이터만 필터링\n const currentMonthStats = statistics.filter(stat => stat.periodType === 'MONTH' && stat.valueDate === this.currentMonth)\n\n if (currentMonthStats.length === 0) {\n this.error = '현재 월의 데이터가 없습니다.'\n return\n }\n\n // 카테고리별로 데이터 그룹화\n const categoryStats = new Map<string, any[]>()\n\n currentMonthStats.forEach(stat => {\n if (stat.kpi?.category?.name) {\n const categoryName = stat.kpi.category.name\n if (!categoryStats.has(categoryName)) {\n categoryStats.set(categoryName, [])\n }\n categoryStats.get(categoryName)!.push(stat)\n }\n })\n\n this.categoryStats = categoryStats\n this.availableCategories = Array.from(categoryStats.keys())\n\n // 첫 번째 카테고리를 기본 선택\n if (this.availableCategories.length > 0 && !this.selectedCategory) {\n this.selectedCategory = this.availableCategories[0]\n }\n\n // 선택된 카테고리의 데이터로 차트 생성\n if (this.selectedCategory) {\n this.generateKpiCharts()\n }\n } catch (e) {\n console.error('KPI 비교 데이터를 불러오지 못했습니다:', e)\n this.error = 'KPI 비교 데이터를 불러오지 못했습니다.'\n } finally {\n this.loading = false\n }\n }\n\n private onCategoryChange(event: Event) {\n const target = event.target as HTMLSelectElement\n this.selectedCategory = target.value\n this.generateKpiCharts()\n }\n\n private generateKpiCharts() {\n if (!this.selectedCategory \|\| !this.categoryStats.has(this.selectedCategory)) {\n this.radarData = []\n this.boxplotData = []\n this.kpis = []\n this.totalKpis = 0\n this.averageScore = 0\n return\n }\n\n const categoryData = this.categoryStats.get(this.selectedCategory)!\n this.kpis = categoryData.map(stat => stat.kpi?.name \|\| '').filter(Boolean)\n this.totalKpis = this.kpis.length\n\n // 레이더 차트 데이터 생성\n this.generateRadarData(categoryData)\n\n // 박스플롯 데이터 생성\n this.generateBoxplotData(categoryData)\n\n // 평균 점수 계산\n const scores = categoryData.map(stat => {\n const mean = stat.mean \|\| 0\n const targetValue = stat.kpi?.targetValue \|\| 100\n if (targetValue === 0) return 0\n const achievement = Math.min((mean / targetValue) * 100, 100)\n return Math.max(achievement, 0)\n })\n this.averageScore = Math.round(scores.reduce((sum, score) => sum + score, 0) / scores.length)\n }\n\n private generateRadarData(categoryData: any[]) {\n const result: any[] = []\n\n this.kpis.forEach(kpiName => {\n const stat = categoryData.find(s => s.kpi?.name === kpiName)\n if (stat) {\n const mean = stat.mean \|\| 0\n const median = stat.median \|\| 0\n const stdDev = stat.standardDeviation \|\| 0\n\n if (mean > 0) {\n result.push({ group: '평균', category: kpiName, value: mean })\n }\n if (median > 0) {\n result.push({ group: '중앙값', category: kpiName, value: median })\n }\n if (stdDev > 0) {\n result.push({ group: '표준편차', category: kpiName, value: stdDev })\n }\n }\n })\n\n this.radarData = result\n }\n\n private generateBoxplotData(categoryData: any[]) {\n const result: any[] = []\n\n this.kpis.forEach(kpiName => {\n const stat = categoryData.find(s => s.kpi?.name === kpiName)\n if (stat) {\n const mean = stat.mean \|\| 0\n const median = stat.median \|\| 0\n const min = stat.minimum \|\| 0\n const max = stat.maximum \|\| 0\n const q1 = stat.percentile25 \|\| 0\n const q3 = stat.percentile75 \|\| 0\n\n if (mean > 0) {\n result.push({\n group: kpiName,\n min,\n q1,\n median,\n q3,\n max,\n mean,\n value: mean\n })\n }\n }\n })\n\n this.boxplotData = result\n }\n\n render() {\n if (this.loading) {\n return html`\n <div class=\"comparison-container\">\n <div class=\"comparison-title\">KPI 상세 비교 분석</div>\n <div class=\"category-selector\">\n <div class=\"selector-label\">카테고리:</div>\n <select class=\"category-select\" disabled>\n <option>로딩 중...</option>\n </select>\n </div>\n <div class=\"charts-section\">\n <div class=\"chart-card\">\n <div class=\"chart-title\">레이더 차트</div>\n <div class=\"chart-container\">\n <div class=\"loading\">데이터 로딩 중...</div>\n </div>\n </div>\n <div class=\"chart-card\">\n <div class=\"chart-title\">박스플롯</div>\n <div class=\"chart-container\">\n <div class=\"loading\">데이터 로딩 중...</div>\n </div>\n </div>\n </div>\n </div>\n `\n }\n\n if (this.error) {\n return html`\n <div class=\"comparison-container\">\n <div class=\"comparison-title\">KPI 상세 비교 분석</div>\n <div class=\"category-selector\">\n <div class=\"selector-label\">카테고리:</div>\n <select class=\"category-select\" disabled>\n <option>오류 발생</option>\n </select>\n </div>\n <div class=\"charts-section\">\n <div class=\"chart-card\">\n <div class=\"chart-title\">레이더 차트</div>\n <div class=\"chart-container\">\n <div class=\"error\">${this.error}</div>\n </div>\n </div>\n <div class=\"chart-card\">\n <div class=\"chart-title\">박스플롯</div>\n <div class=\"chart-container\">\n <div class=\"error\">${this.error}</div>\n </div>\n </div>\n </div>\n </div>\n `\n }\n\n return html`\n <div class=\"comparison-container\">\n <div class=\"comparison-title\">KPI 상세 비교 분석 (${this.currentMonth})</div>\n\n <div class=\"category-selector\">\n <div class=\"selector-label\">카테고리:</div>\n <select class=\"category-select\" .value=${this.selectedCategory} @change=${this.onCategoryChange}>\n ${this.availableCategories.map(category => html`<option value=\"${category}\">${category}</option>`)}\n </select>\n </div>\n\n <div class=\"charts-section\">\n <div class=\"chart-card\">\n <div class=\"chart-title\">레이더 차트</div>\n <div class=\"chart-container\">\n ${this.selectedCategory\n ? this.radarData.length > 0\n ? html`<sv-kpi-radar-chart\n .data=${this.radarData}\n .categories=${this.kpis}\n .currentGroup=${'평균'}\n ></sv-kpi-radar-chart>`\n : html`<div class=\"no-data\">선택된 카테고리에 데이터가 없습니다.</div>`\n : html`<div class=\"no-category\">카테고리를 선택해주세요.</div>`}\n </div>\n </div>\n\n <div class=\"chart-card\">\n <div class=\"chart-title\">박스플롯</div>\n <div class=\"chart-container\">\n ${this.selectedCategory\n ? this.boxplotData.length > 0\n ? html`<sv-kpi-boxplot-chart\n .data=${this.boxplotData}\n .groups=${this.kpis}\n .currentGroup=${'평균'}\n ></sv-kpi-boxplot-chart>`\n : html`<div class=\"no-data\">선택된 카테고리에 데이터가 없습니다.</div>`\n : html`<div class=\"no-category\">카테고리를 선택해주세요.</div>`}\n </div>\n </div>\n </div>\n\n ${this.selectedCategory\n ? html`\n <div class=\"summary-info\">\n <div class=\"summary-item\">\n <div class=\"summary-value\">${this.selectedCategory}</div>\n <div class=\"summary-label\">선택된 카테고리</div>\n </div>\n <div class=\"summary-item\">\n <div class=\"summary-value\">${this.totalKpis}</div>\n <div class=\"summary-label\">KPI</div>\n </div>\n <div class=\"summary-item\">\n <div class=\"summary-value\">${this.averageScore}</div>\n <div class=\"summary-label\">평균 점수</div>\n </div>\n </div>\n `\n : nothing}\n </div>\n `\n }\n}\n"]}
1	+ {"version":3,"file":"kpi-level3-comparison.js","sourceRoot":"","sources":["../../../../client/pages/kpi-dashboard/cards/kpi-level3-comparison.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, nothing } from 'lit'\nimport { customElement, state, property } from 'lit/decorators.js'\nimport { LitElement } from 'lit'\nimport { client } from '@operato/graphql'\nimport gql from 'graphql-tag'\nimport '../../components/kpi-radar-chart'\nimport '../../components/kpi-boxplot-chart'\n\n@customElement('kpi-level3-comparison')\nexport class KpiLevel3Comparison extends LitElement {\n static styles = css`\n :host {\n display: block;\n }\n .comparison-container {\n background: #fff;\n border-radius: 16px;\n padding: 24px;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);\n border: 1px solid #e0e0e0;\n width: 100%;\n }\n .comparison-title {\n font-size: 1.3rem;\n font-weight: bold;\n margin-bottom: 20px;\n color: #333;\n text-align: center;\n }\n .category-selector {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 24px;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 8px;\n border: 1px solid #e9ecef;\n }\n .selector-label {\n font-weight: 600;\n color: #495057;\n min-width: 80px;\n }\n .category-select {\n padding: 8px 12px;\n border: 1px solid #ced4da;\n border-radius: 6px;\n background: white;\n font-size: 1rem;\n min-width: 200px;\n }\n .category-select:focus {\n outline: none;\n border-color: #667eea;\n box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.2);\n }\n .charts-section {\n display: flex;\n gap: 24px;\n margin-bottom: 20px;\n }\n .chart-card {\n flex: 1;\n background: #f8f9fa;\n border-radius: 12px;\n padding: 20px;\n border: 1px solid #e9ecef;\n }\n .chart-title {\n font-size: 1.1rem;\n font-weight: 600;\n margin-bottom: 16px;\n color: #495057;\n text-align: center;\n }\n .chart-container {\n height: 300px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n .loading {\n color: #666;\n font-size: 1rem;\n }\n .error {\n color: #d32f2f;\n font-size: 1rem;\n }\n .no-data {\n color: #666;\n font-size: 1rem;\n text-align: center;\n }\n .no-category {\n color: #666;\n font-size: 1rem;\n text-align: center;\n font-style: italic;\n }\n .summary-info {\n display: flex;\n justify-content: space-around;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 8px;\n margin-top: 16px;\n }\n .summary-item {\n text-align: center;\n }\n .summary-value {\n font-size: 1.2rem;\n font-weight: bold;\n color: #333;\n margin-bottom: 4px;\n }\n .summary-label {\n font-size: 0.9rem;\n color: #666;\n }\n `\n\n @property({ type: String }) sectorType: string = ''\n @property({ type: String }) buildingUsage: string = ''\n\n @state() loading = true\n @state() error = ''\n @state() radarData: any[] = []\n @state() boxplotData: any[] = []\n @state() kpis: string[] = []\n @state() availableCategories: string[] = []\n @state() selectedCategory = ''\n @state() totalKpis = 0\n @state() averageScore = 0\n @state() categoryStats = new Map<string, any[]>()\n\n connectedCallback() {\n super.connectedCallback()\n this.fetchKpiComparison()\n }\n\n override updated(changedProperties: Map<string, unknown>) {\n if (changedProperties.has('sectorType') \|\| changedProperties.has('buildingUsage')) {\n this.fetchKpiComparison()\n }\n }\n\n async fetchKpiComparison() {\n this.loading = true\n this.error = ''\n\n try {\n const response = await client.query({\n query: gql`\n query KpiLevel3Stats($sectorType: String, $buildingUsage: String) {\n kpiProjectStats(kpiNamePattern: \"X\", sectorType: $sectorType, buildingUsage: $buildingUsage) {\n kpiName\n categoryName\n minVal\n q1Val\n medVal\n q3Val\n maxVal\n avgVal\n stddevVal\n projectCount\n }\n }\n `,\n variables: {\n sectorType: this.sectorType \|\| null,\n buildingUsage: this.buildingUsage \|\| null\n }\n })\n\n const stats: any[] = response.data.kpiProjectStats \|\| []\n\n if (stats.length === 0) {\n this.error = '데이터가 없습니다.'\n return\n }\n\n // X-level KPIs를 categoryName(Y-level)으로 그룹화\n const categoryMap = new Map<string, any[]>()\n stats.forEach(stat => {\n const catName = stat.categoryName \|\| '기타'\n if (!categoryMap.has(catName)) categoryMap.set(catName, [])\n categoryMap.get(catName)!.push(stat)\n })\n\n this.categoryStats = categoryMap\n this.availableCategories = Array.from(categoryMap.keys())\n\n // 카테고리 변경 시 선택 초기화\n if (!this.selectedCategory \|\| !categoryMap.has(this.selectedCategory)) {\n this.selectedCategory = this.availableCategories[0] ?? ''\n }\n\n if (this.selectedCategory) {\n this.generateKpiCharts()\n }\n } catch (e) {\n console.error('KPI 비교 데이터를 불러오지 못했습니다:', e)\n this.error = 'KPI 비교 데이터를 불러오지 못했습니다.'\n } finally {\n this.loading = false\n }\n }\n\n private onCategoryChange(event: Event) {\n const target = event.target as HTMLSelectElement\n this.selectedCategory = target.value\n this.generateKpiCharts()\n }\n\n private generateKpiCharts() {\n if (!this.selectedCategory \|\| !this.categoryStats.has(this.selectedCategory)) {\n this.radarData = []\n this.boxplotData = []\n this.kpis = []\n this.totalKpis = 0\n this.averageScore = 0\n return\n }\n\n const categoryData = this.categoryStats.get(this.selectedCategory)!\n this.kpis = categoryData.map(s => s.kpiName)\n this.totalKpis = this.kpis.length\n\n this.generateRadarData(categoryData)\n this.generateBoxplotData(categoryData)\n\n const scores = categoryData.map(s => s.avgVal * 100)\n this.averageScore = Math.round(scores.reduce((a, b) => a + b, 0) / scores.length)\n }\n\n private generateRadarData(categoryData: any[]) {\n const result: any[] = []\n\n this.kpis.forEach(kpiName => {\n const stat = categoryData.find(s => s.kpiName === kpiName)\n if (stat) {\n if (stat.avgVal > 0) result.push({ group: '평균', category: kpiName, value: stat.avgVal })\n if (stat.medVal > 0) result.push({ group: '중앙값', category: kpiName, value: stat.medVal })\n if (stat.stddevVal > 0) result.push({ group: '표준편차', category: kpiName, value: stat.stddevVal })\n }\n })\n\n this.radarData = result\n }\n\n private generateBoxplotData(categoryData: any[]) {\n const result: any[] = []\n\n this.kpis.forEach(kpiName => {\n const stat = categoryData.find(s => s.kpiName === kpiName)\n if (stat && stat.avgVal > 0) {\n result.push({\n group: kpiName,\n min: stat.minVal,\n q1: stat.q1Val,\n median: stat.medVal,\n q3: stat.q3Val,\n max: stat.maxVal,\n mean: stat.avgVal,\n value: stat.avgVal\n })\n }\n })\n\n this.boxplotData = result\n }\n\n render() {\n if (this.loading) {\n return html`\n <div class=\"comparison-container\">\n <div class=\"comparison-title\">KPI 상세 비교 분석</div>\n <div class=\"category-selector\">\n <div class=\"selector-label\">카테고리:</div>\n <select class=\"category-select\" disabled>\n <option>로딩 중...</option>\n </select>\n </div>\n <div class=\"charts-section\">\n <div class=\"chart-card\">\n <div class=\"chart-title\">레이더 차트</div>\n <div class=\"chart-container\">\n <div class=\"loading\">데이터 로딩 중...</div>\n </div>\n </div>\n <div class=\"chart-card\">\n <div class=\"chart-title\">박스플롯</div>\n <div class=\"chart-container\">\n <div class=\"loading\">데이터 로딩 중...</div>\n </div>\n </div>\n </div>\n </div>\n `\n }\n\n if (this.error) {\n return html`\n <div class=\"comparison-container\">\n <div class=\"comparison-title\">KPI 상세 비교 분석</div>\n <div class=\"category-selector\">\n <div class=\"selector-label\">카테고리:</div>\n <select class=\"category-select\" disabled>\n <option>오류 발생</option>\n </select>\n </div>\n <div class=\"charts-section\">\n <div class=\"chart-card\">\n <div class=\"chart-title\">레이더 차트</div>\n <div class=\"chart-container\">\n <div class=\"error\">${this.error}</div>\n </div>\n </div>\n <div class=\"chart-card\">\n <div class=\"chart-title\">박스플롯</div>\n <div class=\"chart-container\">\n <div class=\"error\">${this.error}</div>\n </div>\n </div>\n </div>\n </div>\n `\n }\n\n return html`\n <div class=\"comparison-container\">\n <div class=\"comparison-title\">KPI 상세 비교 분석</div>\n\n <div class=\"category-selector\">\n <div class=\"selector-label\">카테고리:</div>\n <select class=\"category-select\" .value=${this.selectedCategory} @change=${this.onCategoryChange}>\n ${this.availableCategories.map(category => html`<option value=\"${category}\">${category}</option>`)}\n </select>\n </div>\n\n <div class=\"charts-section\">\n <div class=\"chart-card\">\n <div class=\"chart-title\">레이더 차트</div>\n <div class=\"chart-container\">\n ${this.selectedCategory\n ? this.radarData.length > 0\n ? html`<sv-kpi-radar-chart\n .data=${this.radarData}\n .categories=${this.kpis}\n .currentGroup=${'평균'}\n ></sv-kpi-radar-chart>`\n : html`<div class=\"no-data\">선택된 카테고리에 데이터가 없습니다.</div>`\n : html`<div class=\"no-category\">카테고리를 선택해주세요.</div>`}\n </div>\n </div>\n\n <div class=\"chart-card\">\n <div class=\"chart-title\">박스플롯</div>\n <div class=\"chart-container\">\n ${this.selectedCategory\n ? this.boxplotData.length > 0\n ? html`<sv-kpi-boxplot-chart\n .data=${this.boxplotData}\n .groups=${this.kpis}\n .currentGroup=${'평균'}\n ></sv-kpi-boxplot-chart>`\n : html`<div class=\"no-data\">선택된 카테고리에 데이터가 없습니다.</div>`\n : html`<div class=\"no-category\">카테고리를 선택해주세요.</div>`}\n </div>\n </div>\n </div>\n\n ${this.selectedCategory\n ? html`\n <div class=\"summary-info\">\n <div class=\"summary-item\">\n <div class=\"summary-value\">${this.selectedCategory}</div>\n <div class=\"summary-label\">선택된 카테고리</div>\n </div>\n <div class=\"summary-item\">\n <div class=\"summary-value\">${this.totalKpis}</div>\n <div class=\"summary-label\">KPI</div>\n </div>\n <div class=\"summary-item\">\n <div class=\"summary-value\">${this.averageScore}</div>\n <div class=\"summary-label\">평균 점수</div>\n </div>\n </div>\n `\n : nothing}\n </div>\n `\n }\n}\n"]}

package/dist-client/pages/kpi-dashboard/components/kpi-left-panel.d.ts CHANGED Viewed

@@ -9,6 +9,9 @@ export declare class KpiLeftPanel extends LitElement {
     mapData: any[];
     startYearMonth: string;
     endYearMonth: string;
+    sectorType: string;
+    buildingUsage: string;
+    private isAllPeriod;
     private chartData;
     private chartCategories;
     private kpiYComprehensiveStats;
@@ -23,6 +26,7 @@ export declare class KpiLeftPanel extends LitElement {
     private getRegionTrendData;
     private calculateChangeRate;
     private generateChartData;
+    private _onAllPeriodChange;
     private onCategoryChange;
     private onChartTypeChange;
     private onRegionClick;