yizhizan-h5/pages/my/onlineResume.vue

<template>
	<view class="online-resume" :class="{ pb : scene == 1 }">
		<navBar title="在线简历" />
		<view class="page-content">
			<!-- 用户信息区域 -->
			<view class="user-profile">
				<view class="avatar-container" @click="goToBasicInfo">
					<image
						:src="detail.userEntity && detail.userEntity.avatar ? detail.userEntity.avatar : '../../static/images/logo.jpg'"
						class="user-avatar" mode="aspectFill"></image>
				</view>
				<view class="user-name">{{ detail.userEntity && detail.userEntity.userName || '匿名' }}</view>
				<view class="user-info">
					<text v-if="detail.workExpTimes">{{ detail.workExpTimes }}经验</text>
					<text v-if="detail.userEntity && detail.userEntity.age">· {{ detail.userEntity.age }}岁</text>
					<text v-if="detail.degree">· {{ detail.degree }}</text>
					<text v-if="detail.userEntity && detail.userEntity.sex">· {{ detail.userEntity && detail.userEntity.sex == 1 ? '男' : '女' }}</text>
				</view>
				<view class="contact-info">
					<view class="contact-item">
						<image src="../../static/images/index/phone.svg" style="width: 24rpx;height: 24rpx;" mode="">
						</image>
						<text class="contact-text">{{ detail.resumesPhone }}</text>
					</view>
					<view class="contact-item">
						<image src="../../static/images/index/wx.svg" style="width: 24rpx;height: 24rpx;" mode="">
						</image>
						<text class="contact-text">{{ detail.userEntity && detail.userEntity.weChatNum }}</text>
					</view>
				</view>
			</view>

			<!-- 内容区域 -->
			<view class="content-section">
				<!-- 个人信息 -->
				<view class="common-section section-item">
					<view class="section-header">
						<view class="section-title">个人信息</view>

						<!-- 右侧编辑按钮 -->
						<view @click="toUserInfo">
							<image class="edit-icon"
								src="../../static/images/index/Combined-Shape.svg"
								style="width: 48rpx; height: 48rpx;"
								mode=""
							/>
						</view>
					</view>
					<view class="section-content">
						<view class="availability">
							<text class="status-text">{{ detail.resumeList && detail.resumeList.resumesStatus ? statusList[detail.resumeList.resumesStatus].text : statusList[0].text }}</text>
						</view>
						<view class="content">
							<view class="title">我的优势</view>
							<view class="content-text">
								<text>{{ detail.resumeList && detail.resumeList.adv }}</text>
							</view>
						</view>
						<view class="content">
							<view class="title">我的技能</view>
							<view class="badge-content">
								<template v-if="detail.skills && detail.skills.length">
									<view class="badge" v-for="(skill, index) in detail.skills" :key="index">{{ skill.skillName }}</view>
								</template>
								<view class="badge" v-else>请选择职业技能标签</view>
							</view>
						</view>
					</view>
				</view>

				<!-- 个人优势 -->
				<!-- <view class="common-section section-item">
				    <view class="section-header">
				      <view class="section-title">个人优势</view>
				
				      <view @click="toggleEdit">
				        <template v-if="isEditing">
				          <text class="save-btn">保存</text>
				        </template>
				        <template v-else>
				          <image class="edit-icon"
				            src="../../static/images/index/Combined-Shape.svg"
				            style="width: 48rpx; height: 48rpx;"
				            mode=""
				          />
				        </template>
				      </view>
				    </view>
				
				    <view class="advantage-content">
				      <textarea
				        ref="advInput"
				        :disabled="!isEditing"
				        auto-height
				        placeholder="请输入个人优势"
				        v-model="detail.resumeList && detail.resumeList.adv"
				        @blur="setResume"
				      ></textarea>
				    </view>
				</view> -->
				
				<!-- 是否对外展示简历 -->
				<view class="common-section flex justify-between align-center">
					<view class="text-tip-box">
						<view class="title">是否对外展示简历</view>
						<view class="tip">求职期望至少有1条且完善总分数高于60分，我们将进行简历推荐，请充分填写简历</view>
					</view>
					<async-switch v-model="showChecked" :async-change="updateIsRecommend"></async-switch>
				</view>

				<!-- 求职期望卡片 -->
				<view class="common-section expectation-card">
					<view class="card-header">
						<view class="header-left">
							<image src="../../static/images/index/lingdai.svg" class="header-icon" />
							<text class="header-title">求职期望</text>
						</view>
						<text class="progress-text"><text class="progress-text-light">{{ detail.intentions && detail.intentions.length }}</text>/3
						</text>
					</view>

					<view class="job-list">
						<view @longpress="commonDelete(item.intentionId, 'intentions')"
							@click="addExpectation(item.intentionId)" class="job-item"
							v-for="(item, index) in detail.intentions">
							<view class="job-info">
								<view>
									<text class="job-title">{{ item.ruleClassifyName }}<text class="sub-title">{{ item.citys }}</text></text>
									<view @click.stop="goToPreferenceSetting(item)">
										<view class="preference-btn">
											<text>设置跨境标签</text>
										</view>
										<u-icon name="arrow-right" color="rgba(29, 33, 41, 1)" size="28"></u-icon>
									</view>
								</view>
								<text class="job-details">{{ item.salaryRange }}・{{ item.industry || '不限' }}</text>
							</view>
						</view>
					</view>

					<view class="add-expectation-btn" v-if="showAddJobBtn" @click="addExpectation('')">
						<text>添加求职期望</text>
					</view>
				</view>

				<!-- 工作经历 -->
				<view class="common-section work-experience-section">
					<view class="section-header">
						<view class="section-title">工作经历</view>
						<view class="edit-icon" @click="goToWorkExperience('')">
							<image src="../../static/images/index/Combined-Shape.svg"
								style="width: 48rpx;height: 48rpx;" mode=""></image>
						</view>
					</view>

					<view class="experience-list">
						<template v-if="showExperienceData.length">
							<view class="experience-item" v-for="item in showExperienceData" @click.stop="goToWorkExperience(item.workExpId)">
								<view class="company-title flex justify-between">
									<view>
										<text class="company-name">{{ item.companyName }}</text>
										<text class="company-type"> • {{ setCompanyType(item.type) }}</text>										
									</view>
									<text style="width: 60px; text-align: right;">编辑</text>
								</view>
								
								<view class="experience-content">
									<view class="experience-box" v-for="it in item.workExpDetails">
										<view class="job-header flex justify-between align-center">
											<view class="job-name">{{ it.position }}</view>
											<view class="job-time">{{ it.startTime }}-{{ it.endTime }}</view>
										</view>
										<!-- 工作内容 -->
										<view class="job-content" v-if="it.workContent">{{ it.workContent }}</view>
										<!-- 技能标签 -->
										<view class="skill-tags">
											<view class="tag" v-for="skill in it.skills">{{ skill }}</view>
										</view>
									</view>
									<!-- <view class="flex align-center justify-between">
										<view style="color: #78828a;font-size: 22rpx;">不对该公司展示</view>
										<u-switch v-model="item.isShield" @change="changeIsDisplay(item)"></u-switch>
									</view> -->
								</view>
								<!-- <view @click.stop="commonDelete(item.workExpId, 'workExps')">
									<image src="../../static/images/index/delete.svg" class="delete-icon" />
								</view> -->
							</view>							
						</template>
						
						<!-- 默认样式 -->
						<view class="experience-item" v-else>
							<view class="company-title">
								<text class="company-name">公司名称</text>
								<text class="company-type"> • 业务类型</text>
							</view>
							
							<view class="experience-content">
								<view class="experience-box">
									<view class="job-header flex justify-between align-center">
										<view class="job-name">职位</view>
										<view class="job-time">就职时间</view>
									</view>
									<!-- 工作内容 -->
									<view class="job-content">请填写您的工作内容</view>
									<!-- 技能标签 -->
									<view class="skill-tags">
										<view class="tag">请选择您的跨境标签</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>

				<view class="show-all-experience-btn" v-if="showAllExperienceBtn && !showAllExpToggle" @click="showAllExperience">展开全部工作经历</view>

				<!-- 教育经历 -->
				<view class="common-section education-section">
					<view class="section-header">
						<view class="section-title">教育经历</view>
						<view class="edit-icon" @click="goToEducationExperience('')">
							<image src="../../static/images/index/Combined-Shape.svg"
								style="width: 48rpx;height: 48rpx;" mode=""></image>
						</view>
					</view>

					<view class="education-list">
						<template v-if="detail.eduList && detail.eduList.length">
							<view class="education-item" @click.stop="goToEducationExperience(item.eduId)"
								v-for="(item, index) in detail.eduList">
								<view class="education-content">
									<view class="school-name flex justify-between">
										<text>{{ item.school }}</text>
										<text style="width: 60px; text-align: right;">编辑</text>
									</view>
									<view class="degree-info">{{ item.degree }} • {{ item.profession }} •
										{{ new Date(item.startTime).getFullYear() }}-{{ new Date(item.endTime).getFullYear() }}
									</view>
									<view class="education-description">
										{{ item.detail }}
									</view>
								</view>
								<!-- <view @click.stop="commonDelete(item.eduId, 'eduList')">
									<image src="../../static/images/index/delete.svg" class="delete-icon" />
								</view> -->
							</view>							
						</template>
						<view class="education-item" v-else>
							<view class="education-content">
								<view class="school-name">学校名称</view>
								<view class="degree-info">学历 • 专业 • 在校时间</view>
								<view class="education-description">请填写您的教育经历</view>
							</view>
						</view>
					</view>
				</view>

				<!-- 资质证书 -->
				<view class="common-section certificate-section">
					<view class="section-header">
						<view class="section-title">资质证书</view>
						<view class="edit-icon" @click="goToCertificate">
							<image src="../../static/images/index/Combined-Shape.svg"
								style="width: 48rpx;height: 48rpx;" mode=""></image>
						</view>
					</view>
					<view class="skill-tags">
						<view class="tag" v-for="(certificate, index) in detail.certificates" :key="index">{{ certificate.certificateName }}</view>
					</view>
				</view>

				<!-- 技能 -->
				<!-- <view class="common-section skills-section">
					<view class="section-header">
						<view class="section-title">技能</view>
						<view class="edit-icon" @click="goToJobSkills">
							<image src="../../static/images/index/Combined-Shape.svg"
								style="width: 48rpx;height: 48rpx;" mode=""></image>
						</view>
					</view>

					<view class="skills-grid">
						<view class="skill-tag" v-for="(skill, skillIndex) in detail.skills" :key="skillIndex">
							{{ skill.skillName }}</view>
					</view>
				</view> -->
			</view>
			
			<!-- 开启求职之旅按钮，H5邀请进入 -->
			<view class="button-section" v-if="scene == 1">
				<view class="button" @click="toDownload">保存并开启求职之旅</view>
			</view>
			<view class="button-section" v-else>
				<view class="text-btn" v-if="score < 20 && score !== -1" @click="handleStartWork">稍后填写</view>
				<view class="flex buttons">
					<view class="btn primary-btn" @click="toPreviewResume">预览/导出</view>
					<view class="btn main-btn" @click="handleStartWork">开启求职之旅</view>
				</view>
			</view>
			
			<u-popup v-model="showResumesAnalysis" mode="bottom" border-radius="14" :mask-close-able="false">
				<view class="resume-popup">
					<view class="close-button flex align-center justify-center" @click="showResumesAnalysis = false">
						<u-icon name="close" color="#fff" size="22" />
					</view>
					<view class="title">从附件简历中解析出<text>{{ validInfoCount }}段</text>有效信息</view>
					<view class="tip">无需手动填写，可直接添加到在线简历中</view>
					<view class="info-list">
						<view class="info-item flex align-center" v-for="(item, index) in analysisList" :key="index">
							<view class="label">{{ item.title }}</view>
							<view class="border"></view>
							<view class="content">{{ item.value }}</view>
						</view>
					</view>
					<view class="button" @click="handleSync">立即同步</view>
				</view>
			</u-popup>
		</view>
	</view>
