Show boursecu assets per product from wallet API and scale day range for maftol.

Fix rules paragraph alignment so Persian text does not stretch with justify.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/views/base/home/components/PriceStats.vue

@@ -32,21 +32,35 @@
 
 <script setup lang="ts">
 import { computed } from 'vue'
-import { getTradeBuyPrice, getTradeSellPrice } from '@/utils/price'
 import { usePriceWithoutType } from '../../../../utils/usePrice'
+import type { ChartMetalType } from '../composables/usePriceChart'
+import { resolveMetalDayRangePrices } from '../composables/usePriceChart'
 
 const props = withDefaults(
   defineProps<{
     price: any
     layout?: 'default' | 'boursecu'
     variant?: 'mobile' | 'desktop'
+    selectedMetal?: ChartMetalType
+    maftolRatio?: number
   }>(),
   {
     layout: 'default',
     variant: 'mobile',
+    selectedMetal: 'katod',
+    maftolRatio: 0,
   }
 )
 
-const highPrice = computed(() => props.price?.up?.buy ?? getTradeBuyPrice(props.price))
-const lowPrice = computed(() => props.price?.up?.sell ?? getTradeSellPrice(props.price))
+const rangePrices = computed(() =>
+  resolveMetalDayRangePrices({
+    price: props.price,
+    metal: props.selectedMetal,
+    isBoursecuLayout: props.layout === 'boursecu',
+    maftolRatio: props.maftolRatio,
+  })
+)
+
+const highPrice = computed(() => rangePrices.value.high)
+const lowPrice = computed(() => rangePrices.value.low)
 </script>