<template>
	<view class="personal">
		<u-form
			labelPosition="top"
			:model="userInfo"
			:rules="rules"
			ref="uForm"
			labelWidth="120"
		>
			<u-form-item label="公司名称" prop="orgName" borderBottom>
				<u-input v-model="userInfo.orgName" border="none" placeholder="如: 君营直聘" />
			</u-form-item>
			<u-form-item label="职位名称" prop="job" borderBottom>
				<u-input v-model="userInfo.job" border="none" placeholder="如: 高级软件工程师" />
			</u-form-item>
			<u-form-item label="在职时间" prop="idNo" borderBottom>
				<view class="f_b">
					<view
						class="f_b"
						style="width: 35vw;padding: 10rpx 0;"
						@click="show=true"
					>
						<view>{{userInfo.startTime || '入职时间'}}</view>
						<u-icon size="18" name="arrow-right"/>
					</view>
					-
					<view class="f_b">
						<view
							class="f_b"
							style="width: 35vw;padding: 10rpx 0;"
							@click="show2=true"
						>
							<view>{{userInfo.endTime || '离职时间'}}</view>
							<u-icon size="18" name="arrow-right"/>
						</view>
					</view>
				</view>
				<!-- 入职时间 -->
				<u-datetime-picker
					:show="show"
					v-model="startTime"
					mode="year-month"
					:minDate="2649600000"
					:maxDate="1786778555000"
					@close="show=false"
					@confirm="setStartTime"
				></u-datetime-picker>
				<!-- 离职时间 -->
				<u-datetime-picker
					:show="show2"
					v-model="endTime"
					mode="year-month"
					:minDate="2649600000"
					:maxDate="1786778555000"
					@close="show2=false"
					@confirm="setEndTime"
				></u-datetime-picker>
			</u-form-item>
			<u-form-item label="所属行业" prop="industryName" borderBottom>
				<u-input v-model="userInfo.industryName" border="none" placeholder="请输入" />
			</u-form-item>
			<u-form-item label="月薪" prop="money" borderBottom>
				<u-input v-model="userInfo.money" border="none" placeholder="元/月" />
			</u-form-item>
			<u-form-item label="工作描述" prop="descr">
				<u--textarea
					v-model="userInfo.descr"
					placeholder="在任职期间,主要负责**项目,取得了***的成绩,我再整个项目中的主要贡献是***"
					border="bottom"
					height="80"
					maxlength="500"
				></u--textarea>
			</u-form-item>
		</u-form>
		<view class="br"></view>
		<view class="footer">
			<u-button @click="submit" type="primary">保存</u-button>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo:{},
				show: false,
				startTime: new Date().getTime(),
				show2: false,
				endTime: new Date().getTime(),
			}
		},
		onLoad(e) {
			if (e.id) {
				this.$http.get('/workExperience/details', {id: e.id}).then(res => {
					this.userInfo = res.data
				})
			}
			
		},
		methods: {
			setStartTime(e) {
				this.userInfo.startTime = this.formatTimestampToYearMonth(e.value)
				this.show = false
			},
			setEndTime(e) {
				this.userInfo.endTime = this.formatTimestampToYearMonth(e.value)
				this.show2 = false
			},
			formatTimestampToYearMonth(timestamp) {
			  const date = new Date(timestamp);
			  const year = date.getFullYear();
			  const month = String(date.getMonth() + 1).padStart(2, '0');
			  return `${year}-${month}`;
			},
			submit(){
				if (!this.userInfo.orgName) {
					return uni.showToast({
						title: '请输入公司名称',
						icon: 'none'
					})
				}
				if (!this.userInfo.job) {
					return uni.showToast({
						title: '职位名称',
						icon: 'none'
					})
				}
				if (!this.userInfo.startTime) {
					return uni.showToast({
						title: '请输入入职时间',
						icon: 'none'
					})
				}
				if (!this.userInfo.endTime) {
					return uni.showToast({
						title: '请输入离职时间',
						icon: 'none'
					})
				}
				if (!this.userInfo.industryName) {
					return uni.showToast({
						title: '请输入所属行业',
						icon: 'none'
					})
				}
				if (!this.userInfo.money) {
					return uni.showToast({
						title: '请输入月薪',
						icon: 'none'
					})
				}
				if (!this.userInfo.descr) {
					return uni.showToast({
						title: '请输入工作描述',
						icon: 'none'
					})
				}
				const url = this.userInfo.id ? '/workExperience/u' : '/workExperience/c'
				this.$http.post(url, this.userInfo).then(res => {
					uni.showToast({
					  title: `保存成功`,
					  icon: 'none',
					});
					setTimeout(()=>{
						uni.navigateBack()
					},500)
				})
			}
		}
	}
</script>

<style lang="scss">
.personal{
	background: #fff;
	min-height:100vh;
	padding:0 30rpx;
	.br{
		height: calc(200rpx + env(safe-area-inset-bottom));
	}
	.footer{
		position: fixed;
		bottom: calc(env(safe-area-inset-bottom) + 40rpx);
		width: 690rpx;
	}
}
</style>
