YZProjectCloud/yanzhu-ui-app/pages/workNext/index3.vue

<template>
	<view class="box">
		<navbar titlenav=""></navbar>
		<view>
			<view>
				<view style="font-size: 18px;font-weight: 600;display: flex;justify-content: space-between">
					<view class="">
						<view class="">
							发布兼职
						</view>
						<view class="">
							马上获得优秀人才
						</view>
					</view>
					<view class="" style="font-size: 16px;font-weight: 500;" @click="popupShow=true">
						跳过
					</view>
				</view>
				<view class="" style="line-height: 80rpx;">
					信息安全保护中，请放心填写
				</view>
			</view>
			<view class="" style="margin-top: 40rpx;">
				<u--form labelPosition="top" labelWidth="100" :model="formData" :rules="rules" ref="uForm">
					<u-form-item label="岗位名称" prop="userInfo.name" borderBottom>
						<u--input v-model="formData.name" placeholder="请输入岗位名称"></u--input>
					</u-form-item>
					<u-form-item label="工作年限" borderBottom @click="show = true;" labelPosition="left">
						<!-- 	<u--input v-model="formData.old" readonly disabledColor="#ffffff" placeholder="请选择"
							border="none"></u--input> -->
						{{formData.old?formData.old:`请选择`}}
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="最高学历" borderBottom @click="show2 = true;" labelPosition="left">
						<!-- <u--input v-model="formData.degree" readonly disabledColor="#ffffff" placeholder="请选择学历"
							border="none"></u--input> -->
						{{formData.degree?formData.degree:`请选择`}}
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="任务报酬" prop="userInfo.name" borderBottom>
						<view class="" style="width: 100%;">
							<u--input v-model="formData.name" type="number" placeholder="请输入"></u--input>
							<view style="display: flex;justify-content: space-between">
								<view v-for="(item, index) in radios" :key="index"
									style="display: block;margin-top: 15rpx;">
									<u-tag :text="item.lable" :plain="!item.checked" type="warning" :name="index"
										@click="radioClick">
									</u-tag>
								</view>
							</view>
						</view>
					</u-form-item>
					<u-form-item label="工作地点" prop="userInfo.name" borderBottom>
						<u--input v-model="formData.name" placeholder="请输入"></u--input>
					</u-form-item>
					<u-form-item label="招聘要求" prop="userInfo.name" borderBottom>
						<u--textarea v-model="formData.value" placeholder="请输入内容"></u--textarea>
					</u-form-item>
					<u-form-item label="技能标签" prop="userInfo.name">
						<u--input v-model="formData.name" readonly placeholder="请选择(可多选)"></u--input>
					</u-form-item>
				</u--form>
			</view>
			<view class="wada" style="height: 300rpx;">

			</view>
		</view>
		<view style="position: fixed;bottom: 0;left: 0;width: 100%;padding: 40rpx;">
			<!-- <view class="" style="margin-bottom: 40rpx;">
				<u-button text="上一步" type="success" @click="back()" shape="circle"></u-button>
			</view> -->
			<u-button text="发布职位" type="success" @click="toNext('/pages_loader/pages/index')" shape="circle"></u-button>
		</view>
		<u-picker :show="show" :columns="columns" @confirm="confirm" @cancel="show = false"></u-picker>
		<u-picker :show="show2" :columns="columns2" @confirm="confirm2" @cancel="show2 = false"></u-picker>
		<u-popup :show="popupShow" mode="center" @close="close" @open="open">
			<view class="popupbox">
				<text>发布信息更方便为您匹配人才，您确定要跳过吗？</text>
				<view style="width: 100%;padding: 20rpx;">
					<u-button text="继续填写" type="success" @click="popupShow=false" shape="circle"></u-button>
				</view>
				<view class="" style="text-align: center;" @click="toNext('/pages_loader/pages/index')">跳过</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				popupShow:false,
				fileListcardImg: [],
				fileListcardImgB: [],
				formData: {
					time: null,
					name: null,
					old: null,
					degree: null,
					value: null,
				},
				show: false,
				columns: [
					['3~5年', '5年以上']
				],
				show2: false,
				columns2: [
					['硕士', '本科', '大专', '高中', '初中']
				],
				rules: {
					'name': {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
				},
				radios: [{
						lable: '日结',
						checked: true
					},
					{
						lable: '周结',
						checked: false
					},
					{
						lable: '月结',
						checked: false
					}
				],
			};
		},
		onLoad() {

		},
		methods: {
			open() {
				// console.log('open');
			},
			close() {
				this.popupShow = false
				// console.log('close');
			},

			//工作年限
			confirm(e) {
				this.formData.old = e.value[0]
				this.show = false
			},
			confirm2(e) {
				this.formData.degree = e.value[0]
				this.show2 = false
			},
			// 企业规模
			radioClick(name) {
				this.radios.map((item, index) => {
					item.checked = index === name ? true : false
				})
			},
			back() {
				uni.navigateBack()
			},
			toNext(url) {
				uni.reLaunch({
					url: url
				})
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},

		}
	}
</script>

<style lang="scss" scoped>
	.box {
		margin: 40rpx;
		// height: 100vh;
	}
	.popupbox{
		padding: 40rpx;
		width: 500rpx;
	}
	.flexbetween {
		display: flex;
		justify-content: space-between;
	}
</style>