safavimohadeseh78andCursor
f0c1bb6c51
Fix rules paragraph alignment so Persian text does not stretch with justify. Co-authored-by: Cursor <cursoragent@cursor.com>
67 lines
2.0 KiB
Vue
67 lines
2.0 KiB
Vue
<template>
|
|
<div
|
|
class="w-full flex justify-evenly rounded-lg py-2 home_appear_fade_in"
|
|
:class="[
|
|
layout === 'boursecu' ? 'mt-8 pt-2' : 'mt-6',
|
|
variant === 'mobile' ? 'pb-45' : 'mt-0 pb-0',
|
|
]"
|
|
>
|
|
<div class="text-center w-full">
|
|
<div>بالاترین قیمت امروز</div>
|
|
<div v-if="price" class="flex flex-col items-center mt-3">
|
|
<div class="text-green-600 flex gap-1 text-xs items-center">
|
|
<div class="text-base">{{ usePriceWithoutType(highPrice) }}</div>
|
|
ریال
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<a-divider class="bg-gray-200 !h-auto !my-2" type="vertical" />
|
|
<div class="text-center w-full">
|
|
<div>پایین ترین قیمت امروز</div>
|
|
<div class="flex w-full mt-3 justify-evenly">
|
|
<div v-if="price" class="flex flex-col items-center">
|
|
<div class="text-red-600 flex gap-1 text-xs items-center">
|
|
<div class="text-base">{{ usePriceWithoutType(lowPrice) }}</div>
|
|
ریال
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
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 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>
|