feat: integrate Glance Views (GV) from Traffic Weekly.xlsx

- types.ts: Added TrafficRecord interface and glanceViews field to CombinedKPIs
- dataProcessor.ts: Added processTrafficExcel parser for Traffic Weekly.xlsx
- dataProcessor.ts: Updated mergeSalesAndAdsData to accept and merge traffic data
- App.tsx: Added trafficData state and handleTrafficUpload handler
- FileUpload.tsx: Added Traffic file upload section for GV data
- AdsPerformance.tsx: Added GV and CVR(GV) summary cards
- AdsPerformance.tsx: Added GV column to product table
This commit is contained in:
Christian Vidal Wolf
2026-01-23 09:07:38 +01:00
parent 473174f7e6
commit affae9e994
6 changed files with 150 additions and 11 deletions
+8 -1
View File
@@ -77,6 +77,7 @@ const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters }) => {
target.impressions += item.impressions;
target.conversions += item.conversions;
target.salesOrganic += item.salesOrganic;
target.glanceViews = (target.glanceViews || 0) + (item.glanceViews || 0);
}
}
});
@@ -112,7 +113,8 @@ const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters }) => {
impressions: acc.impressions + curr.impressions,
clicks: acc.clicks + curr.clicks,
conversions: acc.conversions + curr.conversions,
}), { salesTotal: 0, salesAds: 0, salesOrganic: 0, cost: 0, impressions: 0, clicks: 0, conversions: 0 });
glanceViews: acc.glanceViews + (curr.glanceViews || 0),
}), { salesTotal: 0, salesAds: 0, salesOrganic: 0, cost: 0, impressions: 0, clicks: 0, conversions: 0, glanceViews: 0 });
const currTotals = sum(aggregatedByAsin);
const prevTotals = comparisonConfig ? sum(aggregatedByAsin.map(a => a.prevData).filter(Boolean)) : null;
@@ -127,6 +129,7 @@ const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters }) => {
ctr: t.impressions > 0 ? (t.clicks / t.impressions) * 100 : 0,
cpc: t.clicks > 0 ? t.cost / t.clicks : 0,
cvr: t.clicks > 0 ? (t.conversions / t.clicks) * 100 : 0,
cvrGv: t.glanceViews > 0 ? (t.conversions / t.glanceViews) * 100 : 0,
});
const currMetrics = calculateDerived(totals.curr);
@@ -196,6 +199,8 @@ const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters }) => {
<SummaryCard label="ACOS" value={currMetrics.acos} prevValue={prevMetrics?.acos} format="percent" inverse />
<SummaryCard label="ROAS" value={currMetrics.roas} prevValue={prevMetrics?.roas} format="number" decimals={2} color="text-blue-300" />
<SummaryCard label="TACOS" value={currMetrics.tacos} prevValue={prevMetrics?.tacos} format="percent" inverse />
<SummaryCard label="GV" value={totals.curr.glanceViews} prevValue={totals.prev?.glanceViews} format="number" color="text-teal-400" />
<SummaryCard label="CVR (GV)" value={currMetrics.cvrGv} prevValue={prevMetrics?.cvrGv} format="percent" color="text-teal-300" />
</div>
{/* Table Section */}
@@ -236,6 +241,7 @@ const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters }) => {
<SortableHeader label="ACOS" sortKey="acos" activeSort={sortConfig} onSort={handleSort} />
<SortableHeader label="ROAS" sortKey="roas" activeSort={sortConfig} onSort={handleSort} />
<SortableHeader label="TACOS" sortKey="tacos" activeSort={sortConfig} onSort={handleSort} />
<SortableHeader label="GV" sortKey="glanceViews" activeSort={sortConfig} onSort={handleSort} />
</tr>
</thead>
<tbody className="divide-y divide-white/[0.03]">
@@ -261,6 +267,7 @@ const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters }) => {
<TableCell value={row.acos} prevValue={row.prevData?.acos} format="percent" inverse />
<TableCell value={row.roas} prevValue={row.prevData?.roas} format="number" highlight />
<TableCell value={row.tacos} prevValue={row.prevData?.tacos} format="percent" inverse />
<TableCell value={row.glanceViews || 0} prevValue={row.prevData?.glanceViews} format="number" />
</tr>
))}
</tbody>