<template>
	<view>
		<view class="transmit-name allcss">
			孵化器名称 ：<text v-text="listDetail.incubator"></text> 
		</view>
		<view class="demand-box allcss">
			<view class="demand-title">
				<text>需求内容 ：</text>
				<view class="enroll-box" v-if="isEnroll"><text>已揭榜</text></view>
			</view>
			<view class="demand-content">
				{{ listDetail.content }}
			</view>
		</view>
		<view class="unveiling allcss">
			<view class="unveiling-title">
				揭榜	 ：
			</view>
			<view class="unveiling-content">
				电话 ：<input type="number" class="reason-ipt" placeholder="请输入您的电话" v-model="contactPhone"/>
			</view>
			<view class="unveiling-content">
				称呼 ：<input type="text" class="reason-ipt" placeholder="请输入您的称呼" v-model="contacts"/>
			</view>
			<view class="unveiling-content">
				企业名称 ：<input type="text" class="reason-ipt" placeholder="请输入您的企业名称" v-model="enterpriseName"/>
			</view>
			<view class="unveiling-content reason">
				揭榜理由 ：<textarea class="filed" placeholder="非必填,不得多于200字" v-model="remark"></textarea>
			</view>
		</view>
		<button type="default" class="unveilingBtn" @click="unveilingBtn">请揭榜</button>
	</view>
</template>

<script>
	import { listDetails } from 'api/listDetails'
	import { candidate } from 'api/candidate'
	import { detail } from 'api/detail'
	import { candidateQuery } from 'api/candidateQuery'
	
	export default {
		onShareAppMessage(res) {
			if (res.from === 'button') {// 来自页面内分享按钮
				console.log(res.target)
			}
			return {
				title: '',
				path: '/pages/HomePages/ListDetails'
			}
		},
		data() {
			return {
				listDetail:{
					"incubator":'',
					"content":''
				},
				contactPhone:'',
				contacts:'',
				enterpriseName:'',
				remark:'',
				isEnroll:false
			}
		},
		async onLoad(options) {
			const that = this
			try{
				const params1 = {
					param:{
						"publishId":options.id - 0
					}
				}
				const data1 = await candidateQuery(params1)
				// console.log(data1)
				if(data1 !== null){
					that.isEnroll = true
					that.contactPhone = data1.contactPhone
					that.contacts = data1.contacts
					that.enterpriseName = data1.enterpriseName
					that.remark = data1.remark
				}else if(that.$store.state.user.bindMsg.bindStatus-0 === 1){
					const params = {
						param:{
						}
					}
					const data = await detail(params)
					that.contactPhone = data.contactPhone
					that.contacts = data.contacts
					that.enterpriseName = data.name
				}
			}catch(e){
				//TODO handle the exception
				console.log(e)
			}
			if(options.id){
					try{
					const params = {
						param:{
							"id": options.id - 0
							}
						}
					const data = await listDetails(params)
					if(data.content){
						that.listDetail = data
					}
				}catch(err){
					//TODO handle the exception
					console.log(err)
				}
			}
		},
		methods: {
			async unveilingBtn(){
				const that = this
				if(that.contactPhone == ''){
					uni.showModal({
						title:'请填写电话',
						icon:'none',
						duration:2000
					})
				}else if(that.contacts == ''){
					uni.showModal({
						title:'请填写称呼',
						icon:'none',
						duration:2000
					})
				}else if(that.enterpriseName == ''){
					uni.showModal({
						title:'请填写企业名称',
						icon:'none',
						duration:2000
					})
				}else if(that.isEnroll === true){
					uni.showModal({
						title:"提示",
						content:"您已揭榜过，是否确认修改报名信息",
						success: async function(res) {
							if(res.confirm){
								try{
									const params = {
										"param": {
											"contactPhone": that.contactPhone,
											"contacts": that.contacts,
											"enterpriseName": that.enterpriseName,
											"publishId": that.listDetail.id,
											"remark": that.remark
										}
									}
									const data = await candidate(params)
									console.log(data)
									uni.showToast({
										title:'揭榜成功',
										icon:'none'
									})
								}catch(err){
									//TODO handle the exception
									uni.showToast({
										title:'揭榜失败 :' + err,
										icon:'none'
									})
									console.log(err)
								}
							}
						}
					})
				}else{
					try{
						const params = {
							"param": {
								"contactPhone": that.contactPhone,
								"contacts": that.contacts,
								"enterpriseName": that.enterpriseName,
								"publishId": that.listDetail.id,
								"remark": that.remark
							}
						}
						const data = await candidate(params)
						console.log(data)
						uni.showToast({
							title:'揭榜成功',
							icon:'none'
						})
					}catch(err){
						//TODO handle the exception
						uni.showToast({
							title:'揭榜失败 :' + err,
							icon:'none'
						})
						console.log(err)
					}
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
.allcss{
	background-color: $white;
	margin-bottom: 10px;
}
.transmit-name{
	padding-left: 30upx;
	height: 88upx;
	line-height: 88upx;
}
.demand-box{
	height: auto;
	position: relative;
	padding-bottom: 30upx;
}
.demand-title{
	padding-left: 30upx;
	height: 60upx;
	line-height: 60upx;
	border-bottom: 1px solid #eee;
}
.demand-content{
	margin-left: 70upx;
	margin-right: 75upx;
	margin-top: 10px;
	padding:0 10px;
	min-height: 140px;
	// line-min-height: 48upx;
}
.unveiling{
	height: auto;
}
.unveiling-title{
	padding-left: 30upx;
	height: 60upx;
	line-height: 60upx;
	border-bottom: 1px solid #eee;
}
.unveiling-content{
	position: relative;
	margin-left: 30upx;
	width: 690upx;
	border-bottom: 1px solid #eee;
	padding: 10px;
}
.reason{
	border: none !important;
}
.reason-ipt{
	position: absolute;
	border: 1px solid #eee;
	border-radius: 5px;
	top: 10px;
	left: 180upx;
	padding-left: 10px;
}
.filed{
	border: 1px solid #eee;
	border-radius: 5px;
	padding: 10upx;
	height: 100px;
	width: 660upx;
}
.unveilingBtn{
	margin-left: 30upx;
	width: 690upx;
	background-color: $red !important;
	color: $white !important;
}
.enroll-box{
	position: absolute;
	right: 100upx;
	top: 100upx;
	height: 100px;
	width: 100px;
	border: 2px solid #FF4500;
	line-height: 100px;
	color: #FF4500;
	font-size: 24px;
	border-radius: 50%;
	text-align: center;
	transform: rotate(25deg);
	
	text{
		border: 1px solid #FF4500;
		padding: 4px;
		border-radius: 5px;
	}
}
</style>