</template>

<script>
import navBar from "@/components/nav-bar/index.vue";
import { companyType } from '@/constants/common.js';
import asyncSwitch from '@/components/async-switch.vue';
var intentionId = 0
let AIResumeData = {}
export default {
	components: {
		navBar,
		asyncSwitch
	},
	data() {
		return {
			isEditing: false,
			hasEcommerceExperience: false,
			detail: {},
			statusList: [{
				value: 'unemployed_available',
				text: '离职-随时到岗',

			},
			{
				value: 'employed_monthly',
				text: '在职-月内到岗',

			},
			{
				value: 'employed_considering',
				text: '在职-考虑机会',

			},
			{
				value: 'employed_not_considering',
				text: '在职-暂不考虑',
			},
			{
				value: 'internship',
				text: '实习',
			}
			],
			scene: 0, // 0 默认,1 H5邀请
			companyType: companyType, // 公司类型
			showAllExpToggle: false,
			showChecked: false, // 是否对外展示简历
			loadingSwitch: false,
			controlStatus: false,
			score: -1,
			showResumesAnalysis: false,
			validInfoCount: 0, // 有效信息数量
			analysisList: [
				{
					title: '基本信息',
					value: '',
				},
				{
					title: '工作经历',
					value: '',
				},
				{
					title: '教育经历',
					value: '',
				},
				{
					title: '个人优势',
					value: '',
				},
			],
			loading: false
		}
	},
	computed: {
		// 显示添加求职期望按钮
		showAddJobBtn() {
			if (this.detail.intentions && this.detail.intentions.length >= 3) {
				return false;
			}
			return true;
		},
		// 显示全部工作经历按钮
		showAllExperienceBtn() {
			if (this.detail.workExps && this.detail.workExps.length > 1) {
				return true
			}
			return false
		},
		// 展示的工作经历数据
		showExperienceData() {
			if (this.detail && this.detail.workExps) {
				return this.detail.workExps.filter((workExp, index) => {
					if ((!this.showAllExpToggle && index < 1) || this.showAllExpToggle) {
						return workExp
					}
				})
			} else {
				return []
			}
		}
	},
	onLoad(options) {
		if (options.scene) {
			this.scene = options.scene
		}
		// 判断是否有fileId，如果有则是从上传简历文件页面跳转
		if (options.fileId) {
			this.clearResumeData()
			this.getAiResumesAnalysis(options.fileId)
		}
		this.getData()
		var that = this
		uni.$on('updateResume', () => {
			that.getData()
		})

		uni.$on('preferenceUpdated', (data) => {
			if (data.set != 1)
				return
			that.changePreference(data.preferences)
		})
	},
	onUnload() {
		uni.$off('updateResume')
		uni.$off('preferenceUpdated')
	},
	methods: {
		toggleEdit(){
			this.isEditing = !this.isEditing;
		},
		// // 是否屏蔽该公司
		// changeIsDisplay(item){
		// 	let data = {
		// 		workExp:{
		// 			isShield:item.isShield?1:0,
		// 			workExpId:item.workExpId
		// 		}
		// 	}
		// 	this.$Request.postJson("/app/userFirst/addWorkExp", data).then((res) => {
		// 		if (res.code == 0) {
		// 			uni.showToast({
		// 				title: "修改成功",
		// 				icon: "none"
		// 			});
		// 		} else {
		// 			uni.showToast({
		// 				title: res.msg,
		// 				icon: "none",
		// 			});
		// 		}
		// 	});
		// },
		goBack() {
			uni.navigateBack();
		},
		getData() {
			var that = this
			this.$Request.getT("/app/userFirst/getUserResumes", {}).then((res) => {
				if (res.code == 0) {
					that.detail = res.data
					that.hasEcommerceExperience = res.data.resumeList && res.data.resumeList.ifExp ? true :
						false
					that.detail.degree = that.$queue.getHighestEducation(res.data.eduList)
					this.score = res.data?.resumeList?.score || 0

					res.data.workExps.forEach(function (item) {
						try {
							if (typeof item.type === 'string' && (item.type.startsWith('[') || item
								.type.startsWith('{'))) {
								item.type = JSON.parse(item.type);
							}
						} catch (e) {
							console.warn('item.type JSON解析失败:', item.type);
						}
						item.isShield = item.isShield == 1?true:false
						item.workExpDetails = [];
						res.data.workExpList.forEach(function (it) {
							console.log(it.skills);
							try {
								if (typeof it.skills === 'string' && (it.skills.startsWith(
									'[') || it.skills.startsWith('{'))) {
									it.skills = JSON.parse(it.skills);
								}
							} catch (e) {
								console.warn('it.skills JSON解析失败:', it.skills);
							}

							it.startTime = it.startTime ? it.startTime.slice(0, 7) : '';
							if (that.$queue.isCurrentMonth(new Date(it.endTime)))
								it.endTime = '至今';
							else
								it.endTime = it.endTime ? it.endTime.slice(0, 7) : '';

							if (it.workExpId == item.workExpId)
								item.workExpDetails.push(it);
						});
					});
					
					// 设置是否对外展示简历
					this.showChecked = res.data.resumeList?.isRecommend === 1

					that.detail.workExps = res.data.workExps
				} else {
					uni.showToast({
						title: res.msg,
						icon: "none",
					});
				}
			});
		},
		addExpectation(id = '') {
			uni.navigateTo({
				url: '/package/jobIntention/addExpectation?id=' + id
			})
		},
		goToPreferenceSetting(item) {
			intentionId = item.intentionId
			if (item.ruleClassifyId == '' || item.ruleClassifyId == 0)
				return this.$queue.showToast('请先选择岗位')
			uni.navigateTo({
				url: '/package/jobIntention/preferenceSetting?set=1&jobId=' + item.ruleClassifyId +
					'&jobTitle=' + item.ruleClassifyName + '&selectedPreferences=' + encodeURIComponent(JSON
						.stringify(item.industry == '' || item.industry == null ? [] : item.industry.split(
							'/')))
			})
		},
		// 跳转个人信息页面
		toUserInfo() {
			uni.navigateTo({
				url: '/package/my/editUserInfo'
			})
		},
		// 跳转资质证书编辑
		goToCertificate() {
			const certificates = this.detail.certificates.map(certificate => certificate.certificateName).join(';')
			uni.navigateTo({
				url: `/package/jobIntention/updateCertificates?certificates=${encodeURIComponent(certificates)}`
			})
		},
		goToJobSkills() {
			uni.navigateTo({
				url: '/package/jobIntention/jobSkills?from=onlineResume&set=1&jobTitle=我的&skill=' + encodeURIComponent(JSON
					.stringify(this.detail.skills == null ? [] : this.$queue.array_column(this.detail
						.skills, 'skillName')))
			})
		},
		goToWorkExperience(id = '') {
			// 获取业务类型数据
			const businessTypes = this.getBusinessTypes()
			console.log('传递给工作经历页面的业务类型:', businessTypes)
			console.log('当前hasEcommerceExperience状态:', this.hasEcommerceExperience)
			uni.navigateTo({
				url: `/pages/my/workExperience?id=${id}&businessTypes=${encodeURIComponent(JSON.stringify(businessTypes))}`
			})
		},
		goToEducationExperience(id = '') {
			uni.navigateTo({
				url: `/pages/my/educationExperience?id=${id}`
			})
		},
		goToBasicInfo() {
			uni.navigateTo({
				url: '/package/jobIntention/basicInfo?resumesStatus=' + (this.detail.resumeList && this.detail
					.resumeList.resumesStatus || 0) + '&birthday=' + (this.detail.resumeList && this.detail
						.resumeList.birthday || '') + '&ifExp=' + (this.detail.resumeList && this.detail
							.resumeList.ifExp || 0) + '&resumesPhone=' + (this.detail.resumeList && this.detail
								.resumeList.resumesPhone || '') + '&resumesEmail=' + (this.detail.resumeList && this.detail
									.resumeList.resumesEmail || '')
			})
		},
		getBusinessTypes() {
			// 根据是否有跨境电商经验返回业务类型
			if (this.hasEcommerceExperience) {
				return ['0']
			} else {
				return []
			}
		},
		// // 设置
		// setResume() {
		// 	let data = {
		// 		ifExp: this.hasEcommerceExperience ? 1 : 0,
		// 		adv: this.detail.resumeList && this.detail.resumeList.adv || '',
		// 	}
		// 	uni.showLoading({
		// 		title: "提交中..."
		// 	});
		// 	this.$Request.postJson("/app/userFirst/regist", data).then((res) => {
		// 		uni.hideLoading();
		// 		if (res.code == 0) {
		// 			// 实际开发中可以在这里添加跳转逻辑
		// 		} else {
		// 			uni.showToast({
		// 				title: res.msg,
		// 				icon: "none",
		// 			});
		// 		}
		// 	});
		// },
		changePreference(preference) {
			// if (intentionId == 0)
			// 	return;
			var industry = preference == '' || preference == null ? '' : preference.join('/')
			let data = {
				intentionId,
				industry
			}
			var that = this
			this.$Request.postJson("/app/intention/saveUpdate", data).then((res) => {
				if (res.code == 0) {
					// 实际开发中可以在这里添加跳转逻辑
					that.getData()
				} else {
					uni.showToast({
						title: res.msg,
						icon: "none",
					});
				}
			});
		},
		commonDelete(id, modules) {
			var that = this
			var action = 'userFirst/deleteEdu'
			var params = {
				eduId: id
			}
			if (modules == 'workExps') {
				action = 'userFirst/deleteWorkExp'
				params = {
					workExpId: id
				}
			}
			if (modules == 'intentions') {
				action = 'intention/deleteIntention'
				params = {
					intentionId: id
				}
			}
			this.$queue.appConfirm('确认删除该条内容么？', function (res) {
				if (!res)
					return;
				that.$Request.postJson("/app/" + action, params).then((res) => {
					if (res.code == 0) {
						// 实际开发中可以在这里添加跳转逻辑
						var info = that.detail[modules].filter(function (item) {
							return item[modules == 'workExps' ? 'workExpId' : (modules ==
								'intentions' ? 'intentionId' : 'eduId')] != id;
						});
						that.detail[modules] = info
					} else {
						uni.showToast({
							title: res.msg,
							icon: "none",
						});
					}
				});
			})

		},
		
		// H5邀请跳转到下载页面
		toDownload() {
			uni.navigateTo({
				url: '/pages/public/invite/download'
			})
		},
		
		// 设置公司类型
		setCompanyType(types) {
			if (Array.isArray(types)) {
				return types.map(type => {
					let typeName = ''
					for (let i = 0; i < this.companyType.length; i++) {
						if (type == this.companyType[i].value) {
							typeName = this.companyType[i].label
						}
					}
					return typeName
				}).join('/')
			}
			return ''
		},
		
		// 显示全部工作经历
		showAllExperience() {
			this.showAllExpToggle = true
		},
		
		// 跳转至简历预览/下载页面
		toPreviewResume() {
			uni.navigateTo({
				url: '/package/my/previewResume/index'
			})
		},
		
		// 更新是否对外展示简历状态
		updateIsRecommend() {
			uni.showLoading({
				title: '更新中'
			})
			const oldCheckedValue = this.showChecked
			const isRecommend = this.showChecked ? 0 : 1
			this.$Request
				.getT('/app/resumes/setIsRecommend', {
					isRecommend
				})
				.then((res) => {
					uni.hideLoading()
					if (res.code !== 0) {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
						this.showChecked = oldCheckedValue
					}
				})
				.catch(() => {
					uni.hideLoading()
				})
		},
		
		// 跳转首页
		handleStartWork() {
			uni.reLaunch({
				url: '/pages/index/index'
			})
		},
		
		// 获取简历解析数据
		getAiResumesAnalysis() {
			const data = this.$queue.getData('AI_Resume_Data')
			AIResumeData = data || {}
			if (data) {
				this.showResumesAnalysis = true
				// 基本信息
				if (data.name || data.age || data.email) {
					this.validInfoCount++
					let dataArray = []
					if (data.name) {
						dataArray.push(data.name)
					}
					if (data.age) {
						dataArray.push(data.age)
					}
					if (data.email) {
						dataArray.push(data.email)
					}
					this.analysisList[0].value = dataArray.join('、')
				}
				
				// 工作经历
				if (data.workExperience?.length) {
					this.validInfoCount++
					let dataArray = data.workExperience.map(item => item.company)
					this.analysisList[1].value = dataArray.join('、')
				}
				
				// 教育经历
				if (data.education?.length) {
					this.validInfoCount++
					let dataArray = data.education.map(item => item.school)
					this.analysisList[2].value = dataArray.join('、')
				}
				
				// 个人优势
				if (data.selfEvaluation) {
					this.validInfoCount++
					this.analysisList[3].value = data.selfEvaluation
				}
			}
		},
		
		// 同步简历数据
		handleSync() {
			if (this.loading) return
			
			uni.showLoading({ title: '同步中' })
			this.loading = true
			this.$Request
				.postJson('/app/resumes/syncResumess', AIResumeData)
				.then(res => {
					console.log(res)
					if (res.code === 0) {
						this.showResumesAnalysis = false
						this.$queue.showToast('同步成功')
						this.getData()
					}
				})
				.finally(() => {
					this.loading = false
					uni.hideLoading()
				})
		},
		
		// 清空数据
		clearResumeData() {
			this.analysisList.forEach(item => {
				item.value = ''
			})
		}
	},
	watch: {
		hasEcommerceExperience(newVal, oldVal) {
			console.log('hasEcommerceExperience 变化:', oldVal, '->', newVal)
			// 只有有效的布尔值才保存到缓存
		},
	}
}
</script>

