119 lines
4.7 KiB
Vue
119 lines
4.7 KiB
Vue
<template>
|
|
|
|
<div @click="infoVisible = true">
|
|
<div class="flex">
|
|
<div :class="isUp? 'bg-green-50':'bg-red-50'"
|
|
class="rounded-lg p-3 h-fit w-fit flex justify-center items-center ">
|
|
<Icon :class="isUp? 'text-green-600':'text-red-600'"
|
|
:icon="`vuesax-linear:${isUp? 'arrow-up-2':'arrow-down-2'}`"/>
|
|
</div>
|
|
<div class="w-full mr-3">
|
|
<div class="flex justify-between w-full">
|
|
<div>{{ item.title }}</div>
|
|
<div>{{ toJalali(item.expire_at) }}</div>
|
|
</div>
|
|
<div class="flex justify-between mt-2">
|
|
<div :class="item.gold >= 0? 'text-green-600':'text-red-600'" class="text-gray-500 text-xs number-ltr">
|
|
</div>
|
|
<div class="text-gray-500 flex gap-1 text-xs items-center">
|
|
<div :class="item.gold > 0 ? 'text-green-600':'text-red-600'" class="text-base number-ltr">
|
|
{{ formatGoldAmount(item.gold) }}
|
|
</div>
|
|
{{item.unit}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- <div v-if="isGold" class="flex w-full justify-between mt-2">
|
|
<div class="text-gray-500">قیمت معامله</div>
|
|
<div class="text-gray-500 flex gap-1 text-xs items-center">
|
|
<div class="text-base">{{ usePriceWithoutType(Math.abs(item.cash) / Math.abs(item.gold)) }}</div>
|
|
ریال
|
|
</div>
|
|
</div>-->
|
|
<!-- <div v-else class="h-8"></div>-->
|
|
<a-divider class="!my-3"/>
|
|
<BasicActionSheet v-model:show="infoVisible">
|
|
<div class="font-bold text-lg">{{ props.item.title }}</div>
|
|
<div class="pb-20 mt-5">
|
|
<div class="flex justify-between mb-3">
|
|
<div class="text-primary">مقدار {{props.title}} مبادله شده:</div>
|
|
<div :class="item.gold >= 0? 'text-green-600' : 'text-red-600'" class="flex text-xs items-center">
|
|
<div class="text-base ml-1 number-ltr">{{ formatGoldAmount(item.gold) }}</div>
|
|
{{item.unit}}
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-between mb-3">
|
|
<div class="text-primary">موجودی {{ props.title }}:</div>
|
|
<div class="flex text-xs text-yellow-700 items-center">
|
|
<div class="text-base ml-1">{{ formatGoldAmount(item.balance_gold) }}</div>
|
|
{{item.unit}}
|
|
</div>
|
|
</div>
|
|
<!-- <div class="flex justify-between mb-3">
|
|
<div class="text-primary">موجودی کیف پول:</div>
|
|
<div class="flex text-xs items-center" :class="isUp? 'text-green-600' : 'text-red-600'"><div class="text-base">{{usePriceWithoutType(12000000)}}</div>ریال</div>
|
|
</div>
|
|
<div class="flex justify-between mb-3">
|
|
<div class="text-primary">موجودی کیف طلا:</div>
|
|
<div class="flex items-center" :class="isUp? 'text-red-600' : 'text-green-600'">60 گرم</div>
|
|
</div>-->
|
|
<div class="flex justify-between mb-3">
|
|
<div class="text-primary">وضعیت:</div>
|
|
<div class="flex text-xs items-center">
|
|
<ATag :color="item.active? 'blue': 'red'" class="!py-1 !px-6 !ml-0">{{
|
|
item.active ? 'موفق' : 'نا موفق'
|
|
}}
|
|
</ATag>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-between mb-3">
|
|
<div class="text-primary">تاریخ:</div>
|
|
<div>{{ toJalali(item.expire_at) }}</div>
|
|
</div>
|
|
<BasicButton class="w-full mt-5" @click="infoVisible = false">بازگشت</BasicButton>
|
|
</div>
|
|
</BasicActionSheet>
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import Icon from "@/components/BasicPacks/BasicIcon.vue";
|
|
import BasicActionSheet from "@/components/BasicPacks/BasicActionSheet.vue";
|
|
import {computed, ref} from "vue";
|
|
import BasicButton from "@/components/BasicPacks/BasicButton.vue";
|
|
import type {Transaction} from "@/models/transaction";
|
|
import {formatGoldAmount, usePriceWithoutType} from "../../../../../utils/usePrice";
|
|
import {toJalali} from "../../../../../utils/useDateTime";
|
|
|
|
const infoVisible = ref<boolean>(false)
|
|
|
|
interface Prop {
|
|
item: Transaction
|
|
title?: string
|
|
}
|
|
|
|
const props = withDefaults(defineProps<Prop>(), {})
|
|
const isUp = computed(() => props.item.type === 3 || props.item.type === 1)
|
|
// const isGold = computed(() => props.item.type === 1 || props.item.type === 2 || props.item.type === 10)
|
|
/*const title = computed(() => {
|
|
if (isUp.value) {
|
|
if (isGold.value) {
|
|
return 'واریز ریالی'
|
|
} else {
|
|
return 'خرید طلا'
|
|
}
|
|
} else {
|
|
if (isGold.value) {
|
|
return 'برداشت ریالی'
|
|
} else {
|
|
return 'فروش طلا'
|
|
}
|
|
}
|
|
})*/
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style> |