keysass_app/pages/personal/personalresume/projectexperience.vue

<template>
	<view class="navTab">
		<u-form :model="projectobj"  ref="projectobj" label-position='left' label-width='150'   >
			<u-form-item  label="项目名称：" prop="projectName"  required='true'>
				<u-input style="width:100%;"  v-model="projectobj.projectName"  placeholder='请输入项目名称'/>
			</u-form-item>
			<u-form-item  label="项目周期：" prop="projectPeriod"  required='true' >
				<!-- <u-input style="width:100%;" @click="show=true" v-model="projectobj.projectPeriod"  placeholder='请选择项目周期'/> -->
				<u-input class="seleclas"  v-model="projectobj.projectPeriod" type="select"  @click="Periodshow = true"  placeholder='请选择' />
				<u-select v-model="Periodshow" :list="PeriodList"  @confirm="Periodchange"></u-select>
				<!-- <u-calendar v-model="show" :mode="mode" 
					max-date='2050-01-01'
					@change="Periodchange">
					<view slot="tooltip"> <view class="title"> </view> </view>
				</u-calendar> -->
				 <!-- <view class="button"  @click="show=true">请选择项目周期项目周期</view> -->
			</u-form-item>
			<u-form-item  label="担任角色：" prop="role"   required='true'>
				<u-input style="width:100%;"  v-model="projectobj.role"   placeholder='请输入担任角色'/>
			</u-form-item>
			<u-form-item  label="应用技术：" prop="applyTech"  >
				<u-input style="width:100%;"  v-model="projectobj.applyTech"  placeholder='请输入应用技术'/>
			</u-form-item>
			<u-form-item  label="项目简介：" prop="projectIntro" required='true' class="textare">
				<u-input style="width:100%;height: 100px;" border='true' type='textarea'  v-model="projectobj.projectIntro"  placeholder='请输入项目简介'/>
			</u-form-item>
			
		</u-form>
		<view class="bottbtn" @click="resource">保存</view>
		<!-- <view class="bottbtn" @click="delpro">删除</view> -->
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				projectobj:{userId:'',caseId:'',projectName:'',projectPeriod:'',role:'',applyTech:'',projectIntro:''},
				projectRules: {
					projectName: [{ required: true, message: '请输入项目名称', trigger: 'change',}],
					projectPeriod: [{ required: true, message: '请选择项目周期', trigger: 'change',}],
					role: [{ required: true, message: '请输入担任角色', trigger: 'change',}],
					projectIntro: [{ required: true, message: '请输入项目简介', trigger: 'change',}],
				},
				Periodshow: false,
				PeriodList:[{value:'1',label:'3-10天'},{value:'2',label:'10-15天'},{value:'3',label:'15-30天'},{value:'4',label:'1-2个月'},
				{value:'5',label:'3-6个月'},{value:'6',label:'6-12个月'},{value:'7',label:'1-2年'},{value:'8',label:'2年以上'}],
				mode: 'range'
			}
		},
		onReady(){
			this.$refs.projectobj.setRules(this.projectRules);
		},
		onLoad(option) {
			console.log('option---',option)
			let type=option.type;
			if(type&&type==1){
				uni.setNavigationBarTitle({
					title: '添加项目经历'
				});
			
			}else{
				uni.setNavigationBarTitle({
					title: '编辑项目经历'
				});
				let caseId=option.caseId
				if(caseId){
					this.http.quickGet(`/personal/case/${caseId}`,true).then(res=>{
						console.log('项目信息---',res)
						let prodata=res.data;
						if(prodata){
							let {caseId,projectName,projectPeriod,role,applyTech,projectIntro}=prodata
							this.projectobj={caseId,projectName,projectPeriod,role,applyTech,projectIntro}
						}
					})
				}
			}
		},
		methods: {
		
			Periodchange(e){
				this.projectobj.projectPeriod=e[0].label
			},
			resource(){
				console.log('projectobj',this.projectobj)
				this.$refs.projectobj.validate(valid => {
					if (valid) { 
						let wxUserInfo = uni.getStorageSync('wxUserInfo');
						let data={
							userId:wxUserInfo.userId,
							caseId:this.projectobj.caseId,
							projectName:this.projectobj.projectName,
							projectPeriod:this.projectobj.projectPeriod,
							role:this.projectobj.role,
							applyTech:this.projectobj.applyTech,
							projectIntro:this.projectobj.projectIntro,
						}
						console.log('data',data)
						if(this.projectobj.caseId){
							
							
							// 删除制度的项目案例
							// delete /personal/case/{caseId}
							this.http.quickPost(`/personal/case/update`,data,true).then(res=>{
								if(res.data.code==200){
									
									this.$refs.uToast.show({
										title: '编辑项目成功',
										type: 'success',
										url:'pages/personal/personalresume/personalresume'
									})
								}
							})
						}else{
							this.http.quickPost(`/personal/case/add`,data,true).then(res=>{
								if(res.data.code==200){
									this.$refs.uToast.show({
										title: '添加项目成功',
										type: 'success',
										url:'pages/personal/personalresume/personalresume'
									})
								}
							})
						}
					}
				})
			},
			// 删除
			delpro(){
				this.http.quickDelete(`/personal/case/${this.projectobj.caseId}`,true).then(res=>{
					console.log('res---',res)
					this.$refs.uToast.show({
						title: '删除项目成功',
						type: 'info',
						url:'pages/personal/personalresume/personalresume'
					})
				})
			}
		}
	}
</script>

<style>
	.navTab{
		background-color: #ffffff;
		width: 96vw;
		margin: 2vh auto;
		padding: 10px 15px 30px 25px;
		border-radius: 5px;
		
	}
	.u-form-left__content__label{
		color:#808080!important;
	}
	.navTab .u-input{
		/* height:35px; */
		border-bottom: 1px solid #EBEBEB!important;
	}
	.textare .u-input{
		min-height:100px;
	}
	.bottbtn{
		/* width:94vw; */
		margin:30px 3vw 15px 3vw;
		height:75rpx;	
		background: linear-gradient(90deg, #5EA6FD, #1A81F9);
		border-radius:15rpx;
		text-align: center;
		line-height:75rpx;
		color: #FFFFFF;
		font-size: 33rpx;
	}
	.title{
		color: #1A81F9;
		text-align: center;
		padding: 20rpx 0 0 0;
	}
</style>