<style lang='scss' scoped>
	.historyCurve-table{
		width: 100%;
		height: 100%;
		&-list{
			height: 480rpx;
			overflow: auto;
		}
	}
</style>
<template>
	<view class="historyCurve-table" >
		<template v-if="has_data">
			<u-table>
				<u-tr>
					<u-th v-for="(item,index) in tableList.head" :key="index">{{item}}</u-th>
					<!-- <u-th>班级</u-th>
					<u-th>年龄</u-th> -->
				</u-tr>
				<view class="historyCurve-table-list">
					<u-tr v-for="(item,index) in tableList.body" :key="index">
						<u-td v-for="(value,key) in item" :key="key">
							{{value}}
						</u-td>
						<!-- <u-td>{{item.time}}</u-td>
						<u-td>{{item.data0}}</u-td>
						<u-td>{{item.data1}}</u-td> -->
					</u-tr>
				</view>
			</u-table>
		</template>
		<template v-else>
			<u-empty text="数据为空" mode="data"></u-empty>
		</template>
	</view>
</template>
<script>
	export default {
		props: {
			prodDataList: {
				type: Object,
				default() {
					return {}
				}
			}
		},
		data() {
			return {
				// prodDataList:{
				// 	series: [
				// 		{name: "成交量A", data: [35, 8, 25, 37, 4, 20]},
				// 		{name: "成交量B", data: [70, 40, 65, 100, 44, 68]},
				// 	],
				// 	categories:[2021,2020,2022,1999,1996,1995]
				// },
				tableList:{
					head:[],
					body:[]
					// head:["年份","成交量A","成交量B"],
					// body:[{
					// 	year:"2021",
					// 	data1:35,
					// 	data2:70
					// }]
				},
				has_data: false
			}
		},
		created() {
			this.handlerData();
		},
		watch: {
			prodDataList(newVal) {
				this.handlerData();
			}
		},
		methods: {
			handlerData() {
				if(Object.keys(this.prodDataList).length == 0){
					this.has_data = false;
				} else {
					this.tableList={
						head:[],
						body:[]
					}
					this.tableList.head.push("时间");
					this.prodDataList.series.forEach((obj,i)=>{
						this.tableList.head.push(obj.name);
					});
					this.prodDataList.categories.forEach((item,index)=>{
						let dataObj = {
							time:item
						};
						this.prodDataList.series.forEach((obj,i)=>{
							dataObj['data' + i] = obj.data[index];
						});
						this.tableList.body.push(dataObj);
					});
					this.has_data = true;
					
				}
				setTimeout(() => {
					this.$emit('onRenderFinsh', 'ok');
				}, 1000)
			}
		}
	}
</script>
