yizhizan-h5/pages/public/improvePrompt.vue

<template>
	<view class="container">
		<view>
			<image src="/static/images/slogan.png" class="slogan"></image>
			
			<view class="content">
				<image src="/static/images/logo-long.png" class="logo"></image>
				<view class="tip">温馨提示</view>
				<view class="tip-text">
					<template v-if="scene == 1">
						<view class="text">如果您的简历完善度不足80%</view>
						<view class="text">我们将无法进行推荐</view>
						<view class="text">为更好地求职机会，请充分填写简历</view>						
					</template>
					<template v-else>
						<view class="text">如果您的求职期望至少有一条，</view>
						<view class="text">且完善总分数大于等于60分</view>
						<view class="text">我们将进行简历推荐，请充分填写简历</view>		
					</template>
				</view>
			</view>
		</view>
		<view class="buttons">
			<template v-if="scene == 1">
				<view class="white-btn" @click="toOnlineResume">完善在线简历</view>
			</template>
			<template v-else>
				<view class="link-btn" @click="handleSubmit">手动完善简历</view>
				<view class="white-btn" @click="showTipPopup = true">附件简历一键识别</view>
			</template>
		</view>
		
		<view class="load-container" v-if="showLoadCard">
			<image src="@/static/loading.gif" class="loading-image" mode="aspectFit"></image>
		</view>
		
		<!-- 简历解析确认弹窗 -->
		<view class="popup-container" v-if="showTipPopup" @click="showTipPopup = false">
			<view class="popup-content">
				<view class="popup-title">温馨提示</view>
				<view class="tip-container">
					<view>1-2页简历识别预计耗时1分钟；</view>
					<view>3-5页简历识别预计耗时1-3分钟；</view>
					<view>5页简历以上耗时将会超过5分；</view>
					<view>请您耐心等待！</view>
				</view>
				<image src="@/static/upload-tip.png" class="upload-tip"></image>
				<view class="button-primary" @click.stop="handlUploadFile">知道了</view>
			</view>
		</view>
	</view>
</template>

<script>
	// #ifdef APP-PLUS
	import { chooseFileFromModule } from '@/uni_modules/sr-file-choose'
	// #endif
	import config from '@/common/config'
	
	export default {
		data() {
			return {
				scene: 0, // 0正常进入  1邀请进入
				progress: 0,
				showLoadCard: false,
				timer: null,
				showTipPopup: false
			};
		},
		onLoad(options) {
			if (options.scene) {
				this.scene = options.scene
			}
		},
		// onUnload() {
		// 	if (this.timer) {
		// 		clearInterval(this.timer)
		// 	}
		// },
		methods: {
			toOnlineResume() {
				uni.navigateTo({
					url: `/pages/my/onlineResume?scene=${this.scene}`
				})
			},
			// 手动完善
			handleSubmit() {
				uni.navigateTo({
					url: `/pages/my/onlineResume?scene=${this.scene}`
				})
			},
			// 附件一键识别
			handlUploadFile() {
				// #ifdef APP-PLUS
				chooseFileFromModule({
					complete: res => {
						let path = res.path
						let name = res.name
						let fileType = ''
						// 如果没有name，默认为：截取最后一个/之后的内容
						if (!name) {
							let lastIndex = path.lastIndexOf('/');
							if (lastIndex !== -1) {
								name = path.substring(lastIndex + 1);
							} else {
								name = Math.random().toString(36).substr(2) + Date.now();
							}
						}
						// 使用 lastIndexOf 方法找到最后一个 . 的位置
						let lastDotIndex = name.lastIndexOf('.');
						if (lastDotIndex !== -1) {
							fileType = name.substring(lastDotIndex + 1);
						} else {
							console.log('文件路径中没有 .');
						}
						let file = {
							size: res.size,
							path,
							fileType,
							name
						}
						this.uploadAndAnalysisResumes(file)
					}
				})
				// #endif
				// #ifdef H5
				uni.chooseFile({
					count: 1,
					success: res => {
						this.uploadAndAnalysisResumes({
							path: res.tempFilePaths[0],
							name: 'file'
						})
					}
				})
				// #endif
			},
			// 上传解析简历
			uploadAndAnalysisResumes(file) {
				this.showTipPopup = false
				this.showLoadCard = true
				this.$queue.uploadFiles({
					url: '/app/resumes/resumesAnalysisPlus',
					path: file.path,
					name: 'file',
					timeout: 480000,
					hideUploadTask: true
				}, (res) => {
					if (!res) {
						this.showModal('解析失败，请稍后重试')
						this.stopLoadStatus()
						return
					}
					if (res.code == 0 && res.data) {
						this.$queue.setData('AI_Resume_Data', res.data)
						
						uni.reLaunch({
							url: '/pages/my/onlineResume?fileId=AI_Resume_Data'
						})
					} else {
						this.showModal(res?.msg || '解析失败，请稍后重试')
					}
					
					this.stopLoadStatus()
				})
			},
			
			stopLoadStatus() {
				this.showLoadCard = false
				// this.progress = 0
				// clearInterval(this.timer)
			},
			
			showModal(content) {
				uni.showModal({
					title: '提示',
					content,
					showCancel: false
				})
			}
		}
	}
