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

		<!-- 滚动消息 -->
		<rollMessage></rollMessage>

		<view style="width: 100%;height: 1rpx;"></view>
		<!-- usdt -->
		<usdt></usdt>

		<view style="width: 100%;height: 8rpx;"></view>

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

		<view style="width: 100%;height: 8rpx;"></view>
		<!-- 快捷菜单 -->
		<navMuen></navMuen>


		<view style="width: 100%;height: 8rpx;"></view>

		<!-- 自选 / 市场 -->
		<market></market>
	</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
	} from "@/api/index.js"

	import {
		mapGetters
	} from 'vuex'
	export default {
		components: {
			loginStatus,
			message,
			share,
			usdt,
			shortcut,
			navMuen,
			market
		},
		data() {
			return {
				title: 'Hello',
				BannerList:[]
			}
		},
		computed: {
			...mapGetters([
				'stocksColor'
			]),
		},
		onLoad() {
			this.getBanner()
		},
		methods: {
			getBanner() {
				Api_getNewsList({
					cid: 5,
					limit: 10
				}).then(res => {
					this.BannerList = res.list
				})
			}
		}
	}
</script>

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

	.haed-title {

		image {
			width: 85rpx;
			height: 67rpx;
		}
	}
</style>