<template>
	<view class="main_con">

		<navigation :showBack="false" :bgnum="true" class="head">
			Market
		</navigation>
		<view class="main">
			<view class="title_item flex">
				<view class="text1 pairs">Tranding Pairs</view>
				<view class="text1 price">Price/Vol</view>
				<view class="text1  chang">
					24h Chang

				</view>
			</view>
			<view class="scroll">
				<view class="item flex" v-for="(item,index) in recordInfo">
					<view class="text2 pairs">
						<strong>{{item.name}}</strong><span class="t1">/USDT</span>
					</view>
					<view class="text2 price">
						<view class="">
							<strong>${{item.current_price_usd}}</strong>
						</view>
						<view class="t1">
							{{item.current_price}}
						</view>

					</view>
					<view class="btn " :class="item.change_percent>0?'red':'green'">
						<!-- <image src="../../../static/tongyonh/arrow-down-left1.png" mode="aspectFit" class="img1"
							v-if="item.change_percent>=0"></image>
						<image src="../../../static/tongyonh/arrow-down-left.png" mode="aspectFit" class="img1"
							v-if="item.change_percent<0"></image> -->
						{{item.change_percent>0?'+':''}}{{item.change_percent}}%
					</view>
				</view>
			</view>
		</view>

		<tab-bar :selectActive="3"></tab-bar>
	</view>




</template>

<script>
	import cont from "@/components/navigation/navigation.vue"
	export default {
		data() {
			return {
				recordInfo: [],
				isStop: false
			}
		},

		onUnload: function() {
			this.isStop = true
		},
		methods: {
			getHomeSlideFunc() {

				var _self = this;
				uni.request({
					url: 'https://dncapi.fxhapp.com/api/coin/web-coinrank?page=1&type=0&pagesize=10', //请求接口
					header: {
						'content-type': 'application/x-www-form-urlencoded', //自定义请求头信息
					},
					success: (res) => {
						this.recordInfo = res.data.data
						setTimeout(function() {
							console.log(_self.isStop)
							if (!_self.isStop) {
								_self.getHomeSlideFunc()
							}

						}, 2000)
						this.$forceUpdate()


					}
				});

			},


		},
		onLoad() {

			this.getHomeSlideFunc()



		}
	};
</script>
<style scoped>
	page {
		background-color: #FAFAFA;
	}
</style>

<style>
	@import './index.css';
</style>