</script>

<style lang="scss">
	.container {
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		min-height: 100vh;
		background-color: #016bf6;
		background-image: url('/static/images/bg1.png');
		background-size: 100%;
		background-repeat: repeat;
		.slogan {
			display: block;
			width: 634rpx;
			height: 358rpx;
			margin: 80rpx auto;
		}
		.content {
			width: 654rpx;
			padding: 64rpx;
			background-color: #fff;
			border-radius: 64rpx;
			margin: 0 auto;
			text-align: center;
			.logo {
				display: block;
				width: 166rpx;
				height: 46rpx;
				margin: 0 auto;
			}
			.tip {
				font-size: 40rpx;
				font-weight: bold;
				line-height: 64rpx;
				color: #016bf6;
				margin: 48rpx auto 15rpx;
			}
			.text {
				font-size: 32rpx;
				line-height: 50rpx;
				color: #999;
			}
		}
		
		.buttons {
			margin-bottom: 40rpx;
			.white-btn {
				width: 600rpx;
				height: 88rpx;
				font-size: 32rpx;
				line-height: 88rpx;
				text-align: center;
				color: #016bf6;
				background-color: #fff;
				border-radius: 88rpx;
				margin: 32rpx auto 0;
			}
			.link-btn {
				text-align: center;
				color: #fff;
			}
		}
	}
	
	.load-container {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		background: rgba(0, 0, 0, 1);
		.loading-image {
			width: 100%;
			height: 100%;
		}
	}
	
	// 简历解析提示弹窗
	.popup-container {
		position: fixed;
		left: 0;
		top: 0;
		width: 100vw;
		height: 100vh;
		display: flex;
		align-items: center;
		justify-content: center;
		background: rgba(0, 0, 0, 0.4);
		.popup-content {
			padding: 40rpx 0;
			border-radius: 20rpx;
			background: #fff;
			.popup-title {
				font-size: 32rpx;
				font-weight: 600;
				line-height: 56rpx;
				color: rgba(16, 24, 40, 1);
				text-align: center;
				margin-bottom: 20rpx;
			}
			.tip-container {
				padding: 0 130rpx;
				color: rgba(96, 96, 96, 1);
				font-size: 28rpx;
				line-height: 36rpx;
			}
			.upload-tip {
				display: block;
				width: 654rpx;
				height: 802rpx;
			}
			.button-primary {
				height: 80rpx;
				border-radius: 80rpx;
				text-align: center;
				color: #fff;
				font-size: 32rpx;
				line-height: 80rpx;
				margin: 0 40rpx;
				background: linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1));
			}
		}
	}
</style>