<template>
  <view class="page">
    <u-navbar class="u-navbar" title="电子合同" placeholder @leftClick="leftClick" leftIconColor="#fff"  bgColor="#00337A"  :titleStyle="{ color: '#FFF', fontSize: '32rpx' }"/>
	<scroll-view class="content" scroll-y="true">
		<view class="face-btn">点击人脸识别</view>
		<view class="form-box">
			<u--form class="addForm" :model="contractForm" ref="cForm">
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>甲方</text>
					</view>
					<u-form-item prop='partA' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.partA" type="text" placeholder="请输入" maxlength="40"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>法人代表</text>
					</view>
					<u-form-item prop='legalPerson' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.legalPerson" type="text" placeholder="请输入" maxlength="20"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>联系电话</text>
					</view>
					<u-form-item prop='partAPhone' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.partAPhone" type="number" placeholder="请输入" maxlength="11"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>地址</text>
					</view>
					<u-form-item prop='partAAdress' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.partAAdress" type="text" placeholder="请输入" maxlength="40"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>乙方</text>
					</view>
					<u-form-item prop='partB' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.partB" type="text" placeholder="请输入" maxlength="40"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>性别</text>
					</view>
					<u-form-item prop='sex' style="width:70%;height: 100%;" >
						<u-radio-group v-model="contractForm.sex" placement="row" style="border: 1rpx solid #ccc;padding:20rpx;border-radius: 10rpx;">
							<u-radio label="男" name="男" style="margin-right: 40rpx;"></u-radio>
							<u-radio label="女" name="女" ></u-radio>
						</u-radio-group>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>联系方式</text>
					</view>
					<u-form-item prop='partBPhone' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.partBPhone" type="number" placeholder="请输入" maxlength="11"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>家庭地址</text>
					</view>
					<u-form-item prop='partBAdress' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.partBAdress" type="text" placeholder="请输入" maxlength="40"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>工种</text>
					</view>
					<u-form-item prop='workTypeId' style="width:70%;height: 100%;" >
						<uni-data-select v-model="contractForm.workTypeId" :localdata="postList" @change="changePost"></uni-data-select>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>工作任务</text>
					</view>
					<u-form-item prop='workTask' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.workTask" type="text" placeholder="请输入" maxlength="40"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>工作地点</text>
					</view>
					<u-form-item prop='workAdress' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.workAdress" type="text" placeholder="请输入" maxlength="40"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>工资核定方式</text>
					</view>
					<u-form-item prop='verMethod' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.verMethod" type="text" readonly  border="surround"></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>工资核定标准</text>
					</view>
					<u-form-item prop='verStand' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.verStand" type="number" placeholder="请输入" maxlength="3"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>生效日期</text>
					</view>
					<u-form-item prop='effectDate' style="width:70%;height: 100%;" >
						<uni-datetime-picker type="date" :clear-icon="false" format="yyyy-MM-dd" v-model="contractForm.effectDate"/>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>其他补充事项</text>
					</view>
					<u-form-item prop='otherSupply' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.otherSupply" type="text" placeholder="请输入" maxlength="40"  border="surround" clearable></u--input>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>人员角色</text>
					</view>
					<u-form-item prop='role' style="width:70%;height: 100%;" >
						<uni-data-select v-model="contractForm.role" :localdata="roleList"></uni-data-select>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>乙方签名</text>
					</view>
					<u-form-item prop='' style="width:70%;height: 100%;" >
						
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>班组长签名</text>
					</view>
					<u-form-item prop='' style="width:70%;height: 100%;" >
						
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>验证码</text>
					</view>
					<u-form-item prop='' style="width:70%;height: 100%;" >
						
					</u-form-item>
				</view>
				
				
				
				<!-- <view style="width: 100%;height: auto;">
					<view style="width:25%;height: 100%;margin: 20rpx;">
						<text>合同期限类型</text>
					</view>
					<u-form-item prop='laborContractType' style="width:96%;height: 100%;margin: 0 auto;" >
						<u-radio-group v-model="contractForm.laborContractType" placement="row" style="border: 1rpx solid #ccc;padding:20rpx 10rpx;border-radius: 10rpx;">
							<u-radio label="以完成一定工作为期限的合同" name="以完成一定工作为期限的合同" style="margin-right: 20rpx;transform:scale(0.8);"></u-radio>
							<u-radio label="固定期限合同" name="固定期限合同" style="transform:scale(0.8);"></u-radio>
						</u-radio-group>
					</u-form-item>
				</view>
			
				
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>合同终止日期</text>
					</view>
					<u-form-item prop='contractInvalidDate' style="width:70%;height: 100%;" >
						<uni-datetime-picker type="date" :clear-icon="false" format="yyyy-MM-dd" v-model="contractForm.contractInvalidDate"/>
					</u-form-item>
				</view>
				<view class="form-input-box">
					<view style="width:25%;height: 100%;">
						<text>合同类型</text>
					</view>
					<u-form-item prop='contractType' style="width:70%;height: 100%;" >
						<u--input v-model="contractForm.contractType" type="text" readonly  border="surround"></u--input>
					</u-form-item>
				</view> -->
			
				
			</u--form>
		</view>
		<view class="bottom-box">
			<view class="btn1">返回</view>
			<view class="btn2">预览合同</view>
		</view>
	</scroll-view>
  </view>
