<template>
	<view class="content" :rise-fall="stocksColor">
		<!-- 头部 -->
		<headContent>
			<template #left>
				<loginStatus></loginStatus>
			</template>
			<template #content>
				<view class="haed-title">
					<image class="logo" src="../../static/images/logo.png" mode="aspectFit"></image>
					<image class="name" src="../../static/images/name.png" mode="aspectFit"></image>
				</view>
			</template>
			<template #right>
				<message></message>
				<share @openShare="openShare"></share>
			</template>
		</headContent>
		<!-- 轮播图 -->
		<carousels :BannerList="BannerList"></carousels>

		<!-- 滚动消息 -->
		<rollMessage :rollMsg="Announcement"></rollMessage>

		<!-- usdt -->
		<usdt :usdtList="usdtList"></usdt>

		<gap />
		<!-- 快捷买币 -->
		<shortcut></shortcut>

		<gap />
		<!-- 快捷菜单 -->
		<navMuen></navMuen>

		<!-- 自选 / 市场 -->
		<market></market>

		<!-- 邀请 -->
		<sharePage ref="sharePageRef" :tabBar="false" />
	</view>
</template>

<script>
	import loginStatus from "@/components/headModules/login.vue"
	import message from "@/components/headModules/message.vue"
	import share from "@/components/headModules/share.vue"
	import usdt from "./modules/usdt.vue"
	import shortcut from "./modules/shortcut.vue"
	import navMuen from "./modules/nav.vue"
	import market from "./modules/market.vue"

	import {
		Api_getNewsList,
		Api_getQuotationNew
	} from "@/api/index.js"
	import {
		Way_getQuotationNew
	} from "@/utils/common-request.js"


	import {
		mapGetters
	} from 'vuex'
	
	// import {
	// 	gerCurrencyMarket
	// } from "@/utils/currency-market.js"
	export default {
		components: {
			loginStatus,
			message,
			share,
			usdt,
			shortcut,
			navMuen,
			market
		},
		data() {
			return {
				ws: null,
				usdtList: [],
				title: 'Hello',
				BannerList: [],
				Announcement: [],

				refreshStatus: false,
	 
			}
		},
		// watch:{
		// 	aa:{
		// 		handler(newAAA){
		// 			console.log('newAAA' , newAAA)
		// 		},
		// 		immediate:true,
		// 		deep:true
		// 	}
		// },
		computed: {
			...mapGetters([
				'stocksColor'
			]),
		},

		onLoad() {
			// this.aa = gerCurrencyMarket()
			// currencyMarket()
			this.getBanner();
			this.getAnnouncement();
		},
		onShow() {
			// 获取行情 / 首页推荐
			// getQuotationNew() {
			// 	this.$store.dispatch('websocket/getQuotationNew')
			// },
			this.$store.dispatch('websocket/getQuotationNew')
			// this.refreshStatus = true;
			// this.getQuotationNew();
		},
		onHide() {
			// this.$store.commit('websocket/set_currencySuspend' , false)
			this.$store.commit('websocket/set_currencySuspend', false)

		},
		methods: {
			openShare() {
				this.$nextTick(() => {
					this.$refs.sharePageRef.openShare()
				})
			},
			// 获取banner
			getBanner() {
				Api_getNewsList({
					cid: 5,
					limit: 10
				}).then(res => {
					this.BannerList = res.list
				})
			},
			// 获取公告
			getAnnouncement() {
				Api_getNewsList({
					cid: 3,
					limit: 10
				}).then(res => {
					this.Announcement = res.list
				})
			},

			clearInt() {
				try {
					clearInterval(this.timeInterval);
				} catch (e) {
					//TODO handle the exception
				}
				this.timeInterval = null;
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		// padding: 0 30rpx;
	}

	.haed-title {

		image {
			width: 85rpx;
			height: 67rpx;
		}

		.logo {
			width: 85rpx;
			height: 67rpx;
		}

		.name {
			width: 85rpx;
			height: 80rpx;
		}
	}
</style>