简历上传功能开发
This commit is contained in:
@@ -122,7 +122,7 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 4. 新增:简历上传区域(固定在页面底部) -->
|
<!-- 4. 新增:简历上传区域(固定在页面底部) -->
|
||||||
<!-- <view class="resume-upload-section">
|
<view class="resume-upload-section">
|
||||||
<button class="upload-btn" @click="handleResumeUpload" :loading="isUploading" :disabled="isUploading">
|
<button class="upload-btn" @click="handleResumeUpload" :loading="isUploading" :disabled="isUploading">
|
||||||
<uni-icons type="cloud-upload" size="20"></uni-icons>
|
<uni-icons type="cloud-upload" size="20"></uni-icons>
|
||||||
<text class="upload-text">
|
<text class="upload-text">
|
||||||
@@ -138,7 +138,7 @@
|
|||||||
<text class="file-name">{{ uploadedResumeName }}</text>
|
<text class="file-name">{{ uploadedResumeName }}</text>
|
||||||
<button class="delete-file-btn" size="mini" @click.stop="handleDeleteResume">删除</button>
|
<button class="delete-file-btn" size="mini" @click.stop="handleDeleteResume">删除</button>
|
||||||
</view>
|
</view>
|
||||||
</view> -->
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -267,12 +267,202 @@ const handleDeleteItem = async (item, index) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
// 简历上传核心逻辑
|
// 简历上传核心逻辑
|
||||||
const handleResumeUpload = () => {};
|
const handleResumeUpload = () => {
|
||||||
|
// 从缓存获取用户ID(参考首页实现方式)
|
||||||
|
// 优先从store获取,如果为空则从缓存获取
|
||||||
|
const storeUserId = userInfo.value?.userId;
|
||||||
|
const cachedUserInfo = uni.getStorageSync('userInfo') || {};
|
||||||
|
const cachedUserId = cachedUserInfo.userId;
|
||||||
|
|
||||||
|
// 获取用户ID:优先使用store中的userId,如果store中没有,使用缓存中的userId
|
||||||
|
const userId = storeUserId || cachedUserId;
|
||||||
|
|
||||||
|
if (!userId) {
|
||||||
|
$api.msg('请先登录');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 检查是否正在上传
|
||||||
|
if (isUploading.value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选择文件(微信小程序使用 wx.chooseMessageFile,uni-app 中对应 uni.chooseMessageFile)
|
||||||
|
uni.chooseMessageFile({
|
||||||
|
count: 1, // 只能选择一个文件
|
||||||
|
type: 'file', // 选择任意文件类型
|
||||||
|
success: (res) => {
|
||||||
|
// 注意:文件路径在 res.tempFiles[0].path
|
||||||
|
const file = res.tempFiles[0];
|
||||||
|
const tempFilePath = file.path; // 获取临时文件路径
|
||||||
|
const fileName = file.name; // 获取文件名
|
||||||
|
|
||||||
|
// 检查文件大小(20MB = 20 * 1024 * 1024 字节)
|
||||||
|
const maxSize = 20 * 1024 * 1024;
|
||||||
|
if (file.size > maxSize) {
|
||||||
|
$api.msg('文件大小不能超过 20MB');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 检查文件类型
|
||||||
|
const allowedTypes = ['pdf', 'doc', 'docx'];
|
||||||
|
const fileExtension = fileName.split('.').pop()?.toLowerCase();
|
||||||
|
if (!fileExtension || !allowedTypes.includes(fileExtension)) {
|
||||||
|
$api.msg('仅支持 PDF、Word 格式');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 开始上传
|
||||||
|
uploadResumeFile(tempFilePath, fileName, userId);
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
console.error('选择文件失败:', err);
|
||||||
|
// 用户取消选择不提示错误
|
||||||
|
if (err.errMsg && !err.errMsg.includes('cancel')) {
|
||||||
|
$api.msg('选择文件失败,请重试');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 上传简历文件到服务器(使用 wx.uploadFile,uni-app 中对应 uni.uploadFile)
|
||||||
|
const uploadResumeFile = (filePath, fileName, userId) => {
|
||||||
|
// 确保 userId 存在且有效
|
||||||
|
if (!userId) {
|
||||||
|
// 如果传入的userId为空,尝试从缓存再次获取
|
||||||
|
const cachedUserInfo = uni.getStorageSync('userInfo') || {};
|
||||||
|
const cachedUserId = cachedUserInfo.userId;
|
||||||
|
|
||||||
|
if (!cachedUserId) {
|
||||||
|
$api.msg('用户ID不存在,无法上传');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 使用缓存中的userId
|
||||||
|
userId = cachedUserId;
|
||||||
|
}
|
||||||
|
|
||||||
|
isUploading.value = true;
|
||||||
|
|
||||||
|
// 获取token(从缓存获取,参考首页实现方式)
|
||||||
|
let Authorization = '';
|
||||||
|
const tokenValue = uni.getStorageSync('token') || '';
|
||||||
|
if (tokenValue) {
|
||||||
|
Authorization = tokenValue;
|
||||||
|
} else {
|
||||||
|
// 如果缓存中没有token,尝试从store获取
|
||||||
|
const userStore = useUserStore();
|
||||||
|
if (userStore.token) {
|
||||||
|
Authorization = userStore.token;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 根据接口文档,bussinessId 应该作为 Query 参数传递,而不是 formData
|
||||||
|
// 将 bussinessId 拼接到 URL 上作为查询参数
|
||||||
|
const uploadUrl = `${config.baseUrl}/app/file/upload?bussinessId=${encodeURIComponent(String(userId))}`;
|
||||||
|
|
||||||
|
// 打印调试信息
|
||||||
|
console.log('上传文件参数:', {
|
||||||
|
url: uploadUrl,
|
||||||
|
fileName: fileName,
|
||||||
|
bussinessId: userId,
|
||||||
|
userId: userId,
|
||||||
|
token: Authorization ? '已获取' : '未获取'
|
||||||
|
});
|
||||||
|
|
||||||
|
// 上传文件(参考微信小程序 wx.uploadFile API)
|
||||||
|
uni.uploadFile({
|
||||||
|
url: uploadUrl, // 开发者服务器的上传接口(必须是 HTTPS),bussinessId 作为 Query 参数
|
||||||
|
filePath: filePath, // 本地文件路径(临时路径)
|
||||||
|
name: 'file', // 服务器端接收文件的字段名(需与后端一致)
|
||||||
|
// 注意:根据接口文档,bussinessId 通过 Query 参数传递,不需要 formData
|
||||||
|
header: {
|
||||||
|
'Authorization': encodeURIComponent(Authorization)
|
||||||
|
},
|
||||||
|
success: (uploadRes) => {
|
||||||
|
try {
|
||||||
|
// 注意:res.data 是字符串,需转为 JSON(如果后端返回 JSON)
|
||||||
|
// 参考方案:const result = JSON.parse(data);
|
||||||
|
let resData;
|
||||||
|
if (typeof uploadRes.data === 'string') {
|
||||||
|
resData = JSON.parse(uploadRes.data);
|
||||||
|
} else {
|
||||||
|
resData = uploadRes.data;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 判断上传是否成功
|
||||||
|
if (uploadRes.statusCode === 200 && resData.code === 200) {
|
||||||
|
// 上传成功,处理返回结果
|
||||||
|
uploadedResumeName.value = fileName;
|
||||||
|
uploadedResumeUrl.value = resData.data || resData.msg || resData.url || '';
|
||||||
|
$api.msg('简历上传成功');
|
||||||
|
console.log('上传成功', resData);
|
||||||
|
|
||||||
|
// 可以在这里保存简历信息到后端(如果需要)
|
||||||
|
// saveResumeInfo(userId, uploadedResumeUrl.value, fileName);
|
||||||
|
} else {
|
||||||
|
// 上传失败
|
||||||
|
const errorMsg = resData.msg || resData.message || '上传失败,请重试';
|
||||||
|
$api.msg(errorMsg);
|
||||||
|
console.error('上传失败:', resData);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
// 解析响应数据失败
|
||||||
|
console.error('解析上传响应失败:', error);
|
||||||
|
console.error('原始响应数据:', uploadRes.data);
|
||||||
|
$api.msg('上传失败,请重试');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
// 上传失败
|
||||||
|
console.error('上传文件失败:', err);
|
||||||
|
$api.msg('上传失败,请检查网络连接');
|
||||||
|
},
|
||||||
|
// 上传进度监听(可选)
|
||||||
|
progress: (res) => {
|
||||||
|
const progress = res.progress; // 上传进度(0-100)
|
||||||
|
console.log('上传进度:', progress + '%');
|
||||||
|
// 可以在这里更新进度条 UI(如果需要)
|
||||||
|
},
|
||||||
|
complete: () => {
|
||||||
|
// 上传完成(无论成功或失败)
|
||||||
|
isUploading.value = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
// 删除已上传的简历
|
// 删除已上传的简历
|
||||||
const handleDeleteResume = () => {};
|
const handleDeleteResume = () => {
|
||||||
|
if (!uploadedResumeName.value) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
uni.showModal({
|
||||||
|
title: '确认删除',
|
||||||
|
content: '确定要删除已上传的简历吗?',
|
||||||
|
success: (res) => {
|
||||||
|
if (res.confirm) {
|
||||||
|
// 清除本地数据
|
||||||
|
uploadedResumeName.value = '';
|
||||||
|
uploadedResumeUrl.value = '';
|
||||||
|
$api.msg('已删除');
|
||||||
|
|
||||||
|
// 如果需要,可以调用后端接口删除服务器上的文件
|
||||||
|
// deleteResumeFile(userId);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style lang="stylus">
|
||||||
|
/* 修复页面滚动问题:覆盖全局的 overflow: hidden */
|
||||||
|
page {
|
||||||
|
overflow-y: auto !important;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<style lang="stylus" scoped>
|
<style lang="stylus" scoped>
|
||||||
image{
|
image{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
Reference in New Issue
Block a user