<style lang="scss" scoped>
.delete-icon {
	width: 40rpx;
	height: 40rpx;
}

.online-resume {
	height: 100vh;
	display: flex;
	flex-direction: column;
	padding-bottom: 100rpx;
}
.pb {
	padding-bottom: 160rpx;
}

.fixed-nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9999;
	background-color: #ffffff;
	padding: 0 32rpx;
	// padding-top 已改为动态计算，在模板中通过 :style 设置
}

.page-content {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: auto;
}

// 用户信息区域
.user-profile {
	background: #fff;
	padding: 60rpx 30rpx 40rpx;
	font-family: DM Sans;
	text-align: center;

	.avatar-container {
		width: 98px;
		height: 98px;
		padding: 8rpx;
		background-image: linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1));
		margin: 0 auto 4rpx;
		border-radius: 50%;

		.user-avatar {
			width: 90px;
			height: 90px;
			border-radius: 50%;
		}
	}

	.user-name {
		color: rgba(21, 21, 23, 1);
		font-size: 36rpx;
		font-weight: 700;
		line-height: 52rpx;
		text-align: center;
	}

	.user-info {
		min-height: 20rpx;
		color: rgba(102, 112, 122, 1);
		font-size: 28rpx;
		line-height: 64rpx;
		text-align: center;
	}

	.contact-info {
		display: flex;
		justify-content: center;
		gap: 40rpx;

		.contact-item {
			display: flex;
			align-items: center;
			gap: 10rpx;

			.contact-text {
				color: rgba(116, 116, 116, 1);
				font-size: 16rpx;
				font-weight: 400;
				line-height: 20rpx;
				text-align: center;
			}
		}
	}
}

