<template>
	<view class="zk-report-table" v-if="widgetModel">
		<count-report v-model="widgetModel" ref="countReport" v-if="widgetModel.reportTypeRadio == 'countReport'"></count-report>
		<total-report v-model="widgetModel" ref="countTotalReport" v-if="widgetModel.reportTypeRadio == 'countTotalReport'"></total-report>
		<rank-report v-model="widgetModel" ref="rankReport" v-if="widgetModel.reportTypeRadio == 'rankReport'"></rank-report>
	</view>
</template>

<script>
	import json from './index.json'
	import actions from './actions.js'
	import countReport from './widget/count.vue'
	import totalReport from './widget/total.vue'
	import rankReport from './widget/rank.vue'
	export default {
		components: {
			countReport,
			totalReport,
			rankReport
		},
		props: {
			widget: {}
		},
		data() {
			return {
				viewModel: null,
				widgetModel: null,
				tabsList: [],
				links: json,
				pickerOptions: actions.shortcut(),
				activeName: 'noLimit',
				value1: ''
			}
		},
		created() {
			this.init()
		},
		methods: {
			init() {
				if (this.widget && this.widget.value) {
					this.widgetModel = this.widget.value.countReportForm
				}
				if (this.widgetModel.reportTypeRadio === 'countTotalReport') {
					this.tabsList = this.links
				} else {
					this.tabsList = this.links.filter(r => r.show)
				}
			},
			handleClick(ev) {
				actions.handleClick(this, ev)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.zk-report-table {}
</style>
