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="handlUploadFile">附件简历一键识别</view>
			</template>
		</view>
		
		<view class="load-container" v-if="showLoadCard">
			<view class="video-container">
				<view class="title">简历解析中</view>
				<video src="https://bossweb.edccc.cn/video_260307_151616.mp4" :muted="true" :autoplay="true" :controls="false" :loop="true" object-fit="fill"></video>
			</view>
		</view>
		
		<!-- <load-card :progress="progress" v-if="showLoadCard"></load-card> -->
	</view>
</template>

<script>
	// #ifdef APP-PLUS
	import { chooseFileFromModule } from '@/uni_modules/sr-file-choose'
	// #endif
	import loadCard from '@/components/load-card.vue'
	import config from '@/common/config'
	
	export default {
		components: {
			loadCard
		},
		data() {
			return {
				scene: 0, // 0正常进入  1邀请进入
				progress: 0,
				showLoadCard: false,
				timer: null
			};
		},
		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.uploadFile(file)
					}
				})
				// #endif
				// #ifdef H5
				uni.chooseFile({
					count: 1,
					success: res => {
						this.uploadFile({
							path: res.tempFilePaths[0],
							name: 'file'
						})
					}
				})
				// #endif
			},
			// 上传文件
			uploadFile(file) {
				this.$queue.uploadFiles({
					url: '/app/resumes/aiResumesUpload',
					path: file.path,
					name: 'file'
				}, (res) => {
					if (res && res.code === 0) {
						const id = res.data?.id
						const resumesAttachmentId = res.data?.resumesAttachmentId || null
						if (id) {
							this.getAiResumesAnalysis(id, resumesAttachmentId)
						}
					} else {
						this.$queue.showToast(res ? res.msg : '文件上传失败')
					}
				})
			},
			// 获取简历解析数据
			getAiResumesAnalysis(fileId, resumesAttachmentId) {
				// if (this.timer) {
				// 	clearInterval(this.timer)
				// 	this.progress = 0
				// }
				
				this.showLoadCard = true
				// this.timer = setInterval(() => {
				// 	if (this.progress < 99) {
				// 		this.progress++
				// 	}
				// }, 900)
				uni.request({
					url: config.APIHOST + '/app/resumes/aiResumesAnalysis',
					header: {
						'content-type': 'application/x-www-form-urlencoded', // 模拟 form-data
						token: uni.getStorageSync('token'),
					},
					method: 'post',
					data: {
						workflowId: '7594327567932309547',
						fileId,
						resumesAttachmentId
					},
					timeout: 180000,
					success: (res) => {
						this.stopLoadStatus()
						
						if (res.data?.code == 0) {
							const data = res.data.data.data
							this.$queue.setData('AI_Resume_Data', data.output)
							
							uni.reLaunch({
								url: `/pages/my/onlineResume?fileId=${fileId}`
							})
						}
					},
					fail: (err) => {
						this.$queue.showToast('解析失败，请稍后重试')
						this.stopLoadStatus()
					}
				})
			},
			
			stopLoadStatus() {
				this.showLoadCard = false
				// this.progress = 0
				// clearInterval(this.timer)
			}
		}
	}
</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, 0.5);
		.video-container {
			width: 600rpx;
			// height: 600rpx;
			background: #fff;
			border-radius: 20rpx;
			padding: 40rpx;
			.title {
				font-size: 36rpx;
				font-weight: bold;
				text-align: center;
				line-height: 1;
				padding-bottom: 40rpx;
			}
		}
		video {
			display: block;
			width: 520rpx;
			height: 320rpx;
			margin: 0 auto;
		}
	}
</style>