<template>
	<view class="fullHeight addProjectPage">
		<headers class="fixedheader"  :themeType="true" :showBack="true">
			<view class="headerName">
				{{pageTitle}}
			</view>
		</headers>
		<scroll-view :style="{ 'padding-top': statusBarHeight + 44 + 'px' }" class="smallHeight" scroll-y>
			<!-- <view class="add-header">
				<view class="backBtn" @click="back">
					<uni-icons type="back" color="#fff" size="26"/>
				</view>
				{{pageTitle}}
			</view> -->
			<view class="add-from">
				
				<view class="add-item">
					<ul class="add-nav">
						<li :class="{'active': navIndex == 1}" >任务</li>
						<li :class="{'active': navIndex == 3}" >会议</li>
					</ul>
				</view>
				
				<view class="add-item" v-if="navIndex == 1">
					<view class="project-name">
						<view class="icon-image">
							<image src="/static/workstation/icon_voice.png"></image>
						</view>
						<view class="input">
							<input type="text" placeholder="请输入主任务" :disabled="isDisabled" v-model="projectName"/>
						</view>
					</view>
				</view>
				
				<view class="add-item" v-if="navIndex == 3">
					<view class="project-name">
						<view class="icon-image">
							<image src="/static/workstation/icon_voice.png"></image>
						</view>
						<view class="input">
							<input type="text" placeholder="请输入会议名称" :disabled="isDisabled" v-model="meetingName"/>
						</view>
					</view>
				</view>
				
				<view class="add-item" v-if="navIndex == 1">
					<view class="project-select">
						<view class="icon-image">
							<image src="/static/workstation/icon_end_date_bg.png"></image>
							截止日期
						</view>
						<view class="project-picker">
							{{endDate}}
							<view class="uni-list-cell-db">
							    <picker mode="date" :value="endDate" :disabled="isDisabled" @change="bindTimeChange">
							        <view class="uni-input">
										<uni-icons type="arrowright" color="#6C7178" size="20"/>
									</view>
							    </picker>
							 </view>
						</view>
					</view>
				</view>
				
				<view class="add-item" v-if="navIndex == 3">
					<view class="project-select">
						<view class="icon-image">
							<image src="/static/workstation/icon_end_date_bg.png"></image>
							会议时间
						</view>
						<view class="project-picker">
							<view class="date-text">
								<span>{{rangetime[0]}}</span>
								<span>{{rangetime[1]}}</span>
							</view>
								<view class="uni-list-cell-db">
										<view class="uni-input" @click="showDatePicker">
											<uni-icons type="arrowright" color="#6C7178" size="20"/>
										</view>
								</view>
						</view>
					</view>
				</view>
				
				<view class="add-item" v-if="navIndex == 1">
					<view class="project-select">
						<view class="icon-image">
							<image src="/static/workstation/icon_allot_bg.png"></image>
							分配给
						</view>
						<view class="project-picker">
							{{allotPeople}}
							<view class="uni-list-cell-db">
							    <picker :range="peopleList" range-key="workerName" :disabled="isDisabled" :value="allotPeopleIndex" @change="bindPeopleChange">
							        <view class="uni-input">
										<uni-icons type="arrowright" color="#6C7178" size="20"/>
									</view>
							    </picker>
							 </view>
						</view>
					</view>
				</view>
				
				<view class="add-item" v-if="navIndex == 3">
					<view class="project-select">
						<view class="icon-image">
							<image src="/static/workstation/icon_allot_bg.png"></image>
							参会人
						</view>
						<view class="project-picker">
							<view class="people-text">{{allotPeople}}</view> 
							<view class="uni-input" @click="toPeopleList">
								<uni-icons type="arrowright" color="#6C7178" size="20"/>
							</view>
						</view>
					</view>
				</view>
				
				<view class="add-item">
					<view class="project-select">
						<view class="icon-image">
							<image src="/static/workstation/icon_note_bg.png"></image>
							填写备注
						</view>
						<view class="input" style="text-align: right;">
							<input type="text" :disabled="isDisabled" placeholder="" v-model="note"/>
						</view>
					</view>
				</view>
				
				<view class="add-item" v-if="navIndex == 3">
					<view class="project-select">
						<view class="icon-image">
							<image src="/static/workstation/icon_address2.png"></image>
							会议地点
						</view>
						<view class="input" style="text-align: right;">
							<input type="text" :disabled="isDisabled" placeholder="" v-model="address"/>
						</view>
					</view>
				</view>
				
				<view class="add-item">
					<view class="project-select">
						<view class="icon-image">
							<image src="/static/workstation/icon_project_lv.png"></image>
							任务级别
						</view>
						<view class="input project-picker">
							<radio-group class="project-radio_group" @change="radioChange">
								<label class="project-radio radio"><radio value="1" :disabled="isDisabled" :checked="lv == 1" />一般</label>
								<label class="project-radio"><radio value="2" :disabled="isDisabled" :checked="lv == 2" />重要</label>
							</radio-group>
						</view>
					</view>
				</view>
				
				<view class="add-item">
					<view class="project-select" @click="selectFile">
						<view class="icon-image">
							<image src="/static/workstation/icon_file_address_bg.png"></image>
							添加附件
						</view>
						<!-- <view class="input project-upload" @click="selectFile">
						</view> -->
					</view>
				</view>
				
				<view class="project-filelist" v-if="fileList.length > 0">
					<ul>
						<li v-for="(item,index) in fileList" :key="index">
							<p>{{item.name}}</p>
							<icon type="cancel" size="16"  v-if="!isDisabled" @click="removeFive(index)"/>
							<span v-if="isDisabled" @click="previewFile(item)">预览</span>
							<!-- <image :src="item.url" @click="previewImage(item.url)"></image> -->
							<!-- <uni-icons class="icon-close" type="close" color="#6C7178" size="12"></uni-icons> -->
						</li>
					</ul>
				</view>
				
				<view class="add-item">
					<view class="project-select">
						<view class="icon-image">
							<image src="/static/workstation/icon_project_child.png"></image>
							是否有子任务
						</view>
						<view class="input project-picker">
							<switch :disabled="isDisabled" :checked="showChild" @change="switch1Change" />
						</view>
					</view>
				</view>
				
			</view>
			
			<view class="project-children" v-if="showChild && childrenFormList.length > 0">
				<view class="children-title">
					子任务
				</view>
				<ul class="children-box" v-for="(item,index) in childrenFormList" :key="index">
					<view class="close-btn" @click="deleteChild(index)">
						<image src="/static/workstation/icon_close.png"></image>
					</view>
					<li>
						<view class="add-item">
							<view class="project-name">
								<view class="icon-image">
									<image src="/static/workstation/icon_voice.png"></image>
								</view>
								<view class="input">
									<input type="text" :disabled="isDisabled" placeholder="请输入子任务标题" v-model="item.projectName"/>
								</view>
							</view>
						</view>
						
						<view class="add-item">
							<view class="project-select">
								<view class="icon-image">
									<image src="/static/workstation/icon_end_date_bg.png"></image>
									截止日期
								</view>
								<view class="project-picker">
									{{item.endDate}}
									<view class="uni-list-cell-db">
									    <picker mode="date" :disabled="isDisabled" :value="item.endDate" @change="bindTimeChange2($event,item)">
									        <view class="uni-input">
												<uni-icons type="arrowright" color="#6C7178" size="20"/>
											</view>
									    </picker>
									 </view>
								</view>
							</view>
						</view>
						
						<view class="add-item">
							<view class="project-select">
								<view class="icon-image">
									<image src="/static/workstation/icon_allot_bg.png"></image>
									分配给
								</view>
								<view class="project-picker">
									{{item.allotPeople}}
									<view class="uni-list-cell-db">
									    <picker :range="peopleList" range-key="workerName" :disabled="isDisabled" :value="item.allotPeople" @change="bindPeopleChange2($event, item)">
									        <view class="uni-input">
												<uni-icons type="arrowright" color="#6C7178" size="20"/>
											</view>
									    </picker>
									 </view>
								</view>
							</view>
						</view>
						
						<view class="add-item">
							<view class="project-select" @click="selectFile2(index)">
								<view class="icon-image">
									<image src="/static/workstation/icon_file_address_bg.png"></image>
									添加附件
								</view>
								<!-- <view class="input project-upload" @click="selectFile2(index)">
								</view> -->
							</view>
						</view>
						
						<view class="project-filelist" v-if="item.fileList.length > 0">
							<ul>
								<li v-for="(itm,idx) in item.fileList" :key="idx">
										<p>{{itm.name}}</p>
										<icon type="cancel" size="16" v-if="!isDisabled" @click="removeFive2(index,idx)"/>
										<span v-if="isDisabled" @click="previewFile(itm)">预览</span>
									<!-- <image :src="itm.url" @click="previewImage(itm.url)"></image> -->
									<!-- <uni-icons class="icon-close" type="close" color="#6C7178" size="12"></uni-icons> -->
								</li>
							</ul>
						</view>
						
						<view class="add-item">
							<view class="project-select">
								<view class="icon-image">
									<image src="/static/workstation/icon_note_bg.png"></image>
									填写备注
								</view>
								<view class="input" style="text-align: right;">
									<input type="text" :disabled="isDisabled" placeholder="" v-model="item.note"/>
								</view>
							</view>
						</view>
					</li>
				</ul>
			</view>
			
			<view class="add-child" v-if="showChild && childrenFormList.length > 0 && !isDisabled" @click="addChild">
				<span>+</span>
				子任务
			</view>
			
			<view class="submit-btn m-top" v-if="isEdit && isDisabled" @click="editForm">编辑任务</view>
			<view v-if="!isDisabled" class="bottom-btn m-topm-top">
				<view class="close" @click="closeEdit">取消</view>
				<view class="submit-btn" @click="submitForm">提交任务</view>
			</view>
			
		</scroll-view>
	
	<mx-date-picker :show="showPicker" type="rangetime" :value="value" :show-tips="true" :begin-text="'会议开始'" :end-text="'会议结束'" :show-seconds="true" @confirm="ed" @cancel="ed" />
	</view>
