<template>
	<view class="">
		<z-paging style="padding-bottom: 170rpx;" :language="$i18n.locale" ref="paging" v-model="list" @query="queryList" :pageSize="20"
		:style="'background-color: '+theme.bg+';color: '+theme.text">
			<!-- 下拉刷新 -->
			<custom-refresher slot="refresher" slot-scope="{refresherStatus}" :status="refresherStatus">
			</custom-refresher>

			<!-- 头部 -->
			<myNav slot="top" :title="name"></myNav>
			<!-- 身体 -->
			<view>
				<p class="padding-w-30 font-46 bold-font margin-c-30">
					{{i18n.assets.index.detail}}
				</p>
				<view class="listBox" v-for="(item,index) in list" :key="index"
				 :style="'background-color: '+theme.fu_bg+';color: '+theme.fu_text">
					<view class="width-100b height-82 padding-w-22 flex align-center"
						style="border-bottom: 1rpx solid rgba(191, 195, 199, 0.2);">
						<text :class="item.cart==1?'color-00C481':'color-FF4040'"
							class="font-32 numbold-font">{{item.cart==1?i18n.assets.index.shift:i18n.assets.index.roll}}</text>
					</view>
					<view class="width-100b padding-w-20">
						<view class="height-80 flex align-center justify-between">
							<text class="font-26 nummedium-font">{{item.price}}</text>
							<text class="font-26 nummedium-font color-C3C3C3">{{item.createtime}}</text>
						</view>
						<view class="padding-b-20">
							<text class="font-26 numbold-font">{{item.description}}</text>
						</view>
					</view>
				</view>
			</view>


		</z-paging>

		<!-- 底部按钮 -->
		<view v-if="type==1" class="bottomBox">
			<view v-if="curr_obj.is_reg==1" @click="router.push('/pages/index/recharge?id='+curr_id)"
				class="juxing chonbi">{{i18n.assets.index.reg}}</view>
			<view v-if="curr_obj.is_wid==1" @click="router.push('/pages/index/withdraw?id='+curr_id)" class="juxing">
				{{i18n.assets.index.wid}}
			</view>
			<!-- <view v-if="curr_obj.is_tran==1" @click="router.push('/pages/asset/transfer?id=1')" class="juxing">
				{{i18n.assets.index.tran}}
			</view> -->
		</view>
		<!-- <view v-if="type==2&&curr_obj.is_otc==1" class="bottomBox">
			<view @click="router.push('/pages/index/releaseTrade?id='+curr_id)" class="juxing chonbi">
				{{i18n.assets.index.buy}}
			</view>
			<view @click="router.push('/pages/index/releaseTrade?id='+curr_id)" class="juxing">
				{{i18n.assets.index.sell}}
			</view>
		</view> -->
	
	</view>
</template>

<script>
	export default {
		data() {
			return {
				curr_id: '',
				name: '',
				type: '',

				curr_obj: {
				},

				list: [],
				theme: '',
			}
		},
		computed: {
			i18n() {
				return this.$t('message');
			}
		},
		onLoad(e) {
			this.curr_id = e.curr_id
			this.name = e.name
			this.type = e.type
			this.curr_obj = e
		},
		onShow() {
			if (uni.getStorageSync("theme") == "dark") {
				this.theme = this.$store.state.darkTheme
			} else {
				this.theme = this.$store.state.lightTheme
			}
		},
		methods: {
			queryList(pageNo, pageSize) {
				setTimeout(() => {
					this.post('/wallet/detail_log', {
						page: pageNo,
						page_num: pageSize,
						type: this.type,
						curr_id: this.curr_id
					}).then(res => {
						if (res.code == 1) {
							console.log(res)
							this.$refs.paging.complete(res.data.data);
						}
					})
				}, 500)
			},
		}
	}
</script>

<style lang="scss">
	.listBox {
		width: 690rpx;
		// height: 183rpx;
		margin: 30rpx auto;
		// background: #FFFFFF;
		box-shadow: 0rpx 4rpx 4rpx rgba(205, 206, 219, 0.2);
		border-radius: 10rpx;
	}

	.bottomBox {
		width: 100%;
		// height: 120rpx;
		padding: 0 30rpx;
		/* #ifdef APP-PLUS */
		padding: 0 30rpx 40rpx;
		/* #endif */
		// background: #FFFFFF;
		box-shadow: 0rpx 4rpx 10rpx rgba(33, 33, 33, 0.16);
		position: fixed;
		bottom: 0rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.juxing {
		// width: 173rpx;
		flex: 1;
		height: 76rpx;
		margin: 30rpx 20rpx;
		background: #F6F8FB;
		border-radius: 10rpx;
		line-height: 76rpx;
		text-align: center;
		font-size: 32rpx;
		color: #17181A;
	}

	.chonbi {
		background: linear-gradient(180deg, #52F3C9 0%, #3ECEB2 100%)!important;
		color: #FFFFFF !important;
	}
</style>
