<template>
	<view>
		<block v-if="list.length > 0">
			<view class="record--item" v-for="(item, index) in list" :key="index" v-if="item && !hash">
				<view class="title ellipsis-1">{{item.rule.title}} <span> {{item.coin?' ('+item.coin+'个能量球) ':''}} </span></view>
				<view class="time ellipsis-1">{{item.created_at || '-'}}</view>
				<view class="webkit-box variation">
					<view class="ellipsis" :class="item.amount<0 ? 'add': 'remove'">{{item.amount}}</view>
					<view class="symbol">{{item.amount>0?'现金红包收入':'现金红包支出'}}</view>
				</view>
			</view>

			<view class="record--item record--item1" v-for="(item, index) in list" :key="index" v-if="item && hash">
				<view class="title ellipsis-1">{{item.hash}}</view>
				<view class="time ellipsis-1">{{item.block_time || '-'}}</view>
				<view class="webkit-box variation">
					<view class="ellipsis" :class="item.is_in ? 'add': 'remove'">
						{{item.is_in ? '+': '-'}}{{item.amount}}</view>
					<view class="symbol">{{item.assets.symbol}}</view>
				</view>
			</view>
		</block>
		<block v-else>
			<no-list v-if='logsType === ""' name='no-record' txt="没有任何记录~" />
			<no-list v-if='logsType === "in"' name='no-in' txt="没有任何收入记录~" />
			<no-list v-if='logsType === "out"' name='no-out' txt="没有任何支出记录~" />
		</block>

	</view>
</template>

<script>
	export default {
		name: "property",
		props: {
			list: {
				type: Array,
				default: () => {
					return []
				}
			},
			logsType: {
				type: String
			},
			hash: {
				type: Boolean
			}
		},
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss" scoped>
	.record--item1 {
		padding: $padding 330rpx $padding 0 !important;
	}

	.record--item {
		padding: $padding 220rpx $padding 0;
		border-bottom: solid 1rpx #f7f7f7;
		position: relative;
		min-height: 50rpx;

		.variation {
			position: absolute;
			right: 0;
			top: $margin;
			bottom: $margin;
			width: 300rpx;
			text-align: right;
			font-weight: bold;

			&>label {
				font-size: 80%;
			}

			.symbol {
				color: #666;
				font-weight: normal;
				font-size: $title-size-m;
			}

			.add {
				color: $mian-color;
				font-size: 36rpx;
			}

			.remove {
				font-size: 36rpx;
				color: $mian-color;
			}
		}

		.title {
			line-height: 50rpx;
			font-size: 30rpx;
			word-break: break-word;
			span{
				font-size: 24rpx;
				color: #999;
			}
		}

		.time {
			font-size: 26rpx;
			color: #999;
			padding-top: 6rpx;
		}
	}

	// 数据空
	.record--null {
		padding-top: $padding * 3;
		text-align: center;
		color: $mian-color;
		font-size: $title-size;
		height: 50vh;
		box-sizing: border-box;
		line-height: 60rpx;

		image {
			width: 168rpx;
		}
	}
</style>
