<template name="times">
	<view>
		<view class="cu-timeline" v-for="(v,k) in fetch.times" :key="v.id">
			<view class="cu-time">{{v.name}}</view>
			<view class="cu-item" :class="v1.id == times ? 'text-blue' : ''" v-for="(v1,k1) in v.child" :key="v1.id" :style="{backgroundImage: v1.icon}">
				<view class="content" :style="{color:v1.color,backgroundColor:v1.bgcolor}">
					<view class="cu-capsule radius">
						<view class="cu-tag bg-cyan">{{v1.name}}</view>
						<view class="cu-tag line-white">
							<picker mode="date" :value="fetch.user_times[v1.id] && fetch.user_times[v1.id].day != 0 ? fetch.user_times[v1.id].day : v1.year + '-' + month + '-' + day" :start="v1.year+`-01-01`" :end="v1.year+`-12-31`" @change="selectDay" :data-year="v1.year" :data-name="v1.name" :data-id="v1.id">
								<view class="uni-input">{{fetch.user_times[v1.id] && fetch.user_times[v1.id].day != 0 ? fetch.user_times[v1.id].day : '正点'}}</view>
							</picker>
						</view>
					</view>
					<view @click="go(v1)">
						<view class="margin-top" v-if="v1.desc&& !v1.pic">{{v1.desc}}</view>
						<view class="margin-top" v-if="v1.pic && !v1.desc"><image :src="v1.pic" mode="widthFix" class="slide-image" style="height:auto"></image></view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	name: "times",
	props: {
		content_id : {
			type : String,
			value : null
		},
		width : {
			type : String,
			default : '100%'
		},
		param : {},
		index : 0,
		times : 0,
	},
	data() {
		return {
			fetch : {},
			current : '',
			year : '',
			month : '',
			day : '',
		}
	},
	mounted() {
		this.fetch = this.param;
		this.getDate();
	},
	methods:{
		getDate : function(type) {
			const date = new Date();
			let year = date.getFullYear();
			let month = date.getMonth() + 1;
			let day = date.getDate();

			this.year = year;
			this.month = month > 9 ? month : '0' + month;;
			this.day = day > 9 ? day : '0' + day;
			this.current = this.year + '-' + this.month + '-' + this.day;
		},
		getData : function() {
			this.$emit('getTimes');
		},
		getInfo : function(t) {
			//触底刷新
		},
		go : function(times) {
			var self = this;
			this.Dever.alert('正在进入' + times.name);
			// 要拿到最新的page_id
			if (this.fetch.user_times[times.id]) {
				var day = this.fetch.user_times[times.id].day;
			} else {
				var day = '正点';
			}
			if (day == '正点') {
				day = '';
			}
			this.Dever.post('app/collection/?l=api.getPageId', {code:this.Dever.config.code,times_id:times.id,day:day}, function(t) {
				self.Dever.location('dream/view?code=' + t.code);
			})
			
		},
		selectDay : function(res) {
			var times = {};
			times = res.currentTarget.dataset;
			if (!this.fetch.user_times[times.id]) {
				this.fetch.user_times[times.id] = {};
				this.fetch.user_times[times.id].day = '正点';
			}
			var old = this.fetch.user_times[times.id].day;
			this.fetch.user_times[times.id].day = res.detail.value;
			var current = times.year + '-' + this.month + '-' + this.day;
			if (this.fetch.user_times[times.id].day == current) {
				this.fetch.user_times[times.id].day = '正点';
			}
			if (old != res.detail.value) {
				this.go(times);
			}
		},
	},
}
</script>

<style>
.slide-image {
	
}
</style>