// 内容区域
.content-section {
	font-family: DM Sans;
	padding: 40rpx 30rpx 130rpx;
	
	.common-section {
		background: #fff;
		border-radius: 12px;
		padding: 30rpx;
		margin-bottom: 20rpx;
		box-sizing: border-box;
		border: 1px solid rgba(227, 231, 236, 1);
		
		.section-header {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-bottom: 30rpx;
		
			.section-title {
				color: rgba(23, 23, 37, 1);
				font-family: Inter;
				font-size: 32rpx;
				font-weight: 600;
				line-height: 48rpx;
			}
			
			.edit-icon {
				width: 40rpx;
				height: 40rpx;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
		
		.skill-tags {
			display: flex;
			flex-wrap: wrap;
			gap: 12rpx;
			margin-top: 16rpx;
		
			.tag {
				background: rgba(153, 153, 153, 0.1);
				border-radius: 12rpx;
				padding: 8rpx 24rpx;
				color: rgba(102, 102, 102, 1);
				font-size: 20rpx;
				font-weight: 400;
				line-height: 1;
			}
		}
	}

	.section-item {
		.section-header {
			.template-text {
				color: rgba(120, 130, 138, 1);
				font-family: DM Sans;
				font-size: 24rpx;
				font-weight: 400;
				line-height: 32rpx;
				letter-spacing: 0%;
				text-align: left;
			}
		}

		.section-status {
			font-size: 28rpx;
			color: #007AFF;
			font-weight: 500;
		}

		.advantage-content {
			font-size: 14px;
			color: #666;
			line-height: 1.6;

			textarea {
				width: 100%;
				height: fit-content;
				min-height: 44rpx;
			}
		}
		
		.section-content {
			.availability {
				display: flex;
				align-items: center;
				gap: 10rpx;
			
				.status-text {
					color: rgba(156, 164, 171, 1);
					font-family: DM Sans;
					font-size: 24rpx;
					font-weight: 400;
					line-height: 32rpx;
					letter-spacing: 0%;
					text-align: left;
				}
			}
			.content {
				margin-top: 24rpx;
				.title {
					font-size: 28rpx;
					line-height: 44rpx;
					color: #171725;
					margin-bottom: 12rpx;
				}
				.content-text {
					font-size: 28rpx;
					line-height: 32rpx;
					color: #78828a;
					word-break: break-all;
				}
			}
			// 个人技能
			.badge-content {
				display: flex;
				flex-wrap: wrap;
				gap: 20rpx;
				.badge {
					font-size: 20rpx;
					line-height: 1; 
					color: #666666;
					padding: 8rpx 10rpx;
					border-radius: 8rpx;
					background: rgba(153, 153, 153, 0.1);
				}
			}
		}
	}

	// 是否对外展示简历
	.text-tip-box {
		width: 480rpx;
		.title {
			font-size: 28rpx;
			line-height: 52rpx;
			color: rgba(21, 22, 26, 1);
			margin-bottom: 8rpx;
		}
		.tip {
			font-size: 20rpx;
			line-height: 26rpx;
			color: rgba(153, 153, 153, 1);
		}
	}

	// 求职期望卡片样式
	.expectation-card {
		.card-header {
			display: flex;
			justify-content: space-between;
			align-items: center;

			.header-left {
				display: flex;
				align-items: center;

				.header-icon {
					width: 40rpx;
					height: 40rpx;
					margin-right: 12rpx;
				}

				.header-title {
					color: rgba(29, 33, 41, 1);
					font-family: DM Sans;
					font-size: 32rpx;
					font-weight: 500;
					line-height: 16px;
					letter-spacing: 0%;
					text-align: left;
				}
			}

			.progress-text {
				font-family: DM Sans;
				font-size: 32rpx;
				font-weight: 700;
				letter-spacing: 0%;
				text-align: right;
				.progress-text-light {
					color: rgba(1, 107, 246, 1);
				}
			}
		}

		.job-list {
			.job-item {
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding: 20rpx 0;

				&:last-child {
					border-bottom: none;
				}

				.job-info {
					flex: 1;

					>view:first-child {
						display: flex;
						justify-content: space-between;
						align-items: center;
						margin-bottom: 4rpx;
					}

					.job-title {
						color: rgba(29, 33, 41, 1);
						font-family: DM Sans;
						font-size: 28rpx;
						font-weight: 500;
						line-height: 16px;
						letter-spacing: 0%;
						text-align: left;
						.sub-title {
							color: #999999;
							font-size: 20rpx;
							padding-left: 8rpx;
						}
					}

					.job-details {
						width: 400rpx;
						display: block;
						font-size: 24rpx;
						color: rgba(153, 153, 153, 1);
						text-overflow: ellipsis;
						white-space: nowrap;
						overflow: hidden;
						margin-bottom: 4rpx;
					}

					.job-location {
						font-size: 24rpx;
						color: rgba(153, 153, 153, 1);
					}
				}

				.preference-btn {
					display: flex;
					align-items: center;
					padding: 8rpx;
					border: 0.5rpx solid #007AFF;
					border-radius: 12rpx;
					margin-right: 10rpx;

					text {
						font-size: 18rpx;
						color: #007AFF;
					}
				}

				.job-info>view:first-child>view:last-child {
					display: flex;
					align-items: center;
				}
			}
		}

		.add-expectation-btn {
			width: 100%;
			height: 88rpx;
			border-radius: 88rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			background: rgba(1, 107, 246, 0.1);
			margin-top: 40rpx;

			text {
				font-size: 28rpx;
				color: #007AFF;
				font-weight: 500;
			}
		}
	}

	// 工作经历部分样式
	.work-experience-section {
		.experience-list {
			.experience-item {
				// 公司名称
				.company-title {
					width: 100%;
					white-space: nowrap;
					text-overflow: ellipsis;
					overflow: hidden;
					margin-bottom: 16rpx;
					.company-name {
						font-size: 28rpx;
						color: rgba(23, 23, 37, 1);
					}
					.company-type {
						flex: 1;
						font-size: 24rpx;
						color: #78828a;
					}
				}

				.experience-content {
					.experience-box {
						padding-bottom: 20rpx;
						margin-bottom: 20rpx;
						border-bottom: 1px solid rgba(227, 231, 236, 0.55);
						
						&:last-child {
							border-bottom: none;
						}
						
						.job-header {
							margin-bottom: 16rpx;
							.job-name {
								font-size: 28rpx;
								color: #171725;
								line-height: 44rpx;
							}
							.job-time {
								font-size: 24rpx;
								color: rgba(120, 130, 138, 1);
							}
						}
						.job-content {
							font-size: 24rpx;
							color: rgba(120, 130, 138, 1);
							white-space: nowrap;
							text-overflow: ellipsis;
							overflow: hidden;
						}
					}

					.skill-tags {
						display: flex;
						flex-wrap: wrap;
						gap: 12rpx;
						margin-top: 16rpx;

						.tag {
							background: rgba(153, 153, 153, 0.1);
							border-radius: 12rpx;
							padding: 8rpx 24rpx;
							color: rgba(102, 102, 102, 1);
							font-family: DM Sans;
							font-size: 20rpx;
							font-weight: 400;
							line-height: 1;
							letter-spacing: 0%;
							text-align: left;
						}
					}
				}
				
				&:last-child {
					.experience-box:last-child {
						padding-bottom: 0;
						margin-bottom: 0;
					}
				}
			}
		}
	}

	// 展示全部工作经历按钮
	.show-all-experience-btn {
		color: #016bf6;
		font-size: 20rpx;
		line-height: 24rpx;
		margin-bottom: 20rpx;
	}

	// 教育经历部分样式
	.education-section {
		.education-list {
			padding-top: 18rpx;
			.education-item {
				padding-bottom: 20rpx;
				margin-bottom: 20rpx;
				border-bottom: 1rpx solid #F0F0F0;

				&:last-child {
					border-bottom: none;
					padding-bottom: 0;
					margin-bottom: 0;
				}

				.education-content {
					flex: 1;

					.school-name {
						color: #171725;
						font-size: 28rpx;
						line-height: 44rpx;
					}

					.degree-info {
						color: rgba(120, 130, 138, 1);
						font-family: DM Sans;
						font-size: 24rpx;
						font-weight: 500;
						line-height: 40rpx;
						letter-spacing: 0%;
						padding: 12rpx 0;
					}

					.education-description {
						width: 100%;
						color: rgba(120, 130, 138, 1);
						font-family: DM Sans;
						font-size: 24rpx;
						line-height: 32rpx;
						letter-spacing: 0%;
						text-align: left;
						white-space: nowrap;
						text-overflow: ellipsis;
						overflow: hidden;
					}
				}
			}
		}
	}

	// 技能部分样式
	.skills-section {
		.skills-grid {
			display: flex;
			flex-wrap: wrap;
			gap: 16rpx;

			.skill-tag {
				padding: 32rpx;
				border: 1px solid rgba(236, 241, 246, 1);
				border-radius: 64rpx;
				color: rgba(23, 23, 37, 1);
				font-family: DM Sans;
				font-size: 14px;
				font-weight: 400;
				line-height: 20px;
				letter-spacing: 0.5%;
				text-align: right;
			}
		}
	}
}

// 底部按钮
.button-section {
	position: fixed;
	left: 0;
	bottom: 0;
	right: 0;
	padding-top: 28rpx;
	box-shadow: 0px -4px 16px 0px rgba(0, 0, 0, 0.04);
	background: #fff;
	.button {
		width: 670rpx;
		height: 80rpx;
		color: #fff;
		font-size: 32rpx;
		text-align: center;
		line-height: 80rpx;
		border-radius: 80rpx;
		background: var(--线性渐变, linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1) 100%));
		margin: 24rpx auto;
	}
	.text-btn {
		color: rgba(1, 107, 246, 1);
		font-size: 32rpx;
		line-height: 1;
		text-align: center;
		margin-bottom: 36rpx;
	}
	.buttons {
		padding: 0 40rpx 24rpx;
		justify-content: space-between;
		.btn {
			width: 327rpx;
			height: 80rpx;
			font-size: 32rpx;
			text-align: center;
			line-height: 80rpx;
			border-radius: 80rpx;
		}
		.primary-btn {
			background: rgba(1, 107, 246, 0.1);
			color: rgba(1, 107, 246, 1);
		}
		.main-btn {
			background: linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1));
			color: #fff;
		}
	}
}

