lumencode 0.4.3 → 0.4.4
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.
- package/package.json +1 -1
- package/public/app.js +2 -13
- package/public/charts.js +0 -42
- package/public/config.js +0 -1
- package/public/index.html +0 -6
package/package.json
CHANGED
package/public/app.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { COLORS, TEXT, ID, STORAGE } from './config.js';
|
|
2
2
|
import { esc, fmt, fmtShort, renderTrendArrow, destroyChart, destroyAllCharts, setChart } from './utils.js';
|
|
3
3
|
import { createLatestRequestGuard, fetchTools, fetchReport, fetchConfig, saveConfig, fetchDetails, fetchSessions } from './api.js';
|
|
4
|
-
import { renderDoughnut, renderBar, renderTrend, renderCommitTypeChart,
|
|
4
|
+
import { renderDoughnut, renderBar, renderTrend, renderCommitTypeChart, renderModelCostChart } from './charts.js';
|
|
5
5
|
import { renderGitInsights } from './git-insights.js';
|
|
6
6
|
import { loadWorkReport, copyWorkReport, downloadMarkdown, getWorkReportState, setWorkReportState } from './work-report.js';
|
|
7
7
|
import { exportCSV, printReport, exportJSON, exportHTML } from './export.js';
|
|
@@ -247,17 +247,6 @@ function registerAlpineComponents() {
|
|
|
247
247
|
trendSection.style.display = 'none';
|
|
248
248
|
}
|
|
249
249
|
|
|
250
|
-
// Cache efficiency chart
|
|
251
|
-
const cacheSection = document.getElementById('cacheSection');
|
|
252
|
-
if (cacheSection) {
|
|
253
|
-
if (usageStats.cacheRead > 0 || usageStats.cacheCreate > 0) {
|
|
254
|
-
cacheSection.style.display = 'block';
|
|
255
|
-
renderCacheEfficiency(ID.CACHE_CHART, usageStats.cacheRead, usageStats.cacheCreate, usageStats.inputTokens, data.costBreakdown);
|
|
256
|
-
} else {
|
|
257
|
-
cacheSection.style.display = 'none';
|
|
258
|
-
}
|
|
259
|
-
}
|
|
260
|
-
|
|
261
250
|
// Model cost chart
|
|
262
251
|
const modelCostSection = document.getElementById('modelCostSection');
|
|
263
252
|
if (modelCostSection) {
|
|
@@ -270,7 +259,7 @@ function registerAlpineComponents() {
|
|
|
270
259
|
}
|
|
271
260
|
|
|
272
261
|
if (!hasData) {
|
|
273
|
-
destroyAllCharts([ID.SCENARIO_CHART, ID.MODEL_CHART, ID.PROJECT_CHART, ID.TOOL_CHART, ID.
|
|
262
|
+
destroyAllCharts([ID.SCENARIO_CHART, ID.MODEL_CHART, ID.PROJECT_CHART, ID.TOOL_CHART, ID.MODEL_COST_CHART]);
|
|
274
263
|
this.updateGitPanel(gitStats, this.activeTool, reposConfigured);
|
|
275
264
|
return;
|
|
276
265
|
}
|
package/public/charts.js
CHANGED
|
@@ -108,48 +108,6 @@ export function renderTrend(trendData) {
|
|
|
108
108
|
return instance;
|
|
109
109
|
}
|
|
110
110
|
|
|
111
|
-
// ── Cache Efficiency ──
|
|
112
|
-
export function renderCacheEfficiency(canvasId, cacheRead, cacheCreate, inputTokens, costBreakdown) {
|
|
113
|
-
const total = cacheRead + inputTokens + cacheCreate;
|
|
114
|
-
if (total === 0) { destroyChart(canvasId); return null; }
|
|
115
|
-
|
|
116
|
-
destroyChart(canvasId);
|
|
117
|
-
const canvas = document.getElementById(canvasId);
|
|
118
|
-
if (!canvas) return null;
|
|
119
|
-
const ctx = canvas.getContext('2d');
|
|
120
|
-
const instance = new Chart(ctx, {
|
|
121
|
-
type: 'bar',
|
|
122
|
-
data: {
|
|
123
|
-
labels: ['Token 构成'],
|
|
124
|
-
datasets: [
|
|
125
|
-
{ label: '缓存命中', data: [cacheRead], backgroundColor: '#22c55e', borderRadius: 4 },
|
|
126
|
-
{ label: '新输入', data: [inputTokens], backgroundColor: '#3b82f6', borderRadius: 4 },
|
|
127
|
-
{ label: '缓存写入', data: [cacheCreate], backgroundColor: '#f59e0b', borderRadius: 4 },
|
|
128
|
-
],
|
|
129
|
-
},
|
|
130
|
-
options: {
|
|
131
|
-
responsive: true, maintainAspectRatio: false, indexAxis: 'y',
|
|
132
|
-
scales: {
|
|
133
|
-
x: { stacked: true, grid: { color: '#f3f4f6' }, ticks: { font: { family: 'Inter', size: 11 }, callback: v => fmtShort(v) } },
|
|
134
|
-
y: { stacked: true, grid: { display: false }, ticks: { font: { family: 'Inter', size: 12 } } },
|
|
135
|
-
},
|
|
136
|
-
plugins: {
|
|
137
|
-
legend: { position: 'bottom', labels: { font: { family: 'Inter', size: 11 }, padding: 12, boxWidth: 10, usePointStyle: true, pointStyle: 'circle' } },
|
|
138
|
-
tooltip: {
|
|
139
|
-
callbacks: {
|
|
140
|
-
label: (c) => {
|
|
141
|
-
const pct = total > 0 ? ((c.raw / total) * 100).toFixed(1) : 0;
|
|
142
|
-
return ` ${c.dataset.label}: ${fmtShort(c.raw)} (${pct}%)`;
|
|
143
|
-
},
|
|
144
|
-
},
|
|
145
|
-
},
|
|
146
|
-
},
|
|
147
|
-
},
|
|
148
|
-
});
|
|
149
|
-
setChart(canvasId, instance);
|
|
150
|
-
return instance;
|
|
151
|
-
}
|
|
152
|
-
|
|
153
111
|
// ── Model Cost ──
|
|
154
112
|
export function renderModelCostChart(canvasId, models, costBreakdown) {
|
|
155
113
|
if (!costBreakdown?.models?.length) { destroyChart(canvasId); return null; }
|
package/public/config.js
CHANGED
|
@@ -124,7 +124,6 @@ export const ID = {
|
|
|
124
124
|
TOOL_CHART: 'toolChart',
|
|
125
125
|
TREND_CHART: 'trendChart',
|
|
126
126
|
COMMIT_TYPE_CHART: 'commitTypeChart',
|
|
127
|
-
CACHE_CHART: 'cacheChart',
|
|
128
127
|
MODEL_COST_CHART: 'modelCostChart',
|
|
129
128
|
CFG_CLAUDE_DIR: 'cfgClaudeDir',
|
|
130
129
|
CFG_REPOS: 'cfgRepos',
|
package/public/index.html
CHANGED
|
@@ -176,12 +176,6 @@
|
|
|
176
176
|
<div class="chart-wrap chart-wrap-tall"><canvas id="trendChart"></canvas></div>
|
|
177
177
|
</div>
|
|
178
178
|
</section>
|
|
179
|
-
<section class="trend-section" id="cacheSection" style="display:none;">
|
|
180
|
-
<div class="chart-card">
|
|
181
|
-
<h3 class="title-md">缓存效率</h3>
|
|
182
|
-
<div class="chart-wrap"><canvas id="cacheChart"></canvas></div>
|
|
183
|
-
</div>
|
|
184
|
-
</section>
|
|
185
179
|
<section class="trend-section" id="modelCostSection" style="display:none;">
|
|
186
180
|
<div class="chart-card">
|
|
187
181
|
<h3 class="title-md">模型费用分布</h3>
|