<template>
	<view class="page-box-bg-fff m-t20 r-30 p-30">
		<StatisticsTitle :genre="genre" :leftText="leftText" :is_right="false"></StatisticsTitle>
		<view class="column-c m-30 r-30 p-l16">
			<PeakChart ref="peakChart"></PeakChart>
		</view>
	</view>
</template>

<script>
	import PeakChart from "@/common/chart/peak_chart.vue";
	import StatisticsTitle from "./statistics_title.vue";

	export default {
		name: 'peak_chart',
		components: {
			PeakChart,
			StatisticsTitle
		},
		props: {
			genre: {
				type: Number,
				default: 0
			},
			leftText: {
				type: String,
				default: ''
			},
		},
		data() {
			return {

			};
		},
    methods: {
      setPeakChartData(data){
        this.$refs.peakChart.setServerData(data)
      }
    },
	}
</script>

<style lang="scss" scoped>
	// .content_chart {
	// 	text-align: center;

	// 	.chart_item {
	// 		width: 330rpx;

	// 		.num {
	// 			width: 140rpx;
	// 			height: 50rpx;
	// 			line-height: 50rpx;
	// 			background: #F7F9FE;
	// 			border-radius: 10rpx;
	// 		}
	// 	}
	// }
</style>