// 解析简历popup
.resume-popup {
	position: relative;
	padding: 70rpx 40rpx 40rpx;
	.title {
		font-size: 40rpx;
		font-weight: 700;
		line-height: 52rpx;
		color: #333;
		margin-bottom: 12rpx;
		text {
			color: #016bf6;
		}
	}
	.tip {
		font-size: 28rpx;
		line-height: 36rpx;
		color: #999999;
	}
	.info-list {
		.info-item {
			box-sizing: border-box;
			border: 1px solid rgba(242, 242, 242, 1);
			border-radius: 6px;
			background: rgba(250, 250, 250, 1);
			padding: 26rpx 24rpx;
			margin-top: 40rpx;
			.label {
				font-size: 28rpx;
				font-weight: 500;
				line-height: 1;
				color: rgba(51, 51, 51, 1);
			}
			.border {
				width: 1px;
				height: 20rpx;
				margin: 0 20rpx;
				background: rgba(234, 234, 234, 1);
			}
			.content {
				flex: 1;
				width: 0;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				color: rgba(153, 153, 153, 1);
				font-size: 28rpx;
				line-height: 1;
			}
		}
	}
	.button {
		width: 600rpx;
		height: 88rpx;
		border-radius: 88rpx;
		background: linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1));
		font-size: 32rpx;
		font-weight: 500;
		line-height: 88rpx;
		text-align: center;
		color: #fff;
		margin: 60rpx auto 0;
	}
	.close-button {
		position: absolute;
		top: 30rpx;
		right: 40rpx;
		width: 40rpx;
		height: 40rpx;
		border-radius: 40rpx;
		background: rgba(230, 230, 230, 1);
	}
}
</style>