boursecu/boursecu_user
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix some bugs

Browse Source
This commit is contained in:
mohmdsdg
2026-07-01 22:28:25 +03:30
parent 2feeefc26f
commit e097f6b2bb
24 changed files with 579 additions and 189 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/base/home/components/AssetsSection.vue
+8 -4
View File
@@ -3,19 +3,21 @@
<div
v-if="!boursecuLayout && meta?.has_count_based_products"
:class="rowClass"
class="flex justify-center w-full z-20"
class="flex justify-center w-full z-20 mb-2"
>
محصولات:
<div class="text-l mr-2 font-bold">{{ usePriceWithoutType(countBasedInventory, false) }} عدد</div>
</div>
<PortfolioOverview v-if="!boursecuLayout" variant="mobile" />
<BoursecuAssetsSummary
v-if="boursecuLayout"
v-else-if="boursecuLayout"
variant="mobile"
icon-color="primary"
/>
<template v-else-if="meta?.single_metal && primaryMetalTotal">
<template v-else-if="showLegacyRows && meta?.single_metal && primaryMetalTotal">
<div :class="[rowClass, meta?.has_count_based_products ? 'mt-2' : '']" class="flex justify-center w-full z-20">
{{ primaryMetalTotal.label }}:
<div class="text-l mr-2 font-bold">{{ formatMetalTotal(primaryMetalTotal) }}</div>
@@ -39,7 +41,7 @@
</div>
</template>
<template v-else-if="!boursecuLayout">
<template v-else-if="showLegacyRows && !boursecuLayout">
<div
v-for="(metal, index) in metalTotals"
:key="metal.metal_id"
@@ -75,6 +77,7 @@
import { computed } from 'vue'
import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
import BoursecuAssetsSummary from './BoursecuAssetsSummary.vue'
import PortfolioOverview from './PortfolioOverview.vue'
import { formatWeightAmount, usePriceWithoutType } from '@/utils/usePrice'
import { useWalletAssets } from '@/composables/useWalletAssets'
import type { WalletMetalTotal } from '@/models/walletAssets'
@@ -116,6 +119,7 @@ const inventoryCards = computed(() => assetsSummary.value?.inventory_cards ?? []
const countBasedInventory = computed(() =>
(assetsSummary.value?.count_products ?? []).reduce((sum, item) => sum + Number(item.quantity ?? 0), 0)
)
const showLegacyRows = computed(() => !assetsSummary.value?.portfolio)
function formatMetalTotal(metal: WalletMetalTotal) {
return `${formatWeightAmount(resolveSummaryMetalWeight(metal, inventoryCards.value))}${metal.unit}`
src/views/base/home/components/BalanceSheet.vue
+23 -1
View File
@@ -42,6 +42,21 @@
is-line
:value="usePrice(totalRialValue)"
/>
<template v-if="portfolioInsight?.unrealized_profit_rial != null">
<a-divider class="!my-1" />
<BasicInfoItem
class="flex justify-between"
title="میانگین قیمت خرید"
is-line
:value="usePrice(portfolioInsight.average_buy_price ?? 0)"
/>
<BasicInfoItem
class="flex justify-between"
title="سود/زیان تحقق‌نیافته"
is-line
:value="profitSheetLabel"
/>
</template>
</div>
</div>
</div>
@@ -56,7 +71,7 @@ import BasicInfoItem from '@/components/BasicPacks/BasicInfoItem.vue'
import { usePrice } from '@/utils/usePrice'
import { useWalletAssets } from '@/composables/useWalletAssets'
import type { WalletMetalTotal } from '@/models/walletAssets'
import { formatInventoryCardValue, assetSheetInventoryCards, resolveAssetsRialValue } from '@/utils/productAssets'
import { formatInventoryCardValue, assetSheetInventoryCards, resolveAssetsRialValue, formatPortfolioProfitPercent, formatPortfolioProfitText } from '@/utils/productAssets'
import { getTradeBuyPrice, lastPrice } from '@/utils/price'
const props = defineProps<{
@@ -83,6 +98,13 @@ const metalRialValue = computed(() =>
resolveAssetsRialValue(assetsSummary.value, getTradeBuyPrice(lastPrice.value))
)
const totalRialValue = computed(() => cashWallet.value + metalRialValue.value)
const portfolioInsight = computed(() => assetsSummary.value?.portfolio)
const profitSheetLabel = computed(() => {
const profit = portfolioInsight.value?.unrealized_profit_rial
if (profit == null) return '-'
const pct = formatPortfolioProfitPercent(portfolioInsight.value?.unrealized_profit_percent)
return `${formatPortfolioProfitText(profit)}${pct ? ` (${pct})` : ''}`
})
watch(
() => props.show,
src/views/base/home/components/PortfolioOverview.vue
+259
View File
@@ -0,0 +1,259 @@
<template>
<section :class="rootClass">
<header class="portfolio-overview__header">
<span class="portfolio-overview__eyebrow">کل دارایی شما</span>
<p class="portfolio-overview__total">
{{ usePriceWithoutType(totalRial) }}
<span class="portfolio-overview__unit">ریال</span>
</p>
</header>
<div
v-if="hasProfitInsight"
class="portfolio-overview__profit"
:class="{
'portfolio-overview__profit--up': profitTone === 'profit',
'portfolio-overview__profit--down': profitTone === 'loss',
}"
>
<span class="portfolio-overview__profit-amount">{{ profitText }}</span>
<span v-if="profitPercent" class="portfolio-overview__profit-percent">{{ profitPercent }}</span>
<span class="portfolio-overview__profit-hint">سود/زیان تحقق‌نیافته طلا</span>
</div>
<div class="portfolio-overview__grid">
<article class="portfolio-overview__tile">
<span class="portfolio-overview__tile-label">ارزش طلا</span>
<strong class="portfolio-overview__tile-value">{{ usePriceWithoutType(metalRial) }} ریال</strong>
<span v-if="goldWeight > 0" class="portfolio-overview__tile-sub">
{{ formatWeightAmount(goldWeight) }}{{ weightUnit }}
</span>
</article>
<article class="portfolio-overview__tile">
<span class="portfolio-overview__tile-label">موجودی نقد</span>
<strong class="portfolio-overview__tile-value">{{ usePriceWithoutType(cashRial) }} ریال</strong>
<span class="portfolio-overview__tile-sub">کیف پول ریالی</span>
</article>
</div>
<p v-if="hasProfitInsight && averageBuyPrice" class="portfolio-overview__footnote">
بر اساس میانگین خرید {{ usePriceWithoutType(averageBuyPrice) }} ریال و قیمت فعلی
{{ usePriceWithoutType(liveGoldPrice) }} ریال
</p>
</section>
</template>
<script setup lang="ts">
import { computed } from 'vue'
import { useWalletAssets } from '@/composables/useWalletAssets'
import {
formatPortfolioProfitLabel,
formatPortfolioProfitPercent,
formatPortfolioProfitText,
resolveAssetsRialValue,
} from '@/utils/productAssets'
import { formatWeightAmount, usePriceWithoutType } from '@/utils/usePrice'
import { getTradeBuyPrice, lastPrice } from '@/utils/price'
const props = withDefaults(
defineProps<{
variant?: 'mobile' | 'desktop'
}>(),
{ variant: 'mobile' }
)
const { assetsSummary } = useWalletAssets()
const portfolio = computed(() => assetsSummary.value?.portfolio)
const weightUnit = computed(() => assetsSummary.value?.meta?.weight_unit || 'گرم')
const totalRial = computed(() =>
Number(portfolio.value?.total_rial_value ?? assetsSummary.value?.total_rial_value ?? 0)
)
const cashRial = computed(() =>
Number(portfolio.value?.cash_rial ?? assetsSummary.value?.cash_wallet ?? 0)
)
const metalRial = computed(() => {
const fromPortfolio = Number(portfolio.value?.metal_rial_value ?? 0)
if (fromPortfolio > 0) return fromPortfolio
return resolveAssetsRialValue(assetsSummary.value, getTradeBuyPrice(lastPrice.value))
})
const goldWeight = computed(() => Number(portfolio.value?.gold_weight ?? 0))
const averageBuyPrice = computed(() => portfolio.value?.average_buy_price ?? null)
const liveGoldPrice = computed(() => Number(portfolio.value?.live_gold_price ?? 0))
const hasProfitInsight = computed(() => portfolio.value?.unrealized_profit_rial != null)
const profitTone = computed(() => formatPortfolioProfitLabel(portfolio.value?.unrealized_profit_rial))
const profitText = computed(() => formatPortfolioProfitText(portfolio.value?.unrealized_profit_rial))
const profitPercent = computed(() =>
formatPortfolioProfitPercent(portfolio.value?.unrealized_profit_percent)
)
const rootClass = computed(() => [
'portfolio-overview',
`portfolio-overview--${props.variant}`,
])
</script>
<style scoped lang="less">
.portfolio-overview {
border-radius: 14px;
padding: 14px 16px;
background: linear-gradient(145deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.06));
border: 1px solid rgba(255, 255, 255, 0.22);
color: #fff;
}
.portfolio-overview--desktop {
margin-bottom: 16px;
padding: 20px 22px;
background: #fff;
border: 1px solid rgba(15, 23, 42, 0.06);
box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
color: #111827;
}
.portfolio-overview__header {
margin-bottom: 12px;
}
.portfolio-overview__eyebrow {
display: block;
font-size: 12px;
font-weight: 600;
opacity: 0.85;
}
.portfolio-overview--desktop .portfolio-overview__eyebrow {
color: #6b7280;
opacity: 1;
}
.portfolio-overview__total {
margin: 4px 0 0;
font-size: 1.65rem;
font-weight: 800;
line-height: 1.2;
letter-spacing: -0.02em;
}
.portfolio-overview__unit {
font-size: 0.85rem;
font-weight: 600;
margin-right: 4px;
opacity: 0.9;
}
.portfolio-overview__profit {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
padding: 8px 10px;
border-radius: 10px;
margin-bottom: 12px;
background: rgba(255, 255, 255, 0.12);
font-size: 13px;
font-weight: 700;
}
.portfolio-overview--desktop .portfolio-overview__profit {
background: #f9fafb;
}
.portfolio-overview__profit--up {
color: #bbf7d0;
}
.portfolio-overview--desktop .portfolio-overview__profit--up {
color: #027a48;
background: #ecfdf3;
}
.portfolio-overview__profit--down {
color: #fecaca;
}
.portfolio-overview--desktop .portfolio-overview__profit--down {
color: #b42318;
background: #fef3f2;
}
.portfolio-overview__profit-percent {
direction: ltr;
unicode-bidi: isolate;
font-variant-numeric: tabular-nums;
}
.portfolio-overview__profit-hint {
width: 100%;
font-size: 11px;
font-weight: 500;
opacity: 0.85;
}
.portfolio-overview--desktop .portfolio-overview__profit-hint {
color: #6b7280;
opacity: 1;
}
.portfolio-overview__grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
}
.portfolio-overview__tile {
padding: 10px 12px;
border-radius: 10px;
background: rgba(0, 0, 0, 0.12);
}
.portfolio-overview--desktop .portfolio-overview__tile {
background: #f6f7f9;
}
.portfolio-overview__tile-label {
display: block;
font-size: 11px;
font-weight: 600;
opacity: 0.85;
margin-bottom: 4px;
}
.portfolio-overview--desktop .portfolio-overview__tile-label {
color: #6b7280;
opacity: 1;
}
.portfolio-overview__tile-value {
display: block;
font-size: 14px;
font-weight: 700;
line-height: 1.35;
}
.portfolio-overview__tile-sub {
display: block;
margin-top: 4px;
font-size: 11px;
opacity: 0.8;
}
.portfolio-overview--desktop .portfolio-overview__tile-sub {
color: #9ca3af;
opacity: 1;
}
.portfolio-overview__footnote {
margin: 10px 0 0;
font-size: 11px;
line-height: 1.6;
opacity: 0.8;
}
.portfolio-overview--desktop .portfolio-overview__footnote {
color: #6b7280;
opacity: 1;
}
</style>
src/views/base/home/composables/useHomePage.ts
+1 -4
View File
@@ -32,7 +32,6 @@ export interface HomePageContext {
homePageLoading: ReturnType<typeof useHomePageLoading>['homePageLoading']
isGaroosi: ReturnType<typeof computed<boolean>>
bannerEnabled: ReturnType<typeof computed<boolean>>
limitedPrice: ReturnType<typeof computed>
showClosedMessage: ReturnType<typeof computed<boolean>>
closedMessage: ReturnType<typeof computed>
mainActions: ReturnType<typeof computed<HomeActionItem[]>>
@@ -89,7 +88,6 @@ export function useHomePage() {
return custom || ''
})
const showClosedMessage = computed(() => !!marketClosedText.value)
const limitedPrice = computed(() => walletStore.limitedPrice?.[0])
const goldVal = computed(() => lastPrice.value?.price_last ?? 1)
const mainActions = computed<HomeActionItem[]>(() => [
@@ -199,7 +197,7 @@ export function useHomePage() {
const metalRial = resolveAssetsRialValue(summary, getTradeBuyPrice(lastPrice.value))
Modal.confirm({
title: 'دارایی ریالی',
content: renderModalLines(formatRialAssetsInfoText(cash, metalRial)),
content: renderModalLines(formatRialAssetsInfoText(cash, metalRial, summary?.portfolio)),
okText: 'متوجه شدم',
centered: true,
cancelButtonProps: { style: { display: 'none' } },
@@ -234,7 +232,6 @@ export function useHomePage() {
homePageLoading,
isGaroosi,
bannerEnabled,
limitedPrice,
showClosedMessage,
closedMessage: marketClosedText,
mainActions,
src/views/base/home/desktop/components/DesktopAssetsMetrics.vue
+8 -2
View File
@@ -2,6 +2,7 @@
import { computed } from 'vue'
import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
import BoursecuAssetsSummary from '../../components/BoursecuAssetsSummary.vue'
import PortfolioOverview from '../../components/PortfolioOverview.vue'
import { formatWeightAmount, usePriceWithoutType } from '@/utils/usePrice'
import { useWalletAssets } from '@/composables/useWalletAssets'
import type { WalletMetalTotal } from '@/models/walletAssets'
@@ -24,6 +25,7 @@ const cashWallet = computed(() => assetsSummary.value?.cash_wallet ?? 0)
const countBasedInventory = computed(() =>
(assetsSummary.value?.count_products ?? []).reduce((sum, item) => sum + Number(item.quantity ?? 0), 0),
)
const showLegacyMetrics = computed(() => !assetsSummary.value?.portfolio)
type MetricItem = {
id: string
@@ -101,7 +103,10 @@ function handleInfo(metric: MetricItem) {
icon-color="tertiary"
/>
<div v-else class="dhome-metrics">
<template v-else>
<PortfolioOverview variant="desktop" />
<div v-if="showLegacyMetrics" class="dhome-metrics">
<article v-for="metric in metrics" :key="metric.id" class="dhome-metric-tile">
<div class="dhome-metric-tile__head">
<span class="dhome-metric-tile__label">{{ metric.label }}</span>
@@ -117,5 +122,6 @@ function handleInfo(metric: MetricItem) {
</div>
<p class="dhome-metric-tile__value">{{ metric.value }}</p>
</article>
</div>
</div>
</template>
</template>
src/views/base/home/desktop/components/DesktopHomeAlerts.vue
+2 -23
View File
@@ -1,36 +1,15 @@
<script setup lang="ts">
import { computed, inject } from 'vue'
import { useUserStore } from '@/store/userStore'
import { usePriceWithoutType } from '@/utils/usePrice'
import { inject } from 'vue'
import { isBoursecuProject } from '@/utils/config'
import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
import { HOME_PAGE_CONTEXT_KEY } from '../../composables/useHomePage'
const ctx = inject(HOME_PAGE_CONTEXT_KEY)!
const userStore = useUserStore()
const isBoursecu = isBoursecuProject()
const showLimitedPrice = computed(
() =>
ctx.limitedPrice.value !== undefined &&
userStore.userInfo?.trade_active !== 1,
)
const limitedPriceText = computed(() =>
usePriceWithoutType(Number(ctx.limitedPrice.value?.value ?? 0)),
)
</script>
<template>
<div v-if="showLimitedPrice || ctx.showClosedMessage.value" class="dhome-alerts">
<div v-if="showLimitedPrice" class="dhome-alert dhome-alert--warning">
<BasicIcon icon="vuesax-linear:info-circle" size="14" />
<span>
حداقل مبلغ اولیه برای ثبت سفارش {{ limitedPriceText }} ریال می‌باشد.
</span>
</div>
<div v-if="!isBoursecu && ctx.showClosedMessage.value" class="dhome-alerts">
<div
v-if="!isBoursecu && ctx.showClosedMessage.value"
class="dhome-alert dhome-alert--info"
v-html="ctx.closedMessage.value"
/>
src/views/base/home/desktop/layouts/DefaultDesktopHome.vue
+5 -5
View File
@@ -37,17 +37,17 @@ const showSkeleton = computed(() => Boolean(getToken()) && !userInfo.value)
<HomeSkeleton v-if="showSkeleton" />
<template v-if="showContent">
<section class="dhome-hero-row">
<DesktopLivePrice />
<DesktopPriceRange />
</section>
<DesktopAssetsMetrics
v-if="!ctx.isGaroosi.value"
@open-gold-modal="ctx.openGoldModal"
@open-rial-modal="ctx.openRialModal"
/>
<section class="dhome-hero-row">
<DesktopLivePrice />
<DesktopPriceRange />
</section>
<div v-if="ctx.isGaroosi.value" class="dhome-default-grid">
<div class="dhome-default-grid__main">
<DesktopDefaultActions />
src/views/base/home/layouts/configs/boursecu.ts
-1
View File
@@ -11,7 +11,6 @@ export const boursecuHomeLayoutConfig: HomeLayoutConfig = {
{ id: 'assets' },
{ id: 'currentPrice' },
{ id: 'boursecuQuickActions' },
{ id: 'limitedPriceAlert' },
],
sections: [
{ id: 'marketClosed' },
src/views/base/home/layouts/configs/default.ts
+1 -2
View File
@@ -4,12 +4,11 @@ import type { HomeLayoutConfig } from '../types'
export const defaultHomeLayoutConfig: HomeLayoutConfig = {
id: 'default',
wrapperClass: 'p-1 from-primary rounded-lg p-px to-transparent mt-5',
outerSections: [{ id: 'limitedPriceAlert' }],
sections: [
{ id: 'garoosiAssets' },
{ id: 'assets' },
{ id: 'mainActions' },
{ id: 'referral' },
{ id: 'assets' },
{ id: 'marketClosed' },
{ id: 'currentPrice' },
{ id: 'banners' },
src/views/base/home/layouts/sections/LimitedPriceAlertSection.vue
-28
View File
@@ -1,28 +0,0 @@
<script setup lang="ts">
import { computed, inject } from 'vue'
import { useUserStore } from '@/store/userStore'
import { usePriceWithoutType } from '@/utils/usePrice'
import Icon from '@/components/BasicPacks/BasicIcon.vue'
import { HOME_PAGE_CONTEXT_KEY } from '../../composables/useHomePage'
const ctx = inject(HOME_PAGE_CONTEXT_KEY)!
const userStore = useUserStore()
const isVisible = computed(
() =>
ctx.limitedPrice.value !== undefined &&
userStore.userInfo?.trade_active !== 1
)
</script>
<template>
<div
v-if="isVisible"
class="text-red text-xs flex gap-1 items-center justify-center mb-2"
>
<Icon icon="vuesax-linear:info-circle" size="16" />
حداقل مبلغ اولیه برای ثبت سفارش
{{ usePriceWithoutType(Number(ctx.limitedPrice.value?.value ?? 0)) }}
ریال می باشد.
</div>
</template>
src/views/base/home/layouts/sections/index.ts
-2
View File
@@ -1,6 +1,5 @@
import type { Component } from 'vue'
import type { HomeSectionId } from '../types'
import LimitedPriceAlertSection from './LimitedPriceAlertSection.vue'
import GaroosiAssetsSection from './GaroosiAssetsSection.vue'
import MainActionsSection from './MainActionsSection.vue'
import BoursecuQuickActionsSection from './BoursecuQuickActionsSection.vue'
@@ -13,7 +12,6 @@ import PriceChartSection from './PriceChartSection.vue'
import PriceStatsSection from './PriceStatsSection.vue'
export const HOME_SECTION_COMPONENTS: Record<HomeSectionId, Component> = {
limitedPriceAlert: LimitedPriceAlertSection,
garoosiAssets: GaroosiAssetsSection,
mainActions: MainActionsSection,
boursecuQuickActions: BoursecuQuickActionsSection,
src/views/base/home/layouts/types.ts
-1
View File
@@ -2,7 +2,6 @@
export type HomeLayoutId = 'default' | 'boursecu'
export type HomeSectionId =
| 'limitedPriceAlert'
| 'garoosiAssets'
| 'mainActions'
| 'boursecuQuickActions'