fix analyst page
This commit is contained in:
parent
465e7385de
commit
18b1ca855f
@ -4,12 +4,12 @@
|
|||||||
export let title;
|
export let title;
|
||||||
export let content;
|
export let content;
|
||||||
export let id;
|
export let id;
|
||||||
|
export let hide = false;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<label for={id} class="cursor-pointer ml-1">
|
<label for={id} class="cursor-pointer ml-1">
|
||||||
<svg class="w-5 h-5" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="gray"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <title></title> <g id="Complete"> <g id="info-circle"> <g> <circle cx="12" cy="12" data-name="--Circle" fill="none" id="_--Circle" r="10" stroke="gray" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></circle> <line fill="none" stroke="gray" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="12" y2="16"></line> <line fill="none" stroke="gray" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="8" y2="8"></line> </g> </g> </g> </g></svg>
|
<svg class="w-5 h-5 {hide ? 'hidden' : ''}" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="gray"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <title></title> <g id="Complete"> <g id="info-circle"> <g> <circle cx="12" cy="12" data-name="--Circle" fill="none" id="_--Circle" r="10" stroke="gray" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></circle> <line fill="none" stroke="gray" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="12" y2="16"></line> <line fill="none" stroke="gray" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="8" y2="8"></line> </g> </g> </g> </g></svg>
|
||||||
</label>
|
</label>
|
||||||
|
|
||||||
<!-- Desktop modal using dialog component -->
|
<!-- Desktop modal using dialog component -->
|
||||||
|
|||||||
@ -130,73 +130,88 @@ changeTab(0)
|
|||||||
|
|
||||||
{#if historyList?.length !== 0}
|
{#if historyList?.length !== 0}
|
||||||
|
|
||||||
<div class="stats stats-horizontal bg-[#272727] w-full rounded-lg pr-6 sm:pr-0">
|
<div class="mb-4 grid grid-cols-2 grid-rows-2 divide-gray-500 rounded-lg border border-gray-600 bg-[#272727] shadow md:grid-cols-4 md:grid-rows-1 md:divide-x">
|
||||||
|
<div class="p-4 bp:p-5 sm:p-6">
|
||||||
<div class="grid grid-cols-2">
|
<div class="text-sm font-normal text-default xs:text-base">
|
||||||
|
Total Analysts
|
||||||
<div class="stat">
|
<span class="relative" role="tooltip">
|
||||||
<div class="flex flex-row items-center">
|
<label for="totalAnalystInfo" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
||||||
<label for="totalAnalystInfo" class="cursor-pointer stat-title text-md sm:text-lg font-medium text-gray-300">
|
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
||||||
Total Analyst
|
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
||||||
|
</svg>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
<InfoModal
|
||||||
title={"Total Analyst"}
|
title={"Total Analyst"}
|
||||||
content={"The total number of analyst who provided a rating in the past 12 months."}
|
content={"The total number of analyst who provided a rating in the past 12 months."}
|
||||||
id={"totalAnalystInfo"}
|
id={"totalAnalystInfo"}
|
||||||
|
hide={true}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat-value mt-1 text-lg text-gray-200 font-semibold">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
||||||
{numOfAnalyst}
|
{numOfAnalyst}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="p-4 bp:p-5 sm:p-6 border-l border-contrast md:border-0">
|
||||||
|
<div class="text-sm font-normal text-default xs:text-base">
|
||||||
<div class="stat">
|
|
||||||
<div class="flex flex-row items-center">
|
|
||||||
<label for="consensusRatingInfo" class="cursor-pointer stat-title text-md sm:text-lg font-medium text-gray-300">
|
|
||||||
Consensus Rating
|
Consensus Rating
|
||||||
|
<span class="relative" role="tooltip">
|
||||||
|
<label for="consensusRatingInfo" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
||||||
|
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
||||||
|
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
||||||
|
</svg>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
<InfoModal
|
||||||
title={"Consensus Rating"}
|
title={"Consensus Rating"}
|
||||||
content={`The average analyst rating for ${$stockTicker} is standardized to align with categories: Strong Buy, Buy, Hold, Sell, and Strong Sell.`}
|
content={`The average analyst rating for ${$stockTicker} is standardized to align with categories: Strong Buy, Buy, Hold, Sell, and Strong Sell.`}
|
||||||
id={"consensusRatingInfo"}
|
id={"consensusRatingInfo"}
|
||||||
|
hide={true}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
||||||
<div class="stat-value font-semibold {['Strong Buy', 'Buy']?.includes(consensusRating) ? 'text-[#10DB06]' : consensusRating === 'Hold' ? 'text-[#FF7070]' : ['Strong Sell','Sell']?.includes(consensusRating) ? 'text-[#FF2F1F]' : 'text-gray-200'} mt-1 text-lg">
|
|
||||||
{consensusRating}
|
{consensusRating}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0">
|
||||||
<div class="stat">
|
<div class="text-sm font-normal text-default xs:text-base">
|
||||||
<div class="flex flex-row items-center">
|
|
||||||
<label for="priceTargetInfo" class="cursor-pointer stat-title text-md sm:text-lg font-medium text-gray-300">
|
|
||||||
Price Target
|
Price Target
|
||||||
|
<span class="relative" role="tooltip">
|
||||||
|
<label for="priceTargetInfo" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
||||||
|
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
||||||
|
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
||||||
|
</svg>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
<InfoModal
|
||||||
title={"Price Target"}
|
title={"Price Target"}
|
||||||
content={"The average 12-month price target"}
|
content={"The average 12-month price target"}
|
||||||
id={"priceTargetInfo"}
|
id={"priceTargetInfo"}
|
||||||
|
hide={true}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat-value font-semibold text-lg text-gray-200">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
||||||
${priceTarget}
|
${priceTarget}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0 border-l border-contrast md:border-0">
|
||||||
<div class="stat">
|
<div class="text-sm font-normal text-default xs:text-base">
|
||||||
<div class="flex flex-row items-center">
|
|
||||||
<label for="upsideInfo" class="cursor-pointer stat-title text-md sm:text-lg font-medium text-gray-300">
|
|
||||||
Upside
|
Upside
|
||||||
|
<span class="relative" role="tooltip">
|
||||||
|
<label for="upsideInfo" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
||||||
|
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
||||||
|
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
||||||
|
</svg>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
<InfoModal
|
||||||
title={"Upside"}
|
title={"Upside"}
|
||||||
content={"The average price target's percentage difference from the current stock price."}
|
content={"The average price target's percentage difference from the current stock price."}
|
||||||
id={"upsideInfo"}
|
id={"upsideInfo"}
|
||||||
|
hide ={true}
|
||||||
/>
|
/>
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="stat-value font-semibold text-lg text-gray-200">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
||||||
<div class="flex flex-row items-center">
|
|
||||||
{#if changesPercentage >=0}
|
{#if changesPercentage >=0}
|
||||||
<span class="text-[#10DB06]">+{changesPercentage}%</span>
|
<span class="text-[#10DB06]">+{changesPercentage}%</span>
|
||||||
{:else}
|
{:else}
|
||||||
@ -206,13 +221,6 @@ changeTab(0)
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user