hire-wx-houxuanren/pagesD/apply1.vue

<template>
	<view class="personal">
		<view class="">
			<text class="title">求职意向</text>
			<view class="titleb">不同的求职意向，会为您推荐不同的职位</view>
		</view>
		<view class="u-flex content u-row-between">
			<view class="biaoti">
				<view class="">
					<view class="fei" >付费</view>
					<text>北京</text>
					<text style="margin: 0 20rpx;">|</text>
					<text>新媒体运营</text>
				</view>
				<view class="money">
					<text>12-15K·</text>
					<text>行业不限</text>
				</view>
			</view>
			<u-icon name="arrow-right" color="#4C4C4C" size="24"></u-icon>
		</view>
		<view class="add" @click="toapply">
			+添加求职意向
		</view>
		<view class="bottom u-flex u-row-between">
			<text>求职状态</text>
			<view class="u-flex">
				<text>急于求职</text>
				<u-icon name="arrow-right" color="#4C4C4C" size="16"></u-icon>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		getAllArea
	} from "@/units/inquire.js"
	export default {
		data() {
			return {
				value: false,
				province: [], //省数据
				city: [], //市数据
				area: [], //区数据
				provinceid: "", //省数据
				cityid: "", //市数据
				areaid: "", //区数据
				indexs: [], //默认地区下标
				//选择器状态
				birthdayShow: false, //出生年月
				workShow: false, //工作时间
				cityShow: false, //户口所在地
				jobShow: false, //工作显示
				cityList: [], //数据地址
				cityids: [], //数据地址
				joblist: []
			}
		},
		onLoad() {
			this.AllArea()
		},
		methods: {
			change() {

			},
			toapply(){
				uni.navigateTo({
					url:"/pagesD/apply"
				})
			},
			//所有地区
			AllArea() {
				getAllArea().then((res) => {
					console.log(res);
					this.province = res.data.map(t => {
						return {
							name: t.name,
							id: t.id
						}
					})
					console.log("aaa", this.province);
					this.city = res.data.map(t => t.children.map(v => {
						return {
							name: v.name,
							id: v.id
						}
					}))
					this.area = res.data.map(t => t.children.map(v => v.children.map(i => {
						return {
							name: i.name,
							id: i.id
						}
					})))
					//默认显示数据
					// this.cityList = [
					// 	this.province.map(res => res.name),
					// 	this.city[0].map(res => res.name),
					// 	this.area[0][0].map(res => res.name)
					// ]
					let a = []
					let b = []
					let c = []
					this.province.map(res => {
						a.push({
							name: res.name,
							id: res.id,
						})
					})
					this.city[0].map(res => {
						b.push({
							name: res.name,
							id: res.id,
						})
					})
					this.area[0][0].map(res => {
						c.push({
							name: res.name,
							id: res.id,
						})
					})

					this.cityList = [a, b, c]
					// if (this.province && this.city && this.area) {
					// 	//省索引
					// 	let pIdx = this.province.findIndex(v => v.name == this.province);
					// 	//根据省索引设置默认市数据
					// 	this.columns[1] = this.city[pIdx].map(res => res.name)
					// 	//市索引
					// 	let cIdx = this.city[pIdx].findIndex(v => v.name == this.city);
					// 	//根据市索引设置默认区数据
					// 	this.columns[2] = this.area[pIdx][cIdx].map(res => res.name)
					// 	//区索引
					// 	let aIdx = this.area[pIdx][cIdx].findIndex(v => v.name == this.area);
					// 	this.indexs = [pIdx, cIdx, aIdx];
					// 	// console.log(pIdx, cIdx, aIdx);
					// 	console.log(this.indexs);
					// }
					// if (this.addressData.province && this.addressData.city && this.addressData.area) {
					// 	//省索引
					// 	let pIdx = this.province.findIndex(v => v.name == this.addressData.province);
					// 	//根据省索引设置默认市数据
					// 	this.columns[1] = this.city[pIdx].map(res => res.name)
					// 	//市索引
					// 	let cIdx = this.city[pIdx].findIndex(v => v.name == this.addressData.city);
					// 	//根据市索引设置默认区数据
					// 	this.columns[2] = this.area[pIdx][cIdx].map(res => res.name)
					// 	//区索引
					// 	let aIdx = this.area[pIdx][cIdx].findIndex(v => v.name == this.addressData.area);
					// 	this.indexs = [pIdx, cIdx, aIdx];
					// 	// console.log(pIdx, cIdx, aIdx);
					// 	console.log(this.indexs);
					// }
				})
			},
			changeHandler(e) {
				const {
					columnIndex, //当前改变值的列下标
					value,
					values, // values为当前变化列的数组内容
					indexs, //当前地区值下标
					picker = this.$refs.uPicker
				} = e
				//columnIndex代表第几列，意思是下标为0的列发生变化

				if (columnIndex === 0) {
					picker.setColumnValues(1, this.city[indexs[0]].map(v => {
						return {
							name: v.name,
							id: v.id
						}
					}))
					picker.setColumnValues(2, this.area[indexs[0]][0].map(v => {
						return {
							name: v.name,
							id: v.id
						}
					}))
				}
				if (columnIndex === 1) {
					picker.setColumnValues(2, this.area[indexs[0]][indexs[1]].map(v => {
						return {
							name: v.name,
							id: v.id
						}
					}))
				}
			},
			//点击显示时间选择器
			birthdayBtn() {
				this.birthdayShow = true
				//new Date(this.endDate).getTime()为你需要在选择器上显示的时间戳
				this.$refs.picker.innerValue = new Date(946656000000).getTime()
			},
			//出生日期选择器
			async birthdayConfirm(e) {
				const timeFormat = uni.$u.timeFormat;
				let timeValue = await timeFormat(e.value, 'yyyy-mm-dd');
				this.from.birthday = timeValue;
				this.birthdayShow = false
			},
			//户口地址
			cityconfirm(e) {
				let a = e.value[0].name + e.value[1].name + e.value[2].name
				let ids = String(e.value[0].id) + String(e.value[1].id) + String(e.value[2].id)
				this.from.domicile_city_id = e.value[1].id
				this.from.domicile_province_id = e.value[0].id
				// this.city1 = e.value.join("")
				this.city1 = a
				this.cityShow = false
			},
		}
	}
