<template>
	<div style="width: 100%;">

		<div class="shop_item">
			<div class="shop_title" style="display: flex;margin: 20px 0;font-size: 20px;">
				<a href="#" @click="prev" style="text-decoration:none;font-size: 14px;">
					<icon-svg name="jiantou" style="width: 1.2em;height: 1.2em;position: relative;top: 0.3em;">
					</icon-svg>
					返回
				</a>
				<span style="display: inline-block;margin: 0 15px;color: #D9D9D9;">|</span>
				<span style="flex:1;">项目详情</span>
				<el-button style="margin-bottom: 20px;position: absolute;bottom: 50px;right: 50px;" size="mini" type="primary" @click="cancel">刷新
				</el-button>
			</div>
			<div>
				<div class="detailtabel">
					<div class="table_main">
						<table>
							<tbody>
								<tr>
									<th>公司名称</th>
									<td>
										<span v-if="tableData.company">
											{{tableData.company.companyName}}
										</span>
									</td>
									<th>项目类型</th>
									<td>{{tableData.projectType}}</td>
									<th><!-- {{tableData.classify==2?'项目名称':'项目属性'}} -->项目甲方</th>
									<td class="border-rt">{{tableData.projectName}}</td>
								</tr>
								<tr>
									<th>项目工期(月)</th>
									<td>{{tableData.projectDayNum}}</td>
									<th>项目福利</th>
									<td>
										{{tableData.projectAward}}
									</td>
									<th>省市区</th>
									<td class="border-rt">
										{{tableData.address}}
									</td>
								</tr>
								<tr v-if="tableData.classify==1">
									<th>配备人员情况</th>
									<td>{{tableData.manning}}</td>
									<th>施工阶段</th>
									<td>
										{{tableData.construction}}
									</td>
									<th>详细地址</th>
									<td class="border-rt">
										{{tableData.details}}
									</td>
								</tr>
								<tr>
									<th>支付钻石</th>
									<td>
										{{tableData.payMoney}}
									</td>
									<th>邮箱</th>
									<td>
										{{tableData.email}}
									</td>
									<th>状态</th>
									<td class="border-rt">
										<span style="color: #4f9dec;" v-if="tableData.status === 1 ">待审核</span>
										<span style="color: #4f9dec;" v-if="tableData.status === 2 ">正常</span>
										<span style="color: #4f9dec;" v-if="tableData.status === 3 ">完成</span>
										<span style="color: #4f9dec;" v-if="tableData.status === 4 ">未完成</span>
										<span style="color: #999;" v-if="tableData.status === 5 ">已取消</span>
										<span style="color: #999;" v-if="tableData.status === 6 ">拒绝</span>
										<el-button size="mini" type="primary" v-if="tableData.status === 1 "
											@click="shenhe(tableData)">审核</el-button>
									</td>
								</tr>
								<tr>
									<th class="border-bt">进场时间</th>
									<td class="border-bt">{{tableData.approachTime}}
									</td>
									<th class="border-bt">项目负责人姓名</th>
									<td class="border-bt">{{tableData.projectPrincipalName}}
									</td>
									<th class="border-bt">项目负责人电话</th>
									<td class="border-bt border-rt">
										{{tableData.projectPrincipalPhone}}
									</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
			</div>
			<div>
				<div style="margin: 20px 0;font-size: 20px;">招聘岗位</div>
				<el-table v-loading="tableDataLoading" :data="tableData.postDetailsList">
					<el-table-column prop="postDetailsId" label="编号" width="80" fixed="left">
					</el-table-column>
					<el-table-column prop="postName" label="岗位" width="100">
					</el-table-column>
					<el-table-column prop="rulePostName" label="专业" width="100">
					</el-table-column>
					<el-table-column prop="education" label="学历要求" width="150" v-if="tableData.classify==1">
					</el-table-column>
					<el-table-column prop="postPeopleNum" label="人数">
					</el-table-column>
					<el-table-column prop="postSex" label="性别">
					</el-table-column>
					<el-table-column prop="postAge" label="年龄">
					</el-table-column>
					<el-table-column prop="priceR" label="人均发布价格" width="100">
						<template slot-scope="scope">
							<div>{{(Number(scope.row.price) /Number(scope.row.postPeopleNum)).toFixed(2)}}</div>
						</template>
					</el-table-column>
					<el-table-column prop="price" label="总发布价格" width="100">
					</el-table-column>
					<el-table-column prop="postPrice" label="岗位工资" width="140">
					</el-table-column>
					<!-- <el-table-column prop="workDay" label="工期" width="100">
					</el-table-column> -->

					<el-table-column prop="status" label="状态" width="100" fixed="right">
						<template slot-scope="scope">
							<span style="color: #4f9dec;" v-if="scope.row.status === 1 ">待推送</span>
							<span style="color: #4f9dec;" v-if="scope.row.status === 2 ">已推送</span>
							<span style="color: #4f9dec;" v-if="scope.row.status === 3 ">未完成</span>
							<span style="color: #4f9dec;" v-if="scope.row.status === 4 ">报名已满</span>
						</template>
					</el-table-column>
					<el-table-column prop="createTime" label="创建时间" width="180">
					</el-table-column>
					<el-table-column label="操作" prop="id" width="260" fixed='right' align="center"
						v-if="tableData.classify==2">
						<template slot-scope="scope">
							<el-button size="mini" type="primary" @click="plCompileB(scope.row)">报名列表
							</el-button>
							<el-button size="mini" type="primary" @click="plCompile(scope.row)">推送列表
							</el-button>
						</template>
					</el-table-column>
				</el-table>
				<div style="color: #B94A48;font-size: 20px;margin-top: 10px;" v-if="totalMoney">本页累计交易统计：{{totalMoney}}钻石
				</div>
			</div>

		</div>
		<!-- 服务审核弹框 -->
		<el-dialog title="项目审核" :visible.sync="dialogFormVisible8" center>
			<el-radio-group v-model="radio" style="width: 100%;margin-bottom: 30px;margin-left: 200px;">
				<el-radio :label="1">通过</el-radio>
				<el-radio :label="2">驳回</el-radio>
			</el-radio-group>
			<div style="margin-bottom: 10px;">
				<span style="width: 200px;display: inline-block;text-align: right;">审核理由：</span>
				<el-input style="width:50%;" v-model="contents" type="text" placeholder="请输入审核理由"></el-input>
			</div>
			<div slot="footer" class="dialog-footer">
				<el-button @click="dialogFormVisible8 = false">取 消</el-button>
				<el-button type="primary" @click="refuseto()">确 定</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				tableData: {},
				postDetailsId: '',
				postPushId: '',
				classify: 1,
				totalMoney: 0,
				tableDataLoading:false,
				dialogFormVisible8:false,
				radio: '',
				contents: '',
			}
		},
		methods: {

			// 取消
			cancel() {
				this.dataSelect()
			},

			// 获取详情数据
			dataSelect() {
				this.totalMoney = 0
				let postPushId = this.$route.query.postPushId
				this.postPushId = this.$route.query.postPushId
				this.tableDataLoading = true
				this.$http({
					url: this.$http.adornUrl('postPush/selectPostPushDetails'),
					method: 'get',
					params: this.$http.adornParams({
						'postPushId': postPushId
					})
				}).then(({
					data
				}) => {
					this.tableDataLoading = false
					let returnData = data.data;
					this.tableData = returnData
					for (var i in this.tableData.postDetailsList) {
						this.tableData.postDetailsList[i].goodsPriceZ = 0
						this.totalMoney = this.totalMoney + this.tableData.postDetailsList[i].price
					}
					this.totalMoney = this.totalMoney.toFixed(2)
				})
			},
			// 返回上一级
			prev() {
				this.$router.back()
			},
			// 推送列表
			plCompile(row) {
				this.postDetailsId = row.postDetailsId

				this.$router.push({
					path: '/propellingList',
					query: {
						postDetailsId: row.postDetailsId,
						postPushId: row.postPushId
					}
				})
			},
			// 报名列表
			plCompileB(row) {
				this.postDetailsId = row.postDetailsId
				this.$router.push({
					path: '/registrationList',
					query: {
						postDetailsId: row.postDetailsId,
						postPushId: row.postPushId
					}
				})
			},
			// 审核
			shenhe(row) {
				this.shenheId = row.postPushId
				this.dialogFormVisible8 = true
			},
			// 提交审核
			refuseto(row) {
				if (this.radio == '') {
					this.$notify({
						title: '提示',
						duration: 1800,
						message: '请选择审核结果',
						type: 'warning'
					})
					return
				}
				if (this.contents == '') {
					this.$notify({
						title: '提示',
						duration: 1800,
						message: '请输入审核理由',
						type: 'warning'
					})
					return
				} else {
					let ids = this.shenheId
					let status = this.radio
					let content = this.contents
					this.$http({
						url: this.$http.adornUrl('postPush/auditPostPush'),
						method: 'post',
						params: this.$http.adornParams({
							'ids': ids,
							'status': status,
							'content': content
						})
					}).then(({
						data
					}) => {
						this.dialogFormVisible8 = false
						this.$message({
							message: '审核完成',
							type: 'success',
							duration: 1500,
							onClose: () => {
								this.radio = 0
								this.contents = ''
								this.dataSelect()
							}
						})
					})
				}
			},
		},
		mounted() {
			this.dataSelect()
		}
	};
</script>

<style scoped="scoped">
	.detailtabel h2 {
		margin-top: 0;
	}

	.detailtabel .table_main table {
		width: 100%;
	}

	.detailtabel .table_main {
		border: 1px solid #e8e8e8;
	}

	.detailtabel table tr {
		border-bottom: 1px solid #e8e8e8;
	}

	.detailtabel table tr th {
		background-color: #fafafa;
		padding: 16px 24px;
		border-right: 1px solid #e8e8e8;
		border-bottom: 1px solid #e8e8e8;
	}

	.detailtabel table tr td {
		padding: 16px 24px;
		border-right: 1px solid #e8e8e8;
		border-bottom: 1px solid #e8e8e8;
	}

	.detailtabel table th {
		color: rgba(0, 0, 0, .85);
		font-weight: 400;
		font-size: 14px;
		line-height: 1.5;
	}
	.border-rt {
		border-right: none !important;
	}
	
	.border-bt {
		border-bottom: none !important;
	}
</style>
