new UI and handle cashing
This commit is contained in:
@@ -39,6 +39,17 @@
|
||||
@click="$emit('openGoldModal', primaryMetalTotal)"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div :class="[rowClass, 'mt-2']" class="flex justify-center w-full z-20">
|
||||
دارایی ریالی:
|
||||
<div class="text-l mr-2 font-bold">{{ usePriceWithoutType(cashWallet) }} ریال</div>
|
||||
<BasicIcon
|
||||
icon="vuesax-linear:info-circle"
|
||||
size="18"
|
||||
:color="iconColor"
|
||||
@click="$emit('openRialModal')"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-else-if="!boursecuLayout">
|
||||
@@ -61,7 +72,7 @@
|
||||
|
||||
<div :class="[rowClass, 'mt-2']" class="flex justify-center w-full z-20">
|
||||
دارایی ریالی:
|
||||
<div class="text-l mr-2 font-bold">{{ usePriceWithoutType(totalRialValue) }} ریال</div>
|
||||
<div class="text-l mr-2 font-bold">{{ usePriceWithoutType(cashWallet) }} ریال</div>
|
||||
<BasicIcon
|
||||
icon="vuesax-linear:info-circle"
|
||||
size="18"
|
||||
@@ -119,7 +130,7 @@ const primaryMetalTotal = computed(() => metalTotals.value[0])
|
||||
const boursecuAssetRows = computed(() =>
|
||||
props.boursecuLayout ? buildBoursecuHomeAssetRows(assetsSummary.value) : []
|
||||
)
|
||||
const totalRialValue = computed(() => assetsSummary.value?.total_rial_value ?? 0)
|
||||
const cashWallet = computed(() => assetsSummary.value?.cash_wallet ?? 0)
|
||||
const inventoryCards = computed(() => assetsSummary.value?.inventory_cards ?? [])
|
||||
const countBasedInventory = computed(() =>
|
||||
(assetsSummary.value?.count_products ?? []).reduce((sum, item) => sum + Number(item.quantity ?? 0), 0)
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { computed, h, inject, onMounted, onUnmounted, provide, ref, type InjectionKey } from 'vue'
|
||||
import { computed, h, inject, onUnmounted, provide, ref, type InjectionKey } from 'vue'
|
||||
import router from '@/router'
|
||||
import { loading, removeToken } from '@/utils'
|
||||
import { getToken, removeToken } from '@/utils'
|
||||
import { useUserStore } from '@/store/userStore'
|
||||
import { useWalletStore } from '@/store/walletStore'
|
||||
import { useWalletAssets } from '@/composables/useWalletAssets'
|
||||
@@ -20,14 +20,14 @@ import { useBanners } from './useBanners'
|
||||
import { usePriceChart, type ChartMetalType } from './usePriceChart'
|
||||
import type { HomeActionItem } from '../layouts/types'
|
||||
import { getHomeLayoutId } from '../layouts/registry'
|
||||
import { initHomePageData, resetHomePageData } from './useHomePageData'
|
||||
import { initHomePageData, resetHomePageData, useHomePageLoading } from './useHomePageData'
|
||||
import { resetWalletPageData } from '../../wallet/composables/useWalletPageData'
|
||||
import { resetAddressPageData } from '../../address/composables/useAddressPageData'
|
||||
import { resetTransactionsPageData } from '../../transactions/composables/useTransactionsPageData'
|
||||
import { resetProductsPageData } from '../../products/composables/useProductsPageData'
|
||||
|
||||
export interface HomePageContext {
|
||||
loading: typeof loading
|
||||
homePageLoading: ReturnType<typeof useHomePageLoading>['homePageLoading']
|
||||
isGaroosi: ReturnType<typeof computed<boolean>>
|
||||
limitedPrice: ReturnType<typeof computed>
|
||||
showClosedMessage: ReturnType<typeof computed<boolean>>
|
||||
@@ -65,6 +65,7 @@ export function useHomePage() {
|
||||
const TextBanner = ref('')
|
||||
|
||||
const { banners } = useBanners()
|
||||
const { homePageLoading } = useHomePageLoading()
|
||||
const {
|
||||
updateChartData,
|
||||
priceChartSeries,
|
||||
@@ -230,7 +231,7 @@ export function useHomePage() {
|
||||
}
|
||||
|
||||
const context: HomePageContext = {
|
||||
loading,
|
||||
homePageLoading,
|
||||
isGaroosi,
|
||||
limitedPrice,
|
||||
showClosedMessage,
|
||||
@@ -250,15 +251,12 @@ export function useHomePage() {
|
||||
|
||||
provide(HOME_PAGE_CONTEXT_KEY, context)
|
||||
|
||||
void ensureHomeUserAndData()
|
||||
|
||||
onUnmounted(() => {
|
||||
stopLastPricePolling()
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
// Single shared fetch for mobile + desktop — safe to call on remount (deduped in useHomePageData)
|
||||
void initHomePageData()
|
||||
})
|
||||
|
||||
return {
|
||||
userStore,
|
||||
walletStore,
|
||||
@@ -279,3 +277,15 @@ export function useHomePageContext() {
|
||||
}
|
||||
return context
|
||||
}
|
||||
|
||||
async function ensureHomeUserAndData() {
|
||||
const userStore = useUserStore()
|
||||
|
||||
if (getToken() && !userStore.userInfo) {
|
||||
await userStore.getMyInfo()
|
||||
}
|
||||
|
||||
if (getToken()) {
|
||||
await initHomePageData()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import { ref } from 'vue'
|
||||
import { loading } from '@/utils'
|
||||
import { getLastPrices, startLastPricePolling, stopLastPricePolling } from '@/utils/price'
|
||||
import { useWalletAssets } from '@/composables/useWalletAssets'
|
||||
import { clearProductsCatalog } from '@/composables/useProductsCatalog'
|
||||
@@ -8,13 +7,16 @@ import { fetchHomeChartPrices, loadHomeMaftolOffset, resetHomePriceChart } from
|
||||
import { loadHomeBanners, resetHomeBanners } from './useBanners'
|
||||
import { loadHomeFunds, resetHomeFunds } from './useUserFunds'
|
||||
|
||||
/**
|
||||
* Single entry point for all homepage API calls.
|
||||
* Mobile and desktop layouts must not fetch independently — they consume shared module state.
|
||||
*/
|
||||
/** فقط لودینگ صفحه اصلی — نه loading سراسری @/utils */
|
||||
const homePageLoading = ref(false)
|
||||
|
||||
let initPromise: Promise<void> | null = null
|
||||
const initialized = ref(false)
|
||||
|
||||
export function useHomePageLoading() {
|
||||
return { homePageLoading }
|
||||
}
|
||||
|
||||
export function isHomePageDataInitialized() {
|
||||
return initialized.value
|
||||
}
|
||||
@@ -36,7 +38,6 @@ export async function initHomePageData(force = false) {
|
||||
|
||||
initPromise = (async () => {
|
||||
try {
|
||||
loading.value = true
|
||||
const { loadWalletAssets } = useWalletAssets()
|
||||
|
||||
await Promise.all([
|
||||
@@ -56,7 +57,6 @@ export async function initHomePageData(force = false) {
|
||||
} catch (error) {
|
||||
console.error('Home page initialization error:', error)
|
||||
} finally {
|
||||
loading.value = false
|
||||
initPromise = null
|
||||
}
|
||||
})()
|
||||
@@ -68,6 +68,7 @@ export async function initHomePageData(force = false) {
|
||||
export function resetHomePageData() {
|
||||
initialized.value = false
|
||||
initPromise = null
|
||||
homePageLoading.value = false
|
||||
stopLastPricePolling()
|
||||
resetHomeBanners()
|
||||
resetHomeFunds()
|
||||
|
||||
@@ -19,7 +19,7 @@ const isBoursecuLayout = computed(() => ctx.isBoursecuHomeLayout.value)
|
||||
const meta = computed(() => assetsSummary.value?.meta)
|
||||
const metalTotals = computed(() => assetsSummary.value?.metal_totals ?? [])
|
||||
const inventoryCards = computed(() => assetsSummary.value?.inventory_cards ?? [])
|
||||
const totalRialValue = computed(() => assetsSummary.value?.total_rial_value ?? 0)
|
||||
const cashWallet = computed(() => assetsSummary.value?.cash_wallet ?? 0)
|
||||
const countBasedInventory = computed(() =>
|
||||
(assetsSummary.value?.count_products ?? []).reduce((sum, item) => sum + Number(item.quantity ?? 0), 0),
|
||||
)
|
||||
@@ -90,7 +90,7 @@ const metrics = computed<MetricItem[]>(() => {
|
||||
items.push({
|
||||
id: 'rial',
|
||||
label: 'دارایی ریالی',
|
||||
value: `${usePriceWithoutType(totalRialValue.value)} ریال`,
|
||||
value: `${usePriceWithoutType(cashWallet.value)} ریال`,
|
||||
showInfo: true,
|
||||
onInfo: 'rial',
|
||||
})
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue'
|
||||
import { storeToRefs } from 'pinia'
|
||||
import { useUserStore } from '@/store/userStore'
|
||||
import { loading } from '@/utils'
|
||||
import { getToken } from '@/utils'
|
||||
import { useHomePageContext } from '../../composables/useHomePage'
|
||||
import HomeSkeleton from '../../components/HomeSkeleton.vue'
|
||||
import DesktopHomeShell from '../components/DesktopHomeShell.vue'
|
||||
@@ -18,10 +19,11 @@ defineEmits<{
|
||||
}>()
|
||||
|
||||
const userStore = useUserStore()
|
||||
const { userInfo } = storeToRefs(userStore)
|
||||
const ctx = useHomePageContext()
|
||||
|
||||
const showSkeleton = computed(() => loading.value || !userStore.userInfo)
|
||||
const showContent = computed(() => !loading.value && Boolean(userStore.userInfo))
|
||||
const showContent = computed(() => Boolean(userInfo.value))
|
||||
const showSkeleton = computed(() => Boolean(getToken()) && !userInfo.value)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -31,7 +33,7 @@ const showContent = computed(() => !loading.value && Boolean(userStore.userInfo)
|
||||
|
||||
<HomeSkeleton v-if="showSkeleton" />
|
||||
|
||||
<template v-else-if="showContent">
|
||||
<template v-if="showContent">
|
||||
<section class="dhome-hero-row">
|
||||
<DesktopLivePrice />
|
||||
<DesktopPriceRange />
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue'
|
||||
import { storeToRefs } from 'pinia'
|
||||
import { useUserStore } from '@/store/userStore'
|
||||
import { loading } from '@/utils'
|
||||
import { getToken } from '@/utils'
|
||||
import { useHomePageContext } from '../../composables/useHomePage'
|
||||
import HomeSkeleton from '../../components/HomeSkeleton.vue'
|
||||
import DesktopHomeShell from '../components/DesktopHomeShell.vue'
|
||||
@@ -21,10 +22,11 @@ defineEmits<{
|
||||
}>()
|
||||
|
||||
const userStore = useUserStore()
|
||||
const { userInfo } = storeToRefs(userStore)
|
||||
const ctx = useHomePageContext()
|
||||
|
||||
const showSkeleton = computed(() => loading.value || !userStore.userInfo)
|
||||
const showContent = computed(() => !loading.value && Boolean(userStore.userInfo))
|
||||
const showContent = computed(() => Boolean(userInfo.value))
|
||||
const showSkeleton = computed(() => Boolean(getToken()) && !userInfo.value)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -34,7 +36,7 @@ const showContent = computed(() => !loading.value && Boolean(userStore.userInfo)
|
||||
|
||||
<HomeSkeleton v-if="showSkeleton" />
|
||||
|
||||
<template v-else-if="showContent">
|
||||
<template v-if="showContent">
|
||||
<section class="dhome-hero-row">
|
||||
<DesktopLivePrice />
|
||||
<DesktopPriceRange />
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue'
|
||||
import { storeToRefs } from 'pinia'
|
||||
import { useUserStore } from '@/store/userStore'
|
||||
import { loading } from '@/utils'
|
||||
import { getToken } from '@/utils'
|
||||
import HomeSkeleton from '../components/HomeSkeleton.vue'
|
||||
import { getHomeLayoutConfig } from './registry'
|
||||
import { HOME_SECTION_COMPONENTS } from './sections'
|
||||
@@ -12,6 +13,7 @@ const props = defineProps<{
|
||||
}>()
|
||||
|
||||
const userStore = useUserStore()
|
||||
const { userInfo } = storeToRefs(userStore)
|
||||
const layoutConfig = computed(() => props.layoutConfig ?? getHomeLayoutConfig())
|
||||
|
||||
const outerSections = computed(() =>
|
||||
@@ -22,13 +24,17 @@ const innerSections = computed(() =>
|
||||
layoutConfig.value.sections.filter((section) => section.visible !== false)
|
||||
)
|
||||
|
||||
/** محتوا با userInfo — دادههای API در پسزمینه لود میشوند */
|
||||
const showContent = computed(() => Boolean(userInfo.value))
|
||||
const showSkeleton = computed(() => Boolean(getToken()) && !userInfo.value)
|
||||
|
||||
function resolveSectionComponent(sectionId: HomeSectionId) {
|
||||
return HOME_SECTION_COMPONENTS[sectionId]
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="userStore.userInfo && !loading">
|
||||
<div v-if="showContent">
|
||||
<component
|
||||
:is="resolveSectionComponent(section.id)"
|
||||
v-for="section in outerSections"
|
||||
@@ -52,5 +58,5 @@ function resolveSectionComponent(sectionId: HomeSectionId) {
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<HomeSkeleton v-else class="w-full" />
|
||||
<HomeSkeleton v-else-if="showSkeleton" class="w-full" />
|
||||
</template>
|
||||
|
||||
@@ -1,21 +1,25 @@
|
||||
import type { Component } from 'vue'
|
||||
import { defineAsyncComponent, type Component } from 'vue'
|
||||
import { getConfigApp, isBoursecuProject } from '@/utils/config'
|
||||
import type { HomeLayoutConfig, HomeLayoutId } from './types'
|
||||
import { defaultHomeLayoutConfig } from './configs/default'
|
||||
import { boursecuHomeLayoutConfig } from './configs/boursecu'
|
||||
import HomeLayoutRenderer from './HomeLayoutRenderer.vue'
|
||||
|
||||
export const DEFAULT_HOME_LAYOUT_ID: HomeLayoutId = 'default'
|
||||
|
||||
const HOME_LAYOUT_CONFIGS: Record<HomeLayoutId, HomeLayoutConfig> = {
|
||||
default: defaultHomeLayoutConfig,
|
||||
boursecu: boursecuHomeLayoutConfig,
|
||||
}
|
||||
|
||||
const HOME_LAYOUT_COMPONENTS: Record<HomeLayoutId, Component> = {
|
||||
default: HomeLayoutRenderer,
|
||||
boursecu: HomeLayoutRenderer,
|
||||
}
|
||||
let cachedLayoutRenderer: Component | null = null
|
||||
|
||||
export const DEFAULT_HOME_LAYOUT_ID: HomeLayoutId = 'default'
|
||||
function getLayoutRenderer(): Component {
|
||||
if (!cachedLayoutRenderer) {
|
||||
cachedLayoutRenderer = defineAsyncComponent(() => import('./HomeLayoutRenderer.vue'))
|
||||
}
|
||||
|
||||
return cachedLayoutRenderer
|
||||
}
|
||||
|
||||
export function isHomeLayoutId(value: unknown): value is HomeLayoutId {
|
||||
return typeof value === 'string' && value in HOME_LAYOUT_CONFIGS
|
||||
@@ -38,8 +42,8 @@ export function getHomeLayoutConfig(layoutId = getHomeLayoutId()): HomeLayoutCon
|
||||
return HOME_LAYOUT_CONFIGS[layoutId] ?? HOME_LAYOUT_CONFIGS[DEFAULT_HOME_LAYOUT_ID]
|
||||
}
|
||||
|
||||
export function resolveHomeLayoutComponent(layoutId = getHomeLayoutId()): Component {
|
||||
return HOME_LAYOUT_COMPONENTS[layoutId] ?? HOME_LAYOUT_COMPONENTS[DEFAULT_HOME_LAYOUT_ID]
|
||||
export function resolveHomeLayoutComponent(_layoutId = getHomeLayoutId()): Component {
|
||||
return getLayoutRenderer()
|
||||
}
|
||||
|
||||
export function registerHomeLayoutConfig(layoutId: HomeLayoutId, config: HomeLayoutConfig) {
|
||||
|
||||
Reference in New Issue
Block a user