<template>
	<view>
		<view class="box">
			<view class="flex align-center justify-between margin-bottom" @click="getPost">
				<view class=" text-bold">岗位</view>
				<view class="text-right flex align-center ">
					<view class="">{{postName?postName:'请选择岗位'}}</view>
					<view class="margin-left-sm">
						<image src="../../static/images/my/right_icon.png" style="width: 12upx;height: 21upx;"></image>
					</view>
				</view>
			</view>
			<view class="margin-tb-sm" style="width: 100%;height: 1rpx;background: #F2F2F2;"></view>
			<view class="flex align-center justify-between" @click="getPostlist">
				<view class=" text-bold">专业</view>
				<view class="text-right flex align-center padding-tb-sm">
					<view>{{rulePostName? rulePostName:'请选择专业'}}</view>
					<view class="margin-left-sm">
						<image src="../../static/images/my/right_icon.png" style="width: 12upx;height: 21upx;"></image>
					</view>
				</view>
			</view>
			<view class="margin-tb-sm" style="width: 100%;height: 1rpx;background: #F2F2F2;"></view>
			<view class="flex align-center justify-between" @click="getMonyList">
				<view class=" text-bold">工资</view>
				<view class="text-right flex align-center padding-tb-sm">
					<view>{{postPrice? postPrice:'请选择薪资'}}</view>
					<view class="margin-left-sm">
						<image src="../../static/images/my/right_icon.png" style="width: 12upx;height: 21upx;"></image>
					</view>
				</view>
				<!-- <view class="text-right flex align-center ">
					<u-input v-model="postPrice" placeholder="请填写工资" placeholder-style="color:#999999;"
						:clearable="false" />
					<view class="margin-left-sm">
						<image src="../../static/images/my/right_icon.png" style="width: 12upx;height: 21upx;"></image>
					</view>
				</view> -->
			</view>
			<view class="margin-tb-sm" style="width: 100%;height: 1rpx;background: #F2F2F2;"></view>
			<view class="flex align-center justify-between">
				<view class=" text-bold">人数</view>
				<view class="text-right flex align-center ">
					<u-input v-model="postPeopleNum" type="number" placeholder="请填写人数" placeholder-style="color:#999999;"
						@input="input" :clearable="false" />
					<view class="margin-left-sm">
						<image src="../../static/images/my/right_icon.png" style="width: 12upx;height: 21upx;"></image>
					</view>
				</view>
			</view>
			<view class="margin-tb-sm" style="width: 100%;height: 1rpx;background: #F2F2F2;"></view>
			<view class="flex align-center justify-between" @click="SexShow=true">
				<view class=" text-bold">性别</view>
				<view class="text-right flex align-center margin-tb-sm">
					<view v-if="postSex">{{postSex}}</view>
					<view v-else style="color:#999999;">请选择性别</view>
					<view class="margin-left-sm">
						<image src="../../static/images/my/right_icon.png" style="width: 12upx;height: 21upx;"></image>
					</view>
				</view>
			</view>
			<view class="margin-tb-sm" style="width: 100%;height: 1rpx;background: #F2F2F2;"></view>
			<view class="flex align-center justify-between" @click="getAgeList">
				<view class=" text-bold">年龄</view>
				<view class="text-right flex align-center padding-tb-sm">
					<view>{{postAge? postAge:'请选择年龄'}}</view>
					<view class="margin-left-sm">
						<image src="../../static/images/my/right_icon.png" style="width: 12upx;height: 21upx;"></image>
					</view>
				</view>
			</view>

		</view>

		<view class="margin-lr " style="color: #82A9FE;" v-if="offlinePrice">
			当前岗位线下需要支付{{offlinePrice?offlinePrice:'0'}}元，支付后保证金会退回账户。</view>

		<!-- 求职岗位 -->
		<u-select v-model="postShow" :list="postlist" @confirm="postConfirm"></u-select>

		<!-- 专业 -->
		<u-select v-model="show" :list="ErjiList" @confirm="postlistConfirm"></u-select>

		<u-select v-model="SexShow" :list="list" @confirm="SexConfirm"></u-select>

		<!-- 薪资 -->
		<u-select v-model="monyShow" :list="monyList" @confirm="moneyConfirm"></u-select>
		<!-- 年龄 -->
		<u-select v-model="ageShow" :list="ageList" @confirm="ageConfirm"></u-select>
		
		
		<view class="subbtn" @click="save">
			<view class="padding-left flex align-center" style="color: red;" v-if="classify==2">
				<!-- <view class="text-df">￥</view> -->
				<view style="font-size: 48upx;">{{totalPrice?totalPrice:'0'}}<span style="font-size:24rpx;margin-left: 5rpx;margin-right: 5rpx;">积分</span></view>
				<view class=" margin-left-xs" style="color:#82A9FE;font-size: 22rpx;">*发布当前岗位需支付的价格</view>
			</view>
			<view class="btn">保存</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				ageShow:false,
				ageList:[],
				monyShow:false,
				monyList:[],//薪资列表
				postName: '', //岗位名称
				rulePostName: '', //岗位职称
				rulePostId: '',
				postMajor: [], //岗位专业
				postPeopleNum: '', //岗位人数
				postSex: '', //性别
				postAge: '', //年龄段
				postPrice: '', //岗位工资

				postShow: false, //一级岗位
				postlist: [],
				show: false, //二级岗位
				ErjiList: [],
				price: '',
				totalPrice: '',
				member: '', //1 会员
				SexShow: false, //性别
				list: [{
					value: '1',
					label: '男'
				}, {
					value: '2',
					label: '女'
				}, {
					value: '3',
					label: '男女不限'
				}],
				postDetailsList: [],
				postDetailsIndex: '',
				classify: '', //1.定制化  2.精准推送
				offlinePrice: '', //线下价格
				customizationPrice: '', //保证金价格
			}
		},
		onLoad(e) {
			this.classify = e.classify
			this.member = uni.getStorageSync('member') ? uni.getStorageSync('member') : '0'
			if (e.index) {
				this.postDetailsIndex = e.index
				let option = JSON.parse(e.postDetailsList)
				if (option) {
					console.log(option)
					this.postName = option.postName //岗位名称
					this.ruleClassifyId = option.ruleClassifyId
					this.rulePostName = option.rulePostName //专业名称
					this.rulePostId = option.rulePostId
					this.postPeopleNum = option.postPeopleNum //岗位人数
					this.postSex = option.postSex //性别
					this.postAge = option.postAge //年龄段
					this.postPrice = option.postPrice //岗位工资
					this.price = option.price
					this.totalPrice = (parseInt(this.price) * parseInt(this.postPeopleNum)).toFixed(0)
				}
			}
			if (e.classify) { //1.定制化  2.精准推送
				this.classify = e.classify
			}

			if (uni.getStorageSync('postDetailsList')) {
				this.postDetailsList = uni.getStorageSync('postDetailsList')
			}
			// console.log(this.postDetailsList)
		},
		onShow() {

		},
		methods: {
			ageConfirm(e){
				console.log(e)
				this.postAge = e[0].value
			},
			getAgeList(){
				this.$Request.get('/app/dict/list', {
					type:'年龄'
				}).then(res => {
					if (res.code == 0) {
						let arr = res.data
						arr = JSON.parse(JSON.stringify(arr).replace(/code/g,'label'))
						this.ageList = arr
						this.ageShow = true
						
					}
				})
			},
			moneyConfirm(e){
				console.log(e)
				this.postPrice = e[0].value
			},
			//薪资列表
			getMonyList(){
				this.$Request.get('/app/dict/list', {
					type:'薪资'
				}).then(res => {
					if (res.code == 0) {
						let arr = res.data
						arr = JSON.parse(JSON.stringify(arr).replace(/code/g,'label'))
						this.monyList = arr
						this.monyShow = true
						
					}
				})
			},
			input(e) {
				// console.log('人数：', e)
				this.totalPrice = parseInt(this.price * e).toFixed(0)
				this.customizationPrice = parseInt(this.price * e).toFixed(0)
			},
			SexConfirm(e) { //选择性别
				this.postSex = e[0].label
			},
			//获取一级岗位
			getPost() {
				this.getClassifyList()
			},
			//获取求职岗位
			getClassifyList() {
				let data = {
					status: 1
				}
				this.$Request.get('/app/rule/selectRuleClassifyList', data).then(res => {
					if (res.code == 0) {
						var arr = []
						res.data.forEach((d, index) => {
							var data = {}
							data.label = d.ruleClassifyName
							data.value = d.ruleClassifyId
							data.price = d.accuratePrice//普通价格
							data.memberPrice = d.accurateMemberPrice//会员价格
							arr.push(data)
						})
						this.postlist = arr
						this.postShow = true
					}
				})
			},
			postConfirm(e) {
				this.postName = e[0].label
				this.ruleClassifyId = e[0].value
				this.postlist.map(item=>{
					if(item.value == this.ruleClassifyId){
						if (this.member == 0 || this.member == null ) { //普通用户
							this.price = item.price
							if(this.postPeopleNum){
								this.totalPrice = item.price * this.postPeopleNum
							}else{
								this.totalPrice = item.price 
							}
						} else{//会员
							this.price = item.memberPrice
							if(this.postPeopleNum){
								this.totalPrice = item.memberPrice * this.postPeopleNum
							}else{
								this.totalPrice = item.memberPrice
							}
						}
					}
				})
				this.getPostList()
			},
			getPostlist() {
				if(this.postName!=''){
					this.show = true
				}else{
					uni.showToast({
						title:'请选择岗位',
						icon:'none'
					})
				}
			},
			//获取专业
			getPostList() {
				let data = {
					ruleClassifyId: this.ruleClassifyId
				}
				this.$Request.post('/app/rule/selectRulePostList', data).then(res => {
					if (res.code == 0) {
						var arr = []
						res.data.forEach((d, index) => {
							var data = {}
							data.label = d.rulePostName
							data.value = d.rulePostId
							arr.push(data)
						})
						this.ErjiList = arr
					}
				})
			},
			postlistConfirm(e) {//11111111111111111111
				this.rulePostName = e[0].label
				this.rulePostId = e[0].value
				
			},
			save() {
				if (!this.postName) {
					uni.showToast({
						title: '请选择岗位',
						icon: 'none',
						duration: 1000
					})
					return
				}
				if (!this.rulePostName) {
					uni.showToast({
						title: '请选择专业',
						icon: 'none',
						duration: 1000
					})
					return
				}
				if (!this.postPrice) {
					uni.showToast({
						title: '请选择工资',
						icon: 'none',
						duration: 1000
					})
					return
				}
				if (!this.postPeopleNum) {
					uni.showToast({
						title: '请填写人数',
						icon: 'none',
						duration: 1000
					})
					return
				}
				if (!this.postSex) {
					uni.showToast({
						title: '请选择性别',
						icon: 'none',
						duration: 1000
					})
					return
				}
				if (!this.postAge) {
					uni.showToast({
						title: '请填写年龄',
						icon: 'none',
						duration: 1000
					})
					return
				}
				if (!this.postPrice) {
					uni.showToast({
						title: '请填写工资',
						icon: 'none',
						duration: 1000
					})
					return
				}
				if(this.postDetailsIndex){
					this.postDetailsList.splice(this.postDetailsIndex, 1)
				}
				if (this.classify == 1) {
					let data = {
						postName: this.postName, //岗位名称
						ruleClassifyId: this.ruleClassifyId,
						rulePostName: this.rulePostName, //岗位职称
						rulePostId: this.rulePostId,
						postPeopleNum: this.postPeopleNum, //岗位人数
						postSex: this.postSex, //性别
						postAge: this.postAge, //年龄段
						// postPrice: this.postPrice, //岗位工资
						// price:this.price,//发布价格
						offlinePrice: this.offlinePrice, //线下价格
						customizationPrice: this.customizationPrice, //保证金价格
					}
					this.postDetailsList.push(data)
					uni.setStorageSync('postDetailsList', this.postDetailsList)
					uni.navigateBack()
				} else if (this.classify == 2) {
					let data = {
						postName: this.postName, //岗位名称
						ruleClassifyId: this.ruleClassifyId,
						rulePostName: this.rulePostName, //岗位职称
						rulePostId: this.rulePostId,
						postPeopleNum: this.postPeopleNum, //岗位人数
						postSex: this.postSex, //性别
						postAge: this.postAge, //年龄段
						postPrice: this.postPrice, //岗位工资
						price: this.price, //发布价格
					}
					this.postDetailsList.push(data)
					uni.setStorageSync('postDetailsList', this.postDetailsList)
					uni.navigateBack()
				}

			}
		}
	}
</script>

<style lang="less">
	page {
		background: #F2F2F7;
	}

	.box {
		background: #FFFFFF;
		border-radius: 24upx;
		margin: 30upx;
		padding: 30upx;
	}

	.u-input__input {
		text-align: right !important;
	}

	.subbtn {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		background: #fff;
		border-radius: 10upx;
		height: 90upx;
		// padding: 30upx 0upx;
		color: #000;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 99;

	}

	.btn {
		background: #82A9FE;
		color: #FFFFFF;
		width: 30%;
		height: 90upx;
		line-height: 90upx;
		text-align: center;
	}
</style>
