OHDSI · fdefalco · Sep 12, 2025 · Aug 18, 2025
diff --git a/frontend/src/pages/reports/network/networkCostReport/NetworkCostReport.vue b/frontend/src/pages/reports/network/networkCostReport/NetworkCostReport.vue
@@ -0,0 +1,121 @@
+<template>
+  <Panel header="Network Cost Index">
+    <DataTable
+      v-if="data"
+      :striped-rows="store.getters.getSettings.strippedRows"
+      removable-sort
+      size="small"
+      :value="data"
+    >
+      <Column header="Source" field="SOURCE">
+        <template #body="slotProps">
+          <router-link
+            class="text-blue-400 hover:underline"
+            :to="redirectToPage(slotProps.data)"
+            :title="slotProps.data.SOURCE"
+          >
+            {{ slotProps.data.SOURCE }}
+          </router-link>
+        </template>
+      </Column>
+      <Column header="Latest Release" field="LATEST_RELEASE">
+        <template #body="slotProps">
+          <router-link
+            class="text-blue-400 hover:underline"
+            :to="redirectToPage(slotProps.data)"
+            :title="slotProps.data.LATEST_RELEASE"
+          >
+            {{ slotProps.data.LATEST_RELEASE }}
+          </router-link>
+        </template>
+      </Column>
+      <Column
+        style="text-align: end"
+        :pt="{ headerContent: 'justify-end' }"
+        header="Total Cost"
+        field="TOTAL_COST"
+      >
+        <template #body="slotProps">
+          {{
+            parseFloat(slotProps.data.TOTAL_COST) &&
+            !isNaN(parseFloat(slotProps.data.TOTAL_COST))
+              ? `${isoToSymbol(slotProps.data.CURRENCY_CODE)} ${formatComma(
+                  slotProps.data.TOTAL_COST
+                )}`
+              : "No data"
+          }}
+        </template>
+      </Column>
+      <Column
+        style="text-align: end"
+        :pt="{ headerContent: 'justify-end' }"
+        header="Total Paid"
+        field="TOTAL_CHARGE"
+      >
+        <template #body="slotProps">
+          {{
+            parseFloat(slotProps.data.TOTAL_COST) &&
+            !isNaN(parseFloat(slotProps.data.TOTAL_COST))
+              ? `${isoToSymbol(slotProps.data.CURRENCY_CODE)} ${formatComma(
+                  slotProps.data.TOTAL_COST
+                )}`
+              : "No data"
+          }}
+        </template>
+      </Column>
+      <Column
+        style="text-align: end"
+        :pt="{ headerContent: 'justify-end' }"
+        header="Total Charge"
+        field="TOTAL_PAID"
+      >
+        <template #body="slotProps">
+          {{
+            parseFloat(slotProps.data.TOTAL_COST) &&
+            !isNaN(parseFloat(slotProps.data.TOTAL_COST))
+              ? `${isoToSymbol(slotProps.data.CURRENCY_CODE)} ${formatComma(
+                  slotProps.data.TOTAL_COST
+                )}`
+              : "No data"
+          }}
+        </template>
+      </Column>
+    </DataTable>
+  </Panel>
+</template>
+
+<script setup lang="ts">
+import DataTable from "primevue/datatable";
+import Column from "primevue/column";
+import Panel from "primevue/panel";
+import { useStore } from "vuex";
+import { computed } from "vue";
+import { formatComma } from "@/shared/lib/mixins/methods/formatComma";
+
+const store = useStore();
+
+const data = computed(() => store.getters.getData.networkCostIndex);
+
+function isoToSymbol(code) {
+  if (!code) return "$";
+  const formatter = new Intl.NumberFormat(undefined, {
+    style: "currency",
+    currency: code,
+    currencyDisplay: "symbol",
+    minimumFractionDigits: 0,
+  });
+  return formatter.format(0).replace(/\d|[.,\s]/g, "");
+}
+
+function redirectToPage(data) {
+  return {
+    name: "costTable",
+    params: {
+      cdm: data.SOURCE,
+      release: data.LATEST_RELEASE,
+    },
+  };
+}
+</script>
+
+<style scoped></style>
diff --git a/frontend/src/processes/exploreReports/config/dataLoadConfig.ts b/frontend/src/processes/exploreReports/config/dataLoadConfig.ts
@@ -22,6 +22,7 @@ import {
   DOMAIN_VISIT_STRATIFICATION,
   LOCATION,
   METADATA,
+  NETWORK_COST_INDEX,
   NETWORK_PERFORMANCE,
   NETWORK_QUALITY_SUMMARY,
   NETWORK_UNMAPPED_SOURCE_CODES,
@@ -78,6 +79,10 @@ export default function getFilesByView(params = null) {
       loadMethod: FETCH_FILES,
       payload: { files: [{ name: NETWORK_PERFORMANCE, required: true }] },
     },
+    networkCostReport: {
+      loadMethod: FETCH_FILES,
+      payload: { files: [{ name: NETWORK_COST_INDEX, required: true }] },
+    },
     costTable: {
       loadMethod: FETCH_FILES,
       payload: {

diff --git a/frontend/src/processes/exploreReports/config/routes.ts b/frontend/src/processes/exploreReports/config/routes.ts
@@ -30,6 +30,7 @@ import WebApiInfo from "@/pages/info/WebApiInfo.vue";
 
 import { RouteRecordRaw } from "vue-router";
 import NetworkComparisonTool from "@/pages/reports/network/NetworkComparisonTool/NetworkComparisonTool.vue";
+import NetworkCostReport from "@/pages/reports/network/networkCostReport/NetworkCostReport.vue";
 
 export const routes: RouteRecordRaw[] = [
   {
@@ -53,6 +54,11 @@ export const routes: RouteRecordRaw[] = [
         name: "networkDataQuality",
         components: { reportsView: NetworkDataQualitySummary },
       },
+      {
+        path: "network_cost_report",
+        name: "networkCostReport",
+        components: { reportsView: NetworkCostReport },
+      },
       {
         path: "network_annotations_report",
         name: "networkAnnotationsReport",

diff --git a/frontend/src/processes/exploreReports/model/store/preprocessing/index.ts b/frontend/src/processes/exploreReports/model/store/preprocessing/index.ts
@@ -26,6 +26,7 @@ import {
   COST_DRILLDOWN,
   COST_TIMESERIES,
   COST_DOMAIN_SUMMARY,
+  NETWORK_COST_INDEX,
 } from "@/shared/config/files";
 import csvParse from "@/processes/exploreReports/model/store/preprocessing/csvParse";
 
@@ -57,4 +58,5 @@ export default {
   [COST_DRILLDOWN]: csvParse,
   [COST_TIMESERIES]: csvParse,
   [COST_DOMAIN_SUMMARY]: csvParse,
+  [NETWORK_COST_INDEX]: csvParse,
 };
diff --git a/frontend/src/shared/api/axios/files.ts b/frontend/src/shared/api/axios/files.ts
@@ -49,5 +49,6 @@ export default function getFilePath(params: Params) {
     [files.COST_DRILLDOWN]: `data/${params.cdm}/${params.release}/cost-drilldown.csv`,
     [files.COST_DOMAIN_SUMMARY]: `data/${params.cdm}/${params.release}/cost-domain-summary.csv`,
     [files.COST_CONCEPT]: `data/${params.cdm}/${params.release}/concepts/cost/concept_${params.concept}.json`,
+    [files.NETWORK_COST_INDEX]: `data/network-cost-index.csv`,
   };
 }
diff --git a/frontend/src/shared/config/files.ts b/frontend/src/shared/config/files.ts
@@ -45,3 +45,4 @@ export const COHORT_TEMPORAL_COVARIATE_DISTRIBUTION =
   "cohortTemporalCovariateDistribution";
 
 export const LOCATION = "location";
+export const NETWORK_COST_INDEX = "networkCostIndex";
diff --git a/frontend/src/widgets/error/model/config/errorMessages.ts b/frontend/src/widgets/error/model/config/errorMessages.ts
@@ -6,6 +6,8 @@ export default {
     networkPerformance:
       "Network performance file is not found. Please make sure it exists within the data directory then try again",
     networkDiversityReport: "Requested files not found",
+    networkCostReport:
+      "Network Cost Index is not available. Please run AresIndexer and try again",
     networkUnmappedSourceCodes: "Requested files not found",
     networkConcept: "Requested files not found",
     networkDataQuality: "Requested files not found",

diff --git a/frontend/src/widgets/explorer/config/reports.ts b/frontend/src/widgets/explorer/config/reports.ts
@@ -254,6 +254,12 @@ export const reports = [
     name: "Quality Assessment",
     routeName: "networkDataQuality",
   },
+  {
+    folder: "Data Network",
+    icon: mdiCurrencyUsd,
+    name: "Network Cost Report",
+    routeName: "networkCostReport",
+  },
   {
     folder: "Data Network",
     icon: mdiChartLine,
Original file line number	Diff line number	Diff line change
Expand Up		@@ -45,3 +45,4 @@ export const COHORT_TEMPORAL_COVARIATE_DISTRIBUTION =
		"cohortTemporalCovariateDistribution";

		export const LOCATION = "location";
		export const NETWORK_COST_INDEX = "networkCostIndex";