diff --git a/web/src/views/rs/recruitment-apply.vue b/web/src/views/rs/recruitment-apply.vue index c83447b3..f883b193 100644 --- a/web/src/views/rs/recruitment-apply.vue +++ b/web/src/views/rs/recruitment-apply.vue @@ -10,71 +10,7 @@
- -
- - - -
-
{{ jobInfo.title }}
-
- - - {{ jobInfo.department }} - - - - {{ jobInfo.location }} - - - - {{ jobInfo.salaryRange }} - -
- - -
-
- - 发布时间:{{ formatDate(jobInfo.publishTime) }} -
-
- - 浏览次数:{{ jobInfo.viewCount || 0 }} -
-
- - 申请人数:{{ jobInfo.applicantCount || 0 }} -
-
- - -
-

岗位描述

-
-
- - -
-

岗位要求

-
-
- - -
-

其他说明

-
{{ jobInfo.remark }}
-
-
-
-
- - +
- - - - - - - - - - 男 - 女 - - - - + + + - - - - - - - - - - - - + + + 男 + 女 + + - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + 返回 - 提交应聘申请 + 提交申请
@@ -194,16 +115,12 @@ import { ref, reactive, onMounted } from 'vue'; import { useRoute, useRouter } from 'vue-router'; import { ElMessage, ElMessageBox, type FormInstance } from 'element-plus'; -import { Briefcase, OfficeBuilding, Location, Money, User, Calendar, View } from '@element-plus/icons-vue'; -import { getPublicJob, type JobVO } from '@/api/rs/job'; +import { User } from '@element-plus/icons-vue'; import { submitJobApplication, type ApplicationForm } from '@/api/rs/application'; const route = useRoute(); const router = useRouter(); -// 岗位信息 -const jobInfo = ref(null); - // 表单引用 const applyFormRef = ref(); @@ -259,31 +176,6 @@ const applyRules = { ] }; -// 获取岗位信息 -const getJobInfo = async (jobId: string) => { - try { - const response = await getPublicJob(jobId); - jobInfo.value = response.data; - applyForm.jobId = jobId; - } catch (error) { - console.error('获取岗位信息失败:', error); - ElMessage.error('获取岗位信息失败'); - goBack(); - } -}; - -// 格式化日期 -const formatDate = (timestamp: string) => { - if (!timestamp) return ''; - const date = new Date(timestamp); - const year = date.getFullYear(); - const month = String(date.getMonth() + 1).padStart(2, '0'); - const day = String(date.getDate()).padStart(2, '0'); - const hours = String(date.getHours()).padStart(2, '0'); - const minutes = String(date.getMinutes()).padStart(2, '0'); - return `${year}-${month}-${day} ${hours}:${minutes}`; -}; - // 提交应聘申请 const submitApplication = async () => { if (!applyFormRef.value) return; @@ -330,7 +222,7 @@ const goBack = () => { onMounted(() => { const jobId = route.query.jobId as string; if (jobId) { - getJobInfo(jobId); + applyForm.jobId = jobId; } else { ElMessage.error('缺少岗位信息'); goBack(); @@ -374,131 +266,21 @@ onMounted(() => { } .apply-container { - max-width: 1200px; + max-width: 800px; margin: 0 auto; padding: 30px 20px; .apply-layout { display: flex; - gap: 30px; - align-items: flex-start; - - .job-info-section, - .apply-form-section { - position: relative; - } - - .job-info-section { - flex: 0 0 40%; - max-width: 40%; - } + justify-content: center; .apply-form-section { - flex: 0 0 60%; - max-width: 60%; + width: 100%; } } } - // 左侧岗位信息卡片 - .job-info-card { - height: 100%; - position: sticky; - top: 20px; - - .el-card__body { - max-height: calc(100vh - 250px); - overflow-y: auto; - padding-right: 10px; - scrollbar-width: thin; - - &::-webkit-scrollbar { - width: 6px; - } - - &::-webkit-scrollbar-thumb { - background-color: #dcdfe6; - border-radius: 3px; - } - } - - .job-header { - display: flex; - align-items: center; - gap: 8px; - font-weight: 600; - color: #2c3e50; - } - - .job-details { - .job-title { - font-size: 1.5rem; - font-weight: 600; - color: #2c3e50; - margin-bottom: 15px; - } - - .job-meta { - display: flex; - flex-wrap: wrap; - gap: 20px; - - .meta-item { - display: flex; - align-items: center; - gap: 5px; - color: #666; - font-size: 0.9rem; - - .el-icon { - color: #999; - } - } - } - - .job-status, - .job-description, - .job-requirements, - .job-remark { - margin-top: 20px; - border-top: 1px solid #eee; - padding-top: 15px; - - h3 { - font-size: 1.1rem; - margin-bottom: 10px; - color: #2c3e50; - } - - div { - color: #666; - line-height: 1.6; - white-space: pre-wrap; - word-break: break-word; - } - } - - .job-status { - display: flex; - flex-direction: column; - gap: 8px; - - .status-item { - display: flex; - align-items: center; - font-size: 14px; - color: #606266; - - .el-icon { - margin-right: 8px; - color: #909399; - } - } - } - } - } - - // 右侧应聘表单卡片 + // 应聘表单卡片 .apply-form-card { .form-header { display: flex; @@ -528,7 +310,6 @@ onMounted(() => { } // 卡片通用样式 - .job-info-card, .apply-form-card { box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.05); border-radius: 4px; @@ -548,27 +329,7 @@ onMounted(() => { // 响应式布局 @media (max-width: 768px) { .apply-container { - .apply-layout { - flex-direction: column; - gap: 20px; - - .job-info-section, - .apply-form-section { - flex: 0 0 100%; - max-width: 100%; - } - - .job-info-section { - .job-info-card { - position: relative; - top: 0; - - .el-card__body { - max-height: 500px; - } - } - } - } + padding: 20px 15px; } } } @@ -576,14 +337,14 @@ onMounted(() => { /* 大屏幕优化 */ @media (min-width: 1440px) { .apply-container { - max-width: 1400px; + max-width: 900px; } } /* 超大屏幕优化 */ @media (min-width: 1920px) { .apply-container { - max-width: 1800px; + max-width: 1000px; } }