attachment.vue 23 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043
  1. <template>
  2. <view style="height: 100vh;" class="flex flex-direction">
  3. <!-- 顶部导航栏 -->
  4. <view class="navbar" :style="{ paddingTop: (12 + statusBarHeight) + 'px' }">
  5. <view class="navbar-content">
  6. <view class="navbar-left" @click="goBack">
  7. <u-icon name="arrow-leftward" size="36" color="#333"></u-icon>
  8. </view>
  9. <view class="navbar-title">附件管理</view>
  10. <view class="navbar-right"></view>
  11. </view>
  12. </view>
  13. <!-- <nav-bar title="基本信息"></nav-bar> -->
  14. <view class="contain flex flex-direction">
  15. <scroll-view scroll-with-animation scroll-y>
  16. <!-- 我的公司 -->
  17. <view class="usermain-item item-padding" v-for="item in content">
  18. <view class="usermain-item-title c-flex-center">
  19. <image
  20. :src="item.fileType == 'pdf' ? '../../static/images/pdf.svg' : '../../static/images/docx.svg'"
  21. class="header-icon" mode="aspectFill" />
  22. </view>
  23. <view @click="seekDoc(item)" class="fileContent c-flex-center">
  24. <view class="fileName m-ellipsis">{{ item.attachmentName }}</view>
  25. <view class="filedesc">{{ item.attachmentSize }}kb 更新于{{ item.createTime }}</view>
  26. </view>
  27. <view @click.stop="more(item.resumesAttachmentId)" class="c-flex-center">
  28. <u-icon name="more-dot-fill"></u-icon>
  29. </view>
  30. </view>
  31. <empty :isShow="false" v-if="content.length == 0" />
  32. </scroll-view>
  33. </view>
  34. <!-- #ifdef APP-PLUS -->
  35. <view class="white-btn" @click="handleWeChatUpload">微信上传</view>
  36. <!-- #endif -->
  37. <view class="buttons flex align-center">
  38. <view class="button pain" @click="showTipPopup = true">Ai一键解析简历</view>
  39. <view class="button primary">
  40. 简历上传
  41. <fileSelector title="" allowType=".doc,.docx,.xls,.xlsx,.pdf" @fileSelected="uploadResumes"
  42. @filesChanged="onFilesChanged" />
  43. </view>
  44. </view>
  45. <!-- 简历解析确认弹窗 -->
  46. <view class="popup-container" v-if="showTipPopup" @click="showTipPopup = false">
  47. <view class="popup-content">
  48. <view class="popup-title">温馨提示</view>
  49. <view class="tip-container">
  50. <view>1-2页简历识别预计耗时1分钟;</view>
  51. <view>3-5页简历识别预计耗时1-3分钟;</view>
  52. <view>5页简历以上耗时将会超过5分;</view>
  53. <view>请您耐心等待!</view>
  54. </view>
  55. <image src="@/static/upload-tip.png" class="upload-tip"></image>
  56. <view class="button-primary" @click.stop="handlUploadFile">知道了</view>
  57. </view>
  58. </view>
  59. <!-- 简历解析加载 -->
  60. <view class="load-container" v-if="showLoadCard">
  61. <image src="@/static/loading.gif" class="loading-image" mode="aspectFit"></image>
  62. </view>
  63. <!-- 权限说明弹窗 -->
  64. <u-popup mode="top" ref="permission">
  65. <view class="popup-content">
  66. <view class="popup-text-permission">选择/拍摄照片需要相机/相册权限,用于上传用户头像</view>
  67. </view>
  68. </u-popup>
  69. <!-- 同步解析简历数据 -->
  70. <u-popup v-model="showResumesAnalysis" mode="bottom" border-radius="14" :mask-close-able="false">
  71. <view class="resume-popup">
  72. <view class="close-button flex align-center justify-center" @click="showResumesAnalysis = false">
  73. <u-icon name="close" color="#fff" size="22" />
  74. </view>
  75. <view class="title">从附件简历中解析出<text>{{ validInfoCount }}段</text>有效信息</view>
  76. <view class="tip">无需手动填写,可直接添加到在线简历中</view>
  77. <view class="info-list">
  78. <view class="info-item flex align-center" v-for="(item, index) in analysisList" :key="index">
  79. <view class="label">{{ item.title }}</view>
  80. <view class="border"></view>
  81. <view class="content">{{ item.value }}</view>
  82. </view>
  83. </view>
  84. <view class="button" @click="handleSync">立即同步</view>
  85. </view>
  86. </u-popup>
  87. </view>
  88. </template>
  89. <script>
  90. import configdata from '../../common/config.js';
  91. import navBar from "@/components/nav-bar/index.vue";
  92. // 引入组件
  93. import fileSelector from '@/uni_modules/zhouquan-fileSelector/components/zhouquan-fileSelector/file-selector.vue';
  94. import empty from '../../components/empty.vue'
  95. // #ifdef APP-PLUS
  96. import { chooseFileFromModule } from '@/uni_modules/sr-file-choose'
  97. // #endif
  98. let AIResumeData = {}
  99. export default {
  100. components: {
  101. navBar,
  102. fileSelector,
  103. empty
  104. },
  105. data() {
  106. return {
  107. statusBarHeight: 0, // 状态栏高度
  108. phone: '',
  109. weChatNum: '',//微信号
  110. email: '',//接收简历邮箱
  111. selectedCompany: '深圳市汉瑞国际猎头服务有限公司', // 我的公司
  112. selectedPosition: '人事总监', // 我的职务
  113. avatar: '../../static/logo.png',
  114. userName: '',
  115. nickName: '',
  116. userId: '',
  117. realName: '',
  118. weChatId: "",
  119. password: '',
  120. platform: '',
  121. createTime: '',
  122. money: '',
  123. jiFen: '',
  124. status: '',
  125. zhiFuBao: '',
  126. zhiFuBaoName: '',
  127. sex: 1,
  128. age: 0,
  129. content: [],
  130. showLoadCard: false,
  131. showResumesAnalysis: false,
  132. validInfoCount: 0, // 有效信息数量
  133. analysisList: [
  134. {
  135. title: '基本信息',
  136. value: '',
  137. },
  138. {
  139. title: '工作经历',
  140. value: '',
  141. },
  142. {
  143. title: '教育经历',
  144. value: '',
  145. },
  146. {
  147. title: '个人优势',
  148. value: '',
  149. },
  150. ],
  151. loading: false,
  152. showTipPopup: false
  153. };
  154. },
  155. computed: {
  156. phoneWithMask() {
  157. if (this.phone && this.phone.length >= 11) {
  158. return this.phone.substring(0, 3) + '******' + this.phone.substring(9);
  159. }
  160. return this.phone || '请设置手机号';
  161. }
  162. },
  163. onLoad(e) {
  164. // 获取状态栏高度
  165. let systemInfo = uni.getSystemInfoSync();
  166. this.statusBarHeight = systemInfo.statusBarHeight || 0;
  167. this.getUserInfo()
  168. // this.avatar = uni.getStorageSync('avatar')
  169. },
  170. methods: {
  171. // 返回上一页
  172. goBack() {
  173. uni.navigateBack();
  174. },
  175. // 修改手机号
  176. modifyPhone() {
  177. console.log('点击修改手机号,当前手机号:', this.phone);
  178. const url = `/pages/my/userphone?currentPhone=${this.phone}`;
  179. console.log('跳转路径:', url);
  180. uni.navigateTo({
  181. url: url,
  182. });
  183. },
  184. // 选择公司
  185. selectCompany() {
  186. uni.navigateTo({
  187. url: '/pages/my/myCompany'
  188. });
  189. },
  190. // 选择职务
  191. selectPosition() {
  192. // 这里可以跳转到职务选择页面或显示职务选择弹窗
  193. console.log('选择职务');
  194. },
  195. onChooseAvatar(e) {
  196. let that = this;
  197. let token = uni.getStorageSync('token');
  198. uni.uploadFile({
  199. url: this.$Request.config("APIHOST1") +
  200. '/alioss/upload', //真实的接口地址
  201. filePath: e.detail.avatarUrl,
  202. header: {
  203. token: token
  204. },
  205. name: 'file',
  206. success: uploadFileRes => {
  207. let url = JSON.parse(uploadFileRes.data);
  208. that.avatar = url.data
  209. uni.hideLoading();
  210. }
  211. });
  212. },
  213. goMyAddress() {
  214. uni.navigateTo({
  215. url: '../jifen/myaddress'
  216. });
  217. },
  218. getUserInfo() {
  219. this.$Request.get("/app/resumes/getAttachment").then(res => {
  220. if (res.code == 0) {
  221. res.data.forEach(function (item) {
  222. const ext = item.attachmentName.split('.').pop().toLowerCase();
  223. item.fileType = ext
  224. })
  225. this.content = res.data
  226. }
  227. uni.hideLoading();
  228. });
  229. },
  230. // 保存
  231. uploadResumes(e) {
  232. var that = this
  233. console.log(e.path)
  234. const validExtensions = ['pdf', 'doc', 'docx'];
  235. const ext = e.name.split('.').pop().toLowerCase();
  236. if (!validExtensions.includes(ext)) {
  237. this.$queue.showToast('仅支持PDF/DOC/DOCX格式')
  238. return;
  239. }
  240. uni.getFileInfo({
  241. filePath: e.path,
  242. success: (info) => {
  243. console.log('文件大小:', info.size); // 单位:字节
  244. let attachment_size = (info.size / 1024).toFixed(1)
  245. that.$queue.uploadFile(e.path, function (path) {
  246. if (path)
  247. that.$Request.postJson("/app/resumes/saveAttachment", {
  248. attachmentAddress: path,
  249. attachmentName: e.name,
  250. attachmentSize: attachment_size
  251. }).then(res => {
  252. if (res.code === 0) {
  253. that.getUserInfo()
  254. uni.$emit('updateAttachmentList')
  255. } else {
  256. uni.showToast({
  257. title: res.msg,
  258. icon: "none"
  259. })
  260. }
  261. })
  262. else
  263. that.$queue.showToast('文件上传失败')
  264. })
  265. },
  266. fail: (err) => {
  267. console.error('获取失败', err);
  268. }
  269. });
  270. },
  271. more(id) {
  272. uni.showActionSheet({
  273. itemList: ["AI解析", "删除"],
  274. itemColor: "#3273db",
  275. success: res => {
  276. if (res.tapIndex == 0) {
  277. let [resume] = this.content.filter(item => item.resumesAttachmentId == id)
  278. if (resume) {
  279. this.analyserResumeByUrl(resume?.attachmentAddress)
  280. } else {
  281. this.$queue.showToast('获取简历失败')
  282. }
  283. } else if (res.tapIndex == 1) {
  284. this.deleteAttachment(id)
  285. }
  286. },
  287. fail(res) {
  288. console.log(res.errMsg);
  289. },
  290. });
  291. },
  292. handleWeChatUpload() {
  293. plus.share.getServices(res => {
  294. let weixinService = null;
  295. for (let i in res) {
  296. if (res[i].id === 'weixin') {
  297. weixinService = res[i];
  298. break;
  299. }
  300. }
  301. console.log('weixinService :>> ', weixinService);
  302. const userId = uni.getStorageSync('userId')
  303. if (weixinService) {
  304. weixinService.launchMiniProgram({
  305. id: 'gh_854ab5288c2d',
  306. path: `/pages/index/index?userId=${userId}`,
  307. type: 0 // 小程序版本类型:0-正式版;1-测试版;2-体验版
  308. });
  309. } else {
  310. console.log('未安装微信或获取微信服务失败');
  311. }
  312. });
  313. },
  314. deleteAttachment(id) {
  315. var that = this;
  316. uni.showModal({
  317. title: '提示',
  318. content: '确定删除?',
  319. success(res) {
  320. if (res.confirm) {
  321. that.$Request.postJson("/app/resumes/deleteAttachment", {
  322. resumesAttachmentId: id
  323. }).then(res => {
  324. if (res.code === 0) {
  325. var info = that.content.filter(function (item) {
  326. return item.resumesAttachmentId != id;
  327. });
  328. that.content = info
  329. uni.$emit('updateAttachmentList')
  330. } else {
  331. uni.showToast({
  332. title: res.msg,
  333. icon: "none"
  334. })
  335. }
  336. })
  337. } else if (res.cancel) {
  338. console.log('用户点击取消')
  339. }
  340. }
  341. })
  342. },
  343. onFilesChanged(e) {
  344. console.log(e)
  345. },
  346. seekDoc(it) {
  347. //#ifdef APP-PLUS
  348. uni.downloadFile({
  349. url: it.attachmentAddress,
  350. success: function (res) {
  351. var filePath = res.tempFilePath;
  352. uni.openDocument({
  353. filePath: filePath,
  354. showMenu: true,
  355. success: function (res) {
  356. console.log('打开文档成功');
  357. }
  358. });
  359. }
  360. });
  361. return;
  362. //#endif
  363. uni.navigateTo({
  364. url: '/pages/index/webView?url=' + it.attachmentAddress + '&title=' + it.attachmentName
  365. });
  366. },
  367. // 附件一键识别
  368. handlUploadFile() {
  369. if (this.content.length >= 3) {
  370. this.showTipPopup = false
  371. this.$queue.showToast('最多保存三张附件简历,请删除后再试')
  372. return
  373. }
  374. // #ifdef APP-PLUS
  375. chooseFileFromModule({
  376. complete: res => {
  377. let path = res.path
  378. let name = res.name
  379. let fileType = ''
  380. // 如果没有name,默认为:截取最后一个/之后的内容
  381. if (!name) {
  382. let lastIndex = path.lastIndexOf('/');
  383. if (lastIndex !== -1) {
  384. name = path.substring(lastIndex + 1);
  385. } else {
  386. name = Math.random().toString(36).substr(2) + Date.now();
  387. }
  388. }
  389. // 使用 lastIndexOf 方法找到最后一个 . 的位置
  390. let lastDotIndex = name.lastIndexOf('.');
  391. if (lastDotIndex !== -1) {
  392. fileType = name.substring(lastDotIndex + 1);
  393. } else {
  394. console.log('文件路径中没有 .');
  395. }
  396. let file = {
  397. size: res.size,
  398. path,
  399. fileType,
  400. name
  401. }
  402. this.uploadAndAnalysisResumes(file)
  403. }
  404. })
  405. // #endif
  406. // #ifdef H5
  407. uni.chooseFile({
  408. count: 1,
  409. success: res => {
  410. this.uploadAndAnalysisResumes({
  411. path: res.tempFilePaths[0],
  412. name: 'file'
  413. })
  414. }
  415. })
  416. // #endif
  417. },
  418. // 上传解析简历
  419. uploadAndAnalysisResumes(file) {
  420. this.showTipPopup = false
  421. this.showLoadCard = true
  422. this.$queue.uploadFiles({
  423. url: '/app/resumes/resumesAnalysisPlus',
  424. path: file.path,
  425. name: 'file',
  426. timeout: 480000,
  427. hideUploadTask: true
  428. }, (res) => {
  429. if (!res) {
  430. this.showModal('解析失败,请稍后重试')
  431. this.stopLoadStatus()
  432. return
  433. }
  434. if (res.code == 0 && res.data) {
  435. // 识别前,先清空数据
  436. this.clearResumeData()
  437. this.setAiResumesAnalysis(JSON.parse(res.data))
  438. this.getUserInfo()
  439. } else {
  440. this.showModal(res?.msg || '解析失败,请稍后重试')
  441. }
  442. this.stopLoadStatus()
  443. })
  444. },
  445. stopLoadStatus() {
  446. this.showLoadCard = false
  447. },
  448. // 获取简历解析数据
  449. setAiResumesAnalysis(data) {
  450. AIResumeData = data || {}
  451. if (data) {
  452. this.showResumesAnalysis = true
  453. // 基本信息
  454. if (data.name || data.age || data.email) {
  455. this.validInfoCount++
  456. let dataArray = []
  457. if (data.name) {
  458. dataArray.push(data.name)
  459. }
  460. if (data.age) {
  461. dataArray.push(data.age)
  462. }
  463. if (data.email) {
  464. dataArray.push(data.email)
  465. }
  466. this.analysisList[0].value = dataArray.join('、')
  467. }
  468. // 工作经历
  469. if (data.workExperience?.length) {
  470. this.validInfoCount++
  471. let dataArray = data.workExperience.map(item => item.company)
  472. this.analysisList[1].value = dataArray.join('、')
  473. }
  474. // 教育经历
  475. if (data.education?.length) {
  476. this.validInfoCount++
  477. let dataArray = data.education.map(item => item.school)
  478. this.analysisList[2].value = dataArray.join('、')
  479. }
  480. // 个人优势
  481. if (data.selfEvaluation) {
  482. this.validInfoCount++
  483. this.analysisList[3].value = data.selfEvaluation
  484. }
  485. }
  486. },
  487. // 同步简历数据
  488. handleSync() {
  489. if (this.loading) return
  490. uni.showLoading({ title: '同步中' })
  491. this.loading = true
  492. this.$Request
  493. .postJson('/app/resumes/syncResumess', AIResumeData)
  494. .then(res => {
  495. if (res.code === 0) {
  496. this.showResumesAnalysis = false
  497. this.$queue.showToast('同步成功')
  498. } else {
  499. this.$queue.showToast('同步失败')
  500. }
  501. })
  502. .finally(() => {
  503. this.loading = false
  504. uni.hideLoading()
  505. })
  506. },
  507. // 清空数据
  508. clearResumeData() {
  509. this.analysisList.forEach(item => {
  510. item.value = ''
  511. })
  512. },
  513. showModal(content) {
  514. uni.showModal({
  515. title: '提示',
  516. content,
  517. showCancel: false
  518. })
  519. },
  520. // 通过文件地址解析简历
  521. analyserResumeByUrl(filePath) {
  522. this.showLoadCard = true
  523. this.$Request.getT('/app/resumes/resumesAnalysisAttach', {
  524. filePath
  525. }, null, 480000, true).then(res => {
  526. if (!res) {
  527. this.showModal('解析失败,请稍后重试')
  528. this.stopLoadStatus()
  529. return
  530. }
  531. if (res.code == 0 && res.data) {
  532. // 识别前,先清空数据
  533. this.clearResumeData()
  534. this.setAiResumesAnalysis(JSON.parse(res.data))
  535. this.getUserInfo()
  536. } else {
  537. this.showModal(res?.msg || '解析失败,请稍后重试')
  538. }
  539. this.stopLoadStatus()
  540. }).catch(err => {
  541. this.showModal('解析失败,请稍后重试')
  542. this.stopLoadStatus()
  543. })
  544. }
  545. },
  546. // userphone(){
  547. // uni.navigateTo({
  548. // url:'/pages/my/userphone'
  549. // })
  550. // }
  551. };
  552. </script>
  553. <style lang="scss" scoped>
  554. page {
  555. /* background: #f6f6f6; */
  556. }
  557. .navbar {
  558. padding: 24rpx 32rpx 20rpx 32rpx;
  559. background: #fff;
  560. .navbar-content {
  561. display: flex;
  562. align-items: center;
  563. justify-content: space-between;
  564. height: 60rpx;
  565. .navbar-left {
  566. width: 60rpx;
  567. height: 60rpx;
  568. display: flex;
  569. align-items: center;
  570. justify-content: center;
  571. }
  572. .navbar-title {
  573. color: rgba(23, 23, 37, 1);
  574. font-family: DM Sans;
  575. font-size: 36rpx;
  576. font-weight: 700;
  577. line-height: 52rpx;
  578. letter-spacing: 0%;
  579. text-align: center;
  580. }
  581. .navbar-right {
  582. width: 60rpx;
  583. height: 60rpx;
  584. }
  585. }
  586. }
  587. button::after {
  588. border: none;
  589. background-color: none;
  590. }
  591. button {
  592. position: relative;
  593. display: block;
  594. margin-left: auto;
  595. margin-right: auto;
  596. padding-left: 0px;
  597. padding-right: 0px;
  598. box-sizing: border-box;
  599. text-decoration: none;
  600. line-height: 1.35;
  601. overflow: hidden;
  602. color: #666666;
  603. /* background-color: #fff; */
  604. background-color: rgba(255, 255, 255, 0) !important;
  605. width: 100%;
  606. height: 100%;
  607. }
  608. .contain {
  609. flex: 1;
  610. scroll-view {
  611. height: 100%;
  612. }
  613. }
  614. .usermain-item {
  615. display: flex;
  616. justify-content: space-between;
  617. margin: 0 40rpx;
  618. padding: 30rpx 0;
  619. // border-bottom: 1rpx solid rgba(229, 229, 229, 0.3);
  620. background: #fff;
  621. .fileContent {
  622. width: 85%;
  623. margin: 0 20rpx;
  624. }
  625. .fileName {
  626. color: #222;
  627. font-size: 32rpx;
  628. }
  629. .filedesc {
  630. margin-top: 10rpx;
  631. font-size: 24rpx;
  632. }
  633. .c-flex-center {
  634. align-self: center;
  635. color: #aaa;
  636. flex-shrink: 0;
  637. }
  638. }
  639. .usermain-item-title {
  640. color: rgba(31, 44, 55, 1);
  641. font-family: DM Sans;
  642. font-size: 28rpx;
  643. font-weight: 500;
  644. line-height: 44rpx;
  645. text-align: left;
  646. .header-icon {
  647. width: 50rpx;
  648. height: 50rpx;
  649. display: block;
  650. }
  651. }
  652. .usermain-item.item-padding {
  653. /* padding: 0; */
  654. }
  655. .cu-form-group {
  656. padding: 0;
  657. background: #ffffff;
  658. text-align: right;
  659. }
  660. .cu-form-group input {
  661. background: #ffffff;
  662. font-size: 28rpx;
  663. /* color: #fff; */
  664. }
  665. /* 姓名字段样式 - 参考basicInfo.vue */
  666. .usermain-item .form-label {
  667. color: rgba(31, 44, 55, 1);
  668. font-family: DM Sans;
  669. font-size: 32rpx;
  670. font-weight: 500;
  671. line-height: 44rpx;
  672. letter-spacing: 0.5%;
  673. text-align: left;
  674. display: flex;
  675. align-items: center;
  676. margin-bottom: 16rpx;
  677. }
  678. .usermain-item .required-mark {
  679. color: #FF3B30;
  680. font-size: 36rpx;
  681. font-weight: 600;
  682. margin-right: 8rpx;
  683. }
  684. .usermain-item .cu-form-group {
  685. background: transparent;
  686. text-align: left;
  687. padding: 0;
  688. }
  689. .usermain-item .cu-form-group input {
  690. width: 100%;
  691. height: 68rpx;
  692. font-size: 28rpx;
  693. border: 1rpx solid rgba(227, 231, 236, 1);
  694. border-radius: 44rpx;
  695. color: rgba(23, 23, 37, 1);
  696. padding: 0 32rpx;
  697. background: #ffffff;
  698. font-family: DM Sans;
  699. font-weight: 400;
  700. }
  701. .usermain-item .cu-form-group input::placeholder {
  702. color: rgba(155, 155, 155, 1);
  703. font-size: 28rpx;
  704. }
  705. /* 联系方式样式 */
  706. .contact-structure {
  707. border-bottom: none !important;
  708. }
  709. .contact-wrapper {
  710. display: flex;
  711. align-items: center;
  712. justify-content: space-between;
  713. padding: 0;
  714. margin-top: 8rpx;
  715. }
  716. .phone-display {
  717. color: rgba(23, 23, 37, 1);
  718. font-family: DM Sans;
  719. font-size: 28rpx;
  720. font-weight: 400;
  721. line-height: 40rpx;
  722. letter-spacing: 0.5%;
  723. }
  724. .modify-link {
  725. color: rgba(24, 144, 255, 1);
  726. font-family: DM Sans;
  727. font-size: 28rpx;
  728. font-weight: 400;
  729. line-height: 40rpx;
  730. letter-spacing: 0.5%;
  731. cursor: pointer;
  732. text-decoration: none;
  733. }
  734. .modify-link:active {
  735. opacity: 0.7;
  736. }
  737. /* 头像编辑图标样式 */
  738. .avatar-wrapper {
  739. position: relative;
  740. display: inline-block;
  741. }
  742. .edit-avatar-icon {
  743. position: absolute;
  744. bottom: 10rpx;
  745. right: 2rpx;
  746. width: 24rpx;
  747. height: 24rpx;
  748. // background: #fff;
  749. border-radius: 50%;
  750. display: flex;
  751. align-items: center;
  752. justify-content: center;
  753. box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
  754. }
  755. .avatar-button {
  756. position: relative;
  757. padding: 0;
  758. margin: 0;
  759. background: transparent;
  760. border: none;
  761. }
  762. .buttons {
  763. padding: 40rpx 40rpx 60rpx;
  764. .button {
  765. position: relative;
  766. flex: 1;
  767. height: 80rpx;
  768. line-height: 80rpx;
  769. text-align: center;
  770. border-radius: 80rpx;
  771. &:first-child {
  772. margin-right: 16rpx;
  773. }
  774. }
  775. .pain {
  776. color: rgba(1, 107, 246, 1);
  777. background: rgba(1, 107, 246, 0.1);
  778. }
  779. .primary {
  780. color: #fff;
  781. background: linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1));
  782. }
  783. ::v-deep .main {
  784. position: absolute;
  785. left: 0;
  786. top: 0;
  787. width: 100%;
  788. height: 100%;
  789. padding: 0;
  790. .upload-area {
  791. margin: 0;
  792. background: transparent;
  793. }
  794. }
  795. }
  796. /* 选择器样式 - 参考workExperience页面 */
  797. .form-input-selector {
  798. width: 100%;
  799. height: 68rpx;
  800. padding: 0 40rpx;
  801. border: 1px solid rgba(227, 231, 236, 1);
  802. border-radius: 24px;
  803. background: rgba(255, 255, 255, 1);
  804. display: flex;
  805. align-items: center;
  806. justify-content: space-between;
  807. cursor: pointer;
  808. transition: all 0.2s ease;
  809. .placeholder {
  810. color: #999999;
  811. font-family: DM Sans;
  812. font-size: 28rpx;
  813. font-weight: 400;
  814. line-height: 40rpx;
  815. }
  816. text {
  817. color: rgba(23, 23, 37, 1);
  818. font-family: DM Sans;
  819. font-size: 28rpx;
  820. font-weight: 400;
  821. line-height: 40rpx;
  822. }
  823. }
  824. .arrow-down {
  825. color: rgba(96, 98, 102, 1);
  826. font-size: 24rpx;
  827. font-weight: 400;
  828. transform: scale(1.5);
  829. }
  830. .selector-group:active {
  831. background: #f5f7fa !important;
  832. transform: scale(0.99);
  833. }
  834. .white-btn {
  835. width: 600rpx;
  836. font-size: 32rpx;
  837. text-align: center;
  838. color: #016bf6;
  839. background-color: #fff;
  840. border-radius: 88rpx;
  841. margin: 32rpx auto 0;
  842. }
  843. .load-container {
  844. position: fixed;
  845. left: 0;
  846. top: 0;
  847. width: 100%;
  848. height: 100%;
  849. display: flex;
  850. align-items: center;
  851. justify-content: center;
  852. background: rgba(0, 0, 0, 1);
  853. .loading-image {
  854. width: 100%;
  855. height: 100%;
  856. }
  857. }
  858. // 解析简历popup
  859. .resume-popup {
  860. position: relative;
  861. padding: 70rpx 40rpx 40rpx;
  862. .title {
  863. font-size: 40rpx;
  864. font-weight: 700;
  865. line-height: 52rpx;
  866. color: #333;
  867. margin-bottom: 12rpx;
  868. text {
  869. color: #016bf6;
  870. }
  871. }
  872. .tip {
  873. font-size: 28rpx;
  874. line-height: 36rpx;
  875. color: #999999;
  876. }
  877. .info-list {
  878. .info-item {
  879. box-sizing: border-box;
  880. border: 1px solid rgba(242, 242, 242, 1);
  881. border-radius: 6px;
  882. background: rgba(250, 250, 250, 1);
  883. padding: 26rpx 24rpx;
  884. margin-top: 40rpx;
  885. .label {
  886. font-size: 28rpx;
  887. font-weight: 500;
  888. line-height: 1;
  889. color: rgba(51, 51, 51, 1);
  890. }
  891. .border {
  892. width: 1px;
  893. height: 20rpx;
  894. margin: 0 20rpx;
  895. background: rgba(234, 234, 234, 1);
  896. }
  897. .content {
  898. flex: 1;
  899. width: 0;
  900. overflow: hidden;
  901. text-overflow: ellipsis;
  902. white-space: nowrap;
  903. color: rgba(153, 153, 153, 1);
  904. font-size: 28rpx;
  905. line-height: 1;
  906. }
  907. }
  908. }
  909. .button {
  910. width: 600rpx;
  911. height: 88rpx;
  912. border-radius: 88rpx;
  913. background: linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1));
  914. font-size: 32rpx;
  915. font-weight: 500;
  916. line-height: 88rpx;
  917. text-align: center;
  918. color: #fff;
  919. margin: 60rpx auto 0;
  920. }
  921. .close-button {
  922. position: absolute;
  923. top: 30rpx;
  924. right: 40rpx;
  925. width: 40rpx;
  926. height: 40rpx;
  927. border-radius: 40rpx;
  928. background: rgba(230, 230, 230, 1);
  929. }
  930. }
  931. // 简历解析提示弹窗
  932. .popup-container {
  933. position: fixed;
  934. left: 0;
  935. top: 0;
  936. width: 100vw;
  937. height: 100vh;
  938. display: flex;
  939. align-items: center;
  940. justify-content: center;
  941. background: rgba(0, 0, 0, 0.4);
  942. .popup-content {
  943. padding: 40rpx 0;
  944. border-radius: 20rpx;
  945. background: #fff;
  946. .popup-title {
  947. font-size: 32rpx;
  948. font-weight: 600;
  949. line-height: 56rpx;
  950. color: rgba(16, 24, 40, 1);
  951. text-align: center;
  952. margin-bottom: 20rpx;
  953. }
  954. .tip-container {
  955. padding: 0 130rpx;
  956. color: rgba(96, 96, 96, 1);
  957. font-size: 28rpx;
  958. line-height: 36rpx;
  959. }
  960. .upload-tip {
  961. display: block;
  962. width: 654rpx;
  963. height: 802rpx;
  964. }
  965. .button-primary {
  966. height: 80rpx;
  967. border-radius: 80rpx;
  968. text-align: center;
  969. color: #fff;
  970. font-size: 32rpx;
  971. line-height: 80rpx;
  972. margin: 0 40rpx;
  973. background: linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1));
  974. }
  975. }
  976. }
  977. </style>