From 13c86dbd774e141ac61626d9ff6929d6667505b9 Mon Sep 17 00:00:00 2001 From: MuslemRahimi Date: Tue, 17 Sep 2024 14:02:43 +0200 Subject: [PATCH] update industry page && bugfixing forecast --- src/routes/industry/+layout.svelte | 24 ++- src/routes/industry/+page.svelte | 2 +- src/routes/industry/+page.ts | 10 +- src/routes/industry/all/+page.svelte | 153 ++++++++++++++++++ src/routes/industry/all/+page.ts | 34 ++++ src/routes/industry/sectors/+page.svelte | 85 +++++++--- src/routes/industry/sectors/+page.ts | 34 ++++ .../stocks/[tickerID]/forecast/+page.svelte | 2 +- 8 files changed, 312 insertions(+), 32 deletions(-) create mode 100644 src/routes/industry/all/+page.svelte create mode 100644 src/routes/industry/all/+page.ts create mode 100644 src/routes/industry/sectors/+page.ts diff --git a/src/routes/industry/+layout.svelte b/src/routes/industry/+layout.svelte index e7b475c2..6c3e5ba1 100644 --- a/src/routes/industry/+layout.svelte +++ b/src/routes/industry/+layout.svelte @@ -1,13 +1,22 @@ diff --git a/src/routes/industry/+page.svelte b/src/routes/industry/+page.svelte index f5d92407..c7da2770 100644 --- a/src/routes/industry/+page.svelte +++ b/src/routes/industry/+page.svelte @@ -5,7 +5,7 @@ import { industryList, sectorList } from '$lib/utils'; import { goto } from '$app/navigation'; export let data; -let rawData = data?.getIndustryOverview; +let rawData = data?.getSectorIndustryOverview; const sectorNavigation = [ { diff --git a/src/routes/industry/+page.ts b/src/routes/industry/+page.ts index 090e3468..9accb35a 100644 --- a/src/routes/industry/+page.ts +++ b/src/routes/industry/+page.ts @@ -1,17 +1,17 @@ import { getCache, setCache } from "$lib/store"; export const load = async ({ parent }) => { - const getIndustryOverview = async () => { + const getSectorIndustryOverview = async () => { let output; // Get cached data for the specific tickerID - const cachedData = getCache("", "getIndustryOverview"); + const cachedData = getCache("", "getSectorIndustryOverview"); if (cachedData) { output = cachedData; } else { const { apiKey, apiURL } = await parent(); - const response = await fetch(apiURL + "/industry-overview", { + const response = await fetch(apiURL + "/sector-industry-overview", { method: "GET", headers: { "Content-Type": "application/json", @@ -21,7 +21,7 @@ export const load = async ({ parent }) => { output = await response.json(); - setCache("", output, "getAllReEITs"); + setCache("", output, "getSectorIndustryOverview"); } return output; @@ -29,6 +29,6 @@ export const load = async ({ parent }) => { // Make sure to return a promise return { - getIndustryOverview: await getIndustryOverview(), + getSectorIndustryOverview: await getSectorIndustryOverview(), }; }; diff --git a/src/routes/industry/all/+page.svelte b/src/routes/industry/all/+page.svelte new file mode 100644 index 00000000..1983b9c6 --- /dev/null +++ b/src/routes/industry/all/+page.svelte @@ -0,0 +1,153 @@ + + +
+ + + + + +
+ + + + +
+ + + + + + + + + + + + + + + + {#each rawData as item} + + sectorSelector(item?.sector)} class="cursor-pointer sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B]"> + + + + + + + + + + + + + + + + + + + + + + {/each} + +
Industry NameStocksMarket CapDiv. YieldPE RatioProfit Margin1M Change1Y Change
+ {item?.industry?.length > charNumber ? item?.industry?.slice(0,charNumber) + "..." : item?.industry} + + {item?.numStocks} + + {abbreviateNumber(item?.totalMarketCap) ?? '-'} + + {item?.avgDividendYield?.toFixed(2) ?? '-'}% + + {item?.pe?.toFixed(2) ?? '-'} + + {item?.profitMargin?.toFixed(2)}% + + {item?.avgChange1M?.toFixed(2) ?? '-'}% + + {item?.avgChange1Y?.toFixed(2) ?? '-'}% +
+
+ +
+ +
+ + + \ No newline at end of file diff --git a/src/routes/industry/all/+page.ts b/src/routes/industry/all/+page.ts new file mode 100644 index 00000000..36d2ec2c --- /dev/null +++ b/src/routes/industry/all/+page.ts @@ -0,0 +1,34 @@ +import { getCache, setCache } from "$lib/store"; + +export const load = async ({ parent }) => { + const getIndustryOverview = async () => { + let output; + + // Get cached data for the specific tickerID + const cachedData = getCache("", "getIndustryOverview"); + if (cachedData) { + output = cachedData; + } else { + const { apiKey, apiURL } = await parent(); + + const response = await fetch(apiURL + "/industry-overview", { + method: "GET", + headers: { + "Content-Type": "application/json", + "X-API-KEY": apiKey, + }, + }); + + output = await response.json(); + + setCache("", output, "getIndustryOverview"); + } + + return output; + }; + + // Make sure to return a promise + return { + getIndustryOverview: await getIndustryOverview(), + }; +}; diff --git a/src/routes/industry/sectors/+page.svelte b/src/routes/industry/sectors/+page.svelte index f5d92407..472b9b12 100644 --- a/src/routes/industry/sectors/+page.svelte +++ b/src/routes/industry/sectors/+page.svelte @@ -1,11 +1,10 @@ @@ -76,35 +76,76 @@ $: charNumber = $screenWidth < 640 ? 20 : 30;
-
- - We categorize stocks into {sectorList?.length} sectors and {industryList?.length} industries, based on the company's primary business activity. -
- - +
-
- {#each sectorList as sector} -

sectorSelector(sector)} class="cursor-pointer text-white sm:hover:underline font-semibold text-lg sm:text-xl mt-5"> - Sector: {sector} -

+
+ + + + + + + + + + + + + + + + {#each rawData as item} + + sectorSelector(item?.sector)} class="cursor-pointer sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#09090B]"> + + + + + + + + + + + + + + + + + + + + -
+ {/each} +
+
Industry NameStocksMarket CapDiv. YieldPE RatioProfit Margin1M Change1Y Change
+ {item?.sector?.length > charNumber ? item?.sector?.slice(0,charNumber) + "..." : item?.sector} + + {item?.numStocks} + + {abbreviateNumber(item?.totalMarketCap) ?? '-'} + + {item?.avgDividendYield?.toFixed(2) ?? '-'}% + + {item?.pe?.toFixed(2) ?? '-'} + + {item?.profitMargin?.toFixed(2)}% + + {item?.avgChange1M?.toFixed(2) ?? '-'}% + + {item?.avgChange1Y?.toFixed(2) ?? '-'}% +
+
- -
- {/each} - -
- -
diff --git a/src/routes/industry/sectors/+page.ts b/src/routes/industry/sectors/+page.ts new file mode 100644 index 00000000..84be3b29 --- /dev/null +++ b/src/routes/industry/sectors/+page.ts @@ -0,0 +1,34 @@ +import { getCache, setCache } from "$lib/store"; + +export const load = async ({ parent }) => { + const getSectorOverview = async () => { + let output; + + // Get cached data for the specific tickerID + const cachedData = getCache("", "getSectorOverview"); + if (cachedData) { + output = cachedData; + } else { + const { apiKey, apiURL } = await parent(); + + const response = await fetch(apiURL + "/sector-overview", { + method: "GET", + headers: { + "Content-Type": "application/json", + "X-API-KEY": apiKey, + }, + }); + + output = await response.json(); + + setCache("", output, "getSectorOverview"); + } + + return output; + }; + + // Make sure to return a promise + return { + getSectorOverview: await getSectorOverview(), + }; +}; diff --git a/src/routes/stocks/[tickerID]/forecast/+page.svelte b/src/routes/stocks/[tickerID]/forecast/+page.svelte index b9b5329e..8cb2ad95 100644 --- a/src/routes/stocks/[tickerID]/forecast/+page.svelte +++ b/src/routes/stocks/[tickerID]/forecast/+page.svelte @@ -10,7 +10,7 @@ let changeEPS = 0; function findIndex(data) { const currentYear = new Date().getFullYear(); - return data?.findIndex((item) => item?.date >= currentYear && item?.revenue === null); + return data?.findIndex((item) => item?.date > currentYear && item?.revenue === null); } if (data?.getAnalystEstimate?.length !== 0) {