apply-assistant-v3/components/panel/time.vue

<template>
	<view>
		<picker mode="multiSelector" class="g_flex_column_center"
					 :range="dateTimeArray" 
					 :value="dateTime" 
					 @change="changeDateTime" 
					 @columnchange="changeDateTimeColumn($event)" 
					 style="color:#333"
		>
			<view class="g_flex_row_end flex_center">
				<view class="g_fs_16">
					{{ !!currentTime ? currentTime : '----' }}
				</view>
				<view class="">
					<i class="iconfont icon-rili g_c_9 g_ml_6"></i>
				</view>
			</view>
		</picker>
	</view>
</template>

<script>
	import dateTimePicker from "../../utils/dateTimePicker.js";
	export default{
		data(){
			return {
				dateTimeArray: null,
				dateTime: [],
				startYear: new Date().getFullYear(),
				endYear: new Date().getFullYear() + 2,
				currentTime: '',
			}
		},
		props:{
			timeval:{
				type:String,
				default:()=>{
					return ''
				}
			}
		},
		created() {
			console.log('create 是否触发',this.timeval)
		},
		watch:{
			timeval(oldVal,newVal){
				console.log('watch 是否触发',oldVal,'--',newVal)
				this.currentTime = oldVal ? oldVal : newVal;
			}
		},
		mounted(){
			var obj = dateTimePicker.dateTimePicker(this.startYear, this.endYear, this.currentTime);
			this.currentTime = this.timeval;
			this.dateTimeArray = obj.dateTimeArray
			this.dateTime = obj.dateTime == -1 ? 0 : obj.dateTime 
		},
		methods:{
			changeDateTime(e) {
				console.log('DateTime：',e)
				var dateTimeArray = this.dateTimeArray,
				dateTime = e.detail.value;
				if(dateTime[3] == -1){
					this.currentTime = dateTimeArray[0][dateTime[0]].replace("年", "") + "-" + dateTimeArray[1][dateTime[1]].replace("月", "") + "-" + dateTimeArray[2][dateTime[2]].replace("日", "") + " " + '06:00';
				}else{
					this.currentTime = dateTimeArray[0][dateTime[0]].replace("年", "") + "-" + dateTimeArray[1][dateTime[1]].replace("月", "") + "-" + dateTimeArray[2][dateTime[2]].replace("日", "") + " " + dateTimeArray[3][dateTime[3]];
				}
				console.log('拼接：',this.currentTime)
				this.$emit('confirmChooseTime',this.currentTime);
			},
			changeDateTimeColumn(e) {
				console.log('Column：',e)
				// var arr = this.dateTime
				// var dateArr = this.dateTimeArray;
				// arr[e.detail.column] = e.detail.value;
				// dateArr[2] = dateTimePicker.getMonthDay(dateArr[0][arr[0]], dateArr[1][arr[1]]);
				// for (let index = 0; index < dateArr[2].length; index++) {
				// 	dateArr[2][index] = dateArr[2][index] + "日";
				// }
				// // .replace("年",'').replace("月",'').replace("日",'')
				// dateTimeArray = dateArr
				// dateTime = arr
			},
		}
	}
</script>

<style>
</style>