yizhizan-h5/package/jobIntention/completeMsg.vue

<template>
	<view class="company">
		<nav-bar title="完善信息" color="#000"></nav-bar>
		<view class="company-content">
			<view class="company-title">完善你的招聘名片</view>
			<view class="company-desc">求职者更愿意主动联系名片信息完整的HR</view>
			<!-- 头像上传区域 -->
			<view class="form-label">头像</view>
			<view class="avatar-section">
				<view class="avatar-upload" @click="chooseAvatar">
					<view class="avatar-preview">
						<image v-if="avatar" :src="avatar" class="avatar-image" mode="aspectFill"></image>
						<image v-else src="@/static/images/jobApplicant/touxiang.svg" mode="scaleToFill"
							class="user-img" />
					</view>
					<view class="upload-view">上传头像</view>
				</view>
			</view>
			<!-- 姓名 -->
			<view class="form-item">
				<view class="form-label">填写职务</view>
				<u-input placeholder="真实的职务，更能赢得牛人的信任" v-model="name" :border="false" class="form-input"></u-input>
			</view>
			<view class="form-item">
				<view class="form-label">求职者视角中的效果</view>
				<view class="form-border" v-for="(item, inx)  in userpost" :key="inx">
					<view class="form-border-top">
						<view class="form-border-title">{{item.ruleClassifyName}}</view>
						<view class="form-border-money">{{item.salaryRange}}</view>
					</view>
					<view class="form-border-desc">{{item.companyName}}{{item.companyPeople}}人</view>
					<view class="form-border-img-name">
						<view class="people-img">
							<image v-if="item.hr!=null && item.hr.hrImg" :src="item.hr.hrImg" class="avatar-image"
								mode="aspectFill"></image>
							<image v-else src="@/static/images/jobApplicant/touxiang.svg" mode="scaleToFill"
								class="user-img" />
						</view>
						<view class="people-name">{{item.hr.hrPosition}} 招聘者</view>
					</view>
				</view>
			</view>
			<view class="bottom-btn" @click="submithr">开始招聘</view>
		</view>
	</view>
</template>
<script>
	import navBar from "@/components/nav-bar/index.vue";
	export default {
		data() {
			return {
				avatar: "",
				name: "",
				isok: false,
				userpost: {}
			};
		},
		components: {
			navBar,
		},
		onShow() {
			this.getmypost()
		},
		methods: {
			goUploadImg() {
				uni.navigateTo({
					url: "/package/jobIntention/companyImg"
				});
			},
			goCompanyReview() {
				if (this.isok) {
					uni.navigateTo({
						url: "/package/jobIntention/companyReview",
					});
				}
				return uni.showToast({
					title: "请补全资料",
					icon: "none"
				});

			},
			// 选择头像
			chooseAvatar() {
				var that = this
				uni.chooseImage({
					count: 1,
					sizeType: ["compressed"],
					sourceType: ["album", "camera"],
					success: (res) => {
						that.$queue.uploadFile(res.tempFilePaths[0], function(path) {
							console.log("上传返回？：", path)
							if (path){
								that.avatar = path;
							}
								
						})

					},
				});
			},
			//提交hr 信息

			submithr() {
				// 验证必填项
				if (!this.avatar) {
					return uni.showToast({
						title: "请上传头像",
						icon: "none"
					});
				}
				if (!this.name) {
					return uni.showToast({
						title: "请输入职务",
						icon: "none"
					});
				}
				// 构造提交数据
				const data = {
					hrImg: this.avatar, //头像
					hrPosition: this.name, //职位
				};

				// 调用接口提交
				uni.showLoading({
					title: "提交中..."
				});
				this.$Request.postJson("/app/HrFirst/addHr", data)
					.then((res) => {
						uni.hideLoading();
						if (res.code === 0) {
							this.isok = true
							uni.showToast({
								title: "提交成功，请开始招聘吧。",
								icon: "success"
							});
							// uni.navigateTo({
							// 	url: "/package/jobIntention/companyReview",
							// });
							uni.switchTab({
								url:'/pages/index/index'
							})
							
						} else {
							uni.showToast({
								title: res.msg || "提交失败",
								icon: "none"
							});
						}
					})
					.catch((err) => {
						uni.hideLoading();
						console.error("提交失败：", err);
						uni.showToast({
							title: "网络异常",
							icon: "none"
						});
					});
			
		},

		//获取我发布的岗位列表
		getmypost() {
			this.$Request.get("/app/postPush/getMyPostPush",{status:""})
				.then((res) => {
					if (res.code != 0) {
						uni.showToast({
							title: res.msg || "查询失败",
							icon: "none"
						});
						return;
					}
					this.userpost = res.data.records || {};
					this.name=this.userpost[0].hr.hrPosition || ""
					this.avatar=this.userpost[0].hr.hrImg || ""
					console.log("查询我的岗位列表状态", res)
				})
				.catch((err) => {
					console.error("查询失败：", err);
					uni.showToast({
						title: "网络异常",
						icon: "none"
					});
				});
		}
	},
	};