</script>


<style lang="scss" scoped>
	.content {
		padding: 24rpx 20rpx;
		background: #F6F6F6;
		border-radius: 16rpx;
		box-sizing: border-box;
		margin-top: 32rpx;
		position: relative;
	}
	
	.fei{
		background: #FF5335;
		border-radius: 16rpx 0rpx 16rpx 0rpx;
		font-size: 22rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		position: absolute;
		left: 0;
		top: 0;
	}
	.add {
		background: rgba(12, 102, 194, 0.05);
		border-radius: 12rpx;
		border: 2rpx dashed #0C66C2;
		text-align: center;
		height: 108rpx;
		line-height: 108rpx;
		margin-top: 44rpx;
		font-size: 32rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #0C66C2;
	}

	.biaoti {
		font-size: 32rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #222222;
		
	}

	.money {
		font-size: 26rpx;
		font-family: SFPro-Regular, SFPro;
		font-weight: 400;
		color: #888888;
		margin-top: 16rpx;
	}

	.bottom {
		height: 144rpx;
		border-bottom: 2rpx solid #F0F0F0;
	}

	//个人信息
	.personal {
		width: 750rpx;
		background: #FFFFFF;
		border-radius: 28rpx 28rpx 0rpx 0rpx;
		margin-top: -40rpx;
		position: relative;
		z-index: 99;
		padding: 40rpx 32rpx 0;
		margin-bottom: 60rpx;
		box-sizing: border-box;

		.title {
			font-size: 48rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #222222;
		}

		.titleb {
			font-size: 26rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #777777;
			margin-top: 20rpx;
		}

		.body-input {
			height: 150rpx;
			border-bottom: 2rpx solid #F4F4F4;

			.input-title {
				font-size: 26rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #888888;
				margin-top: 30rpx;
				box-sizing: border-box;
			}

			.input-style {
				font-size: 32rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #CACACA;
			}
		}

		.button {
			width: 686rpx;
			height: 88rpx !important;
			background: #0C66C2;
			border-radius: 12rpx;
			font-size: 32rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 88rpx;
			margin: 54rpx 0 0rpx 0;
			display: flex;
			justify-content: center;
		}
	}
</style>