resumeDetail.vue 25 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087
  1. <template>
  2. <view class="resume-detail" :style="{ paddingTop: (12 + statusBarHeight + 88 - 60) + 'px' }">
  3. <!-- 固定顶部导航栏 -->
  4. <view class="fixed-nav" :style="{ paddingTop: (12 + statusBarHeight) + 'px' }">
  5. <view class="navbar">
  6. <view class="navbar-content">
  7. <view class="navbar-left" @click="goBack">
  8. <u-icon name="arrow-leftward" size="38" color="#333"></u-icon>
  9. </view>
  10. <view class="navbar-title">简历详情</view>
  11. <view class="navbar-right"></view>
  12. </view>
  13. </view>
  14. </view>
  15. <!-- 用户信息区域 -->
  16. <view class="user-profile">
  17. <view class="profile-header">
  18. <view class="name-section">
  19. <view class="user-name">{{userEntity.userName || '匿名用户'}}</view>
  20. <view class="status-tag">热门搜索</view>
  21. </view>
  22. <view class="avatar-container">
  23. <image :src="userEntity.avatar || '../../static/logo.png'" class="user-avatar" mode="aspectFill">
  24. </image>
  25. <view class="notification-badge"></view>
  26. </view>
  27. </view>
  28. <view class="current-job">
  29. <image src="../../static/images/aixin.svg" class="job-icon" mode="aspectFit"></image>
  30. <text class="job-text">{{workExpList&&workExpList[0].position || '暂无'}}</text>
  31. </view>
  32. <view class="availability">
  33. <text class="status-text">{{resumesStatus[resumeList.resumesStatus] || '离职&随时到岗位'}}</text>
  34. </view>
  35. <view class="summary-info">
  36. <view class="summary-item">
  37. <text class="summary-text">{{workExpTimes || '0'}}年</text>
  38. </view>
  39. <view class="summary-item">
  40. <text class="summary-text">{{eduList.degree || '无'}}</text>
  41. </view>
  42. <view class="summary-item">
  43. <text class="summary-text">{{userEntity.age || '无'}}岁</text>
  44. </view>
  45. </view>
  46. </view>
  47. <!-- 内容区域 -->
  48. <view class="content-section">
  49. <!-- 个人优势 -->
  50. <view class="section-item">
  51. <view class="advantage-content">
  52. {{resumeList.adv || '暂无个人优势。(最多展示三行)'}}
  53. </view>
  54. </view>
  55. <!-- 附件简历 -->
  56. <!-- <view class="attachment-section">
  57. <view class="attachment-btn">
  58. <image src="../../static/images/fujian.svg" class="attachment-icon" mode="aspectFit"></image>
  59. <text class="attachment-text">已上传附件简历</text>
  60. </view>
  61. </view> -->
  62. <!-- 求职期望 -->
  63. <view class="expectation-card">
  64. <view class="card-header">
  65. <text class="header-title">求职期望</text>
  66. </view>
  67. <view class="job-expectation">
  68. <text
  69. class="expectation-text">{{intentions&&intentions[0].ruleClassifyName || '无'}},{{intentions&&intentions[0].citys || '无'}}</text>
  70. <text class="salary-range">{{intentions&&intentions[0].salaryRange}}元</text>
  71. </view>
  72. </view>
  73. <view class="jobRemarks-box-c-title flex align-center">
  74. <image src="/static/images/index/ins.png" class="title-icon"></image>
  75. <text>工作经历</text>
  76. </view>
  77. <!-- 工作经历 -->
  78. <view class="work-experience-section">
  79. <view class="section-header">
  80. <view class="section-title">
  81. <text class="required-mark">*</text>
  82. <text class="required-title">工作经历</text>
  83. <view class="section-desc">请填写专属跨境行业的工作经验</view>
  84. </view>
  85. <!-- <view class="edit-icon">
  86. <image src="../../static/images/index/Combined-Shape.svg" style="width: 48rpx;height: 48rpx;" mode=""></image>
  87. </view> -->
  88. </view>
  89. <view class="experience-list">
  90. <view class="experience-item" v-for="(item,index) in workExpList" :key="index">
  91. <view class="company-logo">
  92. <image src="../../static/images/index/changsha.svg" class="logo-img" mode="aspectFit">
  93. </image>
  94. </view>
  95. <view class="experience-content">
  96. <view class="job-info-row">
  97. <view class="job-title">{{item.position}}</view>
  98. <view class="job-department">{{item.department}}</view>
  99. </view>
  100. <view class="company-period-row">
  101. <view class="company-name">{{item.companyName}}</view>
  102. <view class="work-period">{{item.startTime.slice(0, 7)}} -{{item.endTime.slice(0, 7)}}
  103. </view>
  104. </view>
  105. <view class="job-description">
  106. {{item.workContent}}...
  107. </view>
  108. <view class="skill-tags">
  109. <view class="tag" v-for="(imt,index) in item.skills?JSON.parse(item.skills):{}">{{imt}}
  110. </view>
  111. </view>
  112. </view>
  113. </view>
  114. </view>
  115. </view>
  116. <!-- 教育经历 -->
  117. <view class="education-section">
  118. <view class="section-header">
  119. <view class="section-title">
  120. <text>教育经历</text>
  121. </view>
  122. </view>
  123. <view class="education-list">
  124. <view class="education-item" v-for="(item,index) in eduList" :key="index">
  125. <view class="school-logo">
  126. <image src="../../static/images/index/wuhan.svg" class="logo-img" mode="aspectFit"></image>
  127. </view>
  128. <view class="education-content">
  129. <view class="school-name">{{item.school}}</view>
  130. <view class="degree-info">{{item.degree}} • {{item.profession}} •
  131. {{item.startTime.slice(0, 4)}}-{{item.endTime.slice(0, 4)}}</view>
  132. <view class="education-description">
  133. {{item.detail}}
  134. </view>
  135. </view>
  136. </view>
  137. </view>
  138. </view>
  139. <!-- 资格证书 -->
  140. <view class="certificates-section">
  141. <view class="section-header">
  142. <view class="section-title">
  143. <text>专业技能</text>
  144. </view>
  145. </view>
  146. <view class="certificates-grid">
  147. <view class="certificate-tag" v-for="(skll,index) in skills || {}" :key="index">{{skll.skillName}}</view>
  148. </view>
  149. </view>
  150. <!-- 专业技能 -->
  151. <!-- <view class="skills-section">
  152. <view class="section-header">
  153. <view class="section-title">
  154. <text>专业技能</text>
  155. </view>
  156. </view>
  157. <view class="skills-content">
  158. {{skills || '熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练使用熟练'}}
  159. </view>
  160. </view> -->
  161. </view>
  162. <!-- 底部操作按钮 -->
  163. <view class="bottom-actions">
  164. <view class="action-btn contact-btn" @click="contactCandidate">
  165. <text>立即联系</text>
  166. </view>
  167. </view>
  168. </view>
  169. </template>
  170. <script>
  171. export default {
  172. data() {
  173. return {
  174. statusBarHeight: 0, // 状态栏高度
  175. resumeId: '',
  176. resumeData: {},
  177. userEntity: "",
  178. eduList: "",
  179. intentions: "",
  180. resumeList: "",
  181. skills: "",
  182. postPushId:"",
  183. workExpList: "",
  184. workExpTimes: "",
  185. workExps: "",
  186. resumesStatus: ['离职&随时到岗', '在职&月内到岗', '在职&考虑机会', '在职&暂不考虑'],
  187. defaultExpectations: [{
  188. title: '亚马逊运营总监',
  189. salary: '30-40K',
  190. type: '不限',
  191. location: '深圳'
  192. },
  193. {
  194. title: 'TikTok运营总监',
  195. salary: '30-40K',
  196. type: '精品铺货',
  197. location: '深圳'
  198. }
  199. ],
  200. defaultWorkExperience: [{
  201. position: '资深亚马逊运营',
  202. department: '运营部',
  203. company: '深圳市世迪贸易科技有限公司',
  204. period: '2019.02-至今',
  205. description: '负责Amazon英国、欧洲站、制定推广与销售计划,达成团队要求的销售业绩;做好数据的统计分析工作,收集、分析市场信息,竞争对手状况,并根据产品销售与排名变化,及时制定和调整产品的销售...',
  206. skills: ['精品铺货', '独立站', '3C数码', '品类运营']
  207. }],
  208. defaultEducation: [{
  209. school: '武汉工程大学',
  210. degree: '硕士',
  211. major: '高分子化学与物理',
  212. period: '2014-2017',
  213. description: '这是简历填写的内容这是简历填写的内容内容这是简历填写的内是简历填写的内容这是简历填写的内容...'
  214. }],
  215. defaultSkills: ['Design & Creative', 'Wireframing UX', 'Figma', 'UI Design', 'Prototype', 'Adobe XD',
  216. 'UX Design', 'Front End'
  217. ],
  218. defaultCertificates: ['大学英语六级', '计算机职业资格', '初级会计师', '中级会计师', '高级会计师', '注册会计师']
  219. }
  220. },
  221. onLoad(option) {
  222. // 获取状态栏高度
  223. let systemInfo = uni.getSystemInfoSync();
  224. this.statusBarHeight = systemInfo.statusBarHeight || 0;
  225. // 获取邀请码保存到本地
  226. if (option.invitation) {
  227. this.$queue.setData('inviterCode', option.invitation);
  228. }
  229. // #ifdef MP-WEIXIN
  230. if (option.scene) {
  231. const scene = decodeURIComponent(option.scene);
  232. this.$queue.setData('inviterCode', scene.split(',')[0]);
  233. }
  234. // #endif
  235. uni.showLoading({
  236. title: '加载中'
  237. })
  238. this.weekMember = uni.getStorageSync('weekMember')
  239. this.userId = uni.getStorageSync('userId') ? uni.getStorageSync('userId') : 0
  240. if (option.resumesId) {
  241. this.resumesId = option.resumesId
  242. this.getDetail()
  243. } else if (option.userId) {
  244. this.byuserId = option.userId
  245. this.getDetails()
  246. }
  247. // 获取邀请码保存到本地
  248. if (option.postPushId) {
  249. this.postPushId=option.postPushId
  250. }
  251. },
  252. methods: {
  253. goBack() {
  254. uni.navigateBack();
  255. },
  256. loadResumeData() {
  257. // 这里应该根据 resumeId 加载简历数据
  258. // 暂时使用默认数据
  259. console.log('加载简历数据:', this.resumeId);
  260. },
  261. contactCandidate() {
  262. //去联系
  263. this.getDetail()
  264. this.$Request.postJson('/app/chat/insertChatConversation', {
  265. userId: this.userEntity.userId,//会话对象的id
  266. focusedUserId: uni.getStorageSync('userId'),//当前登录者Id
  267. postPushId: this.postPushId,
  268. resumesId: this.resumesId,
  269. // type:2,
  270. }).then(ret => {
  271. if (ret.code == 0) {
  272. uni.navigateTo({
  273. url: '/pages/msg/im?byUserId=' + this.userEntity
  274. .userId + '&chatConversationId=' + ret.data
  275. .chatConversationId + '&resumesId=' + this.resumesId + '&postPushId=' +
  276. this.postPushId
  277. })
  278. }
  279. })
  280. },
  281. getDetail() {
  282. uni.showLoading({
  283. title: '加载中'
  284. })
  285. let data = {
  286. resumesId: this.resumesId,
  287. userId: this.userId,
  288. companyId: uni.getStorageSync('companyId')
  289. }
  290. //this.$Request.get('/app/resumes/selectResumesByResumesId', data).then(res => {
  291. this.$Request.get('/app/userFirst/getResumes', data).then(res => {
  292. if (res.code == 0) {
  293. uni.hideLoading()
  294. if (res.data.status == 1) {
  295. uni.showModal({
  296. title: '提示',
  297. content: '该简历审核中,暂无法查看',
  298. showCancel: false,
  299. cancelText: '',
  300. confirmText: '去首页',
  301. confirmColor: '#016BF6',
  302. complete: (ret) => {
  303. if (ret.confirm) {
  304. uni.switchTab({
  305. url: '/pages/index/index'
  306. })
  307. }
  308. }
  309. });
  310. } else {
  311. var data = res.data;
  312. this.userEntity = data.userEntity
  313. this.eduList = data.eduList
  314. this.intentions = data.intentions
  315. this.resumeList = data.resumeList
  316. this.skills = data.skills
  317. this.workExpList = data.workExpList
  318. this.workExpTimes = data.workExpTimes
  319. this.workExps = data.workExps
  320. //this.order.industryName = this.order.industryName.split(',')
  321. //this.getJobList(res.data.resumesPost)
  322. }
  323. } else {
  324. uni.hideLoading()
  325. uni.showModal({
  326. title: '提示',
  327. content: '用户简历不存在',
  328. showCancel: false,
  329. complete(ret) {
  330. uni.navigateBack()
  331. }
  332. })
  333. }
  334. })
  335. },
  336. //使用岗位名称查询出企业正在招聘的该岗位拿到对应的岗位id
  337. getJobList(ruleClassifyName) {
  338. let data = {
  339. status: 2,
  340. page: 1,
  341. limit: 1,
  342. ruleClassifyName: ruleClassifyName,
  343. companyId: uni.getStorageSync('companyId')
  344. }
  345. this.$Request.getT('/app/postPush/getPostPushList', data).then(res => {
  346. if (res.code == 0) {
  347. this.postPushId = res.data.records[0].postPushId
  348. }
  349. })
  350. },
  351. // 查看图片
  352. saveImg(imgs, index) {
  353. // console.log(imgs)
  354. let that = this;
  355. let imgArr = imgs
  356. // imgArr.push(imgs);
  357. // //预览图片
  358. uni.previewImage({
  359. urls: imgArr,
  360. current: imgArr[index]
  361. });
  362. },
  363. }
  364. }
  365. </script>
  366. <style lang="scss" scoped>
  367. .resume-detail {
  368. min-height: 100vh;
  369. padding-bottom: 120rpx;
  370. // padding-top 已改为动态计算,在模板中通过 :style 设置
  371. }
  372. .fixed-nav {
  373. position: fixed;
  374. top: 0;
  375. left: 0;
  376. right: 0;
  377. z-index: 9999;
  378. background-color: #ffffff;
  379. // padding: 0 4rpx;
  380. // padding-top 已改为动态计算,在模板中通过 :style 设置
  381. }
  382. // 顶部导航栏
  383. .navbar {
  384. background: #fff;
  385. height: 88rpx;
  386. padding: 0 8rpx;
  387. // padding: 80rpx 0 40rpx 0; // 已移除,因为现在是固定导航栏
  388. .navbar-content {
  389. display: flex;
  390. align-items: center;
  391. justify-content: space-between;
  392. padding: 0 30rpx;
  393. height: 60rpx;
  394. .navbar-left {
  395. width: 60rpx;
  396. height: 60rpx;
  397. display: flex;
  398. align-items: center;
  399. justify-content: center;
  400. }
  401. .navbar-title {
  402. color: rgba(23, 23, 37, 1);
  403. font-family: DM Sans;
  404. font-size: 38rpx;
  405. font-weight: 700;
  406. line-height: 52rpx;
  407. letter-spacing: 0%;
  408. text-align: center;
  409. }
  410. .navbar-right {
  411. width: 60rpx;
  412. height: 60rpx;
  413. }
  414. }
  415. }
  416. // 用户信息区域
  417. .user-profile {
  418. background: #fff;
  419. padding: 30rpx;
  420. // margin: 0 32rpx;
  421. .profile-header {
  422. display: flex;
  423. justify-content: space-between;
  424. align-items: flex-start;
  425. margin-bottom: 20rpx;
  426. .name-section {
  427. flex: 1;
  428. display: flex;
  429. align-items: center;
  430. justify-content: flex-start;
  431. gap: 12rpx;
  432. .user-name {
  433. color: rgba(58, 57, 67, 1);
  434. font-family: DM Sans;
  435. font-size: 48rpx;
  436. font-weight: 700;
  437. line-height: 60rpx;
  438. letter-spacing: 0px;
  439. text-align: left;
  440. margin-right: 12rpx;
  441. }
  442. .status-tag {
  443. background: rgba(252, 233, 220, 1);
  444. color: rgba(1, 107, 246, 1);
  445. font-family: DM Sans;
  446. font-size: 18rpx;
  447. padding: 4rpx 8rpx;
  448. border-radius: 8rpx;
  449. display: inline-block;
  450. }
  451. }
  452. .avatar-container {
  453. position: relative;
  454. .user-avatar {
  455. width: 72rpx;
  456. height: 72rpx;
  457. border-radius: 50%;
  458. border: 1px solid #0d27f7;
  459. }
  460. .notification-badge {
  461. position: absolute;
  462. top: 0;
  463. right: 0;
  464. width: 20rpx;
  465. height: 20rpx;
  466. background: #FF3B30;
  467. border-radius: 50%;
  468. border: 2rpx solid #fff;
  469. }
  470. }
  471. }
  472. .current-job {
  473. display: flex;
  474. align-items: center;
  475. gap: 8rpx;
  476. margin-bottom: 12rpx;
  477. .job-icon {
  478. width: 36rpx;
  479. height: 36rpx;
  480. }
  481. .job-text {
  482. color: rgba(156, 164, 171, 1);
  483. font-family: DM Sans;
  484. font-size: 24rpx;
  485. font-weight: 400;
  486. line-height: 40rpx;
  487. letter-spacing: 0.5%;
  488. text-align: left;
  489. }
  490. }
  491. .availability {
  492. display: flex;
  493. align-items: center;
  494. gap: 8rpx;
  495. margin-bottom: 12rpx;
  496. .status-text {
  497. color: rgba(156, 164, 171, 1);
  498. font-family: DM Sans;
  499. font-size: 24rpx;
  500. font-weight: 400;
  501. line-height: 32rpx;
  502. letter-spacing: 0%;
  503. text-align: left;
  504. }
  505. }
  506. .summary-info {
  507. display: flex;
  508. gap: 12rpx;
  509. margin-right: 12rpx;
  510. .summary-item {
  511. .summary-text {
  512. color: rgba(153, 153, 153, 1);
  513. font-family: DM Sans;
  514. font-size: 20rpx;
  515. font-weight: 400;
  516. line-height: 20rpx;
  517. letter-spacing: -0.5px;
  518. text-align: left;
  519. padding: 12rpx;
  520. border-radius: 8rpx;
  521. background: rgba(198, 198, 198, 0.1);
  522. }
  523. }
  524. }
  525. }
  526. // 内容区域
  527. .content-section {
  528. padding: 0 30rpx 30rpx 30rpx;
  529. .section-item {
  530. background: #fff;
  531. border-radius: 12rpx;
  532. padding: 30rpx 0;
  533. margin-bottom: 20rpx;
  534. box-sizing: border-box;
  535. .advantage-content {
  536. color: rgba(97, 110, 124, 1);
  537. font-family: DM Sans;
  538. font-size: 26rpx;
  539. font-weight: 400;
  540. line-height: 32rpx;
  541. letter-spacing: 0px;
  542. text-align: left;
  543. }
  544. }
  545. .attachment-section {
  546. margin-bottom: 20rpx;
  547. .attachment-btn {
  548. background: rgba(246, 246, 246, 1);
  549. border-radius: 8rpx;
  550. padding: 20rpx;
  551. display: flex;
  552. align-items: center;
  553. gap: 12rpx;
  554. .attachment-icon {
  555. width: 32rpx;
  556. height: 32rpx;
  557. }
  558. .attachment-text {
  559. color: rgba(1, 107, 246, 1);
  560. font-family: DM Sans;
  561. font-size: 24rpx;
  562. font-weight: 400;
  563. line-height: 32rpx;
  564. letter-spacing: 0px;
  565. text-align: left;
  566. }
  567. }
  568. }
  569. // 求职期望卡片样式
  570. .expectation-card {
  571. background: #ffffff;
  572. border-radius: 12rpx;
  573. padding: 30rpx 0;
  574. margin-bottom: 20rpx;
  575. box-sizing: border-box;
  576. .card-header {
  577. margin-bottom: 20rpx;
  578. .header-title {
  579. color: rgba(34, 37, 42, 1);
  580. font-family: DM Sans;
  581. font-size: 32rpx;
  582. font-weight: 400;
  583. line-height: 48rpx;
  584. letter-spacing: 0px;
  585. text-align: left;
  586. }
  587. }
  588. .job-expectation {
  589. display: flex;
  590. justify-content: space-between;
  591. align-items: center;
  592. .expectation-text {
  593. color: rgba(153, 153, 153, 1);
  594. font-family: DM Sans;
  595. font-size: 24rpx;
  596. font-weight: 500;
  597. line-height: 48rpx;
  598. letter-spacing: 0.5%;
  599. text-align: left;
  600. }
  601. .salary-range {
  602. color: rgba(1, 107, 246, 1);
  603. font-family: DM Sans;
  604. font-size: 32rpx;
  605. font-weight: 700;
  606. line-height: 40rpx;
  607. letter-spacing: 0.5%;
  608. text-align: right;
  609. }
  610. }
  611. }
  612. // 工作经历部分样式
  613. .work-experience-section {
  614. background: #fff;
  615. border-radius: 12px;
  616. padding: 30rpx;
  617. margin-bottom: 20rpx;
  618. box-sizing: border-box;
  619. border: 1px solid rgba(1, 107, 246, 1);
  620. .section-header {
  621. display: flex;
  622. align-items: center;
  623. justify-content: space-between;
  624. margin-bottom: 30rpx;
  625. .section-title {
  626. display: flex;
  627. align-items: center;
  628. .required-mark {
  629. color: #FF3B30;
  630. font-size: 18px;
  631. font-weight: 600;
  632. margin-right: 8rpx;
  633. }
  634. .required-title {
  635. font-family: DM Sans;
  636. font-size: 28rpx;
  637. font-weight: 700;
  638. line-height: 52rpx;
  639. letter-spacing: 0%;
  640. text-align: left;
  641. margin-right: 12rpx;
  642. }
  643. text {
  644. color: rgba(23, 23, 37, 1);
  645. font-family: Inter;
  646. font-size: 20px;
  647. font-weight: 600;
  648. line-height: 24px;
  649. }
  650. }
  651. .section-desc {
  652. color: rgba(1, 107, 246, 1);
  653. font-family: DM Sans;
  654. font-size: 20rpx;
  655. font-weight: 400;
  656. line-height: 44rpx;
  657. letter-spacing: 0%;
  658. text-align: left;
  659. }
  660. }
  661. .experience-list {
  662. .experience-item {
  663. display: flex;
  664. padding: 24rpx 0;
  665. border-bottom: 1rpx solid #F0F0F0;
  666. &:last-child {
  667. border-bottom: none;
  668. }
  669. .company-logo {
  670. width: 90rpx;
  671. height: 90rpx;
  672. margin-right: 24rpx;
  673. flex-shrink: 0;
  674. border-radius: 8px;
  675. background: rgba(246, 246, 246, 1);
  676. .logo-img {
  677. width: 100%;
  678. height: 100%;
  679. border-radius: 8rpx;
  680. }
  681. }
  682. .experience-content {
  683. flex: 1;
  684. .job-info-row {
  685. display: flex;
  686. align-items: center;
  687. margin-bottom: 4rpx;
  688. }
  689. .job-title {
  690. color: rgba(23, 23, 37, 1);
  691. font-family: DM Sans;
  692. font-size: 28rpx;
  693. font-weight: 400;
  694. line-height: 44rpx;
  695. letter-spacing: 0%;
  696. text-align: left;
  697. margin-right: 12rpx;
  698. }
  699. .job-department {
  700. color: rgba(120, 130, 138, 1);
  701. font-family: DM Sans;
  702. font-size: 20rpx;
  703. font-weight: 400;
  704. line-height: 44rpx;
  705. letter-spacing: 0%;
  706. text-align: left;
  707. }
  708. .company-period-row {
  709. display: flex;
  710. align-items: center;
  711. justify-content: flex-start;
  712. margin-bottom: 12rpx;
  713. gap: 12rpx;
  714. padding: 12rpx 0;
  715. }
  716. .company-name {
  717. color: rgba(120, 130, 138, 1);
  718. font-family: DM Sans;
  719. font-size: 20rpx;
  720. font-weight: 400;
  721. line-height: 10px;
  722. letter-spacing: 0.5%;
  723. text-align: left;
  724. }
  725. .work-period {
  726. color: rgba(120, 130, 138, 1);
  727. font-family: DM Sans;
  728. font-size: 20rpx;
  729. font-weight: 400;
  730. line-height: 10px;
  731. letter-spacing: 0.5%;
  732. text-align: left;
  733. }
  734. .job-description {
  735. color: rgba(120, 130, 138, 1);
  736. font-family: DM Sans;
  737. font-size: 16rpx;
  738. font-weight: 400;
  739. line-height: 24rpx;
  740. letter-spacing: 0%;
  741. text-align: left;
  742. }
  743. .skill-tags {
  744. display: flex;
  745. flex-wrap: wrap;
  746. gap: 8rpx;
  747. margin-top: 12rpx;
  748. .tag {
  749. background: rgba(153, 153, 153, 0.1);
  750. border-radius: 12rpx;
  751. padding: 6rpx;
  752. color: rgba(102, 102, 102, 1);
  753. font-family: DM Sans;
  754. font-size: 16rpx;
  755. font-weight: 400;
  756. letter-spacing: 0%;
  757. text-align: left;
  758. }
  759. }
  760. }
  761. }
  762. }
  763. }
  764. // 教育经历部分样式
  765. .education-section {
  766. background: #fff;
  767. border-radius: 12px;
  768. padding: 30rpx;
  769. margin-bottom: 20rpx;
  770. box-sizing: border-box;
  771. border: 1px solid rgba(227, 231, 236, 1);
  772. .section-header {
  773. display: flex;
  774. align-items: center;
  775. justify-content: space-between;
  776. margin-bottom: 30rpx;
  777. .section-title {
  778. text {
  779. color: rgba(23, 23, 37, 1);
  780. font-family: Inter;
  781. font-size: 20px;
  782. font-weight: 600;
  783. line-height: 24px;
  784. }
  785. }
  786. }
  787. .education-list {
  788. .education-item {
  789. display: flex;
  790. padding: 24rpx 0;
  791. border-bottom: 1rpx solid #F0F0F0;
  792. &:last-child {
  793. border-bottom: none;
  794. }
  795. .school-logo {
  796. width: 90rpx;
  797. height: 90rpx;
  798. margin-right: 24rpx;
  799. flex-shrink: 0;
  800. border-radius: 8px;
  801. background: rgba(246, 246, 246, 1);
  802. .logo-img {
  803. width: 100%;
  804. height: 100%;
  805. border-radius: 8rpx;
  806. }
  807. }
  808. .education-content {
  809. flex: 1;
  810. .school-name {
  811. color: rgba(23, 23, 37, 1);
  812. font-family: DM Sans;
  813. font-size: 18px;
  814. font-weight: 400;
  815. line-height: 22px;
  816. letter-spacing: 0%;
  817. text-align: left;
  818. }
  819. .degree-info {
  820. color: rgba(120, 130, 138, 1);
  821. font-family: DM Sans;
  822. font-size: 20rpx;
  823. font-weight: 500;
  824. line-height: 24px;
  825. letter-spacing: 0%;
  826. text-align: left;
  827. padding: 12rpx 0;
  828. }
  829. .education-description {
  830. color: rgba(120, 130, 138, 1);
  831. font-family: DM Sans;
  832. font-size: 20rpx;
  833. font-weight: 400;
  834. line-height: 16px;
  835. letter-spacing: 0%;
  836. text-align: left;
  837. }
  838. }
  839. }
  840. }
  841. }
  842. // 资格证书部分样式
  843. .certificates-section {
  844. background: #fff;
  845. border-radius: 12px;
  846. padding: 30rpx 0;
  847. margin-bottom: 20rpx;
  848. box-sizing: border-box;
  849. .section-header {
  850. margin-bottom: 30rpx;
  851. .section-title {
  852. text {
  853. color: rgba(34, 37, 42, 1);
  854. font-family: DM Sans;
  855. font-size: 32rpx;
  856. font-weight: 400;
  857. line-height: 48rpx;
  858. letter-spacing: 0px;
  859. text-align: left;
  860. }
  861. }
  862. }
  863. .certificates-grid {
  864. display: flex;
  865. flex-wrap: wrap;
  866. gap: 12rpx;
  867. .certificate-tag {
  868. padding: 8rpx 16rpx;
  869. color: rgba(1, 107, 246, 1);
  870. font-family: DM Sans;
  871. font-size: 16rpx;
  872. font-weight: 400;
  873. line-height: 20rpx;
  874. letter-spacing: -0.5px;
  875. text-align: left;
  876. border-radius: 8rpx;
  877. background: #ebebebb5;
  878. }
  879. }
  880. }
  881. // 专业技能部分样式
  882. .skills-section {
  883. background: #fff;
  884. border-radius: 12px;
  885. padding: 30rpx 0;
  886. margin-bottom: 20rpx;
  887. box-sizing: border-box;
  888. .section-header {
  889. margin-bottom: 30rpx;
  890. .section-title {
  891. text {
  892. color: rgba(34, 37, 42, 1);
  893. font-family: DM Sans;
  894. font-size: 32rpx;
  895. font-weight: 400;
  896. line-height: 48rpx;
  897. letter-spacing: 0px;
  898. text-align: left;
  899. }
  900. }
  901. }
  902. .skills-content {
  903. color: rgba(97, 110, 124, 1);
  904. font-family: DM Sans;
  905. font-size: 24rpx;
  906. font-weight: 400;
  907. line-height: 32rpx;
  908. letter-spacing: 0px;
  909. text-align: left;
  910. }
  911. }
  912. // 工作经历标题样式
  913. .jobRemarks-box-c-title {
  914. color: rgba(1, 107, 246, 1);
  915. font-size: 32rpx;
  916. padding: 8px 12px;
  917. border-radius: 36px;
  918. font-weight: 500;
  919. background: rgba(246, 246, 246, 1);
  920. display: flex;
  921. align-items: center;
  922. margin-bottom: 20rpx;
  923. .title-icon {
  924. width: 32rpx;
  925. height: 32rpx;
  926. margin-right: 12rpx;
  927. }
  928. text {
  929. color: rgba(1, 107, 246, 1);
  930. font-family: DM Sans;
  931. font-size: 32rpx;
  932. font-weight: 500;
  933. line-height: 48rpx;
  934. letter-spacing: 0px;
  935. text-align: left;
  936. }
  937. }
  938. }
  939. // 底部操作按钮
  940. .bottom-actions {
  941. position: fixed;
  942. bottom: 0;
  943. left: 0;
  944. right: 0;
  945. background: #fff;
  946. padding: 30rpx;
  947. box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
  948. .action-btn {
  949. width: 100%;
  950. height: 88rpx;
  951. border-radius: 44rpx;
  952. display: flex;
  953. align-items: center;
  954. justify-content: center;
  955. font-size: 32rpx;
  956. font-weight: 500;
  957. }
  958. .contact-btn {
  959. background: linear-gradient(90deg, rgba(13, 39, 247, 1), rgba(19, 193, 234, 1) 100%);
  960. color: #fff;
  961. }
  962. }
  963. </style>