</script>
<style scoped lang="scss">
	.company {
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		display: flex;
		flex-direction: column;
		font-family: DM Sans;

		.company-content {
			flex: 1;
			padding: 40rpx;
			box-sizing: border-box;
			overflow: hidden;
			overflow-y: auto;

			.company-title {
				color: #333;
				font-size: 40rpx;
				font-weight: 600;
				margin-bottom: 20rpx;
			}

			.form-label {
				color: #1f2c37;
				font-family: DM Sans;
				font-size: 28rpx;
				font-weight: 500;
				line-height: 44rpx;
				padding-top: 30rpx;
				padding-bottom: 27rpx;
				box-sizing: border-box;
			}

			.avatar-section {
				display: flex;
			}

			.avatar-upload {
				display: flex;
				align-items: center;
			}

			.avatar-preview {
				width: 48rpx;
				height: 48rpx;
				border-radius: 50%;
				display: flex;
				align-items: center;
				justify-content: center;
				margin-right: 20rpx;
			}

			.avatar-image {
				width: 100%;
				height: 100%;
				border-radius: 50%;
			}

			.upload-view {
				color: #016bf6;
				font-family: DM Sans;
				font-size: 20rpx;
				font-weight: 500;
				line-height: 48rpx;
			}

			.form-item {
				padding-bottom: 24rpx;
				box-sizing: border-box;

				.job-txt {
					color: #016bf6;
					font-family: DM Sans;
					font-size: 20rpx;
					margin-left: 16rpx;
				}

				.form-border {
					box-sizing: border-box;
					border: 1rpx solid rgba(227, 231, 236, 1);
					border-radius: 12rpx;
					background: rgba(253, 253, 253, 1);
					padding: 36rpx;
					box-sizing: border-box;

					.form-border-top {
						display: flex;
						justify-content: space-between;
						align-items: center;

						.form-border-title {
							color: rgba(23, 23, 37, 1);
							font-family: DM Sans;
							font-size: 32rpx;
							font-weight: 700;
							line-height: 48rpx;
						}

						.form-border-money {
							color: #016bf6;
							font-family: DM Sans;
							font-size: 24rpx;
							font-weight: 700;
							line-height: 40rpx;
						}
					}

					.form-border-desc {
						color: rgba(156, 164, 171, 1);
						font-family: DM Sans;
						font-size: 24rpx;
						font-weight: 400;
						line-height: 40rpx;
						padding: 6rpx 0;
						box-sizing: border-box;
					}

					.form-border-img-name {
						display: flex;
						align-items: center;
						gap: 8rpx;

						.people-img {
							image {
								width: 40rpx;
								height: 40rpx;
							}
						}

						.people-name {
							color: rgba(156, 164, 171, 1);
							font-family: DM Sans;
							font-size: 16rpx;
							font-weight: 400;
						}
					}
				}
			}

			.form-item:last-child {
				border-bottom: none;
			}

			.form-label {
				color: #1f2c37;
				font-family: DM Sans;
				font-size: 28rpx;
				font-weight: 500;
				line-height: 44rpx;
				padding-top: 30rpx;
				padding-bottom: 27rpx;
				box-sizing: border-box;
			}

			.form-input {
				flex: 1;
				box-sizing: border-box;
				border: 2rpx solid #9ea1a8;
				border-radius: 100rpx;
				background: rgba(255, 255, 255, 1);
				padding: 0rpx 24rpx !important;
			}
		}

		.bottom-btn {
			border-radius: 999px;
			background: rgba(255, 102, 0, 1);
			display: flex;
			justify-content: center;
			align-items: center;
			color: rgba(255, 255, 255, 1);
			font-family: DM Sans;
			font-size: 32rpx;
			font-weight: 400;
			line-height: 48rpx;
			padding: 16rpx 32rpx;
			box-sizing: border-box;
		}
	}

	::v-deep .u-input {
		text-align: left !important;
	}
</style>