AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui fixes

Browse Source
This commit is contained in:
MuslemRahimi 2024-09-18 11:55:21 +02:00
parent c1c27f5b40
commit c4b037d492
2 changed files with 26 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/lib/components/BullBearSay.svelte
View File

@ -6,6 +6,23 @@
let rawData = {};
function latestInfoDate(inputDate) {
// Convert the input date string to milliseconds since epoch
const inputDateMs = Date?.parse(inputDate);
// Get today's date in milliseconds since epoch
const todayMs = Date?.now();
// Calculate the difference in milliseconds
const differenceInMs = todayMs - inputDateMs;
// Convert milliseconds to days
const differenceInDays = Math?.floor(differenceInMs / (1000 * 60 * 60 * 24));
// Return the difference in days
return differenceInDays <=1;
}
function handleMode(i) {
activeIdx = i;
@ -81,6 +98,7 @@
<!--End Header-->
<span class="text-gray-200 text-xs sm:text-[0.915rem] italic mt-6 sm:ml-auto">
<label class="{latestInfoDate(rawData?.date) ? '' : 'hidden'} bg-purple-600 mr-2 text-white font-medium not-italic text-xs rounded-lg px-2 py-0.5">New</label>
Updated {rawData?.date}
</span>
<div class="flex mt-5 h-auto">

11
src/lib/components/ETFProfileCard.svelte
View File

@ -21,6 +21,8 @@
let description = '';
let website = '-';
let snippet;
let dividendYield = '-';
let payoutRatio = '-';
let showFullText = false;
@ -38,6 +40,9 @@ let showFullText = false;
inceptionDate = new Date(info?.inceptionDate)?.toLocaleDateString('en-GB', { day: '2-digit', month: '2-digit', year: 'numeric' }).replace(/\//g, '.');
holdingsCount = info?.holdingsCount;
avgVolume = info?.avgVolume;
dividendYield = typeof data?.getStockDividend?.dividendYield !== 'undefined' ? data?.getStockDividend?.dividendYield?.toFixed(2)+'%' : '-'
payoutRatio = typeof data?.getStockDividend?.payoutRatio !== 'undefined' ? data?.getStockDividend?.payoutRatio?.toFixed(2)+'%' : '-'
provider = info?.etfProvider;
country = info?.domicile ?? '-';
description = info?.description ?? 'A detailed description of the company is not yet available.';
@ -124,14 +129,12 @@ let showFullText = false;
<td class="text-start sm:text-end bg-[#000] lg:bg-[#09090B] text-white font-semibold whitespace-nowrap">PE Ratio (ttm)</td>
<td class="text-start sm:text-end bg-[#000] lg:bg-[#09090B]">{data?.getStockQuote?.pe?.toFixed(2)}</td>
</tr>
{#if data?.getStockDividend}
<tr class="text-white border-b border-[#27272A]">
<td class="text-start bg-[#000] lg:bg-[#09090B] text-white font-semibold whitespace-nowrap">Dividend Yield</td>
<td class="text-center sm:text-end bg-[#000] lg:bg-[#09090B]">{data?.getStockDividend?.dividendYield?.toFixed(2)}%</td>
<td class="text-center sm:text-end bg-[#000] lg:bg-[#09090B]">{dividendYield}</td>
<td class="text-start sm:text-end bg-[#000] lg:bg-[#09090B] text-white font-semibold whitespace-nowrap">Payout Ratio</td>
<td class="text-start sm:text-end bg-[#000] lg:bg-[#09090B]">{data?.getStockDividend?.payoutRatio?.toFixed(2)}%</td>
<td class="text-start sm:text-end bg-[#000] lg:bg-[#09090B]">{payoutRatio}</td>
</tr>
{/if}
<tr class="text-white border-b border-[#27272A]">
<td class="text-start bg-[#000] lg:bg-[#09090B] text-white font-semibold whitespace-nowrap">Holdings</td>
<td class="text-center sm:text-end bg-[#000] lg:bg-[#09090B]">{holdingsCount} Assets</td>