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

expand company info by including forward pe, shares out., eps (ttm), pe ratio (ttm)

Browse Source
This commit is contained in:
MuslemRahimi 2024-08-26 20:10:06 +02:00
parent 19533ab347
commit d0f6bbfb33
1 changed files with 32 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/lib/components/TickerInfoCard.svelte
View File

@ -25,7 +25,10 @@
let marketCap = '-'; let marketCap = '-';
let avgVolume = '-'; let avgVolume = '-';
let snippet; let snippet;
let epsTTM = '-';
let peTTM = '-';
let sharesOutstanding = '-';
let forwardPE = '-';
@ -77,7 +80,10 @@ $: {
marketCap = abbreviateNumber(info?.marketCap,true) ?? '-'; marketCap = abbreviateNumber(info?.marketCap,true) ?? '-';
avgVolume = abbreviateNumber(info?.avgVolume) ?? '-' avgVolume = abbreviateNumber(info?.avgVolume) ?? '-'
snippet= description?.slice(0, 150) + "..."; snippet= description?.slice(0, 150) + "...";
epsTTM = info?.eps;
peTTM = info?.pe;
sharesOutstanding = info?.sharesOutstanding;
forwardPE = info?.forwardPE;
} }
} }
@ -121,30 +127,42 @@ $: {
<!-- row 1 --> <!-- row 1 -->
<tr class="text-white border-b border-[#27272A]" style="font-size: 0.75rem"> <tr class="text-white border-b border-[#27272A]" style="font-size: 0.75rem">
<td class="text-start lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">CEO</td> <td class="text-start lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">CEO</td>
<td class="bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B] whitespace-normal">{ceoName}</td> <td class="text-end bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B] whitespace-normal">{ceoName}</td>
<td class="text-start lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">Industry</td> <td class="text-end lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">Industry</td>
<td class="bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B] whitespace-normal">{industry}</td> <td class="text-center bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B] whitespace-normal">{industry}</td>
</tr> </tr>
<!-- row 2 --> <!-- row 2 -->
<tr class="text-white " style="font-size: 0.75rem"> <tr class="text-white " style="font-size: 0.75rem">
<td class="text-start lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">Country</td> <td class="text-start lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">Country</td>
<td class="bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B] whitespace-normal">{country}</td> <td class="text-end bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B] whitespace-normal">{country}</td>
<td class="text-start lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white whitespace-pre-line font-medium">Sector</td> <td class="text-end lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white whitespace-pre-line font-medium">Sector</td>
<td class="bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B] whitespace-pre-line">{sector}</td> <td class="text-center bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B] whitespace-pre-line">{sector}</td>
</tr> </tr>
<!-- row 3 --> <!-- row 3 -->
<tr class="text-white border-b border-[#27272A]" style="font-size: 0.75rem"> <tr class="text-white border-b border-[#27272A]" style="font-size: 0.75rem">
<td class="text-start lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">Employees</td> <td class="text-start lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">Employees</td>
<td class="bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B]">{employees}</td> <td class="text-end bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B]">{employees}</td>
<td class="text-start lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">Exchange</td> <td class="text-end lg:border-b lg:border-[#27272A] bg-[#000] lg:bg-[#09090B] text-white font-medium">Exchange</td>
<td class="bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B]">{exchange}</td> <td class="text-center bg-[#000] lg:border-b lg:border-[#27272A] lg:bg-[#09090B]">{exchange}</td>
</tr> </tr>
<!-- row 4 --> <!-- row 4 -->
<tr class="text-white border-b border-[#27272A]" style="font-size: 0.75rem"> <tr class="text-white border-b border-[#27272A]" style="font-size: 0.75rem">
<td class="text-start bg-[#000] lg:bg-[#09090B] text-white font-medium">Mkt Cap</td> <td class="text-start bg-[#000] lg:bg-[#09090B] text-white font-medium">Mkt Cap</td>
<td class="bg-[#000] lg:bg-[#09090B]">{marketCap}</td> <td class="text-end bg-[#000] lg:bg-[#09090B]">{marketCap}</td>
<td class="text-start bg-[#000] lg:bg-[#09090B] text-white font-medium">Avg. Volume</td> <td class="text-end bg-[#000] lg:bg-[#09090B] text-white font-medium">Avg. Volume</td>
<td class="bg-[#000] lg:bg-[#09090B]">{avgVolume}</td> <td class="text-center bg-[#000] lg:bg-[#09090B]">{avgVolume}</td>
</tr>
<tr class="text-white border-b border-[#27272A]" style="font-size: 0.75rem">
<td class="text-start bg-[#000] lg:bg-[#09090B] text-white font-medium">EPS (TTM)</td>
<td class="text-end bg-[#000] lg:bg-[#09090B]">{epsTTM}</td>
<td class="text-end bg-[#000] lg:bg-[#09090B] text-white font-medium">PE Ratio (TTM)</td>
<td class="text-center bg-[#000] lg:bg-[#09090B]">{peTTM}</td>
</tr>
<tr class="text-white border-b border-[#27272A]" style="font-size: 0.75rem">
<td class="text-start bg-[#000] lg:bg-[#09090B] text-white font-medium">Shares Out.</td>
<td class="text-end bg-[#000] lg:bg-[#09090B]">{abbreviateNumber(sharesOutstanding)}</td>
<td class="text-end bg-[#000] lg:bg-[#09090B] text-white font-medium">Forward PE</td>
<td class="text-center bg-[#000] lg:bg-[#09090B]">{forwardPE}</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>