</template>

<script>
	import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue";
	import headers from '../../../components/headers/headers.vue'
	export default {
		components: {
		    MxDatePicker
		},
		data(){
			return{
				pageTitle: "任务详情",
				navIndex: 1, //新增类型 1.任务 3.会议
				value: '',
				isDisabled: true,
				projectName: "", //项目名称
				meetingName: "", //会议名称
				endDate: "", //截止日期
				allotPeople: "", //分配人
				allotPeopleIndex: "",
				note: "", //备注
				address: "", //会议地址
				time: "",
				allotPeopleId: "", //选中人员id
				peopleList: [], //人员列表
				rangetime: [], // 会议时间
				showPicker: false,
				lv: 1, //任务级别 1.一般 2.重要
				fileList: [],	// 附件
				showChild: false, //是否展示子任务
				childrenFormList: [ //子任务列表
					{
						projectName: "", //子任务名称
						endDate: "", //截止日期
						allotPeople: "", //选中人名
						fileList: [], //附件
						note: "", // 备注
						allotPeopleId: "" //选中人id
					}
				],
				checkPeopleList: [] ,//选中参会人列表
				mettingPeopleId: [],
				isEdit: false, //是否可编辑
				pageId: "",
				statusBarHeight: 0
			}
		},
		components:{
			headers
		},
		onShow(val){
			this.statusBarHeight=uni.getStorageSync('systemInfo').statusBarHeight;
			if(uni.getStorageSync('attendee') && this.navIndex == 3){
				this.checkPeopleList = JSON.parse(uni.getStorageSync('attendee'))
				let arr = []
				this.mettingPeopleId = []
				this.checkPeopleList.forEach(item=>{
					arr.push(item.workerName)
					this.mettingPeopleId.push({
						taskUser: item.userId
					})
				})
				this.allotPeople = arr.join('，')
			}
		},
		onLoad(val){
			console.log(val)
			this.pageId = val.id
			this.selectData()
		},
		created(){
			this.statusBarHeight=uni.getStorageSync('systemInfo').statusBarHeight;
			this.projectSn = JSON.parse(uni.getStorageSync('userInfo')).sn;
			this.userId = JSON.parse(uni.getStorageSync('userInfo')).userId
			if(uni.getStorageSync('attendee') && this.navIndex == 3){
				this.checkPeopleList = JSON.parse(uni.getStorageSync('attendee'))
				let arr = []
				this.mettingPeopleId = []
				this.checkPeopleList.forEach(item=>{
					arr.push(item.workerName)
					this.mettingPeopleId.push({
						taskUser: item.userId
					})
				})
				this.allotPeople = arr.join('，')
			}
			console.log(this.allotPeople)
			this.selctPeopleList()
		},
		methods:{
			previewFile(val){
				console.log(val.url)
				if(val.url){
					let type = val.url.split(".")[1]
					let _this = this
					if(this.isImage(type)){
						uni.previewImage({
							urls: [_this.url_config+'image/' + val.url],
						})
					} else {
						uni.downloadFile({
							url: _this.url_config+'image/' + val.url,
							success: (res) => {
								if (res.statusCode === 200) {
									uni.openDocument({
										filePath: res.tempFilePath, 
										success: function(res) {
											console.log('打开文档成功');
										}
									});
								}
							}
						})
					}
				}
			},
			isImage(val){
				return ['png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'tiff'].indexOf(val.toLowerCase()) !== -1;
			},
			closeEdit(){
				this.pageTitle="任务详情"
				this.isDisabled = true
				this.selectData()
			},
			editForm(){
				this.pageTitle="编辑任务"
				this.isDisabled = false
			},
			selectData(){
				let _this = this
				this.sendRequest({
					url: "xmgl/workstationTaskRecord/selectWorkstationTaskById",
					data: {
						taskId: this.pageId
					},
					method: "POST",
					success(res){
						console.log(res.result);
						let data = res.result
						_this.navIndex = data.taskInfo.taskType
						_this.note = data.taskInfo.taskRemarks
						_this.showChild = data.taskInfo.subtaskType == 1 ?  false : true
						if(data.taskInfo.createUser == _this.userId){
							_this.isEdit = true
						}
						if(_this.showChild){
							_this.childrenFormList = []
							let obj = {}
							console.log(data.subtaskList)
							data.subtaskList.forEach(item=>{
								console.log(item)
								obj = {
									projectName: item.subtaskTitle,
									endDate: item.subtaskCloseTime,
									allotPeople: item.subtaskDistributeName,
									note: item.subtaskRemarks,
									allotPeopleId: item.subtaskDistributeUser,
									fileList: []
								}
								if(item.subtaskFileUrl){
									item.subtaskFileUrl.split(',').forEach(item=>{
										obj.fileList.push({
											name: item,
											url: item
										}) 
									})
								}
								_this.childrenFormList.push(obj)
								// console.log(_this.childrenFormList)
							})
						}
						_this.fileList = []
						if(data.taskInfo.fileUrl){
							data.taskInfo.fileUrl.split(',').forEach((item,index)=>{
								_this.fileList.push({
									name: item,
									url: item
								})
							})
						}
						if(data.taskInfo.taskType == 3){
							_this.meetingName = data.taskInfo.taskTitle
							_this.rangetime[0]=data.taskInfo.meetingStartTime
							_this.rangetime[1]=data.taskInfo.meetingEndTime
							let arr = []
							_this.mettingPeopleId = []
							data.userList.forEach(item=>{
								arr.push(item.taskUserName)
								_this.mettingPeopleId.push({
									taskUser: item.taskUser
								})
							})
							_this.allotPeople = arr.join('，')
							_this.address = data.taskInfo.taskAddr
							_this.lv = data.taskInfo.taskLevel
							// _this.allotPeopleId = 
						} else {
							_this.projectName = data.taskInfo.taskTitle
							_this.endDate = data.taskInfo.closeTime
							_this.allotPeople = data.userList[0].taskUserName
							_this.allotPeopleId = data.userList[0].taskUser
						}
					}
				})
			},
			ed(e) {//选择
			    this.showPicker = false;
			    if(e) {
			        this.rangetime = e.value; 
			        //选择的值
			        console.log('value => '+ e.value);
			        //原始的Date对象
			        console.log('date => ' + e.date);
			    }
			},
			submitForm(){
				let data = {
					taskLevel: this.lv,
					taskRemarks: this.note,
					fileUrl: "",
					projectSn: this.projectSn,
					subtaskType: this.showChild ? 2:1,
					taskType: this.navIndex
				}
				data.createUser = parseInt(this.userId)
				data.id = parseInt(this.pageId )
				let fileArr = []
				for(let i = 0; i<this.fileList.length; i++){
					fileArr.push(this.fileList[i].url)
				}
				if(fileArr.length>0){
					data.fileUrl = fileArr.join(',')
				}
				if(this.navIndex == 1){
					if(!this.projectName){
						uni.showToast({
						    title: '主任务名称不能为空！',
							icon: "none",
							duration: 2000
						});
						return;
					}
					if(!this.endDate){
						uni.showToast({
						    title: '截止日期不能为空！',
							icon: "none",
							duration: 2000
						});
						return;
					}
					if(!this.allotPeopleId){
						uni.showToast({
						    title: '请选择分配人！',
							icon: "none",
							duration: 2000
						});
						return;
					}
					data.taskTitle = this.projectName
					data.closeTime = this.endDate
					data.userList = [{
						taskUser: this.allotPeopleId
					}]
				} else if (this.navIndex == 3) {
					if(!this.meetingName){
						uni.showToast({
						    title: '会议名称不能为空！',
							icon: "none",
							duration: 2000
						});
						return;
					} else {
						data.taskTitle = this.meetingName
					}
					if(this.rangetime.length > 0){
						data.meetingStartTime = this.rangetime[0].split('/').join('-')
						data.meetingEndTime = this.rangetime[1].split('/').join('-')
						data.closeTime = this.rangetime[1].split('/').join('-').split(" ")[0]
					}else{	
						uni.showToast({
						    title: '会议日期不能为空！',
							icon: "none",
							duration: 2000
						});
						return;
					}
					if(this.mettingPeopleId.length > 0){
						data.userList = this.mettingPeopleId
					} else {
						uni.showToast({
						    title: '请选择参会人！',
							icon: "none",
							duration: 2000
						});
						return;
					}
					console.log(this.address)
					if(this.address){
						data.taskAddr = this.address
					} else {
						uni.showToast({
						    title: '请填写会议地点！',
							icon: "none",
							duration: 2000
						});
						return;
					}
				}
				if(this.showChild){
					let childList = [],
						childObj = {}
					for(let j = 0; j<this.childrenFormList.length; j++){
						if(!this.childrenFormList[j].projectName){
							uni.showToast({
							    title: '子任务名称不能为空！',
								icon: "none",
								duration: 2000
							});
							return;
						}
						if(!this.childrenFormList[j].endDate){
							uni.showToast({
							    title: '子任务截止日期不能为空！',
								icon: "none",
								duration: 2000
							});
							return;
						}
						if(!this.childrenFormList[j].allotPeopleId){
							uni.showToast({
							    title: '请选择子任务分配人！',
								icon: "none",
								duration: 2000
							});
							return;
						}
						childObj = {
							subtaskCloseTime: this.childrenFormList[j].endDate,
							subtaskRemarks: this.childrenFormList[j].note,
							subtaskDistributeUser: parseInt(this.childrenFormList[j].allotPeopleId),
							subtaskTitle: this.childrenFormList[j].projectName,
						}
						let fileArr = []
						for(let i = 0; i<this.childrenFormList[j].fileList.length; i++){
							fileArr.push(this.childrenFormList[j].fileList[i].url)
						}
						if(fileArr.length>0){
							childObj.subtaskFileUrl = fileArr.join(',')
						}
						childList.push(childObj)
					}
					data.subtaskList = childList
				}
				
				let that = this
				this.sendRequest({
					url: "xmgl/workstationTaskRecord/edit",
					data: data,
					method: "POST",
					success(res){
						console.log(res)
						if(res.code == 200){
							that.resetData()
							uni.navigateTo({
								url: './workstationIndex'
							})
						}
					}
				})
				console.log(data)
			},
			back(){
				uni.navigateBack({
					url: ''
				})
			},
			selctPeopleList(){
				let that = this
				this.sendRequest({
					url: "xmgl/systemUser/getProjectChilderSystemUserList",
					data: {projectSn: this.projectSn},
					method: "POST",
					success(res){
						that.peopleList = res.result;
					}
				})
			},
			toPeopleList(){
				if(!this.isDisabled){
					uni.navigateTo({
						url: './peopleList'
					})
				}
			},
			checkNavType(index){
				this.navIndex = index
				this.resetData()
			},
			selectNowDate(){
				var date = new Date(),
				year = date.getFullYear(),
				month = date.getMonth() + 1,
				day = date.getDate();
				month >= 1 && month <= 9 ? (month = "0" + month) : "";
				day >= 0 && day <= 9 ? (day = "0" + day) : "";
				var timer = year + '-' + month + '-' + day;
				// console.log(timer)
				return timer;
			},
			bindTimeChange(e){
				let date = this.selectNowDate()
				if(date.split("-").join("") > e.target.value.split("-").join("")){
					uni.showToast({
					    title: '请选择有效截止日期！',
						icon: "none",
						duration: 2000
					});
					this.endDate = ""
					return;
				} else {
					this.endDate = e.target.value
				}
				// this.endDate = e.target.value
			},
			bindTimeChange2(e, item){
				let date = this.selectNowDate()
				if(date.split("-").join("") > e.target.value.split("-").join("")){
					uni.showToast({
					    title: '请选择有效截止日期！',
						icon: "none",
						duration: 2000
					});
					item.endDate = ""
					return;
				} else {
					item.endDate = e.target.value
				}
				// item.endDate = e.target.value
			},
			bindPeopleChange(e){
				this.allotPeople = this.peopleList[e.target.value].workerName
				this.allotPeopleId = this.peopleList[e.target.value].userId
			},
			bindPeopleChange2(e, item){
				item.allotPeople = this.peopleList[e.target.value].workerName
				item.allotPeopleId = this.peopleList[e.target.value].userId
			},
			radioChange(e){
				this.lv = e.target.value
				// console.log(e.target.value)
			},
			selectFile(){
				if(this.isDisabled){
					return;
				} else {
					var that = this
					console.log(uni)
					uni.chooseImage({
						count: 5 - that.fileList.length,
						success(res) {
							const tempFilePaths = res.tempFilePaths;
							console.log(res)
							let data = {
								name: res.tempFiles[0].name,
								url: tempFilePaths[0]
							};
							uni.uploadFile({
								url: that.url_config + 'upload/image', //仅为示例，非真实的接口地址
								filePath: tempFilePaths[0],
								name: 'files',
								success: (uploadFileRes) => {
									let data = {
										name: JSON.parse(uploadFileRes.data).data[0].filename,
										url: JSON.parse(uploadFileRes.data).data[0].imageUrl
									};
									that.fileList.push(data)
								}
							});
						}
					})
				}
			},
			removeFive(index){
				if(this.isDisabled){
					return;
				} else {
					this.fileList.splice(index, 1)
				}
			},
			selectFile2(index){
				if(this.isDisabled){
					return;
				} else {
					var that = this
					uni.chooseImage({
						count: 5 - that.childrenFormList[index].fileList.length,
						success(res) {
							const tempFilePaths = res.tempFilePaths;
							console.log(res)
							let data = {
								name: res.tempFiles[0].name,
								url: tempFilePaths[0]
							};
							// that.childrenFormList[index].fileList.push(data)
							// console.log(that.childrenFormList[index].fileList)
							uni.uploadFile({
								url: that.url_config + 'upload/image', //仅为示例，非真实的接口地址
								filePath: tempFilePaths[0],
								name: 'files',
								success: (uploadFileRes) => {
									let data = {
										name: JSON.parse(uploadFileRes.data).data[0].filename,
										url: JSON.parse(uploadFileRes.data).data[0].imageUrl
									};
									that.childrenFormList[index].fileList.push(data)
								}
							});
						}
					})
				}
			},
			removeFive2(index1,index2){
				if(this.isDisabled){
					return;
				} else {
					this.childrenFormList[index1].fileList.splice(index2, 1)
				}
			},
			switch1Change(){
				this.showChild = !this.showChild
			},
			resetData(){
				this.projectName = ""
				this.meetingName= ""
				this.endDate = ""
				this.allotPeople = ""
				this.note = ""
				this.address = ""
				this.lv = 1,
				this.fileList = []
				this.rangetime = []
				this.showChild = false
				this.childrenFormList = [{
					projectName: "",
					endDate: "",
					allotPeople: "",
					fileList: [],
					note: ""
				}]
				if(uni.getStorageSync('attendee')){
					uni.removeStorage({
						key: 'attendee',
						success: function (res) {
						   console.log('success');
						}
					})
				}
			},
			addChild(){
				if(this.isDisabled){
					return;
				} else {
					let obj = {
						projectName: "",
						endDate: "",
						allotPeople: "",
						fileList: [],
						note: ""
					}
					this.childrenFormList.push(obj)
				}
			},
			deleteChild(index){
				if(this.isDisabled){
					return;
				} else {
					if(this.childrenFormList.length === 1){
						this.childrenFormList.splice(index,1)
						this.addChild()
						this.showChild = false
					} else if(this.childrenFormList.length > 1){
						this.childrenFormList.splice(index,1)
					}
				}
			},
			previewImage(url){
				let imgArr = [];
				imgArr.push(url);
				//预览图片
				uni.previewImage({
					urls: imgArr,
					current: imgArr[0]
				});
			},
			showDatePicker(){
				if(this.isDisabled){
					return;
				} else {
					this.showPicker=true
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.fixedheader{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 2;
}
.smallHeight{
	height: 100%;
	box-sizing: border-box;
	padding-bottom: 58px;
}
.addProjectPage{
	background: #f6f6f6;
	.add-header{
		height: 92rpx;
		width: 100%;
		background: #127FEC;
		color: #fff;
		display: flex;
		align-items: center;
		.backBtn{
			width: 60rpx;
			text-align: right;
		}
	}
}
.add-item{
	background-color: #fff;
	border-bottom: 1px solid rgba(246, 246, 246, 1);
	height: 100rpx;
	display: flex;
	align-items: center;
	width: 100%;
}
.add-nav{
	display: flex;
	justify-content: center;
	align-items: center;
	list-style: none;
	width: 100%;
	height: 100%;
	padding: 0;
	li{
		width: 112rpx;
		height: 48rpx;
		border: 1px solid #979797;
		color: #979797;
		font-size: 28rpx;
		text-align: center;
		line-height: 48rpx;
		border-radius: 40rpx;
		margin: 0 20rpx;
	}
	.active{
		border: 1px solid #127FEC;
		color: #127FEC;
	}
}
.project-name{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 100%;
	padding: 0 30rpx;
	box-sizing: border-box;
	.icon-image{
		margin-left: 25rpx;
		image{
			width: 30rpx;
			height: 52rpx;
		}
	}
}
.input{
	width: 400rpx;
}
.project-radio{
	text-align: right;
	height: 100%;
	display: flex;
	align-items: center;
	font-size: 28rpx;
}
.radio{
	margin-right: 50rpx;
}
.project-radio_group{
	display: flex;
}
.project-radio{
	/deep/ .uni-radio-input{
		width: 32rpx;
		height: 32rpx;
	}
}
.project-select{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 100%;
	padding: 0 30rpx;
	box-sizing: border-box;
	.icon-image{
		display: flex;
		align-items: center;
		color: #979797;
		font-size: 28rpx;
		white-space: nowrap;
		image{
			width: 36rpx;
			height: 36rpx;
			margin-right: 30rpx;
		}
	}
	.project-picker{
		display: flex;
		width: 100%;
		align-items: center;
		justify-content: flex-end;
		text-align: right;
		.uni-list-cell-db{
			margin-left: 20rpx;
		}
	}
}
.project-upload{
	height: 100%;
}
.project-filelist{
	background-color: #fff;
	border-bottom: 1px solid rgba(246, 246, 246, 1);
	width: 100%;
	padding: 0 20rpx;
	box-sizing: border-box;
	ul{
		// display: flex;
		// align-items: center;
		list-style: none;
		padding: 20rpx;
		// flex-wrap: wrap;
		li{
			display: flex;
			align-items: center;
			// height: 48rpx;
			justify-content: space-between;
			padding: 8rpx 0;
			// position: relative;
			// image{
			// 	width: 100rpx;
			// 	height: 100rpx;
			// 	margin: 0 10rpx;
			// }
			// .icon-close{
			// 	position: absolute;
			// 	right: 8rpx;
			// 	top: -8rpx;
			// }
			p{
				display: block;
				width: 80%;
				overflow: hidden;
				text-overflow:ellipsis;
				white-space: nowrap;
			}
			span{
				white-space: nowrap;
				color: #127FEC;
			}
		}
	}
}

.add-from{
	margin-bottom: 56rpx;
}

.project-children{
	padding: 0 28rpx;
	box-sizing: border-box;
	padding-bottom: 20rpx;
	.children-title{
		font-size: 28rpx;
		color: #262D4A;
		margin-bottom: 18rpx;
		font-weight: 500;
	}
	.children-box{
		list-style: none;
		padding: 0;
		box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.1);
		border-radius: 16rpx;
		overflow: hidden;
		margin-bottom: 42rpx;
		position: relative;
	}
	.close-btn{
		position: absolute;
		top: 0;
		right: 10rpx;
		image{
			width: 24rpx;
			height: 24rpx;
		}
	}
}

.add-child{
	width: 524rpx;
	height: 68rpx;
	text-align: center;
	background: #fff;
	color: #127FEC;
	margin: 0 auto;
	line-height: 68rpx;
	border: 1px dashed rgba(18, 127, 236, 0.34);
	border-radius: 34rpx;
	margin-bottom: 152rpx;
}

.submit-btn{
	width: 100%;
	height: 94rpx;
	background: #127FEC;
	color: #fff;
	text-align: center;
	line-height: 94rpx;
}
.m-top{
	position: fixed;
	bottom: 0;
	left: 0;
}
.people-text{
	overflow: hidden;
	text-overflow:ellipsis;
	white-space: nowrap;
	width: 400rpx;
	text-align: right;
}
.date-text{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
}
.bottom-btn{
	position: fixed;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	width: 100%;
	height: 48px;
	justify-content: center;
	.submit-btn{
		width: 50%;
	}
	.close{
		width: 50%;
		text-align: center;
		line-height: 94rpx;
		// color: #F56C6C;
		background: #EBEEF5;
		// color: #fff;
	}
}
</style>
