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

update earnings page

Browse Source
This commit is contained in:
MuslemRahimi 2024-08-25 11:30:08 +02:00
parent b0c40758ad
commit 8e5bea246d
1 changed files with 29 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
src/routes/earnings-calendar/+page.svelte
View File

@ -192,6 +192,7 @@ $: {
// Sort and map the filtered data // Sort and map the filtered data
weekday[i] = dayData weekday[i] = dayData
.sort((a, b) => b.marketCap - a.marketCap) .sort((a, b) => b.marketCap - a.marketCap)
console.log(weekday)
} }
} }
@ -328,13 +329,13 @@ $: {
<!-- Cards --> <!-- Cards -->
<div class=" w-full flex flex-row justify-center m-auto items-center pl-2 pr-2 sm:pl-0 sm:pr-0"> <div class=" w-full flex flex-row justify-center m-auto items-center pl-2 pr-2 sm:pl-0 sm:pr-0">
<!-- Start Columns --> <!-- Start Columns -->
<label on:click={() => changeWeek('previous')} class="{previousMax ? 'opacity-80' : ''} hidden sm:flex h-16 w-48 cursor-pointer border m-auto flex bg-[#3C40F0] hover:bg-purple-600 border border-blue-600 mb-3"> <label on:click={() => changeWeek('previous')} class="{previousMax ? 'opacity-80' : ''} hidden sm:flex h-16 w-48 cursor-pointer border m-auto flex bg-[#27272A] border border-gray-600 mb-3">
<svg class="w-6 h-6 m-auto rotate-180 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg> <svg class="w-6 h-6 m-auto rotate-180 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
</label> </label>
{#each weekday as day,index} {#each weekday as day,index}
<div class="w-full {index === selectedWeekday ? '' : 'hidden sm:block'}"> <div class="w-full {index === selectedWeekday ? '' : 'hidden sm:block'}">
<label on:click={() => toggleDate(index)} class="w-11/12 m-auto sm:w-full cursor-pointer h-16 {index === selectedWeekday ? 'bg-purple-600 sm:bg-[#A24D51] sm:gradient-effect' : ''} rounded-lg sm:rounded-none flex bg-[#3C40F0] border border-blue-600 mb-3"> <label on:click={() => toggleDate(index)} class="w-11/12 m-auto sm:w-full cursor-pointer h-16 {index === selectedWeekday ? 'bg-[#27272A]' : ''} rounded-lg sm:rounded-none flex bg-[#09090B] border border-gray-600 mb-3">
<div class=" flex flex-row justify-center items-center w-full "> <div class=" flex flex-row justify-center items-center w-full ">
<label on:click={() => clickWeekday('previous', index) } class="{previousMax === true && index === 0? 'opacity-20' : ''} sm:hidden ml-auto"> <label on:click={() => clickWeekday('previous', index) } class="{previousMax === true && index === 0? 'opacity-20' : ''} sm:hidden ml-auto">
<svg class="w-8 h-8 inline-block rotate-180 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg> <svg class="w-8 h-8 inline-block rotate-180 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
@ -350,7 +351,7 @@ $: {
</label> </label>
</div> </div>
{/each} {/each}
<label on:click={() => changeWeek('next')} class="{nextMax ? 'opacity-80' : ''} hidden sm:flex h-16 w-48 cursor-pointer border m-auto flex bg-[#3C40F0] hover:bg-purple-600 border border-blue-600 mb-3"> <label on:click={() => changeWeek('next')} class="{nextMax ? 'opacity-80' : ''} hidden sm:flex h-16 w-48 cursor-pointer border m-auto flex bg-[#27272A] border border-gray-600 mb-3">
<svg class="w-6 h-6 m-auto" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg> <svg class="w-6 h-6 m-auto" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
</label> </label>
</div> </div>
@ -367,9 +368,9 @@ $: {
<th class="text-start text-slate-200 font-semibold text-sm">Symbol</th> <th class="text-start text-slate-200 font-semibold text-sm">Symbol</th>
<th class="text-start text-slate-200 font-semibold text-sm">Company Name</th> <th class="text-start text-slate-200 font-semibold text-sm">Company Name</th>
<th class="text-slate-200 font-semibold text-sm">Market Cap</th> <th class="text-slate-200 font-semibold text-sm">Market Cap</th>
<th class="text-slate-200 font-semibold text-sm">Revenue Estimate</th> <th class="text-slate-200 font-semibold text-sm text-end">Revenue Estimate</th>
<th class="text-slate-200 font-semibold text-sm">EPS Estimate</th> <th class="text-slate-200 font-semibold text-sm text-end">EPS Estimate</th>
<th class="text-slate-200 font-semibold text-sm text-end">Earnings Time</th> <th class="text-slate-200 font-semibold text-sm text-end text-end">Earnings Time</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@ -389,12 +390,30 @@ $: {
{item?.marketCap !== null ? '$' + abbreviateNumber(item?.marketCap) : '-'} {item?.marketCap !== null ? '$' + abbreviateNumber(item?.marketCap) : '-'}
</td> </td>
<td class="text-white text-center border-b-[#09090B] text-sm sm:text-[1rem]"> <td class="text-white text-end border-b-[#09090B] text-sm sm:text-[1rem]">
{item?.revenueEstimated !== null ? '$' + abbreviateNumber(item?.revenueEstimated) : '-'} <div class="flex flex-row items-center justify-end">
<span>
{item?.revenueEstimated !== null ? '$' + abbreviateNumber(item?.revenueEstimated) : '-'}
</span>
{#if item?.revenueEstimated !== null && item?.revenue !== null}
<span class="ml-1 {item?.revenueEstimated/item?.revenue-1 > 0 ? 'text-[#22C55E]' : 'text-[#FF2F1F]'}">
{`(${((item?.revenueEstimated/item?.revenue-1)*100)?.toFixed(2)}%)`}
</span>
{/if}
</div>
</td> </td>
<td class="text-white text-center border-b-[#09090B] text-sm sm:text-[1rem]"> <td class="text-white text-end border-b-[#09090B] text-sm sm:text-[1rem]">
{item?.epsEstimated !== null ? item?.epsEstimated : '-'} <div class="flex flex-row items-center justify-end">
<span>
{item?.epsEstimated !== null ? '$' + abbreviateNumber(item?.epsEstimated) : '-'}
</span>
{#if item?.epsEstimated !== null && item?.eps !== null}
<span class="ml-1 {item?.epsEstimated/item?.eps-1 > 0 ? 'text-[#22C55E]' : 'text-[#FF2F1F]'}">
{`(${((item?.epsEstimated/item?.eps-1)*100)?.toFixed(2)}%)`}
</span>
{/if}
</div>
</td> </td>