<template>
		<view class="add">
			<!-- 设备信息 -->
			<view class="main">
				<u--form labelPosition="left" labelAlign="center" :model="task" ref="form1" >
					<u-form-item label="任务名称" prop="task.name" labelWidth="auto" borderBottom ref="item1" >
					<u--input v-model="task.name" border="none" placeholder="请输入任务名称"></u--input>
					</u-form-item>
					<u-form-item label="截止日期" prop="task.enableTime" 
					labelWidth="auto" @click="datePickShow = true; " borderBottom ref="item1" >
						<u--input
								v-model="task.enableTime"
								disabled
								disabledColor="#ffffff"
								placeholder="请选择截止日期"
								border="none"
						></u--input>
						<u-icon
								slot="right"
								name="arrow-right"
						></u-icon>
						<u-datetime-picker
						        :show="datePickShow"
						        v-model="pickerTime"
						        mode="date"
								:closeOnClickOverlay="true"
								@close="datePickShow = false"
								@cancel="datePickShow = false"
								@confirm="dateConfirm"
						></u-datetime-picker>
					</u-form-item>
					
					<u-form-item label="任务说明" prop="task.remark" labelWidth="auto" borderBottom ref="item1" >
						<u--textarea v-model="task.remark" placeholder="请输入任务说明" ></u--textarea>
					</u-form-item>
				</u--form>
			</view>
			<u-button type="primary" class="submit" @click="submit" text="提 交"></u-button>
		</view>
</template>

<script>
	// import qianziyu-select from "@/commponents/qianziyu-select/qianziyu-select.vue"
	export default { 
		
		data() {
			return {
				show: true,
				task: {
					name:'',
					enableTime: '',
					remark:'',
				},
				pickerTime: Number(new Date()),
				datePickShow: false,
				showDimension: false,
			}
		},
		
		onLoad: function() {
			// const eventChannel = this.getOpenerEventChannel();
			// eventChannel.on('task', data => {
			// 	this.getTasks(data.id)
			// })
		},
		
		created() {
		},
		filters: {
		},
		
		methods: {
			
			reset(){
				this.task.name = '';
				this.task.remark='';
			},
			submit(){
				let flag = true;
				if(this.task.name=='' || this.task.enableTime=='' || this.task.remark=='' ){
					flag = false;
				}
				
				if(!flag) return uni.showToast({
					title: '请补充任务内容',
					icon: 'error'
				})
				this.addTask();
				
			},
			async addTask(){
				const { data:res } = await this.$http('/addPublish', this.task);
				if(res.code == 0){
					uni.showToast({
						title: '提交成功',
						icon: 'success'
					});
					this.reset();
				}
				
			},
			
			dateConfirm(e){
				const timeFormat = uni.$u.timeFormat
				console.log(timeFormat(e.value, 'yyyy-mm-dd'))
				this.datePickShow = false;
				this.task.enableTime = timeFormat(e.value, 'yyyy-mm-dd');
			}
		}
	}
</script>

<style lang="scss">
	.add {
		background: #f6f6f6;
		padding: 2.667vw;
		height: 100vh;
		.main {
			background: #ffffff;
			margin-bottom: 2.667vw;
			padding: 2vw;
			border-radius: 8px;
			
			.u-form-item__body__right{
				padding-left: 20vw;
			}
			.submit{
				position: absolute;
				bottom: 10vw;
				width: 100%;
			}
			.u-button{
				border: none !important;
				padding: 0 !important;
				justify-content: flex-start;
			}
		}
	}
	.u-popup{
		.title{
			margin: 1vh 0 0 0;
			text-align: center;	
		}
		.u-button{
			justify-content: center !important;
		}
		.u-checkbox{
			margin-bottom: 16px;
		}
	}
</style>