BiKing/pages/contract/order-info.vue

<template>
	<view>
		<headContent borderBottom>
			<template #left>
				<reverse-back />
			</template>
			<template #content>
				<view class="haed-title">
					订单详情
				</view>
			</template>
		</headContent>
		
		<view class="content-box" :rise-fall="stocksColor">
			<view class="content-top">
				<view class="top-left">
					<view class="top-left-title">
						<text>{{ item.symbol }}</text>
						<text v-if="item.settled == 0">永续</text>
						<text v-else-if="item.settled == 9">快捷</text>
					</view>
					<view class="top-left-b">
						<text>{{ item.multiple }}倍杠杆</text>
						<text class="top-left-b-tag">{{ item.type_name }}</text>
						<text class="top-left-b-tag">{{ item.status_name }}</text>
					</view>
				</view>
		
				<view :class="['top-right' , $setColor(item.profits)]">
					<text class="color">{{ item.profits || '--'}}</text>
					<text class="color top-right-float"><text
							class="bdColor">平仓盈亏</text>{{ $getChange(item , 1) }}%</text>
				</view>
			</view>
			<view class="content-info">
				<view class="info-item">
					<text class="info-item-lable">保证金(USDT)</text>
					<text class="info-item-val">{{ item.caution_money }}</text>
				</view>
				<view class="info-item">
					<text class="info-item-lable">开仓价格(USDT)</text>
					<text class="info-item-val">{{ item.price }}</text>
				</view>
				<view class="info-item">
					<text class="info-item-lable">平仓价格(USDT)</text>
					<text class="info-item-val">{{ item.origin_price }}</text>
				</view>
		
		
				<view class="info-item">
					<text class="info-item-lable">平仓数量(张)</text>
					<text class="info-item-val">{{ item.number }}</text>
				</view>
				<view class="info-item">
					<text class="info-item-lable">手续费(USDT)</text>
					<text class="info-item-val">{{ item.trade_fee || '--' }}</text>
				</view>
				<view class="info-item">
					<text class="info-item-lable">平仓类型(USDT)</text>
					<text class="info-item-val">{{ item.status === 3 ? '强制平仓' : '' }}</text>
				</view>
			</view>
			<view class="record-hint">
				<text class="record-lable">平仓时间 {{ $getData_(item.create_time ) }}</text>
				<!-- <view class="record-icon" @click.stop="$emit('shareContent' , item)">
					<text class="icon-size iconfont">&#xe8b0;</text>
					<text class="icon-size">分享</text>
				</view> -->
			</view>
		</view>
		
		
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	export default {
		data() {
			return {
				item:{}
			};
		},
		computed: {
			...mapGetters([
				"stocksColor",
			])
		},
		onLoad() {
			this.item = this.$getStorageSync('historyInfo') || {}
		}
	}
</script>

<style lang="scss" scoped>
	@import "~./sustainability/index.scss";
	@import "~./history/index.scss";
	.top-right-float{
		text{
			border: none;
		}
	}
	.top-left-b-tag{
		font-size: 20rpx;
		border-radius: 5rpx;
	}
</style>