</template>

<script>
import PdfView from '../../components/PdfView.vue';
import config from '@/config';
export default {
  components: { PdfView },
  data() {
    return {
		postList:[],
		roleList:[
			{value:'管理人员',text:'管理人员'},
			{value:'务工人员',text:'务工人员'},
			{value:'劳资专管员',text:'劳资专管员'}
		],
		contractForm:{
				"partA": "",//甲方
				"legalPerson": "",//法人代表
				"partAPhone": "",//甲方电话
				"partAAdress": "",//甲方地址
				"partB": "",//乙方
				"sex":"男",//性别
				"partBPhone": "",//乙方电话
				"partBAdress": "",//乙方地址
				"workTypeId":"",//工种id
				"workType":"",//工种
				"workTask":"",//工作任务
				"workAdress":"",//工作地点
				"verMethod": "天",//工资核定方式
				"verStand": "",//工资核定标准
				"effectDate": "",//生效日期
				"otherSupply": "",//其他补充事项
				"role": "",//人员角色
				"partBSign": "",//乙方签名
				"teamSign": "",//班组长签名
				
				
				"id":'',
				"idNumber":uni.getStorageSync('realNameUser').idNumber,
				"proId":uni.getStorageSync('realNameUser').proId,//工程id
				"uploadDate": "",//日期
				"uploadTime": "",//时间
				"uploadId": uni.getStorageSync('realNameUser').userId,//上传人id
				"witnessType": "1",
				"isActive": "1",
				"witnessPath": "",//图片地址
				// "contractPath": "",//合同见证照片
				
				"laborContractType": "固定期限合同",//合同期限类型
				
				"contractInvalidDate": "",//合同终止日期
				"contractType": "纸质合同",//合同类型
				"isYiLiao": "是",//是否参加城乡居民医疗保险
				"isYangLao": "是",//是否参加城乡居民养老保险
				"whetherOnJob": "是"//是否在职
		},
		
    }
  },
  onLoad() {
	  
    console.log('🚀 ~ mounted ~ mounted-index:') 
	this.getpostList()
  },
  onShow() {
  },
  methods: { 
	//获取工种
	getpostList(){
		uni.request({
		  url: config.realAppUrl + '/offLine/getWorkType',
		  method: 'post',
		  data: {},
		  header: {
			'Content-Type': 'application/x-www-form-urlencoded',
			Authorization: uni.getStorageSync('realNameToken')
		  },
		  success: res => {
			res = res.data;
			if(res.code==200){
				res.data.forEach(item=>{
					if(item.code=='postType'){
						let obj={value:item.id,text:item.type}
						this.postList.push(obj)
					}
				});
			}
		  },
		  fail: err => {
			console.log(err)
		  }
		})
	},
	changePost(e){
		this.postList.forEach(item=>{
			console.log(item)
			if(item.value==e){ 
				this.contractForm.workType=item.text;
			}
		})
		console.log(this.contractForm.workType)
	},
    // 返回
    leftClick() {
      console.log('返回')
      uni.navigateBack({
      	delta: 1 // 返回
      });
    }
  },

}
</script>

<style lang="scss">
.page {
	width: 100vw;
	height: 100vh;
	background-color: #FFF;
	box-sizing: border-box;
	position: relative;
	.content{
		width: 100%;
		height: 92vh;
		// margin-top: 20rpx;
		padding-bottom: 40rpx;
	}
	.face-btn{
		width: 92%;
		height: 80rpx;
		margin: 0 auto;
		margin-top: 40rpx;
		display: flex;
		align-items: center;justify-content: center;
		color: #FFF;
		background: #00337A;
		border-radius: 10rpx;
	}
	.form-box{
		width: 94%;
		height: auto;
		margin: 0 auto;
		margin-top: 20rpx;
		.addForm{
			width: 100%;
			height: auto;
			font-size: 26rpx;
			.form-input-box{
				padding: 0 20rpx;
				display: flex;
				align-items: center;
				// border-bottom: 1rpx solid #eee;
			}
		}
	}
	.bottom-box{
		width: 90%;
		margin: 0 auto;
		height: 120rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		.btn1{
			width: 40%;
			height: 80rpx;
			display: flex;
			align-items: center;justify-content: center;
			color: #FFF;
			background: #00337A;
			border-radius: 10rpx;
		}
		.btn2{
			width: 40%;
			height: 80rpx;
			display: flex;
			align-items: center;justify-content: center;
			color: #FFF;
			background: #00337A;
			border-radius: 10rpx;
		}
	}
}
</style>
