23 Commits
Author SHA1 Message Date
xuxin d556170969 1.1岗位列表等新版本 2026-08-11 11:54:35 +08:00
xuxin 1e103627f8 加一个超级管理员登陆页面 2026-08-05 14:32:33 +08:00
xuxin 8b9ebd6ddc 删掉之前测试时用过的一个无效旧token 2026-07-29 15:18:24 +08:00
xuxin 5abd6d27d6 联系二维码图片存oss图片链接缓存oss里的 2026-07-27 14:31:02 +08:00
xuxin bb7a8c55b2 4个mvp补丁 2026-07-24 18:15:31 +08:00
xuxin a0f01dd697 插件上传谷歌商店验证文件 2026-07-22 10:01:10 +08:00
xuxin 58a027296a 隐私协议单独加个页面 2026-07-21 11:29:26 +08:00
xuxin 010a80be81 隐私协议单独加个页面 2026-07-21 11:20:01 +08:00
xuxin 6c03793daf 去掉offer派插件test和www不同环境域名的通信隔离 2026-07-17 20:19:59 +08:00
xuxin 33ecccdcb0 bug处理加文字样式微调 2026-07-17 20:00:24 +08:00
xuxin d429bae98a 备案号 2026-07-17 16:49:46 +08:00
xuxin 0b9f2e7333 备案号 2026-07-17 16:48:39 +08:00
xuxin db46766d48 个人资料教育经历学历类型保存bug,和岗位为列表页查询条件添加公司类型分类 2026-07-17 16:28:50 +08:00
xuxin 27d2592d06 bug修改 2026-07-17 15:12:41 +08:00
xuxin c81c9b79dd 没有个人资料时检测跳转登陆页,登陆页改造,添加新的业务配置文件来控制功能开关 2026-07-17 12:01:34 +08:00
xuxin 5f4aab8d04 bug处理 2026-07-16 18:36:40 +08:00
xuxin 15971bffd9 友盟跟踪记录 2026-07-16 16:30:07 +08:00
xuxin bf84da7783 bug处理,插件版本同步 2026-07-15 16:36:20 +08:00
xuxin 0911760e27 3个需求处理和插件通信组件引入(和插件共用的一个ts) 2026-07-15 09:49:21 +08:00
xuxin 66026f211c bug处理 2026-07-14 11:44:09 +08:00
xuxin 7abe158dbb bug处理 2026-07-13 23:01:49 +08:00
xuxin aed2535ab2 登陆和首页微调 2026-07-13 20:56:06 +08:00
xuxin 5f723e5573 ai助手投递偏好设置修复 2026-07-10 16:57:43 +08:00
124 changed files with 6629 additions and 2008 deletions
+2 -3
View File
@@ -13,6 +13,7 @@ declare module 'vue' {
export interface GlobalComponents { export interface GlobalComponents {
AgentApplyProgress: typeof import('./src/components/AgentApplyProgress.vue')['default'] AgentApplyProgress: typeof import('./src/components/AgentApplyProgress.vue')['default']
AgentApplyProgressPanel: typeof import('./src/components/AgentApplyProgressPanel.vue')['default'] AgentApplyProgressPanel: typeof import('./src/components/AgentApplyProgressPanel.vue')['default']
AgentBrowserInstallGuide: typeof import('./src/components/AgentBrowserInstallGuide.vue')['default']
AgentChatJobList: typeof import('./src/components/AgentChatJobList.vue')['default'] AgentChatJobList: typeof import('./src/components/AgentChatJobList.vue')['default']
AgentJobPreviewPanel: typeof import('./src/components/AgentJobPreviewPanel.vue')['default'] AgentJobPreviewPanel: typeof import('./src/components/AgentJobPreviewPanel.vue')['default']
AgentMatchJobAdd: typeof import('./src/components/AgentMatchJobAdd.vue')['default'] AgentMatchJobAdd: typeof import('./src/components/AgentMatchJobAdd.vue')['default']
@@ -30,17 +31,15 @@ declare module 'vue' {
ElDialog: typeof import('element-plus/es')['ElDialog'] ElDialog: typeof import('element-plus/es')['ElDialog']
ElIcon: typeof import('element-plus/es')['ElIcon'] ElIcon: typeof import('element-plus/es')['ElIcon']
ElInput: typeof import('element-plus/es')['ElInput'] ElInput: typeof import('element-plus/es')['ElInput']
ElOption: typeof import('element-plus/es')['ElOption']
ElRadio: typeof import('element-plus/es')['ElRadio'] ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup'] ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElSkeleton: typeof import('element-plus/es')['ElSkeleton'] ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem'] ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem']
ElSwitch: typeof import('element-plus/es')['ElSwitch']
ElTooltip: typeof import('element-plus/es')['ElTooltip'] ElTooltip: typeof import('element-plus/es')['ElTooltip']
FullscreenLoading: typeof import('./src/components/FullscreenLoading.vue')['default'] FullscreenLoading: typeof import('./src/components/FullscreenLoading.vue')['default']
HelloWorld: typeof import('./src/components/HelloWorld.vue')['default'] HelloWorld: typeof import('./src/components/HelloWorld.vue')['default']
IndustrySelector: typeof import('./src/components/tools/IndustrySelector.vue')['default'] IndustrySelector: typeof import('./src/components/tools/IndustrySelector.vue')['default']
JobApplyMethodDialog: typeof import('./src/components/JobApplyMethodDialog.vue')['default']
JobCategorySelector: typeof import('./src/components/tools/JobCategorySelector.vue')['default'] JobCategorySelector: typeof import('./src/components/tools/JobCategorySelector.vue')['default']
JobDislikeDialog: typeof import('./src/components/JobDislikeDialog.vue')['default'] JobDislikeDialog: typeof import('./src/components/JobDislikeDialog.vue')['default']
JobFeedbackDialog: typeof import('./src/components/JobFeedbackDialog.vue')['default'] JobFeedbackDialog: typeof import('./src/components/JobFeedbackDialog.vue')['default']
+10
View File
@@ -7,6 +7,16 @@
<title>Offer派 - 大学生AI求职平台 | 智能岗位匹配·一键自动网申·AI简历优化</title> <title>Offer派 - 大学生AI求职平台 | 智能岗位匹配·一键自动网申·AI简历优化</title>
<meta name="description" content="Offer派是专为大学生打造的AI求职平台,提供智能岗位匹配、一键自动网申、岗位定制简历、内推人脉直通等功能,让校招求职效率提升80%。" /> <meta name="description" content="Offer派是专为大学生打造的AI求职平台,提供智能岗位匹配、一键自动网申、岗位定制简历、内推人脉直通等功能,让校招求职效率提升80%。" />
<meta name="keywords" content="大学生求职,校招,AI求职,智能匹配,自动网申,简历优化,内推,Offer派" /> <meta name="keywords" content="大学生求职,校招,AI求职,智能匹配,自动网申,简历优化,内推,Offer派" />
<!-- 友盟统计 -->
<script>
var _czc = _czc || [];
(function () {
var um = document.createElement("script");
um.src = "https://v1.cnzz.com/z.js?id=1281490571&async=1";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(um, s);
})();
</script>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
+1
View File
@@ -20,6 +20,7 @@
"vuex": "^4.1.0" "vuex": "^4.1.0"
}, },
"devDependencies": { "devDependencies": {
"@types/chrome": "^0.2.2",
"@types/markdown-it": "^14.1.2", "@types/markdown-it": "^14.1.2",
"@types/node": "^24.10.1", "@types/node": "^24.10.1",
"@vitejs/plugin-vue": "^6.0.2", "@vitejs/plugin-vue": "^6.0.2",
+28
View File
@@ -36,6 +36,9 @@ importers:
specifier: ^4.1.0 specifier: ^4.1.0
version: 4.1.0(vue@3.5.29(typescript@5.9.3)) version: 4.1.0(vue@3.5.29(typescript@5.9.3))
devDependencies: devDependencies:
'@types/chrome':
specifier: ^0.2.2
version: 0.2.2
'@types/markdown-it': '@types/markdown-it':
specifier: ^14.1.2 specifier: ^14.1.2
version: 14.1.2 version: 14.1.2
@@ -490,9 +493,21 @@ packages:
'@sxzz/popperjs-es@2.11.8': '@sxzz/popperjs-es@2.11.8':
resolution: {integrity: sha512-wOwESXvvED3S8xBmcPWHs2dUuzrE4XiZeFu7e1hROIJkm02a49N120pmOXxY33sBb6hArItm5W5tcg1cBtV+HQ==} resolution: {integrity: sha512-wOwESXvvED3S8xBmcPWHs2dUuzrE4XiZeFu7e1hROIJkm02a49N120pmOXxY33sBb6hArItm5W5tcg1cBtV+HQ==}
'@types/chrome@0.2.2':
resolution: {integrity: sha512-8rSMZ4cvo2xmaSyQg0sN5yRL7oiDkntLoiHxUhfwQnv1mvnkrdoZ25SlNrKWmYKaeP50WvrfWj1pmc02+U9KKw==}
'@types/estree@1.0.8': '@types/estree@1.0.8':
resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==} resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
'@types/filesystem@0.0.36':
resolution: {integrity: sha512-vPDXOZuannb9FZdxgHnqSwAG/jvdGM8Wq+6N4D/d80z+D4HWH+bItqsZaVRQykAn6WEVeEkLm2oQigyHtgb0RA==}
'@types/filewriter@0.0.33':
resolution: {integrity: sha512-xFU8ZXTw4gd358lb2jw25nxY9QAgqn2+bKKjKOYfNCzN4DKCFetK7sPtrlpg66Ywe3vWY9FNxprZawAh9wfJ3g==}
'@types/har-format@1.2.16':
resolution: {integrity: sha512-fluxdy7ryD3MV6h8pTfTYpy/xQzCFC7m89nOH9y94cNqJ1mDIDPut7MnRHI3F6qRmh/cT2fUjG1MLdCNb4hE9A==}
'@types/linkify-it@5.0.0': '@types/linkify-it@5.0.0':
resolution: {integrity: sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==} resolution: {integrity: sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==}
@@ -1365,8 +1380,21 @@ snapshots:
'@sxzz/popperjs-es@2.11.8': {} '@sxzz/popperjs-es@2.11.8': {}
'@types/chrome@0.2.2':
dependencies:
'@types/filesystem': 0.0.36
'@types/har-format': 1.2.16
'@types/estree@1.0.8': {} '@types/estree@1.0.8': {}
'@types/filesystem@0.0.36':
dependencies:
'@types/filewriter': 0.0.33
'@types/filewriter@0.0.33': {}
'@types/har-format@1.2.16': {}
'@types/linkify-it@5.0.0': {} '@types/linkify-it@5.0.0': {}
'@types/lodash-es@4.17.12': '@types/lodash-es@4.17.12':
+1
View File
@@ -0,0 +1 @@
google-site-verification: google18c40aea647ea1cd.html
+1 -3
View File
@@ -301,9 +301,7 @@ export interface OptimizeResumeParams {
*/ */
export function optimizeAgentResume(params: OptimizeResumeParams) { export function optimizeAgentResume(params: OptimizeResumeParams) {
return aiService.post('/job-agent/optimize-resume', params, { return aiService.post('/job-agent/optimize-resume', params, {
headers: {
Token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VySWQiOjIwMzUyNTM4OTg5MTk4NzA0NjUsInV1SWQiOiI2MmQ5MDE2NTcyNzY0ZmNjODNjZTIyYjRjODA5ZmU5MiJ9.eE-Q5rio5J5kxkS-XPYdmk-1Tgvg6kj6NGoKWMFNU14',
},
}).then(res => res.data) }).then(res => res.data)
} }
+13
View File
@@ -54,6 +54,19 @@ export async function smsLogin(mobileNumber: string, code: string, inviteCode?:
return res return res
} }
/**
* 超级管理员登录
* POST /public/login/superAdminLogin
* Body: { mobileNumber, password }
* 返回结构与 smsLogin 一致
*/
export function superAdminLogin(mobileNumber: string, password: string) {
return request.post<any, ApiResult<LoginData>>('/public/login/superAdminLogin', {
mobileNumber,
password,
})
}
/** /**
* 检查登录状态 * 检查登录状态
* GET /public/checkLogin * GET /public/checkLogin
+99 -2
View File
@@ -3,6 +3,16 @@ import aiService from '@/utils/aiRequest'
import type { ApiResult } from '@/api/auth' import type { ApiResult } from '@/api/auth'
import type { AiResult } from '@/utils/aiRequest' import type { AiResult } from '@/utils/aiRequest'
// ==================== 岗位总数 ====================
/**
* 获取全网实时岗位总数
* GET /job/count
*/
export function fetchJobCount() {
return request.get<any, ApiResult<number>>('/job/count')
}
// ==================== 匹配详情 ==================== // ==================== 匹配详情 ====================
/** 匹配度详情 */ /** 匹配度详情 */
@@ -23,12 +33,16 @@ export interface JobListItem {
id: string id: string
/** 岗位标题 */ /** 岗位标题 */
title: string title: string
/** 薪资描述 */
salary?: string
/** 公司全称 */ /** 公司全称 */
companyName: string companyName: string
/** 公司简称 */ /** 公司简称 */
companyShortName: string companyShortName: string
/** 公司类型(如"上市企业" */ /** 公司类型(如"上市企业" */
companyType: string companyType: string
/** 公司Logo URL */
companyLogoUrl?: string
/** 公司标签列表(如 ["新能源汽车", "乘用车制造", "10000人以上"] */ /** 公司标签列表(如 ["新能源汽车", "乘用车制造", "10000人以上"] */
companyTags: string[] companyTags: string[]
/** 地区名称 */ /** 地区名称 */
@@ -41,13 +55,19 @@ export interface JobListItem {
sourceUrl: string sourceUrl: string
/** 是否已收藏 */ /** 是否已收藏 */
isFavorite: boolean isFavorite: boolean
/** 投递状态(null=未投递,0=已投递 1=面试中 2=有Offer 3=未通过 4=已结束) */
applicationStatus?: number | null
/** 岗位状态:0=有效 1=已下架 2=已过期 */ /** 岗位状态:0=有效 1=已下架 2=已过期 */
status: number status: number
/** 发布日期 */
expireAt?: string | null
/** 脚本名字 */
pyname?: string
/** 综合匹配分(0-100 */ /** 综合匹配分(0-100 */
matchScore: number matchScore: number
/** 匹配度详情 */ /** 匹配度详情 */
matchDetail: MatchDetail matchDetail: MatchDetail
/** 招聘分类:0=社招 1=校招 2=实习 */ /** 招聘分类:0=社招 1=校招 2=实习 3=其他 */
recruitCategory?: number recruitCategory?: number
/** 学历要求 0=不限 1=大专 2=本科 3=硕士 4=博士 */ /** 学历要求 0=不限 1=大专 2=本科 3=硕士 4=博士 */
education?: number education?: number
@@ -87,11 +107,62 @@ export interface JobListParams {
statusFilter?: number[] statusFilter?: number[]
/** 搜索关键词 */ /** 搜索关键词 */
keyword?: string keyword?: string
/** 招聘分类 0=招 1=实习 2=社招 3=其他 */ /** 招聘分类 0=招 1=校招 2=实习 3=其他 */
recruitCategory?: number recruitCategory?: number
/** 排除岗位ID列表(用于推荐时排除已推荐过的) */ /** 排除岗位ID列表(用于推荐时排除已推荐过的) */
excludeJobIds?: number[] excludeJobIds?: number[]
/** 公司类型列表(上市企业、独角兽、国企等,可多选) */
companyTypes?: string[]
/** 学历要求列表 0=不限 1=大专 2=本科 3=硕士 4=博士(可多选) */
educations?: number[]
/** 发布开始时间(ISO 8601格式,如 "2026-08-10T21:00:00Z" */
publishStartTime?: string
/** 发布截止时间(ISO 8601格式,如 "2026-08-11T21:00:00Z" */
publishEndTime?: string
}
// ==================== 热门推荐接口 ====================
/** 热门行业项 */
export interface HotIndustryItem {
id: number
name: string
}
/** 热门岗位项 */
export interface HotCategoryItem {
id: number
name: string
}
/** 热门城市项 */
export interface HotCityItem {
code: string
name: string
}
/**
* 获取热门推荐行业
* GET /job/industry/hot
*/
export function fetchHotIndustries() {
return request.get<any, ApiResult<HotIndustryItem[]>>('/job/industry/hot')
}
/**
* 获取热门推荐岗位
* GET /job/category/hot
*/
export function fetchHotCategories() {
return request.get<any, ApiResult<HotCategoryItem[]>>('/job/category/hot')
}
/**
* 获取热门推荐城市
* GET /job/city/hot
*/
export function fetchHotCities() {
return request.get<any, ApiResult<HotCityItem[]>>('/job/city/hot')
} }
// ==================== 求职意向 ==================== // ==================== 求职意向 ====================
@@ -145,6 +216,32 @@ export function fetchJobList(params: JobListParams = {}) {
}) })
} }
/**
* 获取筛选岗位数量
* POST /job/list/count
* @param params 与岗位列表相同的筛选参数
*/
export function fetchJobListCount(params: JobListParams = {}) {
return request.post<any, ApiResult<number>>('/job/list/count', {
pageNum: params.pageNum ?? 1,
pageSize: params.pageSize ?? 10,
...params,
})
}
/**
* 深度匹配岗位列表
* POST /job/list/match
* @param params 与岗位列表相同的筛选参数
*/
export function fetchJobListMatch(params: JobListParams = {}) {
return request.post<any, ApiResult<JobPageData>>('/job/list/match', {
pageNum: params.pageNum ?? 1,
pageSize: params.pageSize ?? 15,
...params,
})
}
// ==================== 收藏列表 ==================== // ==================== 收藏列表 ====================
/** 收藏列表请求参数 */ /** 收藏列表请求参数 */
Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 67 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 105 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1008 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.4 KiB

After

Width:  |  Height:  |  Size: 211 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 67 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 60 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 68 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.3 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 85 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 462 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 177 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 246 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 114 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 168 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 221 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 485 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 232 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 76 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 127 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 77 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 92 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 390 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 114 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 408 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 177 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 98 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 247 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 83 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.8 MiB

+14
View File
@@ -531,6 +531,11 @@ body:not(#_) {
.color-2{ .color-2{
color: #222; color: #222;
} }
.color-2F7DEA{
color: #2F7DEA;
}
.color-3{ .color-3{
color: #333; color: #333;
} }
@@ -583,6 +588,10 @@ body:not(#_) {
.color-9B9EAB{ .color-9B9EAB{
color:#9B9EAB; color:#9B9EAB;
} }
.color-D31414{
color: #D31414;
}
.color-accent{ .color-accent{
color:$accent; color:$accent;
} }
@@ -897,6 +906,9 @@ body:not(#_) {
.max-w1200{ .max-w1200{
max-width: 12rem; max-width: 12rem;
} }
.max-w602{
max-width: 6.02rem;
}
.w0{width: 0rem;} .w0{width: 0rem;}
.w1{width: 0.01rem;} .w2{width: 0.02rem;} .w3{width: 0.03rem;} .w4{width: 0.04rem;} .w5{width: 0.05rem;} .w6{width: 0.06rem;} .w7{width: 0.07rem;} .w8{width: 0.08rem;} .w9{width: 0.09rem;} .w10{width: 0.1rem;} .w11{width: 0.11rem;} .w12{width: 0.12rem;} .w13{width: 0.13rem;} .w14{width: 0.14rem;} .w15{width: 0.15rem;} .w16{width: 0.16rem;} .w17{width: 0.17rem;} .w18{width: 0.18rem;} .w19{width: 0.19rem;} .w20{width: 0.2rem;} .w21{width: 0.21rem;} .w22{width: 0.22rem;} .w23{width: 0.23rem;} .w24{width: 0.24rem;} .w25{width: 0.25rem;} .w26{width: 0.26rem;} .w27{width: 0.27rem;} .w28{width: 0.28rem;} .w29{width: 0.29rem;} .w30{width: 0.3rem;} .w31{width: 0.31rem;} .w32{width: 0.32rem;} .w33{width: 0.33rem;} .w34{width: 0.34rem;} .w35{width: 0.35rem;} .w36{width: 0.36rem;} .w37{width: 0.37rem;} .w38{width: 0.38rem;} .w39{width: 0.39rem;} .w40{width: 0.4rem;} .w41{width: 0.41rem;} .w42{width: 0.42rem;} .w43{width: 0.43rem;} .w44{width: 0.44rem;} .w45{width: 0.45rem;} .w46{width: 0.46rem;} .w47{width: 0.47rem;} .w48{width: 0.48rem;} .w49{width: 0.49rem;} .w50{width: 0.5rem;} .w51{width: 0.51rem;} .w52{width: 0.52rem;} .w53{width: 0.53rem;} .w54{width: 0.54rem;} .w55{width: 0.55rem;} .w56{width: 0.56rem;} .w57{width: 0.57rem;} .w58{width: 0.58rem;} .w59{width: 0.59rem;} .w60{width: 0.6rem;} .w61{width: 0.61rem;} .w62{width: 0.62rem;} .w63{width: 0.63rem;} .w64{width: 0.64rem;} .w65{width: 0.65rem;} .w66{width: 0.66rem;} .w67{width: 0.67rem;} .w68{width: 0.68rem;} .w69{width: 0.69rem;} .w70{width: 0.7rem;} .w71{width: 0.71rem;} .w72{width: 0.72rem;} .w73{width: 0.73rem;} .w74{width: 0.74rem;} .w75{width: 0.75rem;} .w76{width: 0.76rem;} .w77{width: 0.77rem;} .w78{width: 0.78rem;} .w79{width: 0.79rem;} .w80{width: 0.8rem;} .w81{width: 0.81rem;} .w82{width: 0.82rem;} .w83{width: 0.83rem;} .w84{width: 0.84rem;} .w85{width: 0.85rem;} .w86{width: 0.86rem;} .w87{width: 0.87rem;} .w88{width: 0.88rem;} .w89{width: 0.89rem;} .w90{width: 0.9rem;} .w91{width: 0.91rem;} .w92{width: 0.92rem;} .w93{width: 0.93rem;} .w94{width: 0.94rem;} .w95{width: 0.95rem;} .w96{width: 0.96rem;} .w97{width: 0.97rem;} .w98{width: 0.98rem;} .w99{width: 0.99rem;} .w1{width: 0.01rem;} .w2{width: 0.02rem;} .w3{width: 0.03rem;} .w4{width: 0.04rem;} .w5{width: 0.05rem;} .w6{width: 0.06rem;} .w7{width: 0.07rem;} .w8{width: 0.08rem;} .w9{width: 0.09rem;} .w10{width: 0.1rem;} .w11{width: 0.11rem;} .w12{width: 0.12rem;} .w13{width: 0.13rem;} .w14{width: 0.14rem;} .w15{width: 0.15rem;} .w16{width: 0.16rem;} .w17{width: 0.17rem;} .w18{width: 0.18rem;} .w19{width: 0.19rem;} .w20{width: 0.2rem;} .w21{width: 0.21rem;} .w22{width: 0.22rem;} .w23{width: 0.23rem;} .w24{width: 0.24rem;} .w25{width: 0.25rem;} .w26{width: 0.26rem;} .w27{width: 0.27rem;} .w28{width: 0.28rem;} .w29{width: 0.29rem;} .w30{width: 0.3rem;} .w31{width: 0.31rem;} .w32{width: 0.32rem;} .w33{width: 0.33rem;} .w34{width: 0.34rem;} .w35{width: 0.35rem;} .w36{width: 0.36rem;} .w37{width: 0.37rem;} .w38{width: 0.38rem;} .w39{width: 0.39rem;} .w40{width: 0.4rem;} .w41{width: 0.41rem;} .w42{width: 0.42rem;} .w43{width: 0.43rem;} .w44{width: 0.44rem;} .w45{width: 0.45rem;} .w46{width: 0.46rem;} .w47{width: 0.47rem;} .w48{width: 0.48rem;} .w49{width: 0.49rem;} .w50{width: 0.5rem;} .w51{width: 0.51rem;} .w52{width: 0.52rem;} .w53{width: 0.53rem;} .w54{width: 0.54rem;} .w55{width: 0.55rem;} .w56{width: 0.56rem;} .w57{width: 0.57rem;} .w58{width: 0.58rem;} .w59{width: 0.59rem;} .w60{width: 0.6rem;} .w61{width: 0.61rem;} .w62{width: 0.62rem;} .w63{width: 0.63rem;} .w64{width: 0.64rem;} .w65{width: 0.65rem;} .w66{width: 0.66rem;} .w67{width: 0.67rem;} .w68{width: 0.68rem;} .w69{width: 0.69rem;} .w70{width: 0.7rem;} .w71{width: 0.71rem;} .w72{width: 0.72rem;} .w73{width: 0.73rem;} .w74{width: 0.74rem;} .w75{width: 0.75rem;} .w76{width: 0.76rem;} .w77{width: 0.77rem;} .w78{width: 0.78rem;} .w79{width: 0.79rem;} .w80{width: 0.8rem;} .w81{width: 0.81rem;} .w82{width: 0.82rem;} .w83{width: 0.83rem;} .w84{width: 0.84rem;} .w85{width: 0.85rem;} .w86{width: 0.86rem;} .w87{width: 0.87rem;} .w88{width: 0.88rem;} .w89{width: 0.89rem;} .w90{width: 0.9rem;} .w91{width: 0.91rem;} .w92{width: 0.92rem;} .w93{width: 0.93rem;} .w94{width: 0.94rem;} .w95{width: 0.95rem;} .w96{width: 0.96rem;} .w97{width: 0.97rem;} .w98{width: 0.98rem;} .w99{width: 0.99rem;}
.w100{width: 1rem;} .w100{width: 1rem;}
@@ -919,12 +931,14 @@ body:not(#_) {
.w244{width: 2.44rem;} .w244{width: 2.44rem;}
.w263{width: 2.63rem;} .w263{width: 2.63rem;}
.w444{width: 4.44rem;} .w444{width: 4.44rem;}
.w706{width: 7.06rem;}
.w1200{width:12rem} .w1200{width:12rem}
/*height*/ /*height*/
.h0{height: 0rem;} .h0{height: 0rem;}
.h1{height: 0.01rem;} .h2{height: 0.02rem;} .h3{height: 0.03rem;} .h4{height: 0.04rem;} .h5{height: 0.05rem;} .h6{height: 0.06rem;} .h7{height: 0.07rem;} .h8{height: 0.08rem;} .h9{height: 0.09rem;} .h10{height: 0.1rem;} .h11{height: 0.11rem;} .h12{height: 0.12rem;} .h13{height: 0.13rem;} .h14{height: 0.14rem;} .h15{height: 0.15rem;} .h16{height: 0.16rem;} .h17{height: 0.17rem;} .h18{height: 0.18rem;} .h19{height: 0.19rem;} .h20{height: 0.2rem;} .h21{height: 0.21rem;} .h22{height: 0.22rem;} .h23{height: 0.23rem;} .h24{height: 0.24rem;} .h25{height: 0.25rem;} .h26{height: 0.26rem;} .h27{height: 0.27rem;} .h28{height: 0.28rem;} .h29{height: 0.29rem;} .h30{height: 0.3rem;} .h31{height: 0.31rem;} .h32{height: 0.32rem;} .h33{height: 0.33rem;} .h34{height: 0.34rem;} .h35{height: 0.35rem;} .h36{height: 0.36rem;} .h37{height: 0.37rem;} .h38{height: 0.38rem;} .h39{height: 0.39rem;} .h40{height: 0.4rem;} .h41{height: 0.41rem;} .h42{height: 0.42rem;} .h43{height: 0.43rem;} .h44{height: 0.44rem;} .h45{height: 0.45rem;} .h46{height: 0.46rem;} .h47{height: 0.47rem;} .h48{height: 0.48rem;} .h49{height: 0.49rem;} .h50{height: 0.5rem;} .h51{height: 0.51rem;} .h52{height: 0.52rem;} .h53{height: 0.53rem;} .h54{height: 0.54rem;} .h55{height: 0.55rem;} .h56{height: 0.56rem;} .h57{height: 0.57rem;} .h58{height: 0.58rem;} .h59{height: 0.59rem;} .h60{height: 0.6rem;} .h61{height: 0.61rem;} .h62{height: 0.62rem;} .h63{height: 0.63rem;} .h64{height: 0.64rem;} .h65{height: 0.65rem;} .h66{height: 0.66rem;} .h67{height: 0.67rem;} .h68{height: 0.68rem;} .h69{height: 0.69rem;} .h70{height: 0.7rem;} .h71{height: 0.71rem;} .h72{height: 0.72rem;} .h73{height: 0.73rem;} .h74{height: 0.74rem;} .h75{height: 0.75rem;} .h76{height: 0.76rem;} .h77{height: 0.77rem;} .h78{height: 0.78rem;} .h79{height: 0.79rem;} .h80{height: 0.8rem;} .h81{height: 0.81rem;} .h82{height: 0.82rem;} .h83{height: 0.83rem;} .h84{height: 0.84rem;} .h85{height: 0.85rem;} .h86{height: 0.86rem;} .h87{height: 0.87rem;} .h88{height: 0.88rem;} .h89{height: 0.89rem;} .h90{height: 0.9rem;} .h91{height: 0.91rem;} .h92{height: 0.92rem;} .h93{height: 0.93rem;} .h94{height: 0.94rem;} .h95{height: 0.95rem;} .h96{height: 0.96rem;} .h97{height: 0.97rem;} .h98{height: 0.98rem;} .h99{height: 0.99rem;} .h1{height: 0.01rem;} .h2{height: 0.02rem;} .h3{height: 0.03rem;} .h4{height: 0.04rem;} .h5{height: 0.05rem;} .h6{height: 0.06rem;} .h7{height: 0.07rem;} .h8{height: 0.08rem;} .h9{height: 0.09rem;} .h10{height: 0.1rem;} .h11{height: 0.11rem;} .h12{height: 0.12rem;} .h13{height: 0.13rem;} .h14{height: 0.14rem;} .h15{height: 0.15rem;} .h16{height: 0.16rem;} .h17{height: 0.17rem;} .h18{height: 0.18rem;} .h19{height: 0.19rem;} .h20{height: 0.2rem;} .h21{height: 0.21rem;} .h22{height: 0.22rem;} .h23{height: 0.23rem;} .h24{height: 0.24rem;} .h25{height: 0.25rem;} .h26{height: 0.26rem;} .h27{height: 0.27rem;} .h28{height: 0.28rem;} .h29{height: 0.29rem;} .h30{height: 0.3rem;} .h31{height: 0.31rem;} .h32{height: 0.32rem;} .h33{height: 0.33rem;} .h34{height: 0.34rem;} .h35{height: 0.35rem;} .h36{height: 0.36rem;} .h37{height: 0.37rem;} .h38{height: 0.38rem;} .h39{height: 0.39rem;} .h40{height: 0.4rem;} .h41{height: 0.41rem;} .h42{height: 0.42rem;} .h43{height: 0.43rem;} .h44{height: 0.44rem;} .h45{height: 0.45rem;} .h46{height: 0.46rem;} .h47{height: 0.47rem;} .h48{height: 0.48rem;} .h49{height: 0.49rem;} .h50{height: 0.5rem;} .h51{height: 0.51rem;} .h52{height: 0.52rem;} .h53{height: 0.53rem;} .h54{height: 0.54rem;} .h55{height: 0.55rem;} .h56{height: 0.56rem;} .h57{height: 0.57rem;} .h58{height: 0.58rem;} .h59{height: 0.59rem;} .h60{height: 0.6rem;} .h61{height: 0.61rem;} .h62{height: 0.62rem;} .h63{height: 0.63rem;} .h64{height: 0.64rem;} .h65{height: 0.65rem;} .h66{height: 0.66rem;} .h67{height: 0.67rem;} .h68{height: 0.68rem;} .h69{height: 0.69rem;} .h70{height: 0.7rem;} .h71{height: 0.71rem;} .h72{height: 0.72rem;} .h73{height: 0.73rem;} .h74{height: 0.74rem;} .h75{height: 0.75rem;} .h76{height: 0.76rem;} .h77{height: 0.77rem;} .h78{height: 0.78rem;} .h79{height: 0.79rem;} .h80{height: 0.8rem;} .h81{height: 0.81rem;} .h82{height: 0.82rem;} .h83{height: 0.83rem;} .h84{height: 0.84rem;} .h85{height: 0.85rem;} .h86{height: 0.86rem;} .h87{height: 0.87rem;} .h88{height: 0.88rem;} .h89{height: 0.89rem;} .h90{height: 0.9rem;} .h91{height: 0.91rem;} .h92{height: 0.92rem;} .h93{height: 0.93rem;} .h94{height: 0.94rem;} .h95{height: 0.95rem;} .h96{height: 0.96rem;} .h97{height: 0.97rem;} .h98{height: 0.98rem;} .h99{height: 0.99rem;}
.h100{height: 1rem;} .h100{height: 1rem;}
.h452{height: 4.52rem;}
//行高 //行高
.lh0{line-height: 0rem;} .lh0{line-height: 0rem;}
@@ -30,7 +30,7 @@
&__job-title { &__job-title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.27rem; line-height: 0.27rem;
} }
@@ -126,7 +126,7 @@
// 步骤名称 // 步骤名称
&__step-name { &__step-name {
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
line-height: 0.19rem; line-height: 0.19rem;
&--done { &--done {
@@ -0,0 +1,158 @@
// Agent浏览器插件安装步骤指引组件样式
@use '../variables' as *;
/* 步骤内容区域 */
.agent-browser-guide-drawer__body {
flex: 1;
overflow-y: auto;
padding: 0 0.32rem 0.32rem;
display: flex;
flex-direction: column;
gap: 0.16rem;
font-size: 0.14rem;
}
/* 步骤卡片 */
.agent-browser-guide-drawer__card {
border: 1px solid #F0F0F0;
border-radius: 0.12rem;
padding: 0.16rem 0.2rem;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.agent-browser-guide-drawer__step-row {
display: flex;
align-items: flex-start;
gap: 0.12rem;
margin-bottom: 0.16rem;
margin-right: 1rem;
}
.agent-browser-guide-drawer__step-num {
display: flex;
justify-content: center;
align-items: center;
width: 0.32rem;
height: 0.32rem;
background: #EDF9FA;
border-radius: 0.08rem;
font-size: 0.18rem;
font-weight: 620;
color: $accent;
flex-shrink: 0;
}
.agent-browser-guide-drawer__step-info {
flex: 1;
}
.agent-browser-guide-drawer__step-title {
font-size: 0.18rem;
font-weight: 620;
color: $text-dark;
line-height: 0.24rem;
margin: 0 0 0.04rem;
}
.agent-browser-guide-drawer__step-desc {
font-size: 0.14rem;
font-weight: 330;
color: $text-middle;
line-height: 0.19rem;
margin: 0;
}
/* 下载按钮区域 */
.agent-browser-guide-drawer__download-box {
display: flex;
align-items: center;
gap: 0.16rem;
padding: 0.04rem 0.04rem 0.04rem 0.16rem;
background: $bg-main;
border-radius: 0.12rem;
height: 0.44rem;
margin-left: 0.4rem;
}
.agent-browser-guide-drawer__download-name {
font-size: 0.14rem;
font-weight: 450;
color: $text-dark;
line-height: 0.19rem;
}
.agent-browser-guide-drawer__download-btn {
display: flex;
align-items: center;
gap: 0.04rem;
padding: 0.08rem 0.12rem;
background: $accent;
border: none;
border-radius: 0.08rem;
color: $bg-white;
font-size: 0.14rem;
font-weight: 620;
cursor: pointer;
transition: background 0.2s;
&:hover {
background: $accent-hover;
}
}
/* 浏览器链接区域 */
.agent-browser-guide-drawer__browser-links {
display: flex;
align-items: flex-start;
gap: 0.24rem;
margin-bottom: 0.16rem;
margin-left: 0.4rem;
}
.agent-browser-guide-drawer__browser-link {
display: flex;
align-items: center;
gap: 0.04rem;
padding: 0.12rem 0.16rem;
background: $bg-white;
border: 1px solid #F0F0F0;
border-radius: 0.08rem;
font-size: 0.14rem;
font-weight: 450;
color: $text-middle;
cursor: pointer;
transition: border-color 0.2s;
&:hover {
border-color: $accent;
}
svg {
flex-shrink: 0;
}
span {
white-space: nowrap;
}
}
.agent-browser-guide-drawer__copy-btn {
display: flex;
align-items: center;
gap: 0.04rem;
color: $accent;
font-size: 0.14rem;
font-weight: 450;
margin-left: 0.12rem;
}
/* 步骤示意图 */
.agent-browser-guide-drawer__step-img {
width: 100%;
max-width: 3.52rem;
border-radius: 0.08rem;
margin-top: 0.12rem;
margin-left: 0.4rem;
}
@@ -12,7 +12,7 @@
// 标题 // 标题
&__header { &__header {
font-size: 0.22rem; font-size: 0.22rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
margin-bottom: 0.04rem; margin-bottom: 0.04rem;
line-height: 0.29rem; line-height: 0.29rem;
@@ -127,7 +127,7 @@
// 岗位名称 // 岗位名称
&__title { &__title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.27rem; line-height: 0.27rem;
} }
@@ -208,7 +208,7 @@
background: transparent; background: transparent;
border: none; border: none;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
color: $accent; color: $accent;
cursor: pointer; cursor: pointer;
white-space: nowrap; white-space: nowrap;
@@ -232,7 +232,7 @@
border: none; border: none;
border-radius: 0.08rem; border-radius: 0.08rem;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
cursor: pointer; cursor: pointer;
white-space: nowrap; white-space: nowrap;
transition: all 0.2s ease; transition: all 0.2s ease;
@@ -291,7 +291,7 @@
border: 1px solid $accent; border: 1px solid $accent;
border-radius: 0.22rem; border-radius: 0.22rem;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
cursor: pointer; cursor: pointer;
transition: all 0.2s ease; transition: all 0.2s ease;
@@ -325,7 +325,7 @@
border: none; border: none;
border-radius: 0.22rem; border-radius: 0.22rem;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
cursor: pointer; cursor: pointer;
transition: all 0.2s ease; transition: all 0.2s ease;
@@ -60,7 +60,7 @@
/* 标题文字 */ /* 标题文字 */
&__title { &__title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.24rem; line-height: 0.24rem;
} }
@@ -89,7 +89,7 @@
/* 岗位标题 */ /* 岗位标题 */
&__job-title { &__job-title {
font-size: 0.24rem; font-size: 0.24rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.32rem; line-height: 0.32rem;
margin: 0 0 0.08rem; margin: 0 0 0.08rem;
@@ -221,7 +221,7 @@
&__company-name { &__company-name {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.24rem; line-height: 0.24rem;
} }
@@ -57,7 +57,7 @@
// 区块标题 // 区块标题
&__section-title { &__section-title {
font-size: 0.16rem; font-size: 0.16rem;
font-weight: 520; font-weight: 620;
line-height: 0.21rem; line-height: 0.21rem;
color: #1A1A1A; color: #1A1A1A;
} }
@@ -297,7 +297,7 @@
&__edit-dialog-title { &__edit-dialog-title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
line-height: 0.24rem; line-height: 0.24rem;
color: #1A1A1A; color: #1A1A1A;
} }
@@ -451,7 +451,7 @@
&__title { &__title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.24rem; line-height: 0.24rem;
} }
@@ -464,6 +464,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 0.16rem; gap: 0.16rem;
font-size: 0.14rem;
} }
/* 步骤卡片 */ /* 步骤卡片 */
@@ -471,6 +472,8 @@
border: 1px solid #F0F0F0; border: 1px solid #F0F0F0;
border-radius: 0.12rem; border-radius: 0.12rem;
padding: 0.16rem 0.2rem; padding: 0.16rem 0.2rem;
display: flex;
flex-wrap: wrap;
} }
&__step-row { &__step-row {
@@ -478,6 +481,7 @@
align-items: flex-start; align-items: flex-start;
gap: 0.12rem; gap: 0.12rem;
margin-bottom: 0.16rem; margin-bottom: 0.16rem;
margin-right: 1rem;
} }
&__step-num { &__step-num {
@@ -489,7 +493,7 @@
background: #EDF9FA; background: #EDF9FA;
border-radius: 0.08rem; border-radius: 0.08rem;
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $accent; color: $accent;
flex-shrink: 0; flex-shrink: 0;
} }
@@ -500,7 +504,7 @@
&__step-title { &__step-title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.24rem; line-height: 0.24rem;
margin: 0 0 0.04rem; margin: 0 0 0.04rem;
@@ -523,6 +527,7 @@
background: $bg-main; background: $bg-main;
border-radius: 0.12rem; border-radius: 0.12rem;
height: 0.44rem; height: 0.44rem;
margin-left: 0.4rem;
} }
&__download-name { &__download-name {
@@ -542,7 +547,7 @@
border-radius: 0.08rem; border-radius: 0.08rem;
color: $bg-white; color: $bg-white;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
cursor: pointer; cursor: pointer;
transition: background 0.2s; transition: background 0.2s;
@@ -557,6 +562,7 @@
align-items: flex-start; align-items: flex-start;
gap: 0.24rem; gap: 0.24rem;
margin-bottom: 0.16rem; margin-bottom: 0.16rem;
margin-left: 0.4rem;
} }
&__browser-link { &__browser-link {
@@ -599,9 +605,10 @@
/* 步骤示意图 */ /* 步骤示意图 */
&__step-img { &__step-img {
width: 100%; width: 100%;
max-width: 4rem; max-width: 3.52rem;
border-radius: 0.08rem; border-radius: 0.08rem;
margin-top: 0.12rem; margin-top: 0.12rem;
margin-left: 0.4rem;
} }
} }
@@ -60,7 +60,7 @@
/* 标题文字 */ /* 标题文字 */
&__title { &__title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.24rem; line-height: 0.24rem;
} }
@@ -136,7 +136,7 @@
/* 岗位标题 */ /* 岗位标题 */
&__card-title { &__card-title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.27rem; line-height: 0.27rem;
overflow: hidden; overflow: hidden;
@@ -56,15 +56,11 @@
// ==================== 下拉面板 ==================== // ==================== 下拉面板 ====================
&__panel { &__panel {
position: absolute;
top: calc(100% + 0.06rem);
left: 0;
width: 3.6rem; width: 3.6rem;
background: $bg-white; background: $bg-white;
border: 1px solid $border-color; border: 1px solid $border-color;
border-radius: 0.1rem; border-radius: 0.1rem;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
z-index: 100;
padding: 0.1rem; padding: 0.1rem;
// 只显示一栏时缩窄面板 // 只显示一栏时缩窄面板
@@ -57,15 +57,11 @@
// ==================== 下拉面板 ==================== // ==================== 下拉面板 ====================
&__panel { &__panel {
position: absolute;
top: calc(100% + 0.06rem);
left: 0;
width: 4.8rem; width: 4.8rem;
background: $bg-white; background: $bg-white;
border: 1px solid $border-color; border: 1px solid $border-color;
border-radius: 0.1rem; border-radius: 0.1rem;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
z-index: 100;
padding: 0.1rem; padding: 0.1rem;
// 只显示一栏时缩窄面板 // 只显示一栏时缩窄面板
@@ -42,7 +42,7 @@
&__title { &__title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
line-height: 0.24rem; line-height: 0.24rem;
color: #1A1A1A; color: #1A1A1A;
} }
@@ -1,5 +1,86 @@
@use '../variables' as *; @use '../variables' as *;
/* ==================== 岗位统计卡片 ==================== */
.job-stats-cards {
display: flex;
align-items: center;
gap: 0.16rem;
margin-left: auto;
filter: drop-shadow(0px 2px 10px rgba(0, 221, 179, 0.16));
/* 全网实时岗位卡片 */
&__count-card {
position: relative;
height: 0.43rem;
background: #0A171C;
border: 1px solid #1C4C55;
border-radius: 0.05rem;
}
/* 状态指示圆点 */
&__dot {
//position: absolute;
width: 0.08rem;
height: 0.08rem;
background: #2FE9F4;
border-radius: 50%;
box-shadow: 0px 0px 4px rgba(47, 233, 244, 0.75);
}
/* 岗位数字 */
&__count-num {
font-family: 'MiSans';
font-weight: 630;
font-size: 0.16rem;
line-height: 0.21rem;
color: #F4FFFF;
}
/* 岗位标签文字 */
&__count-label {
font-family: 'MiSans';
font-weight: 330;
font-size: 0.10rem;
line-height: 0.13rem;
color: #8AA8AF;
}
/* 可投率卡片 */
&__match-card {
position: relative;
width: 0.52rem;
height: 0.42rem;
background: #08161B;
border: 1px solid #20626D;
border-radius: 0.05rem;
}
/* 可投率数字 */
&__match-num {
position: absolute;
left: 0.08rem;
top: 0.04rem;
font-family: 'MiSans';
font-weight: 630;
font-size: 0.16rem;
line-height: 0.21rem;
color: #2FE9F4;
}
/* 可投率标签文字 */
&__match-label {
position: absolute;
left: 0.08rem;
top: 0.245rem;
font-family: 'MiSans';
font-weight: 620;
font-size: 0.10rem;
line-height: 0.13rem;
color: #8FB7BE;
}
}
.job-page-header { .job-page-header {
@@ -1398,9 +1398,9 @@
} }
} }
// 立即去投递按钮 // 下载专属简历按钮
&__submit-btn { &__submit-btn {
flex: 1; width: 100%;
height: 0.48rem; height: 0.48rem;
background: $btn-dark; background: $btn-dark;
color: $bg-white; color: $bg-white;
@@ -1415,6 +1415,20 @@
background: $btn-dark-hover; background: $btn-dark-hover;
} }
} }
// 下载专属简历按钮包裹含下拉菜单定位
&__submit-wrap {
position: relative;
flex: 1;
.job-resume-custom-dialog__top-download-menu {
top: auto;
bottom: 100%;
margin-top: 0;
margin-bottom: 0.06rem;
width: 100%;
}
}
} }
// 右侧滑入动画 // 右侧滑入动画
+377 -264
View File
@@ -1,4 +1,4 @@
// 会员弹窗样式新版 // 会员弹窗样式 新版黑金左右布局
@use '../variables' as *; @use '../variables' as *;
// 遮罩层 // 遮罩层
@@ -10,82 +10,163 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 0.14rem;
// 扫码支付弹窗的遮罩层级更高
&--qrcode {
z-index: 2400;
}
} }
// 弹窗主体 // 弹窗主体 左右布局
.member-dialog { .member-dialog {
box-sizing: border-box; box-sizing: border-box;
position: relative;
display: flex; display: flex;
flex-direction: column; width: 6.49rem;
align-items: flex-start; height: 4rem;
padding: 0.24rem 0.32rem; border-radius: 0.16rem;
gap: 0.24rem; box-shadow: 0 0.025rem 0.05rem rgba(60, 38, 13, 0.22);
width: 4.8rem; border: 0.00625rem solid #D9B873;
background: linear-gradient(180deg, #EDF9FA 0%, #FFFFFF 20.63%);
border: 1px solid #F0F0F0;
box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.05);
border-radius: 0.12rem;
font-size: 0.14rem; font-size: 0.14rem;
// 扫码支付弹窗变体 // ==================== 左侧黑金权益栏 ====================
&--qrcode { &__left {
position: relative;
width: 2rem;
height: 100%;
background: linear-gradient(180deg, #0F001E 0%, #1A0B09 18.09%, #452206 66.19%, #2C1500 100%);
padding: 0.24rem 0.20rem;
box-sizing: border-box;
overflow: hidden;
flex-shrink: 0;
border-radius: 0.16rem 0 0 0.16rem;
}
// 装饰线条背景
&__left-deco {
position: absolute;
width: 4.47rem;
height: 2.39rem;
left: -0.52rem;
top: -0.75rem;
background: radial-gradient(ellipse at center, rgba(255, 230, 175, 0.08) 0%, transparent 70%);
pointer-events: none;
}
&__left-title {
position: relative;
font-weight: 600;
font-size: 0.16rem;
line-height: 0.21rem;
color: #FFE9A6;
margin: 0 0 0.06rem;
}
&__left-subtitle {
position: relative;
font-weight: 330;
font-size: 0.12rem;
line-height: 0.16rem;
color: #F4E5CC;
margin: 0 0 0.2rem;
}
// ==================== 左栏权益卡片 ====================
&__benefits {
position: relative;
display: flex;
flex-direction: column;
gap: 0.16rem;
}
&__benefit-card {
box-sizing: border-box;
width: 1.56rem;
height: 0.6rem;
border: 0.00625rem solid #9C6D2D;
border-radius: 0.08rem;
display: flex;
align-items: center; align-items: center;
padding: 0 0.12rem;
gap: 0.12rem;
}
&__benefit-icon {
width: 0.32rem;
height: 0.32rem;
background: #4C3517;
border: 0.00625rem solid #D5A64A;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
svg {
width: 0.16rem;
height: 0.16rem;
}
}
&__benefit-info {
display: flex;
flex-direction: column;
gap: 0.04rem;
}
&__benefit-name {
font-weight: 450;
font-size: 0.14rem;
line-height: 0.19rem;
color: #FFE6AF;
}
&__benefit-desc {
font-weight: 330;
font-size: 0.1rem;
line-height: 0.13rem;
color: #F4E5CC;
}
// ==================== 左右分割金边 ====================
&__divider {
width: 0.01rem;
height: 100%;
background: #D6B15B;
flex-shrink: 0;
}
// ==================== 右侧内容区 ====================
&__right {
flex: 1;
background: linear-gradient(179.38deg, #FCEDD8 0.54%, #FEFBF5 19.09%);
display: flex;
flex-direction: column;
padding: 0.2rem 0.24rem;
box-sizing: border-box;
position: relative;
border-radius: 0 0.16rem 0.16rem 0;
} }
// ==================== 顶部标题行 ==================== // ==================== 顶部标题行 ====================
&__header { &__header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: flex-start; align-items: center;
width: 100%; margin-bottom: 0.2rem;
} }
&__header-left { &__title {
display: flex; font-weight: 600;
flex-direction: column; font-size: 0.18rem;
gap: 0.04rem; line-height: 0.24rem;
color: #1F160F;
margin: 0;
} }
&__header-right { &__header-actions {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 0.16rem; gap: 0.16rem;
} }
&__title { // 联系客服
font-weight: 620;
font-size: 0.18rem;
line-height: 0.24rem;
color: $text-dark;
margin: 0;
}
&__subtitle {
font-weight: 330;
font-size: 0.12rem;
line-height: 0.16rem;
color: $text-middle;
margin: 0;
}
&__contact {
font-weight: 330;
font-size: 0.12rem;
line-height: 0.16rem;
color: $text-light;
cursor: pointer;
&:hover {
color: $text-middle;
}
}
// 联系客服外层包装用于定位二维码弹出框
&__contact-wrap { &__contact-wrap {
position: relative; position: relative;
display: inline-flex; display: inline-flex;
@@ -96,7 +177,18 @@
} }
} }
// 联系客服二维码弹出框 &__contact {
font-weight: 330;
font-size: 0.12rem;
line-height: 0.16rem;
color: #2F343B;
cursor: pointer;
&:hover {
color: #1F160F;
}
}
&__contact-qr { &__contact-qr {
display: none; display: none;
position: absolute; position: absolute;
@@ -122,7 +214,6 @@
} }
} }
// 二维码弹出框底部箭头
&__contact-qr-arrow { &__contact-qr-arrow {
position: absolute; position: absolute;
bottom: -0.07rem; bottom: -0.07rem;
@@ -133,7 +224,6 @@
border-left: 0.08rem solid transparent; border-left: 0.08rem solid transparent;
border-right: 0.08rem solid transparent; border-right: 0.08rem solid transparent;
border-top: 0.08rem solid $bg-white; border-top: 0.08rem solid $bg-white;
filter: drop-shadow(0 0.02rem 0.02rem rgba(0, 0, 0, 0.05));
} }
&__close { &__close {
@@ -143,355 +233,378 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 0.14rem; font-size: 0.14rem;
color: $text-middle; color: #2F343B;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
color: $text-dark; color: #1F160F;
} }
} }
// ==================== 套餐选择区域 ==================== // ==================== 套餐选择区域 ====================
&__plans { &__plans {
display: flex; display: flex;
gap: 0.13rem; gap: 0.2rem;
width: 100%; margin-bottom: 0.2rem;
} }
&__plan-card { &__plan-card {
box-sizing: border-box; box-sizing: border-box;
width: 1.2rem;
height: 1.4rem;
background: #FFFDF8;
border: 1px solid #E7C991;
border-radius: 0.08rem;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 0.12rem 0.16rem; gap: 0.08rem;
gap: 0.04rem;
width: 1.3rem;
height: 1.01rem;
background: $bg-white;
border: 1px solid #F0F0F0;
border-radius: 0.08rem;
cursor: pointer; cursor: pointer;
transition: border-color 0.2s;
position: relative; position: relative;
transition: border-color 0.2s, box-shadow 0.2s;
&:hover { &:hover {
border-color: $accent; border-color: #B77D24;
} }
// 选中 粗边框 // 选中态
&--active { &--active {
border: 3px solid $accent; background: linear-gradient(180deg, #FFF4D8 0%, #FDF9F1 100%);
border: 2px solid #B77D24;
box-shadow: 0 0.04rem 0.08rem rgba(183, 125, 36, 0.2);
} }
} }
&__plan-recommend { // 推荐角标
&__plan-badge {
position: absolute; position: absolute;
top: -0.1rem; top: -0.12rem;
left: 10%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
white-space: nowrap; white-space: nowrap;
background: $accent; background: #C28A2F;
color: $bg-white; border: 0.00625rem solid #F0D091;
font-size: 0.1rem; border-radius: 0.075rem;
padding: 0.02rem 0.08rem; padding: 0.04rem 0.12rem;
border-radius: 0.08rem; font-weight: 600;
font-weight: 620; font-size: 0.12rem;
line-height: 0.16rem;
color: #FFFFFF;
} }
&__plan-name { &__plan-name {
font-weight: 450; font-weight: 600;
font-size: 0.14rem; font-size: 0.14rem;
line-height: 0.19rem; line-height: 0.19rem;
text-align: center; text-align: center;
color: $text-dark; color: #1F160F;
} }
&__plan-price { &__plan-price {
display: flex; display: flex;
align-items: flex-end; align-items: baseline;
justify-content: center; justify-content: center;
gap: 0.04rem;
padding: 0.04rem 0;
} }
&__plan-price-symbol { &__plan-price-symbol {
font-weight: 450; font-weight: 600;
font-size: 0.14rem; font-size: 0.14rem;
line-height: 0.19rem; color: #1F160F;
color: $text-dark;
} }
&__plan-price-num { &__plan-price-num {
font-weight: 630; font-weight: 600;
font-size: 0.24rem; font-size: 0.28rem;
line-height: 0.18rem; line-height: 0.37rem;
color: $text-dark; color: #1F160F;
} }
&__plan-original-price { &__plan-original {
font-weight: 330; font-weight: 330;
font-size: 0.12rem; font-size: 0.12rem;
line-height: 0.16rem; line-height: 0.16rem;
text-decoration: line-through; text-decoration: line-through;
color: $text-light; color: #7A7D82;
margin-left: 0.04rem;
} }
&__plan-daily { &__plan-tag {
font-weight: 330; font-weight: 330;
font-size: 0.12rem; font-size: 0.12rem;
line-height: 0.16rem; line-height: 0.16rem;
text-align: center; text-align: center;
color: $accent; color: #3B2A1E;
} }
// ==================== 会员权益区域 ==================== // ==================== 支付方式选择步骤一 ====================
&__benefits { &__step-pay {
width: 100%;
}
&__benefits-title {
font-weight: 450;
font-size: 0.14rem;
line-height: 0.19rem;
color: $text-dark;
margin: 0 0 0.16rem;
}
&__benefits-cards {
display: flex;
gap: 0.13rem;
width: 100%;
}
&__benefit-card {
box-sizing: border-box;
flex: 1; flex: 1;
display: flex;
align-items: center;
padding: 0.12rem 0.16rem;
gap: 0.1rem;
background: $bg-white;
border: 1px solid #AEE6EA;
border-radius: 0.08rem;
} }
&__benefit-icon { &__payment-section {
width: 0.4rem; margin-bottom: 0.16rem;
height: 0.4rem;
display: flex;
align-items: center;
justify-content: center;
background: #EDF9FA;
border-radius: 50%;
flex-shrink: 0;
svg {
width: 0.24rem;
height: 0.24rem;
}
}
&__benefit-info {
display: flex;
flex-direction: column;
gap: 0.04rem;
}
&__benefit-name {
font-weight: 450;
font-size: 0.14rem;
line-height: 0.19rem;
color: $accent;
}
&__benefit-desc {
font-weight: 330;
font-size: 0.12rem;
line-height: 0.16rem;
color: $text-middle;
}
// ==================== 支付方式选择 ====================
&__payment {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
} }
&__payment-label { &__payment-label {
font-weight: 450; font-weight: 450;
font-size: 0.14rem; font-size: 0.14rem;
line-height: 0.19rem; line-height: 0.19rem;
color: $text-dark; color: #1F160F;
display: block;
margin-bottom: 0.08rem;
} }
&__payment-methods { &__payment-methods {
display: flex; display: flex;
align-items: center;
gap: 0.24rem; gap: 0.24rem;
} }
&__payment-item { &__payment-item {
box-sizing: border-box;
width: 1.88rem;
height: 0.58rem;
background: #FFFDF8;
border: 1px solid #E7C991;
border-radius: 0.08rem;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0.04rem 0.08rem; padding: 0 0.2rem;
gap: 0.06rem; gap: 0.12rem;
border-radius: 0.04rem;
cursor: pointer; cursor: pointer;
transition: background 0.2s; position: relative;
transition: border-color 0.2s;
svg { svg {
width: 0.16rem; width: 0.32rem;
height: 0.16rem; height: 0.32rem;
flex-shrink: 0; flex-shrink: 0;
} }
// 微信选中态 // 选中态
&--wechat-active { &--active {
background: #EBFEF4; border-color: #B77D24;
}
// 支付宝选中态
&--alipay-active {
background: #EBF3FF;
} }
} }
&__payment-text { &__payment-text {
font-weight: 620; font-weight: 600;
font-size: 0.12rem; font-size: 0.13rem;
line-height: 0.18rem; line-height: 0.17rem;
color: #1F160F;
}
&--wechat { // 选中圆圈
color: #07C160; &__payment-radio {
} box-sizing: border-box;
width: 0.14rem;
height: 0.14rem;
background: #FFFDF8;
border: 1px solid #E7C991;
border-radius: 50%;
margin-left: auto;
display: flex;
align-items: center;
justify-content: center;
&--alipay { .member-dialog__payment-item--active & {
color: #1677FF; border-color: #C28A2F;
} }
} }
// ==================== 购买按钮 ==================== &__payment-radio-inner {
width: 0.08rem;
height: 0.08rem;
background: #C28A2F;
border-radius: 50%;
}
// ==================== 底部栏步骤一/步骤二共用 ====================
&__bottom-bar {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 0.66rem;
background: #FCF4E8;
border-top: 1px solid #E9D4B1;
border-radius: 0 0 0.16rem 0;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 0.24rem;
box-sizing: border-box;
&--qrcode {
height: 1.7rem;
padding: 0.2rem 0.24rem;
gap: 0.24rem;
justify-content: flex-start;
}
}
&__footer-price {
display: flex;
align-items: baseline;
gap: 0.04rem;
}
&__footer-price-label {
font-weight: 330;
font-size: 0.12rem;
line-height: 0.16rem;
color: #1F160F;
margin-right: 0.08rem;
}
&__footer-price-symbol {
font-weight: 600;
font-size: 0.14rem;
color: #1F160F;
}
&__footer-price-num {
font-weight: 600;
font-size: 0.24rem;
line-height: 0.32rem;
color: #1F160F;
}
// 购买会员按钮
&__buy-btn { &__buy-btn {
width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 0.08rem 0.12rem; padding: 0.08rem 0.24rem;
height: 0.35rem; height: 0.33rem;
background: #AEE6EA; background: #C88E35;
border: 1px solid #F0D091;
box-shadow: 0 0.02rem 0.05rem rgba(154, 104, 32, 0.18);
border-radius: 0.08rem; border-radius: 0.08rem;
border: none; font-weight: 600;
font-weight: 450; font-size: 0.13rem;
font-size: 0.14rem; line-height: 0.15rem;
line-height: 0.19rem; color: #FFFFFF;
color: $bg-white; cursor: pointer;
cursor: default; border: 1px solid #F0D091;
opacity: 0.4; transition: opacity 0.2s;
transition: background 0.2s, opacity 0.2s;
// 选择了支付方式后变为主题色不透明可点击 &:hover {
&--active { opacity: 0.9;
background: $accent; }
opacity: 1;
cursor: pointer;
&:hover { &:disabled {
background: $accent-hover; opacity: 0.5;
} cursor: default;
} }
} }
// ==================== 扫码支付弹窗内容 ==================== // ==================== 扫码支付区域底部栏内 ====================
&__qrcode-content {
&__qrcode-box {
width: 1.2rem;
height: 1.2rem;
border: 2px solid #B77D24;
border-radius: 0.0rem;
display: flex;
align-items: center;
justify-content: center;
background: #FFFFFF;
flex-shrink: 0;
}
&__qrcode-iframe {
border: none;
border-radius: 0.04rem;
}
.qrcode-zhifubao{
transform: scale(0.52);
width: 2.2rem !important;
height: 2.2rem !important;
padding-top: 0.1rem;
padding-left: 0.1rem;
box-sizing: border-box;
}
.qrcode-wechat{
transform: scale(0.66);
width: 1.6rem !important;
height: 1.6rem !important;
box-sizing: border-box;
}
&__qrcode-info {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; gap: 0.12rem;
gap: 0.16rem;
width: 100%;
}
&__qrcode-image {
width: 2.1rem;
height: 2.1rem;
display: flex;
align-items: center;
justify-content: center;
}
&__payment-iframe {
width: 100%;
height: 100%;
border: none;
border-radius: 0.08rem;
}
&__wechat-qr-iframe {
width: 2.2rem;
height: 2.2rem;
border: none;
border-radius: 0.08rem;
} }
&__qrcode-price-row { &__qrcode-price-row {
display: flex; display: flex;
align-items: flex-end; align-items: center;
gap: 0.08rem; gap: 0.04rem;
} }
&__qrcode-price { &__qrcode-price-symbol {
font-weight: 630; font-weight: 600;
font-size: 0.18rem;
color: #1F160F;
}
&__qrcode-price-num {
font-size: 0.32rem; font-size: 0.32rem;
line-height: 0.25rem; font-weight: 600;
color: $text-dark; line-height: 0.37rem;
color: #1F160F;
} }
&__qrcode-tip { &__qrcode-tip {
font-weight: 330; font-weight: 330;
font-size: 0.14rem; font-size: 0.14rem;
line-height: 0.1rem; line-height: 0.19rem;
color: $text-dark; color: #1F160F;
margin-left: 0.08rem;
vertical-align: middle;
} }
&__qrcode-agreement { &__qrcode-agreement {
font-weight: 330; font-weight: 330;
font-size: 0.14rem; font-size: 0.12rem;
line-height: 0.19rem; line-height: 0.16rem;
color: $text-light; color: #3B2A1E;
margin: 0; margin: 0;
a { a {
color: $text-light; color: #A86718;
text-decoration: none; text-decoration: none;
&:hover { &:hover {
color: $accent; color: #A86718;
} }
} }
} }
// 已支付成功按钮 // 已支付成功按钮
&__paid-btn { &__paid-btn {
width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 0.08rem 0.12rem; padding: 0.08rem 0.24rem;
height: 0.35rem; height: 0.33rem;
background: $accent; width: fit-content;
background: #C88E35;
border: 1px solid #F0D091;
box-shadow: 0 0.02rem 0.05rem rgba(154, 104, 32, 0.18);
border-radius: 0.08rem; border-radius: 0.08rem;
border: none; font-weight: 600;
font-weight: 450; font-size: 0.13rem;
font-size: 0.14rem; line-height: 0.15rem;
line-height: 0.19rem; color: #FFFFFF;
color: $bg-white;
cursor: pointer; cursor: pointer;
transition: background 0.2s; transition: opacity 0.2s;
&:hover { &:hover {
background: $accent-hover; opacity: 0.9;
} }
} }
} }
@@ -251,17 +251,15 @@
&__tag { &__tag {
font-size: 0.12rem; font-size: 0.12rem;
color: $text-dark; color: $accent;
background: $bg-main; background: #fff;
border: 1px solid $border-color; border: 1px solid $accent;
border-radius: 0.16rem; border-radius: 0.04rem;
padding: 0.05rem 0.16rem; padding: 0.05rem 0.08rem;
transition: all 0.2s; transition: all 0.2s;
&:hover { &:hover {
border-color: $accent;
color: $accent;
background: $theme-color;
} }
} }
@@ -55,15 +55,11 @@
// ==================== 下拉面板 ==================== // ==================== 下拉面板 ====================
&__panel { &__panel {
position: absolute;
top: calc(100% + 0.06rem);
left: 0;
width: 4.2rem; width: 4.2rem;
background: $bg-white; background: $bg-white;
border: 1px solid $border-color; border: 1px solid $border-color;
border-radius: 0.1rem; border-radius: 0.1rem;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
z-index: 100;
padding: 0.1rem; padding: 0.1rem;
// level=2 时只有两栏面板收窄 // level=2 时只有两栏面板收窄
+216 -45
View File
@@ -12,6 +12,14 @@
position: fixed; position: fixed;
left: 0; left: 0;
top: 0; top: 0;
z-index: 100;
// 窄版模式window.innerWidth < 1440
&--narrow {
width: 0.8rem;
padding: 0.16rem 0.10rem;
align-items: center;
}
&__header { &__header {
display: flex; display: flex;
@@ -21,6 +29,12 @@
margin-bottom: 0.2rem; margin-bottom: 0.2rem;
} }
// 窄版header居中
&--narrow &__header {
justify-content: center;
padding: 0.1rem 0;
}
&__avatar { &__avatar {
width: 0.36rem; width: 0.36rem;
height: 0.36rem; height: 0.36rem;
@@ -43,6 +57,12 @@
width: 1.32rem; width: 1.32rem;
height: 0.34rem; height: 0.34rem;
display: block; display: block;
// 窄版logo
&--narrow {
width: 0.46rem;
height: auto;
}
} }
&__menu { &__menu {
@@ -52,7 +72,13 @@
flex: 1; flex: 1;
} }
// 窄版菜单宽度撑满
&--narrow &__menu {
width: 100%;
}
&__item { &__item {
position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 0.04rem; gap: 0.04rem;
@@ -79,18 +105,45 @@
} }
} }
// 窄版导航项纵向居中排列
&--narrow &__item {
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.04rem;
padding: 0.1rem 0.06rem;
}
&__item-icon { &__item-icon {
width: 0.2rem; width: 0.2rem;
height: 0.2rem; height: 0.2rem;
object-fit: contain; object-fit: contain;
font-size: 0.16rem; font-size: 0.16rem;
// 内部SVG/img统一撑满容器
svg, img {
width: 100%;
height: 100%;
display: block;
}
}
// 窄版图标放大防止scale缩放后图标过小
&--narrow &__item-icon {
width: 0.24rem;
height: 0.24rem;
} }
&__item-label { &__item-label {
} }
// 窄版label字号缩小
&--narrow &__item-label {
font-size: 0.11rem;
white-space: nowrap;
}
&__badge { &__badge {
background: #e85635; background: #e85635;
color: #fff; color: #fff;
@@ -118,6 +171,39 @@
text-align: center; text-align: center;
color: #FFFFFF; color: #FFFFFF;
flex: none; flex: none;
// 窄版角标样式右上角定位
&--corner {
position: absolute;
top: -0.07rem;
right: -0.05rem;
min-width: auto;
padding: 0.02rem 0.04rem;
height: 0.17rem;
font-size: 0.10rem;
line-height: 0.12rem;
border-radius: 0.03rem;
}
}
// 公测群二维码弹出层hover索引5时显示
&__qrcode-popup {
position: absolute;
top: calc(100% + 0.08rem);
left: 0;
padding: 0.08rem;
background: #fff;
border-radius: 0.08rem;
box-shadow: 0 0.02rem 0.12rem rgba(0, 0, 0, 0.08);
z-index: 100;
}
&__qrcode-img {
display: block;
width: auto;
height: auto;
max-width: 1.6rem;
border-radius: 0.04rem;
} }
&__footer { &__footer {
@@ -126,6 +212,48 @@
gap: 0.04rem; gap: 0.04rem;
padding-top: 0.12rem; padding-top: 0.12rem;
} }
// 窄版footer居中
&--narrow &__footer {
align-items: center;
width: 100%;
}
}
// ==================== 窄版邀请图片卡片 ====================
.side-nav__referral-card-narrow {
display: flex;
justify-content: center;
margin-top: 0.12rem;
}
.side-nav__referral-card-narrow-img {
width: 0.56rem;
height: 0.85rem;
display: block;
border-radius: 0.06rem;
}
// ==================== 窄版用户信息 ====================
.side-nav__user-info-narrow {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.06rem;
cursor: pointer;
padding: 0.08rem 0;
border-radius: 0.08rem;
&:hover {
}
}
.side-nav__user-avatar-narrow {
width: 0.26rem;
height: 0.26rem;
border-radius: 50%;
display: block;
} }
.side-nav__dialog-overlay { .side-nav__dialog-overlay {
@@ -478,84 +606,120 @@
// ==================== 邀请会员卡片 ==================== // ==================== 邀请会员卡片 ====================
.side-nav__referral-card { .side-nav__referral-card {
position: relative;
width: 100%; width: 100%;
background: linear-gradient(128.17deg, #52CAD1 0%, #82D79B 100%); height: 2.21rem;
background: linear-gradient(90deg, #DFF5F6 0%, #FBFDF7 100%);
box-shadow: 0px 0px 0.08rem rgba(0, 0, 0, 0.06);
border-radius: 0.08rem; border-radius: 0.08rem;
padding: 0.16rem;
box-sizing: border-box; box-sizing: border-box;
margin-top: 0.12rem; margin-top: 0.12rem;
overflow: hidden;
}
// 顶部区域标题在左上礼物图片定位在右下角
.side-nav__referral-top {
position: relative;
padding: 0.2rem 0.16rem 0.4rem;
}
.side-nav__referral-top-text {
position: relative;
z-index: 1;
} }
.side-nav__referral-title { .side-nav__referral-title {
font-size: 0.16rem; font-size: 0.18rem;
font-weight: 630; font-weight: 630;
color: #FFFFFF; color: #1A1A1A;
line-height: 0.21rem; line-height: 0.24rem;
&--accent {
background: linear-gradient(128.17deg, #52CAD1 0%, #82D79B 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
} }
.side-nav__referral-subtitle { .side-nav__referral-subtitle {
font-size: 0.10rem; font-size: 0.14rem;
font-weight: 330; font-weight: 330;
color: #EAFBFC; color: #6A7282;
line-height: 0.13rem; line-height: 0.19rem;
margin-top: 0.04rem; margin-top: 0.08rem;
} }
// 礼物图片absolute定位在顶部区域的右下角底部被毛玻璃面板遮住
.side-nav__referral-gift {
position: absolute;
right: 0.10rem;
bottom: 0.02rem;
width: 0.68rem;
height: 0.68rem;
mix-blend-mode: darken;
}
// 白色毛玻璃面板覆盖在礼物底部之上
.side-nav__referral-panel { .side-nav__referral-panel {
background: #FFFFFF; position: absolute;
box-shadow: 0px 0.02rem 0.06rem rgba(26, 26, 26, 0.05); left: 0;
border-radius: 0.06rem; bottom: 0;
padding: 0.10rem 0.08rem; width: 100%;
margin-top: 0.10rem; height: 1.38rem;
background: rgba(255, 255, 255, 0.4);
border: 1px solid #FFFFFF;
border-bottom: none;
backdrop-filter: blur(3px);
border-radius: 0.08rem 0.08rem 0 0;
box-sizing: border-box;
padding: 0.16rem;
} }
.side-nav__referral-row { .side-nav__referral-row {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; gap: 0.08rem;
} }
.side-nav__referral-label { .side-nav__referral-label {
font-size: 0.10rem; font-size: 0.14rem;
font-weight: 330; font-weight: 330;
color: #6B7280; color: #6A7282;
line-height: 0.13rem; line-height: 0.19rem;
} }
.side-nav__referral-value { .side-nav__referral-value {
font-size: 0.10rem; font-size: 0.14rem;
font-weight: 620; font-weight: 450;
color: #52CAD1; line-height: 0.19rem;
line-height: 0.13rem; background: linear-gradient(128.17deg, #52CAD1 0%, #82D79B 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
} }
.side-nav__referral-track { .side-nav__referral-track {
width: 100%; width: 100%;
height: 0.02rem; height: 0.06rem;
background: #D7F1F3; background: #EDF9FA;
border-radius: 9999px; border-radius: 0.06rem;
margin-top: 0.06rem; margin-top: 0.1rem;
overflow: hidden; overflow: hidden;
} }
.side-nav__referral-fill { .side-nav__referral-fill {
height: 100%; height: 100%;
background: #52CAD1; background: #52CAD1;
border-radius: 9999px; border-radius: 0.06rem;
}
.side-nav__referral-divider {
width: 100%;
border-top: 0.01rem solid #8C8C8C;
margin-top: 0.08rem;
} }
.side-nav__referral-tip { .side-nav__referral-tip {
font-size: 0.10rem; font-size: 0.12rem;
font-weight: 330; font-weight: 330;
color: #1A1A1A; color: #6A7282;
line-height: 0.13rem; line-height: 0.16rem;
margin-top: 0.08rem; margin-top: 0.06rem;
strong { strong {
font-weight: 630; font-weight: 630;
@@ -563,16 +727,22 @@
} }
.side-nav__referral-action { .side-nav__referral-action {
font-size: 0.11rem; display: flex;
font-weight: 620; align-items: center;
color: #52CAD1; justify-content: center;
line-height: 0.15rem; width: 100%;
text-align: center; height: 0.40rem;
margin-top: 0.08rem; background: linear-gradient(90deg, #36C1C9 16.99%, #AFE9D0 100%);
box-shadow: inset 0px 0px 0.06rem rgba(255, 255, 255, 0.5);
border-radius: 0.08rem;
font-size: 0.14rem;
font-weight: 600;
color: #FFFFFF;
margin-top: 0.12rem;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
opacity: 0.8; opacity: 0.9;
} }
} }
@@ -680,12 +850,13 @@
bottom: calc(100% + 0.08rem); bottom: calc(100% + 0.08rem);
left: 0; left: 0;
width: 100%; width: 100%;
min-width: 1.65rem;
background: #FFFFFF; background: #FFFFFF;
border: 1px solid #F0F0F0; border: 1px solid #F0F0F0;
box-shadow: 0px 0.02rem 0.08rem rgba(0, 0, 0, 0.04); box-shadow: 0px 0.02rem 0.08rem rgba(0, 0, 0, 0.04);
border-radius: 0.08rem; border-radius: 0.08rem;
overflow: hidden; overflow: hidden;
z-index: 100; z-index: 1000;
} }
.side-nav__account-popup-header { .side-nav__account-popup-header {
+1
View File
@@ -44,6 +44,7 @@
@use './components/member-access-dialog.scss'; @use './components/member-access-dialog.scss';
@use './components/step-progress-overlay.scss'; @use './components/step-progress-overlay.scss';
@use './components/mentor-aside-panel.scss'; @use './components/mentor-aside-panel.scss';
@use './components/agent-browser-install-guide.scss';
// 全局样式优先级最高 // 全局样式优先级最高
@use './auto.scss'; @use './auto.scss';
+133 -13
View File
@@ -8,7 +8,7 @@
font-size: 0.14rem; font-size: 0.14rem;
// 主内容区域左侧导航栏右边的部分 // 主内容区域左侧导航栏右边的部分
&__content { &__content {
margin-left: 2.2rem; margin-left: var(--nav-width, 2.2rem);
flex: 1; flex: 1;
overflow-y: auto; overflow-y: auto;
height: var(--app-height, 100vh); height: var(--app-height, 100vh);
@@ -279,8 +279,6 @@
border-radius: 0.12rem; border-radius: 0.12rem;
max-height: calc(var(--app-height, 100vh) - 1.4rem); max-height: calc(var(--app-height, 100vh) - 1.4rem);
overflow-y: auto; overflow-y: auto;
display: flex;
flex-direction: column;
scrollbar-width: none; // Firefox scrollbar-width: none; // Firefox
-ms-overflow-style: none; // IE/Edge -ms-overflow-style: none; // IE/Edge
@@ -690,7 +688,7 @@
&__step2-faq-title { &__step2-faq-title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $accent; color: $accent;
margin-bottom: 0.13rem; margin-bottom: 0.13rem;
} }
@@ -706,7 +704,7 @@
&__step2-faq-item-title { &__step2-faq-item-title {
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
margin-bottom: 0.08rem; margin-bottom: 0.08rem;
} }
@@ -972,7 +970,6 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 0.16rem; gap: 0.16rem;
padding: 0.24rem;
} }
// 单个步骤卡片 // 单个步骤卡片
@@ -1014,7 +1011,7 @@
background: #EDF9FA; background: #EDF9FA;
border-radius: 0.08rem; border-radius: 0.08rem;
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $accent; color: $accent;
flex-shrink: 0; flex-shrink: 0;
line-height: 1; line-height: 1;
@@ -1029,7 +1026,7 @@
// 步骤标题 // 步骤标题
&__install-card-title { &__install-card-title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
margin: 0 0 0.04rem; margin: 0 0 0.04rem;
line-height: 0.24rem; line-height: 0.24rem;
@@ -1087,7 +1084,7 @@
border-radius: 0.08rem; border-radius: 0.08rem;
color: $bg-white; color: $bg-white;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
cursor: pointer; cursor: pointer;
transition: opacity 0.2s ease; transition: opacity 0.2s ease;
white-space: nowrap; white-space: nowrap;
@@ -1156,7 +1153,6 @@
// 完成页占位图标 // 完成页占位图标
&__complete-icon { &__complete-icon {
width: 1.2rem;
height: 1.2rem; height: 1.2rem;
margin-bottom: 0.32rem; margin-bottom: 0.32rem;
@@ -1344,7 +1340,7 @@
border-radius: 0.08rem; border-radius: 0.08rem;
background: $bg-white; background: $bg-white;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
color: $text-middle; color: $text-middle;
cursor: pointer; cursor: pointer;
transition: all 0.2s ease; transition: all 0.2s ease;
@@ -1373,7 +1369,7 @@
border: none; border: none;
border-radius: 0.08rem; border-radius: 0.08rem;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 520; font-weight: 620;
color: $bg-white; color: $bg-white;
cursor: pointer; cursor: pointer;
transition: all 0.2s ease; transition: all 0.2s ease;
@@ -1773,7 +1769,7 @@
/* 标题文字 */ /* 标题文字 */
&__title { &__title {
font-size: 0.18rem; font-size: 0.18rem;
font-weight: 520; font-weight: 620;
color: $text-dark; color: $text-dark;
line-height: 0.24rem; line-height: 0.24rem;
} }
@@ -1868,3 +1864,127 @@
transform: translateX(100%); transform: translateX(100%);
} }
} }
// ==================== 插件安装确认弹窗 ====================
/* 遮罩层 */
.agent-page__install-dialog-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
display: flex;
align-items: center;
justify-content: center;
z-index: 2000;
}
/* 弹窗主体 */
.agent-page__install-dialog {
position: relative;
width: 3.84rem;
background: $bg-white;
border: 1px solid #F0F0F0;
box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.05);
border-radius: 0.12rem;
padding: 0.24rem 0.32rem 0.32rem;
box-sizing: border-box;
overflow: hidden;
}
/* 渐变背景 */
.agent-page__install-dialog-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(180deg, #EDF9FA 0%, #FFFFFF 20.63%);
border-radius: 0.12rem;
pointer-events: none;
}
/* 关闭按钮 */
.agent-page__install-dialog-close {
position: absolute;
top: 0.24rem;
right: 0.24rem;
width: 0.24rem;
height: 0.24rem;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
z-index: 1;
&:hover {
opacity: 0.7;
}
}
/* 标题 */
.agent-page__install-dialog-title {
position: relative;
font-size: 0.18rem;
font-weight: 600;
color: $text-dark;
text-align: center;
margin: 0 0 0.2rem 0;
line-height: 0.24rem;
}
/* 描述文字 */
.agent-page__install-dialog-desc {
position: relative;
font-size: 0.16rem;
font-weight: 330;
color: $text-middle;
text-align: center;
line-height: 0.28rem;
margin: 0 0 0.24rem 0;
}
/* 底部按钮容器 */
.agent-page__install-dialog-btns {
position: relative;
display: flex;
gap: 0.08rem;
}
/* 按钮通用 */
.agent-page__install-dialog-btn {
flex: 1;
height: 0.37rem;
border-radius: 0.08rem;
font-size: 0.14rem;
font-weight: 450;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.2s;
/* 描边按钮 — 还未安装 */
&--outline {
background: $bg-white;
border: 1px solid $accent;
color: $accent;
&:hover {
background: $theme-color;
}
}
/* 实心按钮 — 已安装,继续 */
&--primary {
background: $accent;
border: none;
color: #FFFFFF;
&:hover {
background: $accent-hover;
}
}
}
+1 -1
View File
@@ -344,7 +344,7 @@
&__quote-avatar { &__quote-avatar {
width: 0.38rem; width: 0.38rem;
height: 0.38rem; height: 0.38rem;
background: #D9E3EA; //background: #D9E3EA;
border-radius: 50%; border-radius: 50%;
flex-shrink: 0; flex-shrink: 0;
} }
+56 -42
View File
@@ -142,18 +142,21 @@
// 主标题 // 主标题
&__title { &__title {
font-size: 0.54rem; font-size: 0.48rem;
font-weight: 600; font-weight: 600;
line-height: 0.71rem; line-height: 0.61rem;
letter-spacing: -0.03rem; letter-spacing: 0.03rem;
color: #111; color: #111;
margin: 0; margin: 0;
>span{
width: 1.51rem;
}
} }
// 副标题描述 // 副标题描述
&__desc { &__desc {
font-size: 0.2rem; font-size: 0.16rem;
line-height: 0.325rem; line-height: 0.2rem;
color: #9ca3af; color: #9ca3af;
margin-top: 0.1rem; margin-top: 0.1rem;
} }
@@ -162,12 +165,11 @@
&__cta { &__cta {
margin-top: 0.69rem; margin-top: 0.69rem;
width: 1.84rem; width: 1.84rem;
height: 0.56rem; height: 0.52rem;
//line-height: 0.24rem;
border-radius: 0.16rem; border-radius: 0.16rem;
background: linear-gradient(90deg, rgba(82, 202, 209, 1) 0%, rgba(83, 217, 200, 1) 100%); background: $accent;
color: #fff; color: #fff;
font-size: 0.18rem; font-size: 0.15rem;
font-weight: 600; font-weight: 600;
border: none; border: none;
cursor: pointer; cursor: pointer;
@@ -178,8 +180,9 @@
// 右侧卡片区 // 右侧卡片区
&__right { &__right {
flex-shrink: 0; flex-shrink: 0;
box-shadow: 0px 0px 15.45px rgba(82, 202, 209, 0.1); //box-shadow: 0px 0px 15.45px rgba(82, 202, 209, 0.1);
border-radius: 0.16rem; border-radius: 0.16rem;
background: #FCFEFE;
} }
&__right-top{ &__right-top{
@@ -365,25 +368,25 @@
.stat-card { .stat-card {
background: #fff; background: #fff;
border-radius: 0.16rem; border-radius: 0.16rem;
width: 2.03rem; width: 1.9rem;
height: 1.87rem; height: 1.9rem;
text-align: center; text-align: center;
padding-top:0.38rem; padding-top:0.38rem;
box-shadow: 0 0.06rem 0.2rem rgba(0, 0, 0, 0.05); box-shadow: 0 0.06rem 0.2rem rgba(0, 0, 0, 0.05);
// 大数字 // 大数字
&__num { &__num {
font-size: 0.48rem; font-size: 0.38rem;
font-weight: 900; font-weight: 900;
color: #52CAD1; color: #2A8186;
line-height: 0.63rem; line-height: 0.63rem;
} }
// 描述文字 // 描述文字
&__label { &__label {
font-size: 0.16rem; font-size: 0.13rem;
line-height: 0.22rem; line-height: 0.22rem;
color: #9ca3af; color: #8D9399;
margin-top: 0.12rem; margin-top: 0.12rem;
letter-spacing: 0.0035rem; letter-spacing: 0.0035rem;
} }
@@ -391,7 +394,7 @@
// ==================== 岗位展示区 ==================== // ==================== 岗位展示区 ====================
.home-jobs-showcase { .home-jobs-showcase {
padding: 1rem 0; padding: 0.85rem 0 0.7rem 0;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
background: #fff; background: #fff;
@@ -441,20 +444,20 @@
// 副标题 // 副标题
&__sub { &__sub {
font-size: 0.2rem; font-size: 0.15rem;
line-height: 0.28rem; line-height: 0.28rem;
color: #999; color: #999;
margin-top: 0.2rem; margin-top: 0.19rem;
} }
// 玻璃态展示盒子 // 玻璃态展示盒子
&__box { &__box {
margin-top: 0.6rem; margin-top: 0.87rem;
background: rgba(255, 255, 255, 0.9); background: rgba(255, 255, 255, 0.9);
border: 1px solid rgba(255, 255, 255, 0.9); border: 1px solid rgba(255, 255, 255, 0.9);
box-shadow: 0 10px 40px rgba(82, 202, 209, 0.12); box-shadow: 0 10px 40px rgba(82, 202, 209, 0.12);
backdrop-filter: blur(100px); backdrop-filter: blur(100px);
border-radius: 0.4rem; border-radius: 0.1rem;
padding: 0.64rem 0; padding: 0.64rem 0;
} }
@@ -472,7 +475,7 @@
.ticker-track { .ticker-track {
display: flex; display: flex;
gap: 0.16rem; gap: 0.30rem;
width: max-content; width: max-content;
animation: ticker-scroll 20s linear infinite; animation: ticker-scroll 20s linear infinite;
} }
@@ -483,16 +486,16 @@
.showcase-stat { .showcase-stat {
text-align: center; text-align: center;
&__num { &__num {
font-size: 0.48rem; font-size: 0.40rem;
line-height: 0.6rem; line-height: 0.6rem;
font-weight: 900; font-weight: 900;
color: #1d1d1d; color: #2A8186;
.accent { color: $accent; } .accent { color: #2A8186; }
} }
&__label { &__label {
font-size: 0.18rem; font-size: 0.14rem;
line-height: 0.28rem; line-height: 0.28rem;
color: #64748b; color: #8D9399;
margin-top: 0.08rem; margin-top: 0.08rem;
} }
} }
@@ -500,7 +503,7 @@
// 单个岗位滚动卡片 // 单个岗位滚动卡片
.job-ticker { .job-ticker {
flex-shrink: 0; flex-shrink: 0;
background: rgba(30, 30, 46, 0.9); background: #12383A;
backdrop-filter: blur(36px); backdrop-filter: blur(36px);
border-radius: 0.12rem; border-radius: 0.12rem;
padding: 0.2rem 0.24rem; padding: 0.2rem 0.24rem;
@@ -545,16 +548,17 @@
min-width: 0; min-width: 0;
h2 { h2 {
font-size: 0.48rem; font-size: 0.34rem;
font-weight: 600; font-weight: 600;
line-height: 0.63rem; line-height: 0.43rem;
letter-spacing: 0.02rem;
color: #111; color: #111;
margin: 0; margin: 0;
} }
p { p {
font-size: 0.2rem; font-size: 0.14rem;
line-height: 0.325rem; line-height: 0.2rem;
color: #999; color: #999;
margin-top: 0.16rem; margin-top: 0.16rem;
} }
@@ -566,12 +570,13 @@
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 0.12rem; gap: 0.12rem;
padding: 0.15rem 0.4rem; padding: 0 0.22rem;
border-radius: 0.16rem; border-radius: 0.12rem;
background: #111111; background: $accent;
color: #fff; color: #fff;
font-size: 0.16rem; font-size: 0.12rem;
line-height: 0.28rem; height: 0.42rem;
line-height: 0.42rem;
font-weight: 600; font-weight: 600;
border: none; border: none;
cursor: pointer; cursor: pointer;
@@ -582,7 +587,8 @@
} }
svg { svg {
flex-shrink: 0; flex-shrink: 0;
color: $btn-dark; color: #fff;
font-size: 0.12rem;
} }
} }
@@ -1069,7 +1075,7 @@
margin-bottom: 0.8rem; margin-bottom: 0.8rem;
h2 { h2 {
font-size: 0.48rem; font-size: 0.38rem;
line-height: 0.48rem; line-height: 0.48rem;
font-weight: 600; font-weight: 600;
letter-spacing: -0.012rem; letter-spacing: -0.012rem;
@@ -1077,12 +1083,12 @@
} }
p { p {
font-size: 0.16rem; font-size: 0.15rem;
line-height: 0.24rem; line-height: 0.24rem;
color: #9ca3af; color: #9ca3af;
letter-spacing: 0.0rem; letter-spacing: 0.0rem;
text-transform: uppercase; text-transform: uppercase;
margin-top: 0.24rem; margin-top: 0.14rem;
} }
} }
@@ -1612,10 +1618,18 @@
margin: 0.6rem auto 0; margin: 0.6rem auto 0;
text-align: center; text-align: center;
padding-top: 0.4rem; padding-top: 0.4rem;
display: flex;
justify-content: center;
gap: 0.2rem;
p { p {
font-size: 0.12rem; font-size: 0.12rem;
line-height: 0.16rem; color: #9ca3af;
}
a{
font-size: 0.12rem;
text-decoration: none;
color: #9ca3af; color: #9ca3af;
} }
} }
+4 -3
View File
@@ -3,7 +3,7 @@
// ==================== 岗位详情页 ==================== // ==================== 岗位详情页 ====================
.job-detail { .job-detail {
&__content { &__content {
margin-left: 2.2rem; margin-left: var(--nav-width, 2.2rem);
margin-right: var(--chat-width, 3.6rem); margin-right: var(--chat-width, 3.6rem);
flex: 1; flex: 1;
height: var(--app-height, 100vh); height: var(--app-height, 100vh);
@@ -167,14 +167,15 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 0.08rem 0.16rem; width: 0.88rem;
height: 0.37rem;
line-height: 0.37rem;
background: $accent; background: $accent;
border: 1px solid $accent; border: 1px solid $accent;
border-radius: 0.08rem; border-radius: 0.08rem;
color: $bg-white; color: $bg-white;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 600; font-weight: 600;
line-height: 0.19rem;
cursor: pointer; cursor: pointer;
transition: background 0.2s; transition: background 0.2s;
File diff suppressed because it is too large Load Diff
+39 -36
View File
@@ -177,7 +177,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 0.12rem; gap: 0.12rem;
width: 3.41rem; width: 4rem;
img{ img{
width: 1.6rem; width: 1.6rem;
@@ -230,12 +230,12 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 0.24rem; gap: 0.24rem;
width: 3.41rem; width: 4rem;
} }
/* 标题 */ /* 标题 */
.login-view__heading { .login-view__heading {
width: 3.41rem; width: 4rem;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 0.05rem; gap: 0.05rem;
@@ -243,15 +243,16 @@
.login-view__title { .login-view__title {
font-weight: 700; font-weight: 700;
font-size: 0.18rem; font-size: 0.24rem;
line-height: 0.22rem; line-height: 0.22rem;
color: #18181A; color: #18181A;
} }
.login-view__subtitle { .login-view__subtitle {
font-weight: 400; font-weight: 400;
font-size: 0.10rem; font-size: 0.14rem;
line-height: 0.12rem; margin-top: 0.08rem;
margin-bottom: 0.08rem;
color: #616367; color: #616367;
>span:nth-child(2){ >span:nth-child(2){
@@ -264,12 +265,12 @@
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
align-items: center; align-items: center;
width: 3.41rem; width: 4rem;
height: 0.40rem; height: 0.56rem;
background: #FFFFFF; background: #FFFFFF;
border: 1px solid #C8C9CD; border: 1px solid #C8C9CD;
box-shadow: 0 0.08rem 0.20rem rgba(15, 83, 87, 0.05); box-shadow: 0 0.08rem 0.20rem rgba(15, 83, 87, 0.05);
border-radius: 0.08rem; border-radius: 0.12rem;
} }
/* 手机图标 */ /* 手机图标 */
@@ -292,7 +293,7 @@
.login-view__country-label { .login-view__country-label {
margin-left: 0.06rem; margin-left: 0.06rem;
font-weight: 500; font-weight: 500;
font-size: 0.12rem; font-size: 0.14rem;
line-height: 0.15rem; line-height: 0.15rem;
color: #202124; color: #202124;
white-space: nowrap; white-space: nowrap;
@@ -330,7 +331,7 @@
border: none; border: none;
background: transparent; background: transparent;
font-weight: 400; font-weight: 400;
font-size: 0.12rem; font-size: 0.14rem;
line-height: 0.15rem; line-height: 0.15rem;
color: #202124; color: #202124;
outline: none; outline: none;
@@ -342,14 +343,14 @@
/* ==================== 发送验证码按钮(步骤一) ==================== */ /* ==================== 发送验证码按钮(步骤一) ==================== */
.login-view__send-btn { .login-view__send-btn {
width: 3.41rem; width: 4rem;
height: 0.40rem; height: 0.43rem;
background: linear-gradient(90deg, #4FC2C9 0%, #42A8B3 100%); background: linear-gradient(90deg, #4FC2C9 0%, #42A8B3 100%);
box-shadow: 0 0.16rem 0.30rem rgba(15, 83, 87, 0.15); box-shadow: 0 0.16rem 0.30rem rgba(15, 83, 87, 0.15);
border-radius: 0.08rem; border-radius: 0.12rem;
border: none; border: none;
font-weight: 600; font-weight: 600;
font-size: 0.12rem; font-size: 0.14rem;
line-height: 0.15rem; line-height: 0.15rem;
color: #FFFFFF; color: #FFFFFF;
cursor: pointer; cursor: pointer;
@@ -391,8 +392,8 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
width: 0.42rem; width: 0.56rem;
height: 0.46rem; height: 0.56rem;
background: #FAFBFC; background: #FAFBFC;
border: 1px solid #E2E8F0; border: 1px solid #E2E8F0;
border-radius: 0.12rem; border-radius: 0.12rem;
@@ -401,7 +402,7 @@
.login-view__otp-box--active { .login-view__otp-box--active {
background: #F3FFFD; background: #F3FFFD;
border: 2px solid $accent; border: 1px solid $accent;
} }
.login-view__otp-box--filled { .login-view__otp-box--filled {
@@ -444,13 +445,13 @@
} }
.login-view__sms-status--error { .login-view__sms-status--error {
color: #E85635; color: #EF4444;
} }
/* ==================== 状态按钮(步骤二) ==================== */ /* ==================== 状态按钮(步骤二) ==================== */
.login-view__status-btn { .login-view__status-btn {
width: 100%; width: 100%;
height: 0.4rem; height: 0.43rem;
background: linear-gradient(90deg, $btn-dark 0%, $btn-dark-hover 100%); background: linear-gradient(90deg, $btn-dark 0%, $btn-dark-hover 100%);
border-radius: 0.12rem; border-radius: 0.12rem;
border: none; border: none;
@@ -494,7 +495,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 0.06rem; gap: 0.06rem;
width: 3.41rem; width: 4rem;
} }
.login-view__checkbox { .login-view__checkbox {
@@ -547,7 +548,7 @@
/* ==================== 简历上传阶段 — 右侧面板 ==================== */ /* ==================== 简历上传阶段 — 右侧面板 ==================== */
.login-view__form-wrap--resume { .login-view__form-wrap--resume {
width: 3.41rem; width: 4rem;
} }
/* 上传区域 */ /* 上传区域 */
@@ -592,15 +593,16 @@
.login-view__upload-btn { .login-view__upload-btn {
height: 0.4rem; height: 0.4rem;
line-height: 0.4rem; line-height: 0.43rem;
background: linear-gradient(90deg, $btn-dark 0%, $btn-dark-hover 100%); background: linear-gradient(90deg, $btn-dark 0%, $btn-dark-hover 100%);
border: none; border: none;
border-radius: 0.08rem; border-radius: 0.08rem;
font-size: 0.16rem; font-size: 0.14rem;
font-weight: 600; font-weight: 600;
color: #FFFFFF; color: #FFFFFF;
cursor: pointer; cursor: pointer;
transition: opacity 0.2s; transition: opacity 0.2s;
margin-bottom: -0.1rem;
&:hover { &:hover {
opacity: 0.9; opacity: 0.9;
@@ -610,7 +612,7 @@
/* 解析中状态 — 新版步骤面板 */ /* 解析中状态 — 新版步骤面板 */
.login-view__parse-panel { .login-view__parse-panel {
box-sizing: border-box; box-sizing: border-box;
width: 3.41rem; width: 4rem;
padding: 0.24rem; padding: 0.24rem;
background: #F6FFFF; background: #F6FFFF;
border: 1px solid #D6F1EF; border: 1px solid #D6F1EF;
@@ -767,13 +769,13 @@
/* 解析中按钮(禁用样式) */ /* 解析中按钮(禁用样式) */
.login-view__parse-btn { .login-view__parse-btn {
width: 3.41rem; width: 4rem;
height: 0.40rem; height: 0.43rem;
background: #A6EAE7; background: #A6EAE7;
border-radius: 0.08rem; border-radius: 0.08rem;
border: none; border: none;
font-weight: 600; font-weight: 600;
font-size: 0.12rem; font-size: 0.14rem;
line-height: 0.15rem; line-height: 0.15rem;
color: #FFFFFF; color: #FFFFFF;
cursor: not-allowed; cursor: not-allowed;
@@ -782,7 +784,7 @@
/* ==================== 状态4:上传成功面板 ==================== */ /* ==================== 状态4:上传成功面板 ==================== */
.login-view__success-panel { .login-view__success-panel {
box-sizing: border-box; box-sizing: border-box;
width: 3.41rem; width: 4rem;
padding: 0.28rem 0.24rem; padding: 0.28rem 0.24rem;
background: #F6FFFB; background: #F6FFFB;
border: 1px solid #BCEED7; border: 1px solid #BCEED7;
@@ -863,13 +865,13 @@
/* 进入后台按钮 */ /* 进入后台按钮 */
.login-view__success-btn { .login-view__success-btn {
width: 3.41rem; width: 4rem;
height: 0.40rem; height: 0.43rem;
background: #4FC2C9; background: #4FC2C9;
border-radius: 0.08rem; border-radius: 0.08rem;
border: none; border: none;
font-weight: 600; font-weight: 600;
font-size: 0.12rem; font-size: 0.14rem;
line-height: 0.15rem; line-height: 0.15rem;
color: #FFFFFF; color: #FFFFFF;
cursor: pointer; cursor: pointer;
@@ -883,7 +885,7 @@
/* ==================== 状态3:上传失败面板 ==================== */ /* ==================== 状态3:上传失败面板 ==================== */
.login-view__failed-panel { .login-view__failed-panel {
box-sizing: border-box; box-sizing: border-box;
width: 3.41rem; width: 4rem;
padding: 0.28rem 0.24rem; padding: 0.28rem 0.24rem;
background: #FFFBFA; background: #FFFBFA;
border: 1px solid #FADBD5; border: 1px solid #FADBD5;
@@ -964,14 +966,14 @@
/* 重新上传按钮 */ /* 重新上传按钮 */
.login-view__failed-btn { .login-view__failed-btn {
width: 3.41rem; width: 4rem;
height: 0.40rem; height: 0.43rem;
background: linear-gradient(90deg, #4FC2C9 0%, #42A8B3 100%); background: linear-gradient(90deg, #4FC2C9 0%, #42A8B3 100%);
box-shadow: 0 0.16rem 0.30rem rgba(15, 83, 87, 0.15); box-shadow: 0 0.16rem 0.30rem rgba(15, 83, 87, 0.15);
border-radius: 0.08rem; border-radius: 0.08rem;
border: none; border: none;
font-weight: 600; font-weight: 600;
font-size: 0.12rem; font-size: 0.14rem;
line-height: 0.15rem; line-height: 0.15rem;
color: #FFFFFF; color: #FFFFFF;
cursor: pointer; cursor: pointer;
@@ -990,4 +992,5 @@
color: #999; color: #999;
padding-top: 0.3rem; padding-top: 0.3rem;
border-top: 1px solid #E7F2F3; border-top: 1px solid #E7F2F3;
text-decoration: none;
} }
+1 -1
View File
@@ -14,7 +14,7 @@
flex: 1; flex: 1;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
margin-left: 2.2rem; margin-left: var(--nav-width, 2.2rem);
display: flex; display: flex;
} }
+8 -1
View File
@@ -14,7 +14,7 @@
flex: 1; flex: 1;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
margin-left: 2.2rem; margin-left: var(--nav-width, 2.2rem);
} }
// 左侧主内容区 // 左侧主内容区
@@ -92,6 +92,13 @@
&:hover { &:hover {
background: #EDF9FA; background: #EDF9FA;
} }
// 小屏视口宽度 < 1440px只显示第一个标签
@media (max-width: 1439px) {
& ~ & {
display: none;
}
}
} }
// 搜索框 // 搜索框
+1 -1
View File
@@ -3,7 +3,7 @@
// ==================== 个人资料页 ==================== // ==================== 个人资料页 ====================
.profile-page { .profile-page {
&__content { &__content {
margin-left: 2.2rem; margin-left: var(--nav-width, 2.2rem);
flex: 1; flex: 1;
padding-bottom: 0.12rem; padding-bottom: 0.12rem;
height: var(--app-height, 100vh); height: var(--app-height, 100vh);
+2 -2
View File
@@ -3,7 +3,7 @@
// ==================== 简历详情页 ==================== // ==================== 简历详情页 ====================
.resume-detail { .resume-detail {
&__content { &__content {
margin-left: 2.2rem; margin-left: var(--nav-width, 2.2rem);
flex: 1; flex: 1;
padding-bottom: 0.24rem; padding-bottom: 0.24rem;
height: var(--app-height, 100vh); height: var(--app-height, 100vh);
@@ -726,7 +726,7 @@
background: $bg-white; background: $bg-white;
border: 1px solid $accent; border: 1px solid $accent;
border-radius: 0.04rem; border-radius: 0.04rem;
padding: 0.05rem 0.14rem; padding: 0.05rem 0.08rem;
transition: all 0.2s; transition: all 0.2s;
&:hover { &:hover {
+1 -1
View File
@@ -3,7 +3,7 @@
// ==================== 简历列表页 ==================== // ==================== 简历列表页 ====================
.resume-page { .resume-page {
&__content { &__content {
margin-left: 2.2rem; margin-left: var(--nav-width, 2.2rem);
flex: 1; flex: 1;
height: var(--app-height, 100vh); height: var(--app-height, 100vh);
box-sizing: border-box; box-sizing: border-box;
+9
View File
@@ -0,0 +1,9 @@
/**
*
*/
/** 是否开启"个人资料为空时强制跳转到登录页简历上传"机制 */
export const ENABLE_FORCE_RESUME_UPLOAD = true
/** 浏览器插件目标版本(用于判断用户是否需要更新插件) */
export const PLUGIN_TARGET_VERSION = '0.1.1'
+27 -2
View File
@@ -155,8 +155,12 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed } from 'vue' import { computed } from 'vue'
import { useStore } from 'vuex'
import { createChannelBridge } from '@/utils/channelBridge'
import type { JobListItem } from '@/api/jobs' import type { JobListItem } from '@/api/jobs'
const store = useStore()
// ==================== Props ==================== // ==================== Props ====================
const props = defineProps<{ const props = defineProps<{
@@ -286,8 +290,29 @@ function handleContinueApply() {
emit('continueApply') emit('continueApply')
} }
/** 前往投递 */ /** 前往投递 — 跨域 put 投递链接给插件 */
function handleGoApply() { async function handleGoApply() {
const link = props.jobInfo?.sourceUrl
if (link) {
const bridge = createChannelBridge({ domain: store.state.bridgeDomain })
try {
// get
const existing = await bridge.get<{ linkList: string[] }>(store.state.bridgeDomain, 'offerpaiDeliveryLinkList', true)
const linkList: string[] = existing?.linkList || []
// push
if (!linkList.includes(link)) {
linkList.push(link)
}
// put
await bridge.put<{ linkList: string[] }>(store.state.bridgeDomain, 'offerpaiDeliveryLinkList', { linkList }, true)
} catch (e) {
console.error('[AgentApplyProgress] 跨域 put 投递链接失败', e)
} finally {
bridge.destroy()
}
}
emit('goApply') emit('goApply')
} }
+171
View File
@@ -0,0 +1,171 @@
<!-- Agent页面 - 浏览器插件安装步骤指引组件 -->
<template>
<div class="agent-browser-guide-drawer__body">
<!-- 步骤1下载插件包 -->
<div class="agent-browser-guide-drawer__card">
<div class="mr100">
<div class="agent-browser-guide-drawer__step-row mr0">
<span class="agent-browser-guide-drawer__step-num">1</span>
<div class="agent-browser-guide-drawer__step-info">
<h4 class="agent-browser-guide-drawer__step-title">下载并解压插件压缩包</h4>
<p class="agent-browser-guide-drawer__step-desc">下载 Offer派自动投递助手安装包并将下载好的插件压缩包解压</p>
</div>
</div>
<div class="agent-browser-guide-drawer__download-box w263">
<span class="agent-browser-guide-drawer__download-name">Offer派智能投递助手.zip</span>
<button class="agent-browser-guide-drawer__download-btn" @click="downloadExtension">
<svg viewBox="0 0 16 16" fill="none" width="14" height="14"><path d="M8 2v8M8 10L5 7M8 10l3-3M3 13h10" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/></svg>
<span>下载</span>
</button>
</div>
</div>
<!-- 步骤1示意图 -->
<img src="@/assets/images/agent-setting/1-1.png" alt="打开开发者模式" class="agent-browser-guide-drawer__step-img" />
</div>
<!-- 步骤2打开扩展管理页面 -->
<div class="agent-browser-guide-drawer__card">
<div>
<div class="agent-browser-guide-drawer__step-row">
<span class="agent-browser-guide-drawer__step-num">2</span>
<div class="agent-browser-guide-drawer__step-info">
<h4 class="agent-browser-guide-drawer__step-title">打开扩展管理页面</h4>
<p class="agent-browser-guide-drawer__step-desc">在浏览器地址栏输入对应地址并回车打开扩展管理页面</p>
</div>
</div>
<!-- 浏览器地址链接 -->
<div class="agent-browser-guide-drawer__browser-links">
<div class="agent-browser-guide-drawer__browser-link" @click="copyToClipboard('chrome://extensions')">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_guide_chrome)">
<path d="M8.00027 12.4507C10.4587 12.4507 12.4516 10.4577 12.4516 7.99929C12.4516 5.54085 10.4587 3.54785 8.00027 3.54785C5.54183 3.54785 3.54883 5.54085 3.54883 7.99929C3.54883 10.4577 5.54177 12.4507 8.0002 12.4507" fill="white"/>
<path d="M2.24303 5.81204C1.91094 5.23683 1.52061 4.63314 1.07203 4.00098C0.369757 5.21706 2.38548e-05 6.59661 1.15428e-09 8.0009C-2.38525e-05 9.4052 0.369663 10.7848 1.07189 12.0009C1.77412 13.217 2.78414 14.2268 4.0004 14.9288C5.21666 15.6307 6.59629 16.0001 8.00059 15.9998C8.73688 14.9671 9.2368 14.2225 9.50034 13.766C10.0065 12.8893 10.6612 11.6341 11.4643 10.0004V9.99941C11.1134 10.6077 10.6086 11.113 10.0005 11.4643C9.39241 11.8156 8.70256 12.0006 8.0003 12.0007C7.29804 12.0008 6.60813 11.816 5.99995 11.4649C5.39178 11.1138 4.88677 10.6087 4.53571 10.0005C3.44496 7.96623 2.68073 6.57004 2.24303 5.81204Z" fill="#229342"/>
<path d="M8.00046 16.0002C9.05106 16.0004 10.0914 15.7936 11.0621 15.3916C12.0327 14.9896 12.9147 14.4003 13.6575 13.6574C14.4004 12.9145 14.9896 12.0325 15.3915 11.0619C15.7935 10.0912 16.0002 9.05084 16 8.00024C15.9997 6.59593 15.6297 5.21644 14.9273 4.00043C13.4118 3.85105 12.2933 3.77637 11.5719 3.77637C10.7539 3.77637 9.56323 3.85105 7.9999 4.00043L7.99902 4.00105C8.7013 4.00071 9.39128 4.18529 9.99958 4.53623C10.6079 4.88717 11.113 5.39211 11.4643 6.00024C11.8155 6.60838 12.0004 7.29828 12.0004 8.00056C12.0004 8.70284 11.8155 9.39274 11.4642 10.0009L8.00046 16.0002Z" fill="#FBC116"/>
<path d="M8.00013 11.1677C9.74913 11.1677 11.1669 9.74992 11.1669 8.00086C11.1669 6.2518 9.74913 4.83398 8.00006 4.83398C6.25113 4.83398 4.83325 6.25186 4.83325 8.00086C4.83325 9.74986 6.25113 11.1677 8.00013 11.1677Z" fill="#1A73E8"/>
<path d="M8.00027 4.00027H14.9276C14.2256 2.78399 13.2158 1.77397 11.9997 1.07176C10.7835 0.369547 9.40396 -9.50021e-05 7.99965 1.83149e-08C6.59534 9.50388e-05 5.21581 0.369924 3.99978 1.0723C2.78374 1.77467 1.77406 2.78484 1.07227 4.00121L4.53595 10.0006L4.53689 10.0011C4.18549 9.39306 4.00037 8.70322 4.00017 8.00095C3.99996 7.29868 4.18467 6.60873 4.53571 6.0005C4.88676 5.39226 5.39177 4.88718 5.99995 4.53605C6.60814 4.18491 7.29806 4.0001 8.00033 4.00021L8.00027 4.00027Z" fill="#E33B2E"/>
</g>
<defs>
<clipPath id="clip0_guide_chrome">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
<span>Chrome浏览器chrome://extensions</span>
<span class="agent-browser-guide-drawer__copy-btn">
<svg viewBox="0 0 14 14" fill="none" width="12" height="12"><rect x="4" y="4" width="8" height="8" rx="1" stroke="currentColor" stroke-width="1"/><path d="M10 4V3a1 1 0 00-1-1H3a1 1 0 00-1 1v6a1 1 0 001 1h1" stroke="currentColor" stroke-width="1"/></svg>
复制
</span>
</div>
<div class="agent-browser-guide-drawer__browser-link" @click="copyToClipboard('edge://extensions')">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_guide_edge)">
<path d="M14.4375 11.9059C14.225 12.0184 14.0062 12.1184 13.7812 12.1996C13.0625 12.4684 12.3062 12.6059 11.5375 12.6059C8.5812 12.6059 6.0062 10.5746 6.0062 7.96211C6.01245 7.24961 6.4062 6.59336 7.0312 6.25586C4.3562 6.36836 3.6687 9.15586 3.6687 10.7871C3.6687 15.4059 7.92495 15.8746 8.8437 15.8746C9.33745 15.8746 10.0812 15.7309 10.5312 15.5871L10.6125 15.5621C12.3375 14.9684 13.8 13.8059 14.775 12.2621C14.85 12.1434 14.8125 11.9934 14.7 11.9184C14.6187 11.8684 14.5187 11.8621 14.4375 11.9059Z" fill="url(#paint0_linear_guide_edge)"/>
<path opacity="0.35" d="M14.4375 11.9059C14.225 12.0184 14.0062 12.1184 13.7812 12.1996C13.0625 12.4684 12.3062 12.6059 11.5375 12.6059C8.5812 12.6059 6.0062 10.5746 6.0062 7.96211C6.01245 7.24961 6.4062 6.59336 7.0312 6.25586C4.3562 6.36836 3.6687 9.15586 3.6687 10.7871C3.6687 15.4059 7.92495 15.8746 8.8437 15.8746C9.33745 15.8746 10.0812 15.7309 10.5312 15.5871L10.6125 15.5621C12.3375 14.9684 13.8 13.8059 14.775 12.2621C14.85 12.1434 14.8125 11.9934 14.7 11.9184C14.6187 11.8684 14.5187 11.8621 14.4375 11.9059Z" fill="url(#paint1_radial_guide_edge)"/>
<path d="M6.60629 15.0877C6.05004 14.7439 5.56879 14.2877 5.18754 13.7564C3.54379 11.5064 4.03754 8.3502 6.28754 6.70645C6.52504 6.5377 6.76879 6.38145 7.03129 6.25645C7.22504 6.1627 7.55629 6.0002 8.00004 6.00645C8.63129 6.0127 9.22504 6.3127 9.60629 6.81895C9.85629 7.15645 10 7.5627 10.0063 7.9877C10.0063 7.9752 11.5375 3.0127 5.00629 3.0127C2.26254 3.0127 0.00628588 5.61895 0.00628588 7.9002C-0.00621412 9.10645 0.256286 10.3064 0.762536 11.4002C2.48754 15.0752 6.68754 16.8752 10.5375 15.5939C9.21879 16.0064 7.78129 15.8252 6.60629 15.0877Z" fill="url(#paint2_linear_guide_edge)"/>
<path opacity="0.41" d="M6.60629 15.0877C6.05004 14.7439 5.56879 14.2877 5.18754 13.7564C3.54379 11.5064 4.03754 8.3502 6.28754 6.70645C6.52504 6.5377 6.76879 6.38145 7.03129 6.25645C7.22504 6.1627 7.55629 6.0002 8.00004 6.00645C8.63129 6.0127 9.22504 6.3127 9.60629 6.81895C9.85629 7.15645 10 7.5627 10.0063 7.9877C10.0063 7.9752 11.5375 3.0127 5.00629 3.0127C2.26254 3.0127 0.00628588 5.61895 0.00628588 7.9002C-0.00621412 9.10645 0.256286 10.3064 0.762536 11.4002C2.48754 15.0752 6.68754 16.8752 10.5375 15.5939C9.21879 16.0064 7.78129 15.8252 6.60629 15.0877Z" fill="url(#paint3_radial_guide_edge)"/>
<path d="M9.51875 9.30625C9.46875 9.36875 9.3125 9.4625 9.3125 9.6625C9.3125 9.825 9.41875 9.98125 9.60625 10.1125C10.5062 10.7375 12.2 10.6562 12.2063 10.6562C12.875 10.6562 13.525 10.475 14.1 10.1375C15.275 9.45 16 8.19375 16 6.83125C16.0187 5.43125 15.5 4.5 15.2937 4.0875C13.9688 1.49375 11.1062 0 8 0C3.625 0 0.0625 3.5125 0 7.8875C0.03125 5.60625 2.3 3.7625 5 3.7625C5.21875 3.7625 6.46875 3.78125 7.625 4.39375C8.64375 4.93125 9.18125 5.575 9.55 6.21875C9.9375 6.8875 10.0063 7.725 10.0063 8.0625C10.0063 8.39375 9.8375 8.89375 9.51875 9.30625Z" fill="url(#paint4_radial_guide_edge)"/>
<path d="M9.51875 9.30625C9.46875 9.36875 9.3125 9.4625 9.3125 9.6625C9.3125 9.825 9.41875 9.98125 9.60625 10.1125C10.5062 10.7375 12.2 10.6562 12.2063 10.6562C12.875 10.6562 13.525 10.475 14.1 10.1375C15.275 9.45 16 8.19375 16 6.83125C16.0187 5.43125 15.5 4.5 15.2937 4.0875C13.9688 1.49375 11.1062 0 8 0C3.625 0 0.0625 3.5125 0 7.8875C0.03125 5.60625 2.3 3.7625 5 3.7625C5.21875 3.7625 6.46875 3.78125 7.625 4.39375C8.64375 4.93125 9.18125 5.575 9.55 6.21875C9.9375 6.8875 10.0063 7.725 10.0063 8.0625C10.0063 8.39375 9.8375 8.89375 9.51875 9.30625Z" fill="url(#paint5_radial_guide_edge)"/>
</g>
<defs>
<linearGradient id="paint0_linear_guide_edge" x1="3.66895" y1="11.0634" x2="14.8116" y2="11.0634" gradientUnits="userSpaceOnUse">
<stop stop-color="#0C59A4"/>
<stop offset="1" stop-color="#114A8B"/>
</linearGradient>
<radialGradient id="paint1_radial_guide_edge" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(9.82444 11.1519) scale(5.96065 5.662)">
<stop offset="0.72" stop-opacity="0"/>
<stop offset="0.95" stop-opacity="0.53"/>
<stop offset="1"/>
</radialGradient>
<linearGradient id="paint2_linear_guide_edge" x1="9.54822" y1="6.23432" x2="2.58741" y2="13.8163" gradientUnits="userSpaceOnUse">
<stop stop-color="#1B9DE2"/>
<stop offset="0.16" stop-color="#1595DF"/>
<stop offset="0.67" stop-color="#0680D7"/>
<stop offset="1" stop-color="#0078D4"/>
</linearGradient>
<radialGradient id="paint3_radial_guide_edge" cx="0" cy="0" r="1" gradientTransform="matrix(1.34287 -8.86118 7.162 1.0743 4.41307 12.4383)" gradientUnits="userSpaceOnUse">
<stop offset="0.76" stop-opacity="0"/>
<stop offset="0.95" stop-opacity="0.5"/>
<stop offset="1"/>
</radialGradient>
<radialGradient id="paint4_radial_guide_edge" cx="0" cy="0" r="1" gradientTransform="matrix(-0.506075 12.6493 -26.9472 -1.0119 1.61573 2.96205)" gradientUnits="userSpaceOnUse">
<stop stop-color="#35C1F1"/>
<stop offset="0.11" stop-color="#34C1ED"/>
<stop offset="0.23" stop-color="#2FC2DF"/>
<stop offset="0.31" stop-color="#2BC3D2"/>
<stop offset="0.67" stop-color="#36C752"/>
</radialGradient>
<radialGradient id="paint5_radial_guide_edge" cx="0" cy="0" r="1" gradientTransform="matrix(1.70345 5.83918 -4.74533 1.39926 15.0038 4.83786)" gradientUnits="userSpaceOnUse">
<stop stop-color="#66EB6E"/>
<stop offset="1" stop-color="#66EB6E" stop-opacity="0"/>
</radialGradient>
<clipPath id="clip0_guide_edge">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
<span>Edge浏览器edge://extensions</span>
<span class="agent-browser-guide-drawer__copy-btn">
<svg viewBox="0 0 14 14" fill="none" width="12" height="12"><rect x="4" y="4" width="8" height="8" rx="1" stroke="currentColor" stroke-width="1"/><path d="M10 4V3a1 1 0 00-1-1H3a1 1 0 00-1 1v6a1 1 0 001 1h1" stroke="currentColor" stroke-width="1"/></svg>
复制
</span>
</div>
</div>
</div>
<!-- 步骤2示意图 -->
<img src="@/assets/images/agent-setting/2-1.png" alt="输入扩展地址" class="agent-browser-guide-drawer__step-img" />
</div>
<!-- 步骤3打开开发者模式 -->
<div class="agent-browser-guide-drawer__card">
<div class="agent-browser-guide-drawer__step-row">
<span class="agent-browser-guide-drawer__step-num">3</span>
<div class="agent-browser-guide-drawer__step-info">
<h4 class="agent-browser-guide-drawer__step-title">打开开发者模式</h4>
<p class="agent-browser-guide-drawer__step-desc"><span class="color-D31414">Chrome浏览器</span>在扩展管理页面的右上角找到开发者模式开关并打开</p>
<p class="agent-browser-guide-drawer__step-desc mt3"><span class="color-2F7DEA">Edge浏览器</span>在扩展管理页面左下角找到开发者模式开关并打开</p>
</div>
</div>
<!-- 步骤3示意图 -->
<img src="@/assets/images/agent-setting/3-1.png" alt="打开开发者模式" class="agent-browser-guide-drawer__step-img max-w602" />
</div>
<!-- 步骤4将CRX安装包拖入安装 -->
<div class="agent-browser-guide-drawer__card">
<div class="agent-browser-guide-drawer__step-row">
<span class="agent-browser-guide-drawer__step-num">4</span>
<div class="agent-browser-guide-drawer__step-info">
<h4 class="agent-browser-guide-drawer__step-title">点击加载未打包的扩展程序</h4>
<p class="agent-browser-guide-drawer__step-desc">点击"加载未打包的扩展程序"选择解压后的插件文件夹完成安装</p>
</div>
</div>
<!-- 步骤4示意图 -->
<img src="@/assets/images/agent-setting/4-1.png" alt="拖入安装" class="agent-browser-guide-drawer__step-img" />
</div>
</div>
</template>
<script setup lang="ts">
import { ElMessage } from 'element-plus'
/** 插件下载地址 */
const extensionDownloadUrl = 'https://offerpie.oss-cn-guangzhou.aliyuncs.com/extension/Offer派智能投递助手.zip'
/** 下载插件 */
function downloadExtension() {
window.open(extensionDownloadUrl, '_blank')
}
/** 复制文本到剪贴板 */
function copyToClipboard(text: string) {
navigator.clipboard.writeText(text).then(() => {
ElMessage.success('已复制到剪贴板')
}).catch(() => {
ElMessage.error('复制失败,请手动复制')
})
}
/** 暴露方法给父组件调用 */
defineExpose({ downloadExtension })
</script>
+2 -152
View File
@@ -250,141 +250,7 @@
</div> </div>
<!-- 步骤内容 --> <!-- 步骤内容 -->
<div class="agent-browser-guide-drawer__body"> <AgentBrowserInstallGuide />
<!-- 步骤1下载插件包 -->
<div class="agent-browser-guide-drawer__card">
<div class="agent-browser-guide-drawer__step-row">
<span class="agent-browser-guide-drawer__step-num">1</span>
<div class="agent-browser-guide-drawer__step-info">
<h4 class="agent-browser-guide-drawer__step-title">下载插件包</h4>
<p class="agent-browser-guide-drawer__step-desc">下载 Offer派自动投递助手安装包下载完成后由步骤 2 进入浏览器扩展页面</p>
</div>
</div>
<div class="agent-browser-guide-drawer__download-box w263">
<span class="agent-browser-guide-drawer__download-name">Offer派自动投递助手.crx</span>
<button class="agent-browser-guide-drawer__download-btn" @click="downloadExtension">
<svg viewBox="0 0 16 16" fill="none" width="14" height="14"><path d="M8 2v8M8 10L5 7M8 10l3-3M3 13h10" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/></svg>
<span>下载</span>
</button>
</div>
</div>
<!-- 步骤2打开扩展管理页面 -->
<div class="agent-browser-guide-drawer__card">
<div class="agent-browser-guide-drawer__step-row">
<span class="agent-browser-guide-drawer__step-num">2</span>
<div class="agent-browser-guide-drawer__step-info">
<h4 class="agent-browser-guide-drawer__step-title">打开扩展管理页面</h4>
<p class="agent-browser-guide-drawer__step-desc">在浏览器地址栏输入对应地址并回车打开扩展管理页面</p>
</div>
</div>
<!-- 浏览器地址链接 -->
<div class="agent-browser-guide-drawer__browser-links">
<div class="agent-browser-guide-drawer__browser-link" @click="copyToClipboard('chrome://extensions')">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_498_5140)">
<path d="M8.00027 12.4507C10.4587 12.4507 12.4516 10.4577 12.4516 7.99929C12.4516 5.54085 10.4587 3.54785 8.00027 3.54785C5.54183 3.54785 3.54883 5.54085 3.54883 7.99929C3.54883 10.4577 5.54177 12.4507 8.0002 12.4507" fill="white"/>
<path d="M2.24303 5.81204C1.91094 5.23683 1.52061 4.63314 1.07203 4.00098C0.369757 5.21706 2.38548e-05 6.59661 1.15428e-09 8.0009C-2.38525e-05 9.4052 0.369663 10.7848 1.07189 12.0009C1.77412 13.217 2.78414 14.2268 4.0004 14.9288C5.21666 15.6307 6.59629 16.0001 8.00059 15.9998C8.73688 14.9671 9.2368 14.2225 9.50034 13.766C10.0065 12.8893 10.6612 11.6341 11.4643 10.0004V9.99941C11.1134 10.6077 10.6086 11.113 10.0005 11.4643C9.39241 11.8156 8.70256 12.0006 8.0003 12.0007C7.29804 12.0008 6.60813 11.816 5.99995 11.4649C5.39178 11.1138 4.88677 10.6087 4.53571 10.0005C3.44496 7.96623 2.68073 6.57004 2.24303 5.81204Z" fill="#229342"/>
<path d="M8.00046 16.0002C9.05106 16.0004 10.0914 15.7936 11.0621 15.3916C12.0327 14.9896 12.9147 14.4003 13.6575 13.6574C14.4004 12.9145 14.9896 12.0325 15.3915 11.0619C15.7935 10.0912 16.0002 9.05084 16 8.00024C15.9997 6.59593 15.6297 5.21644 14.9273 4.00043C13.4118 3.85105 12.2933 3.77637 11.5719 3.77637C10.7539 3.77637 9.56323 3.85105 7.9999 4.00043L7.99902 4.00105C8.7013 4.00071 9.39128 4.18529 9.99958 4.53623C10.6079 4.88717 11.113 5.39211 11.4643 6.00024C11.8155 6.60838 12.0004 7.29828 12.0004 8.00056C12.0004 8.70284 11.8155 9.39274 11.4642 10.0009L8.00046 16.0002Z" fill="#FBC116"/>
<path d="M8.00013 11.1677C9.74913 11.1677 11.1669 9.74992 11.1669 8.00086C11.1669 6.2518 9.74913 4.83398 8.00006 4.83398C6.25113 4.83398 4.83325 6.25186 4.83325 8.00086C4.83325 9.74986 6.25113 11.1677 8.00013 11.1677Z" fill="#1A73E8"/>
<path d="M8.00027 4.00027H14.9276C14.2256 2.78399 13.2158 1.77397 11.9997 1.07176C10.7835 0.369547 9.40396 -9.50021e-05 7.99965 1.83149e-08C6.59534 9.50388e-05 5.21581 0.369924 3.99978 1.0723C2.78374 1.77467 1.77406 2.78484 1.07227 4.00121L4.53595 10.0006L4.53689 10.0011C4.18549 9.39306 4.00037 8.70322 4.00017 8.00095C3.99996 7.29868 4.18467 6.60873 4.53571 6.0005C4.88676 5.39226 5.39177 4.88718 5.99995 4.53605C6.60814 4.18491 7.29806 4.0001 8.00033 4.00021L8.00027 4.00027Z" fill="#E33B2E"/>
</g>
<defs>
<clipPath id="clip0_498_5140">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
<span>Chrome浏览器chrome://extensions</span>
<span class="agent-browser-guide-drawer__copy-btn">
<svg viewBox="0 0 14 14" fill="none" width="12" height="12"><rect x="4" y="4" width="8" height="8" rx="1" stroke="currentColor" stroke-width="1"/><path d="M10 4V3a1 1 0 00-1-1H3a1 1 0 00-1 1v6a1 1 0 001 1h1" stroke="currentColor" stroke-width="1"/></svg>
复制
</span>
</div>
<div class="agent-browser-guide-drawer__browser-link" @click="copyToClipboard('edge://extensions')">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_498_5157)">
<path d="M14.4375 11.9059C14.225 12.0184 14.0062 12.1184 13.7812 12.1996C13.0625 12.4684 12.3062 12.6059 11.5375 12.6059C8.5812 12.6059 6.0062 10.5746 6.0062 7.96211C6.01245 7.24961 6.4062 6.59336 7.0312 6.25586C4.3562 6.36836 3.6687 9.15586 3.6687 10.7871C3.6687 15.4059 7.92495 15.8746 8.8437 15.8746C9.33745 15.8746 10.0812 15.7309 10.5312 15.5871L10.6125 15.5621C12.3375 14.9684 13.8 13.8059 14.775 12.2621C14.85 12.1434 14.8125 11.9934 14.7 11.9184C14.6187 11.8684 14.5187 11.8621 14.4375 11.9059Z" fill="url(#paint0_linear_498_5157)"/>
<path opacity="0.35" d="M14.4375 11.9059C14.225 12.0184 14.0062 12.1184 13.7812 12.1996C13.0625 12.4684 12.3062 12.6059 11.5375 12.6059C8.5812 12.6059 6.0062 10.5746 6.0062 7.96211C6.01245 7.24961 6.4062 6.59336 7.0312 6.25586C4.3562 6.36836 3.6687 9.15586 3.6687 10.7871C3.6687 15.4059 7.92495 15.8746 8.8437 15.8746C9.33745 15.8746 10.0812 15.7309 10.5312 15.5871L10.6125 15.5621C12.3375 14.9684 13.8 13.8059 14.775 12.2621C14.85 12.1434 14.8125 11.9934 14.7 11.9184C14.6187 11.8684 14.5187 11.8621 14.4375 11.9059Z" fill="url(#paint1_radial_498_5157)"/>
<path d="M6.60629 15.0877C6.05004 14.7439 5.56879 14.2877 5.18754 13.7564C3.54379 11.5064 4.03754 8.3502 6.28754 6.70645C6.52504 6.5377 6.76879 6.38145 7.03129 6.25645C7.22504 6.1627 7.55629 6.0002 8.00004 6.00645C8.63129 6.0127 9.22504 6.3127 9.60629 6.81895C9.85629 7.15645 10 7.5627 10.0063 7.9877C10.0063 7.9752 11.5375 3.0127 5.00629 3.0127C2.26254 3.0127 0.00628588 5.61895 0.00628588 7.9002C-0.00621412 9.10645 0.256286 10.3064 0.762536 11.4002C2.48754 15.0752 6.68754 16.8752 10.5375 15.5939C9.21879 16.0064 7.78129 15.8252 6.60629 15.0877Z" fill="url(#paint2_linear_498_5157)"/>
<path opacity="0.41" d="M6.60629 15.0877C6.05004 14.7439 5.56879 14.2877 5.18754 13.7564C3.54379 11.5064 4.03754 8.3502 6.28754 6.70645C6.52504 6.5377 6.76879 6.38145 7.03129 6.25645C7.22504 6.1627 7.55629 6.0002 8.00004 6.00645C8.63129 6.0127 9.22504 6.3127 9.60629 6.81895C9.85629 7.15645 10 7.5627 10.0063 7.9877C10.0063 7.9752 11.5375 3.0127 5.00629 3.0127C2.26254 3.0127 0.00628588 5.61895 0.00628588 7.9002C-0.00621412 9.10645 0.256286 10.3064 0.762536 11.4002C2.48754 15.0752 6.68754 16.8752 10.5375 15.5939C9.21879 16.0064 7.78129 15.8252 6.60629 15.0877Z" fill="url(#paint3_radial_498_5157)"/>
<path d="M9.51875 9.30625C9.46875 9.36875 9.3125 9.4625 9.3125 9.6625C9.3125 9.825 9.41875 9.98125 9.60625 10.1125C10.5062 10.7375 12.2 10.6562 12.2063 10.6562C12.875 10.6562 13.525 10.475 14.1 10.1375C15.275 9.45 16 8.19375 16 6.83125C16.0187 5.43125 15.5 4.5 15.2937 4.0875C13.9688 1.49375 11.1062 0 8 0C3.625 0 0.0625 3.5125 0 7.8875C0.03125 5.60625 2.3 3.7625 5 3.7625C5.21875 3.7625 6.46875 3.78125 7.625 4.39375C8.64375 4.93125 9.18125 5.575 9.55 6.21875C9.9375 6.8875 10.0063 7.725 10.0063 8.0625C10.0063 8.39375 9.8375 8.89375 9.51875 9.30625Z" fill="url(#paint4_radial_498_5157)"/>
<path d="M9.51875 9.30625C9.46875 9.36875 9.3125 9.4625 9.3125 9.6625C9.3125 9.825 9.41875 9.98125 9.60625 10.1125C10.5062 10.7375 12.2 10.6562 12.2063 10.6562C12.875 10.6562 13.525 10.475 14.1 10.1375C15.275 9.45 16 8.19375 16 6.83125C16.0187 5.43125 15.5 4.5 15.2937 4.0875C13.9688 1.49375 11.1062 0 8 0C3.625 0 0.0625 3.5125 0 7.8875C0.03125 5.60625 2.3 3.7625 5 3.7625C5.21875 3.7625 6.46875 3.78125 7.625 4.39375C8.64375 4.93125 9.18125 5.575 9.55 6.21875C9.9375 6.8875 10.0063 7.725 10.0063 8.0625C10.0063 8.39375 9.8375 8.89375 9.51875 9.30625Z" fill="url(#paint5_radial_498_5157)"/>
</g>
<defs>
<linearGradient id="paint0_linear_498_5157" x1="3.66895" y1="11.0634" x2="14.8116" y2="11.0634" gradientUnits="userSpaceOnUse">
<stop stop-color="#0C59A4"/>
<stop offset="1" stop-color="#114A8B"/>
</linearGradient>
<radialGradient id="paint1_radial_498_5157" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(9.82444 11.1519) scale(5.96065 5.662)">
<stop offset="0.72" stop-opacity="0"/>
<stop offset="0.95" stop-opacity="0.53"/>
<stop offset="1"/>
</radialGradient>
<linearGradient id="paint2_linear_498_5157" x1="9.54822" y1="6.23432" x2="2.58741" y2="13.8163" gradientUnits="userSpaceOnUse">
<stop stop-color="#1B9DE2"/>
<stop offset="0.16" stop-color="#1595DF"/>
<stop offset="0.67" stop-color="#0680D7"/>
<stop offset="1" stop-color="#0078D4"/>
</linearGradient>
<radialGradient id="paint3_radial_498_5157" cx="0" cy="0" r="1" gradientTransform="matrix(1.34287 -8.86118 7.162 1.0743 4.41307 12.4383)" gradientUnits="userSpaceOnUse">
<stop offset="0.76" stop-opacity="0"/>
<stop offset="0.95" stop-opacity="0.5"/>
<stop offset="1"/>
</radialGradient>
<radialGradient id="paint4_radial_498_5157" cx="0" cy="0" r="1" gradientTransform="matrix(-0.506075 12.6493 -26.9472 -1.0119 1.61573 2.96205)" gradientUnits="userSpaceOnUse">
<stop stop-color="#35C1F1"/>
<stop offset="0.11" stop-color="#34C1ED"/>
<stop offset="0.23" stop-color="#2FC2DF"/>
<stop offset="0.31" stop-color="#2BC3D2"/>
<stop offset="0.67" stop-color="#36C752"/>
</radialGradient>
<radialGradient id="paint5_radial_498_5157" cx="0" cy="0" r="1" gradientTransform="matrix(1.70345 5.83918 -4.74533 1.39926 15.0038 4.83786)" gradientUnits="userSpaceOnUse">
<stop stop-color="#66EB6E"/>
<stop offset="1" stop-color="#66EB6E" stop-opacity="0"/>
</radialGradient>
<clipPath id="clip0_498_5157">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
<span>Edge浏览器edge://extensions</span>
<span class="agent-browser-guide-drawer__copy-btn">
<svg viewBox="0 0 14 14" fill="none" width="12" height="12"><rect x="4" y="4" width="8" height="8" rx="1" stroke="currentColor" stroke-width="1"/><path d="M10 4V3a1 1 0 00-1-1H3a1 1 0 00-1 1v6a1 1 0 001 1h1" stroke="currentColor" stroke-width="1"/></svg>
复制
</span>
</div>
</div>
<!-- 步骤2示意图 -->
<img src="@/assets/images/agent-setting/2-1.png" alt="输入扩展地址" class="agent-browser-guide-drawer__step-img" />
</div>
<!-- 步骤3打开开发者模式 -->
<div class="agent-browser-guide-drawer__card">
<div class="agent-browser-guide-drawer__step-row">
<span class="agent-browser-guide-drawer__step-num">3</span>
<div class="agent-browser-guide-drawer__step-info">
<h4 class="agent-browser-guide-drawer__step-title">打开开发者模式</h4>
<p class="agent-browser-guide-drawer__step-desc">在扩展管理页面的右上角找到开发者模式开关并打开</p>
</div>
</div>
<!-- 步骤3示意图 -->
<img src="@/assets/images/agent-setting/3-1.png" alt="打开开发者模式" class="agent-browser-guide-drawer__step-img" />
</div>
<!-- 步骤4将CRX安装包拖入安装 -->
<div class="agent-browser-guide-drawer__card">
<div class="agent-browser-guide-drawer__step-row">
<span class="agent-browser-guide-drawer__step-num">4</span>
<div class="agent-browser-guide-drawer__step-info">
<h4 class="agent-browser-guide-drawer__step-title"> CRX 安装包拖入安装</h4>
<p class="agent-browser-guide-drawer__step-desc">直接将下载好的CRX文件拖拽到扩展管理页面中浏览器会自动识别并安装插件</p>
</div>
</div>
<!-- 步骤4示意图 -->
<img src="@/assets/images/agent-setting/4-1.png" alt="拖入安装" class="agent-browser-guide-drawer__step-img" />
</div>
</div>
</div> </div>
</div> </div>
</Transition> </Transition>
@@ -399,6 +265,7 @@ import { ElMessage } from 'element-plus'
import { formatEmploymentType } from '@/stores/index' import { formatEmploymentType } from '@/stores/index'
import JobGoalDialog from '@/components/JobGoalDialog.vue' import JobGoalDialog from '@/components/JobGoalDialog.vue'
import RegionSelector from '@/components/tools/RegionSelector.vue' import RegionSelector from '@/components/tools/RegionSelector.vue'
import AgentBrowserInstallGuide from '@/components/AgentBrowserInstallGuide.vue'
import { saveProfile, fetchProfile, fetchEducation } from '@/api/profile' import { saveProfile, fetchProfile, fetchEducation } from '@/api/profile'
import { resolveRegionName } from '@/utils/region' import { resolveRegionName } from '@/utils/region'
import { resolveIndustryName } from '@/utils/industry' import { resolveIndustryName } from '@/utils/industry'
@@ -662,9 +529,6 @@ async function handleSavePreference() {
/** 浏览器插件安装教程抽屉是否显示 */ /** 浏览器插件安装教程抽屉是否显示 */
const showBrowserGuideDrawer = ref(false) const showBrowserGuideDrawer = ref(false)
/** 插件下载地址 */
const extensionDownloadUrl = 'https://offerpie.oss-cn-guangzhou.aliyuncs.com/extension/chrome-mv3-prod.rar'
/** 打开浏览器安装指引抽屉 */ /** 打开浏览器安装指引抽屉 */
function openBrowserGuide(_browser: string) { function openBrowserGuide(_browser: string) {
showBrowserGuideDrawer.value = true showBrowserGuideDrawer.value = true
@@ -675,20 +539,6 @@ function closeBrowserGuideDrawer() {
showBrowserGuideDrawer.value = false showBrowserGuideDrawer.value = false
} }
/** 下载插件 */
function downloadExtension() {
window.open(extensionDownloadUrl, '_blank')
}
/** 复制文本到剪贴板 */
function copyToClipboard(text: string) {
navigator.clipboard.writeText(text).then(() => {
ElMessage.success('已复制到剪贴板')
}).catch(() => {
ElMessage.error('复制失败,请手动复制')
})
}
// ==================== ==================== // ==================== ====================
onMounted(async () => { onMounted(async () => {
+90 -174
View File
@@ -48,6 +48,7 @@
<p class="agent-page__intro-desc">请仔细对你的资料评估包括个人信息教育背景工作履历及技能确保资料齐全</p> <p class="agent-page__intro-desc">请仔细对你的资料评估包括个人信息教育背景工作履历及技能确保资料齐全</p>
<!-- 按钮 --> <!-- 按钮 -->
<button class="agent-page__intro-gradient-btn" @click="handleNext">下一步</button> <button class="agent-page__intro-gradient-btn" @click="handleNext">下一步</button>
</div> </div>
</div> </div>
@@ -76,7 +77,8 @@
:categoryIds="step2CategoryIds" :categoryIds="step2CategoryIds"
:maxSelect="3" :maxSelect="3"
:level="3" :level="3"
:allowParentSelect="true" :allowParentSelect="false"
:allowParentSelectClick="true"
:triggerStyle="prefFilterTriggerStyle" :triggerStyle="prefFilterTriggerStyle"
:displayStyle="prefFilterDisplayStyle" :displayStyle="prefFilterDisplayStyle"
@update:categoryIds="onStep2CategoryChange" @update:categoryIds="onStep2CategoryChange"
@@ -86,7 +88,8 @@
:industryIds="step2IndustryIds" :industryIds="step2IndustryIds"
:maxSelect="3" :maxSelect="3"
:level="2" :level="2"
:allowParentSelect="true" :allowParentSelect="false"
:allowParentSelectClick="true"
:triggerStyle="prefFilterTriggerStyle" :triggerStyle="prefFilterTriggerStyle"
:displayStyle="prefFilterDisplayStyle" :displayStyle="prefFilterDisplayStyle"
@update:industryIds="onStep2IndustryChange" @update:industryIds="onStep2IndustryChange"
@@ -161,164 +164,7 @@
<!-- 左侧安装教程内容 --> <!-- 左侧安装教程内容 -->
<div class="agent-page__right"> <div class="agent-page__right">
<div class="agent-page__profile-wrapper bg-f"> <div class="agent-page__profile-wrapper bg-f">
<div class="agent-page__install-guide"> <AgentBrowserInstallGuide ref="browserInstallGuideRef" />
<!-- 步骤1下载插件包 -->
<div class="agent-page__install-card">
<div class="agent-page__install-card-row">
<div class="agent-page__install-card-left">
<div class="agent-page__install-card-header">
<span class="agent-page__install-card-num">1</span>
<div class="agent-page__install-card-info">
<h4 class="agent-page__install-card-title">下载插件包</h4>
<p class="agent-page__install-card-desc">下载 Offer派自动投递助手安装包下载完成后由步骤 2 进入浏览器扩展页面</p>
</div>
</div>
</div>
<div class="">
<div class="agent-page__install-download-box">
<span class="agent-page__install-download-name">Offer派自动投递助手.crx</span>
<button class="agent-page__install-download-btn2" @click="downloadExtension">
<svg viewBox="0 0 16 16" fill="none" width="14" height="14"><path d="M8 2v8M8 10L5 7M8 10l3-3M3 13h10" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/></svg>
<span>下载</span>
</button>
</div>
</div>
</div>
</div>
<!-- 步骤2打开扩展管理页面 -->
<div class="agent-page__install-card">
<div class="agent-page__install-card-row">
<div class="agent-page__install-card-left">
<div class="agent-page__install-card-header">
<span class="agent-page__install-card-num">2</span>
<div class="agent-page__install-card-info">
<h4 class="agent-page__install-card-title">打开扩展管理页面</h4>
<p class="agent-page__install-card-desc">在浏览器地址栏输入对应地址并回车打开扩展管理页面</p>
</div>
</div>
<!-- 浏览器地址链接 -->
<div class="agent-page__install-browser-row">
<a class="agent-page__install-browser-link" href="javascript:void(0)" @click="copyToClipboard('chrome://extensions')">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_525_3895)">
<path d="M8.00027 12.4507C10.4587 12.4507 12.4516 10.4577 12.4516 7.99929C12.4516 5.54085 10.4587 3.54785 8.00027 3.54785C5.54183 3.54785 3.54883 5.54085 3.54883 7.99929C3.54883 10.4577 5.54177 12.4507 8.0002 12.4507" fill="white"/>
<path d="M2.24303 5.81204C1.91094 5.23683 1.52061 4.63314 1.07203 4.00098C0.369757 5.21706 2.38548e-05 6.59661 1.15428e-09 8.0009C-2.38525e-05 9.4052 0.369663 10.7848 1.07189 12.0009C1.77412 13.217 2.78414 14.2268 4.0004 14.9288C5.21666 15.6307 6.59629 16.0001 8.00059 15.9998C8.73688 14.9671 9.2368 14.2225 9.50034 13.766C10.0065 12.8893 10.6612 11.6341 11.4643 10.0004V9.99941C11.1134 10.6077 10.6086 11.113 10.0005 11.4643C9.39241 11.8156 8.70256 12.0006 8.0003 12.0007C7.29804 12.0008 6.60813 11.816 5.99995 11.4649C5.39178 11.1138 4.88677 10.6087 4.53571 10.0005C3.44496 7.96623 2.68073 6.57004 2.24303 5.81204Z" fill="#229342"/>
<path d="M8.00046 16.0002C9.05106 16.0004 10.0914 15.7936 11.0621 15.3916C12.0327 14.9896 12.9147 14.4003 13.6575 13.6574C14.4004 12.9145 14.9896 12.0325 15.3915 11.0619C15.7935 10.0912 16.0002 9.05084 16 8.00024C15.9997 6.59593 15.6297 5.21644 14.9273 4.00043C13.4118 3.85105 12.2933 3.77637 11.5719 3.77637C10.7539 3.77637 9.56323 3.85105 7.9999 4.00043L7.99902 4.00105C8.7013 4.00071 9.39128 4.18529 9.99958 4.53623C10.6079 4.88717 11.113 5.39211 11.4643 6.00024C11.8155 6.60838 12.0004 7.29828 12.0004 8.00056C12.0004 8.70284 11.8155 9.39274 11.4642 10.0009L8.00046 16.0002Z" fill="#FBC116"/>
<path d="M8.00037 11.1677C9.74937 11.1677 11.1672 9.74992 11.1672 8.00086C11.1672 6.2518 9.74937 4.83398 8.00031 4.83398C6.25137 4.83398 4.8335 6.25186 4.8335 8.00086C4.8335 9.74986 6.25137 11.1677 8.00037 11.1677Z" fill="#1A73E8"/>
<path d="M8.00027 4.00027H14.9276C14.2256 2.78399 13.2158 1.77397 11.9997 1.07176C10.7835 0.369547 9.40396 -9.50021e-05 7.99965 1.83149e-08C6.59534 9.50388e-05 5.21581 0.369924 3.99978 1.0723C2.78374 1.77467 1.77406 2.78484 1.07227 4.00121L4.53595 10.0006L4.53689 10.0011C4.18549 9.39306 4.00037 8.70322 4.00017 8.00095C3.99996 7.29868 4.18467 6.60873 4.53571 6.0005C4.88676 5.39226 5.39177 4.88718 5.99995 4.53605C6.60814 4.18491 7.29806 4.0001 8.00033 4.00021L8.00027 4.00027Z" fill="#E33B2E"/>
</g>
<defs>
<clipPath id="clip0_525_3895">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
<span class="agent-page__install-browser-link-label">Chrome浏览器chrome://extensions</span>
<span class="agent-page__install-browser-link-copy">
<svg viewBox="0 0 14 14" fill="none" width="12" height="12"><rect x="4" y="4" width="8" height="8" rx="1" stroke="currentColor" stroke-width="1"/><path d="M10 4V3a1 1 0 00-1-1H3a1 1 0 00-1 1v6a1 1 0 001 1h1" stroke="currentColor" stroke-width="1"/></svg>
复制
</span>
</a>
<a class="agent-page__install-browser-link" href="javascript:void(0)" @click="copyToClipboard('edge://extensions')">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_525_3912)">
<path d="M14.4377 11.9059C14.2252 12.0184 14.0064 12.1184 13.7814 12.1996C13.0627 12.4684 12.3064 12.6059 11.5377 12.6059C8.58145 12.6059 6.00645 10.5746 6.00645 7.96211C6.0127 7.24961 6.40645 6.59336 7.03145 6.25586C4.35645 6.36836 3.66895 9.15586 3.66895 10.7871C3.66895 15.4059 7.9252 15.8746 8.84395 15.8746C9.3377 15.8746 10.0814 15.7309 10.5314 15.5871L10.6127 15.5621C12.3377 14.9684 13.8002 13.8059 14.7752 12.2621C14.8502 12.1434 14.8127 11.9934 14.7002 11.9184C14.6189 11.8684 14.5189 11.8621 14.4377 11.9059Z" fill="url(#paint0_linear_525_3912)"/>
<path opacity="0.35" d="M14.4377 11.9059C14.2252 12.0184 14.0064 12.1184 13.7814 12.1996C13.0627 12.4684 12.3064 12.6059 11.5377 12.6059C8.58145 12.6059 6.00645 10.5746 6.00645 7.96211C6.0127 7.24961 6.40645 6.59336 7.03145 6.25586C4.35645 6.36836 3.66895 9.15586 3.66895 10.7871C3.66895 15.4059 7.9252 15.8746 8.84395 15.8746C9.3377 15.8746 10.0814 15.7309 10.5314 15.5871L10.6127 15.5621C12.3377 14.9684 13.8002 13.8059 14.7752 12.2621C14.8502 12.1434 14.8127 11.9934 14.7002 11.9184C14.6189 11.8684 14.5189 11.8621 14.4377 11.9059Z" fill="url(#paint1_radial_525_3912)"/>
<path d="M6.60629 15.0877C6.05004 14.7439 5.56879 14.2877 5.18754 13.7564C3.54379 11.5064 4.03754 8.3502 6.28754 6.70645C6.52504 6.5377 6.76879 6.38145 7.03129 6.25645C7.22504 6.1627 7.55629 6.0002 8.00004 6.00645C8.63129 6.0127 9.22504 6.3127 9.60629 6.81895C9.85629 7.15645 10 7.5627 10.0063 7.9877C10.0063 7.9752 11.5375 3.0127 5.00629 3.0127C2.26254 3.0127 0.00628588 5.61895 0.00628588 7.9002C-0.00621412 9.10645 0.256286 10.3064 0.762536 11.4002C2.48754 15.0752 6.68754 16.8752 10.5375 15.5939C9.21879 16.0064 7.78129 15.8252 6.60629 15.0877Z" fill="url(#paint2_linear_525_3912)"/>
<path opacity="0.41" d="M6.60629 15.0877C6.05004 14.7439 5.56879 14.2877 5.18754 13.7564C3.54379 11.5064 4.03754 8.3502 6.28754 6.70645C6.52504 6.5377 6.76879 6.38145 7.03129 6.25645C7.22504 6.1627 7.55629 6.0002 8.00004 6.00645C8.63129 6.0127 9.22504 6.3127 9.60629 6.81895C9.85629 7.15645 10 7.5627 10.0063 7.9877C10.0063 7.9752 11.5375 3.0127 5.00629 3.0127C2.26254 3.0127 0.00628588 5.61895 0.00628588 7.9002C-0.00621412 9.10645 0.256286 10.3064 0.762536 11.4002C2.48754 15.0752 6.68754 16.8752 10.5375 15.5939C9.21879 16.0064 7.78129 15.8252 6.60629 15.0877Z" fill="url(#paint3_radial_525_3912)"/>
<path d="M9.51875 9.30625C9.46875 9.36875 9.3125 9.4625 9.3125 9.6625C9.3125 9.825 9.41875 9.98125 9.60625 10.1125C10.5062 10.7375 12.2 10.6562 12.2063 10.6562C12.875 10.6562 13.525 10.475 14.1 10.1375C15.275 9.45 16 8.19375 16 6.83125C16.0187 5.43125 15.5 4.5 15.2937 4.0875C13.9688 1.49375 11.1062 0 8 0C3.625 0 0.0625 3.5125 0 7.8875C0.03125 5.60625 2.3 3.7625 5 3.7625C5.21875 3.7625 6.46875 3.78125 7.625 4.39375C8.64375 4.93125 9.18125 5.575 9.55 6.21875C9.9375 6.8875 10.0063 7.725 10.0063 8.0625C10.0063 8.39375 9.8375 8.89375 9.51875 9.30625Z" fill="url(#paint4_radial_525_3912)"/>
<path d="M9.51875 9.30625C9.46875 9.36875 9.3125 9.4625 9.3125 9.6625C9.3125 9.825 9.41875 9.98125 9.60625 10.1125C10.5062 10.7375 12.2 10.6562 12.2063 10.6562C12.875 10.6562 13.525 10.475 14.1 10.1375C15.275 9.45 16 8.19375 16 6.83125C16.0187 5.43125 15.5 4.5 15.2937 4.0875C13.9688 1.49375 11.1062 0 8 0C3.625 0 0.0625 3.5125 0 7.8875C0.03125 5.60625 2.3 3.7625 5 3.7625C5.21875 3.7625 6.46875 3.78125 7.625 4.39375C8.64375 4.93125 9.18125 5.575 9.55 6.21875C9.9375 6.8875 10.0063 7.725 10.0063 8.0625C10.0063 8.39375 9.8375 8.89375 9.51875 9.30625Z" fill="url(#paint5_radial_525_3912)"/>
</g>
<defs>
<linearGradient id="paint0_linear_525_3912" x1="3.6692" y1="11.0634" x2="14.8119" y2="11.0634" gradientUnits="userSpaceOnUse">
<stop stop-color="#0C59A4"/>
<stop offset="1" stop-color="#114A8B"/>
</linearGradient>
<radialGradient id="paint1_radial_525_3912" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(9.82468 11.1519) scale(5.96065 5.662)">
<stop offset="0.72" stop-opacity="0"/>
<stop offset="0.95" stop-opacity="0.53"/>
<stop offset="1"/>
</radialGradient>
<linearGradient id="paint2_linear_525_3912" x1="9.54822" y1="6.23432" x2="2.58741" y2="13.8163" gradientUnits="userSpaceOnUse">
<stop stop-color="#1B9DE2"/>
<stop offset="0.16" stop-color="#1595DF"/>
<stop offset="0.67" stop-color="#0680D7"/>
<stop offset="1" stop-color="#0078D4"/>
</linearGradient>
<radialGradient id="paint3_radial_525_3912" cx="0" cy="0" r="1" gradientTransform="matrix(1.34287 -8.86118 7.162 1.0743 4.41307 12.4383)" gradientUnits="userSpaceOnUse">
<stop offset="0.76" stop-opacity="0"/>
<stop offset="0.95" stop-opacity="0.5"/>
<stop offset="1"/>
</radialGradient>
<radialGradient id="paint4_radial_525_3912" cx="0" cy="0" r="1" gradientTransform="matrix(-0.506075 12.6493 -26.9472 -1.0119 1.61573 2.96205)" gradientUnits="userSpaceOnUse">
<stop stop-color="#35C1F1"/>
<stop offset="0.11" stop-color="#34C1ED"/>
<stop offset="0.23" stop-color="#2FC2DF"/>
<stop offset="0.31" stop-color="#2BC3D2"/>
<stop offset="0.67" stop-color="#36C752"/>
</radialGradient>
<radialGradient id="paint5_radial_525_3912" cx="0" cy="0" r="1" gradientTransform="matrix(1.70345 5.83918 -4.74533 1.39926 15.0038 4.83786)" gradientUnits="userSpaceOnUse">
<stop stop-color="#66EB6E"/>
<stop offset="1" stop-color="#66EB6E" stop-opacity="0"/>
</radialGradient>
<clipPath id="clip0_525_3912">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
<span class="agent-page__install-browser-link-label">Edge浏览器edge://extensions</span>
<span class="agent-page__install-browser-link-copy">
<svg viewBox="0 0 14 14" fill="none" width="12" height="12"><rect x="4" y="4" width="8" height="8" rx="1" stroke="currentColor" stroke-width="1"/><path d="M10 4V3a1 1 0 00-1-1H3a1 1 0 00-1 1v6a1 1 0 001 1h1" stroke="currentColor" stroke-width="1"/></svg>
复制
</span>
</a>
</div>
</div>
<div class="agent-page__install-card-right">
<img src="@/assets/images/agent-setting/2-1.png" alt="输入扩展地址" class="agent-page__install-card-img" />
</div>
</div>
</div>
<!-- 步骤3打开开发者模式 -->
<div class="agent-page__install-card">
<div class="agent-page__install-card-row">
<div class="agent-page__install-card-left">
<div class="agent-page__install-card-header">
<span class="agent-page__install-card-num">3</span>
<div class="agent-page__install-card-info">
<h4 class="agent-page__install-card-title">打开开发者模式</h4>
<p class="agent-page__install-card-desc">在扩展管理页面的右上角找到开发者模式开关并打开</p>
</div>
</div>
</div>
<div class="agent-page__install-card-right">
<img src="@/assets/images/agent-setting/3-1.png" alt="打开开发者模式" class="agent-page__install-card-img" />
</div>
</div>
</div>
<!-- 步骤4将CRX安装包拖入安装 -->
<div class="agent-page__install-card">
<div class="agent-page__install-card-row">
<div class="agent-page__install-card-left">
<div class="agent-page__install-card-header">
<span class="agent-page__install-card-num">4</span>
<div class="agent-page__install-card-info">
<h4 class="agent-page__install-card-title"> CRX 安装包拖入安装</h4>
<p class="agent-page__install-card-desc">直接将下载好的CRX文件拖拽到扩展管理页面中浏览器会自动识别并安装插件</p>
</div>
</div>
</div>
<div class="agent-page__install-card-right">
<img src="@/assets/images/agent-setting/4-1.png" alt="拖入安装" class="agent-page__install-card-img" />
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
<!-- 右侧确认卡片 --> <!-- 右侧确认卡片 -->
@@ -333,8 +179,14 @@
<h2 class="agent-page__intro-title">安装浏览器自动投递插件</h2> <h2 class="agent-page__intro-title">安装浏览器自动投递插件</h2>
<!-- 描述 --> <!-- 描述 -->
<p class="agent-page__intro-desc">按照左侧步骤完成插件安装即可开启自动投递功能</p> <p class="agent-page__intro-desc">按照左侧步骤完成插件安装即可开启自动投递功能</p>
<!-- 按钮 --> <!-- 按钮在线显示下一步离线显示安装确认按钮 -->
<button class="agent-page__intro-gradient-btn" @click="handleNext">下一步</button> <button v-if="plugIsOnline" class="agent-page__intro-gradient-btn" @click="handleNext">下一步</button>
<button v-else class="agent-page__intro-gradient-btn" @click="handleInstallConfirm">
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.625 10.2117V11.0417C0.625 11.7047 0.888392 12.3406 1.35723 12.8094C1.82607 13.2783 2.46196 13.5417 3.125 13.5417H11.4583C12.1214 13.5417 12.7573 13.2783 13.2261 12.8094C13.6949 12.3406 13.9583 11.7047 13.9583 11.0417V10.2083M7.29167 0.625V9.79167M4.375 6.875L7.29167 9.79167L10.2083 6.875" stroke="white" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
下载插件
</button>
<button class="agent-page__intro-back-btn" @click="handleBack">上一步</button> <button class="agent-page__intro-back-btn" @click="handleBack">上一步</button>
</div> </div>
</div> </div>
@@ -343,7 +195,9 @@
<!-- ========== 第4步完成配置 ========== --> <!-- ========== 第4步完成配置 ========== -->
<template v-if="currentStep === 4"> <template v-if="currentStep === 4">
<div class="agent-page__complete"> <div class="agent-page__complete">
<div class="agent-page__complete-icon"><svg viewBox="0 0 80 80" fill="none"><rect x="8" y="8" width="64" height="64" rx="8" fill="#E8E8E8"/><circle cx="40" cy="32" r="8" fill="#BFBFBF"/><path d="M20 60 L32 44 L44 52 L56 36 L64 44 L64 64 L20 64Z" fill="#BFBFBF"/></svg></div> <div class="agent-page__complete-icon">
<img class="w160 " src="@/assets/images/agent-setting/setting-success.gif" alt="">
</div>
<h2 class="agent-page__complete-title">恭喜求职助手已经准备好</h2> <h2 class="agent-page__complete-title">恭喜求职助手已经准备好</h2>
<p class="agent-page__complete-desc">启用求职助手后你可以随时调整求职偏好和简历信息</p> <p class="agent-page__complete-desc">启用求职助手后你可以随时调整求职偏好和简历信息</p>
<button class="agent-page__complete-btn" @click="handleLaunchAgent">启用求职助手开始投递</button> <button class="agent-page__complete-btn" @click="handleLaunchAgent">启用求职助手开始投递</button>
@@ -353,6 +207,31 @@
<!-- 求职目标设置弹窗 --> <!-- 求职目标设置弹窗 -->
<JobGoalDialog v-model="showJobGoalDialog" /> <JobGoalDialog v-model="showJobGoalDialog" />
<!-- 插件安装确认弹窗 -->
<Teleport to="body">
<div v-if="showInstallDialog" class="agent-page__install-dialog-overlay" @click.self="showInstallDialog = false">
<div class="agent-page__install-dialog">
<!-- 渐变背景 -->
<div class="agent-page__install-dialog-bg"></div>
<!-- 关闭按钮 -->
<div class="agent-page__install-dialog-close" @click="showInstallDialog = false">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none">
<path d="M18 6L6 18M6 6l12 12" stroke="#6A7282" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</div>
<!-- 标题 -->
<h3 class="agent-page__install-dialog-title">插件是否已安装成功</h3>
<!-- 描述 -->
<p class="agent-page__install-dialog-desc">智能投递助手需要配合浏览器插件使用<br/>请确认插件已成功安装并启用<br/>否则将无法正常进行自动填写和投递</p>
<!-- 底部按钮 -->
<div class="agent-page__install-dialog-btns">
<button class="agent-page__install-dialog-btn agent-page__install-dialog-btn--outline" @click="showInstallDialog = false">还未安装</button>
<button class="agent-page__install-dialog-btn agent-page__install-dialog-btn--primary" @click="handleInstallConfirmReload">已安装继续</button>
</div>
</div>
</div>
</Teleport>
</div> </div>
<!-- 功能说明 独立区块仅第2步显示 --> <!-- 功能说明 独立区块仅第2步显示 -->
<div v-if="currentStep === 2" class="agent-page__step2-faq mrl24 mt16"> <div v-if="currentStep === 2" class="agent-page__step2-faq mrl24 mt16">
@@ -387,6 +266,7 @@ import JobGoalDialog from '@/components/JobGoalDialog.vue'
import RegionSelector from '@/components/tools/RegionSelector.vue' import RegionSelector from '@/components/tools/RegionSelector.vue'
import JobCategorySelector from '@/components/tools/JobCategorySelector.vue' import JobCategorySelector from '@/components/tools/JobCategorySelector.vue'
import IndustrySelector from '@/components/tools/IndustrySelector.vue' import IndustrySelector from '@/components/tools/IndustrySelector.vue'
import AgentBrowserInstallGuide from '@/components/AgentBrowserInstallGuide.vue'
import { saveProfile, saveEducation, saveWork, saveInternship, saveProject, saveCompetition, fetchProfile, fetchEducation, fetchWork, fetchInternship, fetchProject, fetchCompetition } from '@/api/profile' import { saveProfile, saveEducation, saveWork, saveInternship, saveProject, saveCompetition, fetchProfile, fetchEducation, fetchWork, fetchInternship, fetchProject, fetchCompetition } from '@/api/profile'
import type { SaveEducationItem, SaveWorkItem, SaveProjectItem, SaveCompetitionItem } from '@/api/profile' import type { SaveEducationItem, SaveWorkItem, SaveProjectItem, SaveCompetitionItem } from '@/api/profile'
import { fetchResumeList, setDefaultResume } from '@/api/resume' import { fetchResumeList, setDefaultResume } from '@/api/resume'
@@ -430,6 +310,31 @@ const editInitialData = ref<Record<string, any>>({})
// ==================== ==================== // ==================== ====================
onMounted(async () => { onMounted(async () => {
//
const savedStep = sessionStorage.getItem('wizardStep')
if (savedStep) {
currentStep.value = Number(savedStep)
sessionStorage.removeItem('wizardStep')
}
// 线
const needCheck = sessionStorage.getItem('wizardCheckPlug')
if (needCheck) {
sessionStorage.removeItem('wizardCheckPlug')
//
showInstallDialog.value = true
// 3.5
await new Promise(resolve => setTimeout(resolve, 3500))
if (store.state.plugIsOnline) {
// 线
showInstallDialog.value = false
handleNext()
} else {
// 线 +
ElMessage.warning('未检测到插件安装')
}
}
if (!store.state.regions.length) store.dispatch('loadCommonData') if (!store.state.regions.length) store.dispatch('loadCommonData')
store.dispatch('loadJobIntention') store.dispatch('loadJobIntention')
await loadProfile() await loadProfile()
@@ -440,6 +345,10 @@ onMounted(async () => {
await loadCompetition() await loadCompetition()
}) })
// ==================== 线 store ====================
/** 插件是否在线(从 vuex 全局状态读取) */
const plugIsOnline = computed(() => store.state.plugIsOnline)
async function loadProfile() { async function loadProfile() {
try { try {
const res = await fetchProfile() const res = await fetchProfile()
@@ -759,19 +668,26 @@ watch(selectedResumeId, async (newId, oldId) => {
}) })
// ==================== 3 ==================== // ==================== 3 ====================
/** 插件下载地址 */
const extensionDownloadUrl = 'https://offerpie.oss-cn-guangzhou.aliyuncs.com/extension/chrome-mv3-prod.rar'
/** 下载插件 */ /** 浏览器插件安装指引组件引用 */
function downloadExtension() { window.open(extensionDownloadUrl, '_blank') } const browserInstallGuideRef = ref<InstanceType<typeof AgentBrowserInstallGuide> | null>(null)
/** 复制文本到剪贴板 */ /** 插件安装确认弹窗 */
function copyToClipboard(text: string) { const showInstallDialog = ref(false)
navigator.clipboard.writeText(text).then(() => {
ElMessage.success('已复制到剪贴板') /** 点击"下载插件":下载插件文件 + 弹出安装确认弹窗 */
}).catch(() => { function handleInstallConfirm() {
ElMessage.error('复制失败,请手动复制') //
}) browserInstallGuideRef.value?.downloadExtension()
//
showInstallDialog.value = true
}
/** 点击"已安装,继续":保存步骤 + 标记需要检测 + 刷新页面 */
function handleInstallConfirmReload() {
sessionStorage.setItem('wizardStep', String(currentStep.value))
sessionStorage.setItem('wizardCheckPlug', '1')
location.reload()
} }
// ==================== 4 ==================== // ==================== 4 ====================
+2 -2
View File
@@ -152,11 +152,11 @@ function switchTab(tab: 'pending' | 'completed') {
activeTab.value = tab activeTab.value = tab
} }
/** 加载待投递列表(pageSize=300 */ /** 加载待投递列表(pageSize=200 */
async function loadPendingList() { async function loadPendingList() {
pendingLoading.value = true pendingLoading.value = true
try { try {
const res = await fetchAgentTaskList({ pageNum: 1, pageSize: 300, tab: 1 }) const res = await fetchAgentTaskList({ pageNum: 1, pageSize: 200, tab: 1 })
if (res.code === '0' && res.data) { if (res.code === '0' && res.data) {
pendingList.value = res.data.list || [] pendingList.value = res.data.list || []
} }
+14 -3
View File
@@ -150,9 +150,9 @@ interface ChatMsg {
// ==================== ==================== // ==================== ====================
/** 获取当前用户的缓存 key */ /** 获取当前用户的缓存 key,使用 vuex 中的用户 ID 区分不同账号 */
function getCacheKey(): string { function getCacheKey(): string {
const userId = sessionStorage.getItem('userId') || 'anonymous' const userId = store.state.userInfo?.id || 'anonymous'
return `nova_chat_${userId}` return `nova_chat_${userId}`
} }
@@ -272,7 +272,7 @@ async function sendMessage() {
// ==================== ==================== // ==================== ====================
onMounted(() => { onMounted(() => {
// //
messages.value = loadChatFromCache() messages.value = loadChatFromCache()
if (messages.value.length > 0) { if (messages.value.length > 0) {
scrollToBottom() scrollToBottom()
@@ -283,6 +283,17 @@ onMounted(() => {
} }
}) })
// userInfo userInfo null
watch(() => store.state.userInfo, (newInfo, oldInfo) => {
if (newInfo && newInfo.id && (!oldInfo || !oldInfo.id)) {
//
messages.value = loadChatFromCache()
if (messages.value.length > 0) {
scrollToBottom()
}
}
})
// jobId // jobId
watch(() => props.jobId, (newId, oldId) => { watch(() => props.jobId, (newId, oldId) => {
if (newId && newId !== oldId && !isJobDetailPage.value) { if (newId && newId !== oldId && !isJobDetailPage.value) {
+420
View File
@@ -0,0 +1,420 @@
<template>
<!-- 选择投递方式弹窗 -->
<div v-if="visible" class="job-apply-method__overlay" @click.self="close">
<div class="job-apply-method__dialog">
<!-- 渐变背景层 -->
<div class="job-apply-method__bg"></div>
<!-- 标题 -->
<p class="job-apply-method__title">选择投递方式</p>
<!-- 关闭按钮 -->
<span class="job-apply-method__close" @click="close">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M18 6L6 18M6 6l12 12" stroke="#6A7282" stroke-width="1.5" stroke-linecap="round"/></svg>
</span>
<!-- 两个选项卡 -->
<div class="job-apply-method__options">
<!-- 直接前往官网 -->
<div class="job-apply-method__card" :class="{ 'job-apply-method__card--active': choice === 'direct' }" @click="choice = 'direct'">
<p class="job-apply-method__card-title">直接前往官网</p>
<p class="job-apply-method__card-desc">手动填写网申信息<br>自行记录投递进度</p>
</div>
<!-- 智能投递助手 -->
<div class="job-apply-method__card" :class="{ 'job-apply-method__card--active': choice === 'agent' }" @click="choice = 'agent'">
<!-- 左下角圆形装饰 -->
<div class="job-apply-method__card-circle"></div>
<div class="job-apply-method__card-header">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M8 1L10 5.5L15 6.5L11.5 10L12.5 15L8 12.5L3.5 15L4.5 10L1 6.5L6 5.5L8 1Z" fill="#52CAD1"/></svg>
<span class="job-apply-method__card-title job-apply-method__card-title--accent">智能投递助手</span>
</div>
<p class="job-apply-method__card-desc">{{ agentCardDesc }}</p>
</div>
</div>
<!-- 底部操作按钮 -->
<button class="job-apply-method__action" :class="actionClass" :disabled="!choice" @click="handleAction">
<svg v-if="actionIcon" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_apply_method)">
<path d="M6.0714 3.63204C6.47007 2.46537 8.08207 2.43004 8.55474 3.52604L8.59474 3.63271L9.13274 5.20604C9.25603 5.56686 9.45527 5.89705 9.71702 6.17432C9.97877 6.4516 10.2969 6.66952 10.6501 6.81337L10.7947 6.86737L12.3681 7.40471C13.5347 7.80337 13.5701 9.41537 12.4747 9.88804L12.3681 9.92804L10.7947 10.466C10.4338 10.5893 10.1035 10.7885 9.82608 11.0502C9.54869 11.312 9.33067 11.6302 9.18674 11.9834L9.13274 12.1274L8.5954 13.7014C8.19674 14.868 6.58474 14.9034 6.11274 13.808L6.0714 13.7014L5.53407 12.128C5.41086 11.7671 5.21165 11.4368 4.9499 11.1594C4.68814 10.882 4.36993 10.664 4.01674 10.52L3.87274 10.466L2.2994 9.92871C1.13207 9.53004 1.09674 7.91804 2.19274 7.44604L2.2994 7.40471L3.87274 6.86737C4.23356 6.74408 4.56374 6.54484 4.84102 6.28309C5.11829 6.02134 5.33621 5.70317 5.48007 5.35004L5.53407 5.20604L6.0714 3.63204ZM7.3334 4.06271L6.79607 5.63604C6.60833 6.18624 6.30292 6.68891 5.90109 7.10904C5.49927 7.52917 5.0107 7.85666 4.4694 8.06871L4.30274 8.12937L2.7294 8.66671L4.30274 9.20404C4.85294 9.39178 5.35561 9.6972 5.77573 10.099C6.19586 10.5008 6.52335 10.9894 6.7354 11.5307L6.79607 11.6974L7.3334 13.2707L7.87074 11.6974C8.05848 11.1472 8.36389 10.6445 8.76571 10.2244C9.16753 9.80425 9.65611 9.47676 10.1974 9.26471L10.3641 9.20471L11.9374 8.66671L10.3641 8.12937C9.81387 7.94163 9.3112 7.63622 8.89107 7.2344C8.47094 6.83258 8.14345 6.34401 7.9314 5.80271L7.8714 5.63604L7.3334 4.06271ZM12.6667 1.33337C12.7915 1.33337 12.9137 1.36836 13.0195 1.43436C13.1253 1.50035 13.2105 1.59471 13.2654 1.70671L13.2974 1.78471L13.5307 2.46871L14.2154 2.70204C14.3404 2.7445 14.45 2.82312 14.5302 2.92792C14.6105 3.03272 14.6578 3.15899 14.6663 3.29072C14.6747 3.42246 14.6438 3.55373 14.5775 3.6679C14.5113 3.78207 14.4126 3.874 14.2941 3.93204L14.2154 3.96404L13.5314 4.19737L13.2981 4.88204C13.2555 5.00699 13.1769 5.11651 13.072 5.1967C12.9672 5.2769 12.8409 5.32417 12.7092 5.33252C12.5774 5.34088 12.4462 5.30994 12.3321 5.24363C12.2179 5.17732 12.1261 5.07862 12.0681 4.96004L12.0361 4.88204L11.8027 4.19804L11.1181 3.96471C10.9931 3.92224 10.8835 3.84363 10.8033 3.73883C10.723 3.63403 10.6756 3.50776 10.6672 3.37603C10.6588 3.24429 10.6897 3.11302 10.7559 2.99885C10.8222 2.88468 10.9208 2.79275 11.0394 2.73471L11.1181 2.70271L11.8021 2.46937L12.0354 1.78471C12.0804 1.65299 12.1654 1.53865 12.2786 1.45771C12.3918 1.37677 12.5276 1.33329 12.6667 1.33337Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0_apply_method">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
{{ actionText }}
</button>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, computed } from 'vue'
import { useRouter } from 'vue-router'
import { useStore } from 'vuex'
import { createChannelBridge } from '@/utils/channelBridge'
import { fetchAgentConfig, applyJob } from '@/api/agent'
import { ElMessage } from 'element-plus'
// ==================== Props & Emits ====================
const props = defineProps<{
/** 控制弹窗显隐(v-model */
modelValue: boolean
/** 岗位来源链接 */
sourceUrl: string
/** 岗位 ID */
jobId: string
}>()
const emit = defineEmits<{
(e: 'update:modelValue', val: boolean): void
/** 需要打开会员购买弹窗 */
(e: 'openMember'): void
}>()
// ==================== ====================
const router = useRouter()
const store = useStore()
// ==================== ====================
/** 弹窗是否显示 */
const visible = computed(() => props.modelValue)
// ==================== ====================
/** 用户选择的投递方式:null=未选择, 'direct'=直接前往官网, 'agent'=智能投递助手 */
const choice = ref<'direct' | 'agent' | null>(null)
/** AI助手是否已完成配置(status === 1 */
const agentConfigReady = ref(false)
/** 是否正在加载 AI 助手配置 */
const agentConfigLoading = ref(false)
// ==================== Store ====================
/** 用户会员状态 */
const memberStatus = computed(() => store.state.memberStatus)
/** 用户是否是会员(正式或试用) */
const isMember = computed(() => !!memberStatus.value?.isMember)
// ==================== ====================
/** 智能投递助手选项卡内的描述文字 — 根据会员和配置状态动态显示 */
const agentCardDesc = computed(() => {
if (!isMember.value) {
return '自动填写网申信息\n统一管理投递进度'
}
if (!agentConfigReady.value) {
return '完成助手设置后\n可使用智能投递'
}
return '将该岗位加入待投递列表\n在投递助手中统一处理'
})
/** 底部操作按钮文字 */
const actionText = computed(() => {
if (!choice.value) return '请选择投递方式'
if (choice.value === 'direct') return '去官网投递'
if (!isMember.value) return '开通会员使用'
if (!agentConfigReady.value) return '去完成设置'
return '加入待投递列表'
})
/** 底部操作按钮是否显示 icon */
const actionIcon = computed(() => {
if (!choice.value) return false
if (choice.value === 'direct') return false
return true
})
/** 底部操作按钮样式 class */
const actionClass = computed(() => {
if (!choice.value) return 'job-apply-method__action--disabled'
return 'job-apply-method__action--active'
})
// ==================== ====================
/** 加载 AI 助手配置状态 */
async function loadAgentConfigStatus() {
if (agentConfigLoading.value) return
agentConfigLoading.value = true
try {
const res = await fetchAgentConfig()
if (res.code === '0' && res.data && res.data.status === 1) {
agentConfigReady.value = true
} else {
agentConfigReady.value = false
}
} catch {
agentConfigReady.value = false
} finally {
agentConfigLoading.value = false
}
}
/** 打开弹窗时重置状态并加载配置 */
function open() {
choice.value = null
loadAgentConfigStatus()
}
/** 关闭弹窗 */
function close() {
emit('update:modelValue', false)
}
/** 底部操作按钮点击处理 */
async function handleAction() {
if (!choice.value) return
if (choice.value === 'direct') {
//
close()
if (props.sourceUrl) {
window.open(props.sourceUrl, '_blank')
//
const url = props.sourceUrl
const bridge = createChannelBridge({ domain: store.state.bridgeDomain })
bridge.get<{ linkList: string[] }>(store.state.bridgeDomain, 'offerpaiDeliveryLinkList', true)
.then((existing) => {
const linkList: string[] = existing?.linkList || []
if (!linkList.includes(url)) {
linkList.push(url)
}
return bridge.put<{ linkList: string[] }>(store.state.bridgeDomain, 'offerpaiDeliveryLinkList', { linkList }, true)
})
.catch((e) => {
console.error('[JobApplyMethodDialog] 跨域 put 投递链接失败', e)
})
.finally(() => {
bridge.destroy()
})
}
return
}
//
if (!isMember.value) {
//
close()
emit('openMember')
return
}
if (!agentConfigReady.value) {
// AI Agent
close()
router.push('/agent')
return
}
//
try {
const res = await applyJob({ jobId: props.jobId, status: -1 })
if (res.code === '0') {
ElMessage.success('已加入待投递列表')
} else {
ElMessage.error(res.msg || '加入待投递列表失败')
}
} catch {
ElMessage.error('加入待投递列表失败')
}
close()
}
// ==================== ====================
defineExpose({ open })
</script>
<style lang="scss" scoped>
@use '../assets/styles/variables' as *;
/* 组件最外层字号基准 */
.job-apply-method__overlay {
font-size: 0.14rem;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: $overlay-bg;
display: flex;
align-items: center;
justify-content: center;
z-index: 2000;
}
.job-apply-method__dialog {
position: relative;
width: 4.8rem;
background: $bg-white;
border: 1px solid #F0F0F0;
box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.05);
border-radius: 0.12rem;
padding: 0.28rem 0.32rem 0.32rem;
box-sizing: border-box;
overflow: hidden;
}
.job-apply-method__bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(180deg, #EDF9FA 0%, #FFFFFF 20.63%);
border-radius: 0.12rem;
pointer-events: none;
}
.job-apply-method__title {
position: relative;
font-size: 0.18rem;
font-weight: 620;
color: $text-dark;
text-align: center;
margin: 0 0 0.2rem 0;
line-height: 0.24rem;
}
.job-apply-method__close {
position: absolute;
top: 0.24rem;
right: 0.24rem;
width: 0.24rem;
height: 0.24rem;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
z-index: 1;
&:hover {
opacity: 0.7;
}
}
.job-apply-method__options {
position: relative;
display: flex;
gap: 0.16rem;
margin-bottom: 0.24rem;
}
.job-apply-method__card {
position: relative;
flex: 1;
height: 1.06rem;
background: $bg-white;
border: 1px solid #F0F0F0;
border-radius: 0.08rem;
padding: 0.2rem 0;
box-sizing: border-box;
cursor: pointer;
text-align: center;
transition: border-color 0.2s, background 0.2s;
overflow: hidden;
&:hover {
border-color: #D0D0D0;
}
&--active {
border-color: $accent;
background: #EDF9FA;
}
}
.job-apply-method__card-title {
font-size: 0.14rem;
font-weight: 450;
color: #000;
margin: 0;
line-height: 0.19rem;
&--accent {
color: $accent;
}
}
.job-apply-method__card-desc {
font-size: 0.12rem;
font-weight: 330;
color: $text-light;
line-height: 0.2rem;
margin: 0.06rem 0 0 0;
white-space: pre-line;
}
.job-apply-method__card-header {
display: flex;
align-items: center;
justify-content: center;
gap: 0.04rem;
}
.job-apply-method__card-circle {
position: absolute;
width: 0.46rem;
height: 0.46rem;
left: -0.05rem;
bottom: -0.08rem;
background: #AEE6EA;
border-radius: 50%;
opacity: 1;
transition: opacity 0.2s;
&::before,
&::after {
content: '';
position: absolute;
width: 0.04rem;
height: 0.09rem;
background: $bg-white;
border-radius: 0.02rem;
top: 40%;
}
&::before {
left: 42%;
}
&::after {
left: 60%;
}
}
.job-apply-method__action {
position: relative;
width: 100%;
height: 0.35rem;
border: none;
border-radius: 0.08rem;
font-size: 0.14rem;
font-weight: 450;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.2s, color 0.2s;
&--disabled {
background: #EDF9FA;
color: #AEE6EA;
cursor: not-allowed;
}
&--active {
background: $accent;
color: $bg-white;
&:hover {
background: $accent-hover;
}
}
}
</style>
+7 -1
View File
@@ -19,6 +19,7 @@
:maxSelect="3" :maxSelect="3"
:level="3" :level="3"
:allowParentSelect="false" :allowParentSelect="false"
:allowParentSelectClick="true"
:triggerStyle="selectorTriggerStyle" :triggerStyle="selectorTriggerStyle"
:displayStyle="selectorDisplayStyle" :displayStyle="selectorDisplayStyle"
@update:categoryIds="onCategoryChange" @update:categoryIds="onCategoryChange"
@@ -33,6 +34,7 @@
:maxSelect="3" :maxSelect="3"
:level="2" :level="2"
:allowParentSelect="false" :allowParentSelect="false"
:allowParentSelectClick="true"
:triggerStyle="selectorTriggerStyle" :triggerStyle="selectorTriggerStyle"
:displayStyle="selectorDisplayStyle" :displayStyle="selectorDisplayStyle"
@update:industryIds="onIndustryChange" @update:industryIds="onIndustryChange"
@@ -157,11 +159,15 @@ function onRegionChange(codes: string[]) {
/** 保存表单数据 */ /** 保存表单数据 */
async function handleSave() { async function handleSave() {
try { try {
const intention = store.state.jobIntention
await store.dispatch('saveJobIntention', { await store.dispatch('saveJobIntention', {
categoryIds: [...selectedCategoryIds.value], categoryIds: [...selectedCategoryIds.value],
industryIds: [...selectedIndustryIds.value], industryIds: [...selectedIndustryIds.value],
regionCodes: [...selectedRegionCodes.value], regionCodes: [...selectedRegionCodes.value],
recruitCategory: JOB_TYPE_OPTIONS.find(o => o.label === selectedJobType.value)?.value ?? 0, recruitCategory: selectedJobType.value === '全部' ? null : (JOB_TYPE_OPTIONS.find(o => o.label === selectedJobType.value)?.value ?? null),
employmentType: intention.employmentType ?? null,
aiCategoryIds: intention.aiCategoryIds || [],
aiIndustryIds: intention.aiIndustryIds || [],
}) })
visible.value = false visible.value = false
} catch (e) { } catch (e) {
+46 -2
View File
@@ -1,5 +1,5 @@
<template> <template>
<div class="bg-f mb16 prl24 ptb16"> <div class="bg-f mb16 prl24 ptb16 dflex aliite-c">
<div class="job-page-header dflex-start aliite-c"> <div class="job-page-header dflex-start aliite-c">
<h2 class="job-page-header__title">发现理想职位</h2> <h2 class="job-page-header__title">发现理想职位</h2>
<div class="job-page-header__tabs ml30 "> <div class="job-page-header__tabs ml30 ">
@@ -17,6 +17,22 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 岗位统计卡片区域 -->
<div class="job-stats-cards">
<!-- 全网实时岗位卡片 -->
<div class="job-stats-cards__count-card prl10 dflex-center aliite-c">
<span class="job-stats-cards__dot"></span>
<div class="ml8">
<div class="job-stats-cards__count-num">{{ formattedJobCount }}</div>
<div class="job-stats-cards__count-label">全网实时岗位</div>
</div>
</div>
<!-- 可投率卡片 -->
<div class="job-stats-cards__match-card">
<span class="job-stats-cards__match-num">92%</span>
<span class="job-stats-cards__match-label">可投率</span>
</div>
</div>
</div> </div>
</template> </template>
@@ -25,7 +41,7 @@
import { ref, computed, onMounted } from 'vue' import { ref, computed, onMounted } from 'vue'
import { useRouter, useRoute } from 'vue-router' import { useRouter, useRoute } from 'vue-router'
import { useStore } from 'vuex' import { useStore } from 'vuex'
import { fetchFavoriteCount, fetchApplyCount } from '@/api/jobs' import { fetchFavoriteCount, fetchApplyCount, fetchJobCount } from '@/api/jobs'
// ==================== Props & Emits ==================== // ==================== Props & Emits ====================
@@ -50,12 +66,32 @@ const isAuthenticated = computed(() => store.state.isAuthenticated)
// ==================== & ==================== // ==================== & ====================
/** 全网岗位总数 */
const jobCount = ref(0)
/** 格式化岗位总数(每3位加逗号) */
const formattedJobCount = computed(() => {
return jobCount.value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')
})
/** 收藏总数 */ /** 收藏总数 */
const favoriteTotal = ref(0) const favoriteTotal = ref(0)
/** 投递总数 */ /** 投递总数 */
const applyTotal = ref(0) const applyTotal = ref(0)
/** 加载岗位总数 */
async function loadJobCount() {
try {
const res = await fetchJobCount()
if (res.code === '0' && res.data !== undefined) {
jobCount.value = Number(res.data)
}
} catch (e) {
console.error('加载岗位总数失败', e)
}
}
/** 加载收藏统计 */ /** 加载收藏统计 */
async function loadFavoriteCount() { async function loadFavoriteCount() {
try { try {
@@ -82,12 +118,20 @@ async function loadApplyCount() {
/** 组件挂载时请求收藏和投递统计 */ /** 组件挂载时请求收藏和投递统计 */
onMounted(() => { onMounted(() => {
//
loadJobCount()
if (isAuthenticated.value) { if (isAuthenticated.value) {
loadFavoriteCount() loadFavoriteCount()
loadApplyCount() loadApplyCount()
} }
}) })
/** 暴露刷新方法给父组件调用,以便收藏/投递操作后同步刷新计数 */
defineExpose({
loadFavoriteCount,
loadApplyCount,
})
// ==================== ==================== // ==================== ====================
/** Tab 选项列表,count 用于显示圆形徽章计数 */ /** Tab 选项列表,count 用于显示圆形徽章计数 */
+14 -21
View File
@@ -12,21 +12,7 @@
</button> </button>
<h2 class="job-resume-custom-dialog__drawer-title">生成你的岗位专属简历</h2> <h2 class="job-resume-custom-dialog__drawer-title">生成你的岗位专属简历</h2>
</div> </div>
<!-- 下载简历按钮步骤三显示位于步骤指示器上方 -->
<div v-if="currentStep === 4" class="job-resume-custom-dialog__top-download mt10 ml12">
<button class="job-resume-custom-dialog__top-download-btn" @click="toggleDownloadMenu">
<svg viewBox="0 0 16 16" fill="none" class="job-resume-custom-dialog__top-download-icon">
<path d="M8 2v8M8 10l-3-3M8 10l3-3" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M3 12h10" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/>
</svg>
下载简历
</button>
<!-- 下载下拉菜单 -->
<div v-if="showDownloadMenu" class="job-resume-custom-dialog__top-download-menu">
<button class="job-resume-custom-dialog__top-download-option" @click="handleDownload('pdf')">下载PDF</button>
<button class="job-resume-custom-dialog__top-download-option" @click="handleDownload('word')">下载Word</button>
</div>
</div>
<!-- 步骤指示器 --> <!-- 步骤指示器 -->
<div class="job-resume-custom-dialog__steps pt10"> <div class="job-resume-custom-dialog__steps pt10">
<div class="job-resume-custom-dialog__step" :class="{ 'job-resume-custom-dialog__step--active': currentStep === 2 }"> <div class="job-resume-custom-dialog__step" :class="{ 'job-resume-custom-dialog__step--active': currentStep === 2 }">
@@ -48,8 +34,8 @@
<!-- 匹配度标题区域 --> <!-- 匹配度标题区域 -->
<div class="job-resume-custom-dialog__gap-header"> <div class="job-resume-custom-dialog__gap-header">
<div class="job-resume-custom-dialog__gap-left"> <div class="job-resume-custom-dialog__gap-left">
<h3 class="job-resume-custom-dialog__gap-title">你的简历与该岗位<span class="job-resume-custom-dialog__gap-title-highlight">匹配度{{ isLowMatch ? '较' : '较' }}</span></h3> <h3 class="job-resume-custom-dialog__gap-title">你的简历与该岗位任职要求差距<span class="job-resume-custom-dialog__gap-title-highlight">{{ isLowMatch ? '较' : '较' }}</span></h3>
<p class="job-resume-custom-dialog__gap-subtitle">匹配度低于 6.0 分的简历在筛选环节可能会被优先淘汰我们会帮你快速优化提升</p> <p class="job-resume-custom-dialog__gap-subtitle">竞争力低于 6.0 分的简历在筛选环节可能会被优先淘汰我们会帮你快速优化提升</p>
</div> </div>
<!-- 右侧匹配度分数 --> <!-- 右侧匹配度分数 -->
<div class="job-resume-custom-dialog__gap-score-area"> <div class="job-resume-custom-dialog__gap-score-area">
@@ -222,7 +208,7 @@
</svg> </svg>
<span class="job-resume-custom-dialog__match-score">{{ cachedOptimizedScore.toFixed(1) }}</span> <span class="job-resume-custom-dialog__match-score">{{ cachedOptimizedScore.toFixed(1) }}</span>
</div> </div>
<span class="job-resume-custom-dialog__match-label job-resume-custom-dialog__match-label--high">{{ cachedOptimizedScore >= 9 ? '非常匹配' : cachedOptimizedScore >= 6 ? '高匹配度' : '低匹配度' }}</span> <span class="job-resume-custom-dialog__match-label job-resume-custom-dialog__match-label--high">{{ cachedOptimizedScore >= 9 ? '非常匹配' : cachedOptimizedScore >= 6 ? '高匹配度' : '低竞争力' }}</span>
</div> </div>
</div> </div>
<!-- 改写说明卡片外面平铺 --> <!-- 改写说明卡片外面平铺 -->
@@ -327,8 +313,15 @@
<div v-if="currentStep === 4" class="job-resume-custom-dialog__preview-footer mt10 pt30"> <div v-if="currentStep === 4" class="job-resume-custom-dialog__preview-footer mt10 pt30">
<!-- 左侧上一步按钮 --> <!-- 左侧上一步按钮 -->
<button class="job-resume-custom-dialog__footer-prev-btn" @click="goToStep(3)">上一步</button> <button class="job-resume-custom-dialog__footer-prev-btn" @click="goToStep(3)">上一步</button>
<!-- 右侧立即去投递按钮 --> <!-- 右侧下载专属简历按钮 -->
<button class="job-resume-custom-dialog__submit-btn" @click="handleSubmit">立即去投递</button> <div class="job-resume-custom-dialog__submit-wrap">
<button class="job-resume-custom-dialog__submit-btn" @click="toggleDownloadMenu">下载专属简历</button>
<!-- 下载下拉菜单 -->
<div v-if="showDownloadMenu" class="job-resume-custom-dialog__top-download-menu">
<button class="job-resume-custom-dialog__top-download-option" @click="handleDownload('pdf')">下载PDF</button>
<button class="job-resume-custom-dialog__top-download-option" @click="handleDownload('word')">下载Word</button>
</div>
</div>
</div> </div>
</div> </div>
@@ -482,7 +475,7 @@ const missingSkills = computed(() => props.jobInfo.missingSkills || [])
const matchLevelText = computed(() => { const matchLevelText = computed(() => {
const score = props.jobInfo.matchScore const score = props.jobInfo.matchScore
if (score >= 6) return '高匹配度' if (score >= 6) return '高匹配度'
return '低匹配度' return '低竞争力'
}) })
/** 是否为低匹配度(低于6分) */ /** 是否为低匹配度(低于6分) */
+206 -226
View File
@@ -3,71 +3,41 @@
<Teleport to="body"> <Teleport to="body">
<!-- 遮罩层 点击关闭弹窗 --> <!-- 遮罩层 点击关闭弹窗 -->
<div v-if="modelValue" class="member-dialog-overlay" @click="$emit('update:modelValue', false)"> <div v-if="modelValue" class="member-dialog-overlay" @click="$emit('update:modelValue', false)">
<!-- 弹窗主体 阻止点击冒泡 --> <!-- 弹窗主体 左右布局 -->
<div class="member-dialog" @click.stop> <div class="member-dialog" @click.stop>
<!-- 顶部标题行 --> <!-- 左侧黑金权益栏 -->
<div class="member-dialog__header"> <div class="member-dialog__left">
<div class="member-dialog__header-left"> <!-- 装饰线条背景 -->
<h2 class="member-dialog__title">会员中心</h2> <div class="member-dialog__left-deco"></div>
<p class="member-dialog__subtitle">解锁更多求职功能让投递更高效</p> <!-- 左栏标题 -->
</div> <h2 class="member-dialog__left-title">Offer派会员专享权益</h2>
<div class="member-dialog__header-right"> <p class="member-dialog__left-subtitle">解锁更多功能让求职更高效</p>
<!-- 联系客服hover显示二维码 --> <!-- 权益卡片列表 -->
<span class="member-dialog__contact-wrap"> <div class="member-dialog__benefits">
<span class="member-dialog__contact">联系客服</span>
<div class="member-dialog__contact-qr">
<img src="@/assets/images/nav/kg-qcCode.png" alt="客服二维码" />
<div class="member-dialog__contact-qr-arrow"></div>
</div>
</span>
<span class="member-dialog__close" @click="$emit('update:modelValue', false)"></span>
</div>
</div>
<!-- 套餐选择区域 -->
<div class="member-dialog__plans">
<div
v-for="plan in plans"
:key="plan.key"
class="member-dialog__plan-card"
:class="{ 'member-dialog__plan-card--active': selectedPlan === plan.key }"
@click="selectedPlan = plan.key"
>
<!-- 推荐标签 -->
<div v-if="plan.recommend" class="member-dialog__plan-recommend"><svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_180_2594)">
<path d="M0.872709 4.61946C0.867714 4.56192 0.874732 4.50398 0.893317 4.44931C0.911903 4.39464 0.94165 4.34442 0.980672 4.30186C1.01969 4.25929 1.06714 4.2253 1.11999 4.20204C1.17285 4.17878 1.22996 4.16676 1.28771 4.16675H2.08333C2.19384 4.16675 2.29982 4.21065 2.37796 4.28879C2.4561 4.36693 2.5 4.47291 2.5 4.58341V8.54175C2.5 8.65225 2.4561 8.75823 2.37796 8.83637C2.29982 8.91451 2.19384 8.95841 2.08333 8.95841H1.63208C1.5278 8.95844 1.42729 8.91936 1.35042 8.84889C1.27355 8.77842 1.2259 8.68168 1.21688 8.57779L0.872709 4.61946ZM3.75 4.45321C3.75 4.27904 3.85833 4.1232 4.01563 4.04904C4.35917 3.88696 4.94438 3.56133 5.20833 3.12112C5.54854 2.55362 5.61271 1.52841 5.62313 1.29362C5.62458 1.26071 5.62375 1.22779 5.62813 1.19529C5.68458 0.788414 6.46979 1.26362 6.77083 1.76612C6.93438 2.03862 6.95521 2.39675 6.93813 2.67654C6.91958 2.97571 6.83188 3.26466 6.74583 3.55175L6.5625 4.16362H8.82438C8.88875 4.16362 8.95225 4.17853 9.0099 4.20719C9.06754 4.23585 9.11776 4.27748 9.15662 4.32881C9.19547 4.38014 9.22191 4.43977 9.23384 4.50303C9.24578 4.56629 9.2429 4.63145 9.22542 4.69341L8.10667 8.65508C8.08197 8.74245 8.02941 8.81937 7.95698 8.87413C7.88455 8.92888 7.79622 8.95848 7.70542 8.95841H4.16667C4.05616 8.95841 3.95018 8.91451 3.87204 8.83637C3.7939 8.75823 3.75 8.65225 3.75 8.54175V4.45321Z" fill="white" stroke="white" stroke-width="0.833333" stroke-linecap="round" stroke-linejoin="round"/>
</g>
<defs>
<clipPath id="clip0_180_2594">
<rect width="10" height="10" fill="white"/>
</clipPath>
</defs>
</svg>
推荐</div>
<!-- 套餐名称 -->
<div class="member-dialog__plan-name">{{ plan.name }}</div>
<!-- 价格行 -->
<div class="member-dialog__plan-price">
<span class="member-dialog__plan-price-symbol">¥</span>
<span class="member-dialog__plan-price-num">{{ plan.priceInt }}</span>
<span v-if="plan.originalPrice" class="member-dialog__plan-original-price">{{ plan.originalPrice }}</span>
</div>
<!-- 标签描述接口tag字段 -->
<div class="member-dialog__plan-daily mt4">{{ plan.tag }}</div>
</div>
</div>
<!-- 会员权益区域 -->
<div class="member-dialog__benefits">
<h3 class="member-dialog__benefits-title">会员权益</h3>
<div class="member-dialog__benefits-cards">
<div class="member-dialog__benefit-card"> <div class="member-dialog__benefit-card">
<div class="member-dialog__benefit-icon"> <div class="member-dialog__benefit-icon">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"> <svg width="14" height="15" viewBox="0 0 13 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="12" fill="#EDF9FA"/> <path d="M4.67492 2.29867C5.07359 1.132 6.68559 1.09667 7.15825 2.19267L7.19825 2.29933L7.73625 3.87267C7.85955 4.23349 8.05879 4.56367 8.32054 4.84095C8.58229 5.11822 8.90046 5.33614 9.25359 5.48L9.39825 5.534L10.9716 6.07133C12.1383 6.47 12.1736 8.082 11.0783 8.55467L10.9716 8.59467L9.39825 9.13267C9.03731 9.25588 8.70699 9.45508 8.4296 9.71684C8.1522 9.97859 7.93418 10.2968 7.79025 10.65L7.73625 10.794L7.19892 12.368C6.80025 13.5347 5.18825 13.57 4.71625 12.4747L4.67492 12.368L4.13759 10.7947C4.01437 10.4337 3.81517 10.1034 3.55341 9.82601C3.29166 9.54862 2.97345 9.3306 2.62025 9.18667L2.47625 9.13267L0.902919 8.59533C-0.264415 8.19667 -0.299748 6.58467 0.796252 6.11267L0.902919 6.07133L2.47625 5.534C2.83707 5.4107 3.16726 5.21146 3.44453 4.94971C3.72181 4.68796 3.93973 4.36979 4.08359 4.01667L4.13759 3.87267L4.67492 2.29867ZM11.2703 1.20458e-07C11.395 -1.57315e-07 11.5172 0.0349855 11.623 0.100981C11.7288 0.166977 11.814 0.261335 11.8689 0.373333L11.9009 0.451333L12.1343 1.13533L12.8189 1.36867C12.9439 1.41113 13.0535 1.48974 13.1337 1.59454C13.214 1.69934 13.2613 1.82561 13.2698 1.95735C13.2782 2.08908 13.2473 2.22035 13.1811 2.33453C13.1148 2.4487 13.0161 2.54063 12.8976 2.59867L12.8189 2.63067L12.1349 2.864L11.9016 3.54867C11.859 3.67362 11.7804 3.78313 11.6755 3.86333C11.5707 3.94352 11.4444 3.99079 11.3127 3.99915C11.1809 4.0075 11.0497 3.97656 10.9356 3.91025C10.8214 3.84394 10.7296 3.74524 10.6716 3.62667L10.6396 3.54867L10.4063 2.86467L9.72159 2.63133C9.5966 2.58887 9.48703 2.51026 9.40677 2.40546C9.3265 2.30066 9.27916 2.17439 9.27073 2.04265C9.26231 1.91092 9.29318 1.77965 9.35944 1.66548C9.4257 1.5513 9.52436 1.45937 9.64292 1.40133L9.72159 1.36933L10.4056 1.136L10.6389 0.451333C10.6839 0.319617 10.7689 0.205272 10.8821 0.124333C10.9954 0.0433927 11.1311 -8.35209e-05 11.2703 1.20458e-07Z" fill="#FFE2A1"/>
<path d="M7 8h7v2H7V8zm0 3h10v2H7v-2zm0 3h5v2H7v-2z" fill="#52CAD1"/> </svg>
</div>
<div class="member-dialog__benefit-info">
<span class="member-dialog__benefit-name">AI智能投递</span>
<span class="member-dialog__benefit-desc">会员专享</span>
</div>
</div>
<div class="member-dialog__benefit-card">
<div class="member-dialog__benefit-icon">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2639_2062)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.49998 1.66667C9.49998 1.62246 9.48242 1.58007 9.45116 1.54882C9.41991 1.51756 9.37752 1.5 9.33331 1.5H4.66665C4.18042 1.5 3.7141 1.69315 3.37028 2.03697C3.02647 2.38079 2.83331 2.8471 2.83331 3.33333V12.6667C2.83331 13.1529 3.02647 13.6192 3.37028 13.963C3.7141 14.3068 4.18042 14.5 4.66665 14.5H11.3333C11.8195 14.5 12.2859 14.3068 12.6297 13.963C12.9735 13.6192 13.1666 13.1529 13.1666 12.6667V6.098C13.1666 6.0538 13.1491 6.0114 13.1178 5.98015C13.0866 5.94889 13.0442 5.93133 13 5.93133H9.99998C9.86737 5.93133 9.74019 5.87865 9.64643 5.78489C9.55266 5.69112 9.49998 5.56394 9.49998 5.43133V1.66667ZM9.99998 8.16667C10.1326 8.16667 10.2598 8.21935 10.3535 8.31311C10.4473 8.40688 10.5 8.53406 10.5 8.66667C10.5 8.79927 10.4473 8.92645 10.3535 9.02022C10.2598 9.11399 10.1326 9.16667 9.99998 9.16667H5.99998C5.86737 9.16667 5.74019 9.11399 5.64643 9.02022C5.55266 8.92645 5.49998 8.79927 5.49998 8.66667C5.49998 8.53406 5.55266 8.40688 5.64643 8.31311C5.74019 8.21935 5.86737 8.16667 5.99998 8.16667H9.99998ZM9.99998 10.8333C10.1326 10.8333 10.2598 10.886 10.3535 10.9798C10.4473 11.0735 10.5 11.2007 10.5 11.3333C10.5 11.4659 10.4473 11.5931 10.3535 11.6869C10.2598 11.7807 10.1326 11.8333 9.99998 11.8333H5.99998C5.86737 11.8333 5.74019 11.7807 5.64643 11.6869C5.55266 11.5931 5.49998 11.4659 5.49998 11.3333C5.49998 11.2007 5.55266 11.0735 5.64643 10.9798C5.74019 10.886 5.86737 10.8333 5.99998 10.8333H9.99998Z" fill="#FFE2A1"/>
<path d="M10.5 1.88272C10.5 1.76005 10.6287 1.68205 10.724 1.75872C10.8049 1.82405 10.8767 1.90005 10.9393 1.98672L12.948 4.78472C12.9933 4.84872 12.944 4.93139 12.8653 4.93139H10.6667C10.6225 4.93139 10.5801 4.91383 10.5488 4.88257C10.5176 4.85131 10.5 4.80892 10.5 4.76472V1.88272Z" fill="#FFE2A1"/>
</g>
<defs>
<clipPath id="clip0_2639_2062">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg> </svg>
</div> </div>
<div class="member-dialog__benefit-info"> <div class="member-dialog__benefit-info">
@@ -77,107 +47,184 @@
</div> </div>
<div class="member-dialog__benefit-card"> <div class="member-dialog__benefit-card">
<div class="member-dialog__benefit-icon"> <div class="member-dialog__benefit-icon">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"> <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" rx="12" fill="#EDF9FA"/> <path d="M8.655 1.64404C8.70394 1.5974 8.76182 1.56116 8.82516 1.53753C8.8885 1.5139 8.95597 1.50335 9.0235 1.50654C11.9815 1.64504 14.355 4.01854 14.4935 6.97654C14.4967 7.04411 14.4861 7.11162 14.4624 7.17499C14.4388 7.23835 14.4025 7.29626 14.3558 7.3452C14.3091 7.39414 14.253 7.4331 14.1908 7.45971C14.1286 7.48632 14.0616 7.50004 13.994 7.50004H9C8.86739 7.50004 8.74021 7.44736 8.64645 7.35359C8.55268 7.25982 8.5 7.13264 8.5 7.00004V2.00604C8.49999 1.93835 8.51372 1.87136 8.54036 1.80913C8.567 1.74691 8.60601 1.69074 8.655 1.64404ZM7.345 3.14404C7.39399 3.19074 7.43299 3.24691 7.45964 3.30913C7.48628 3.37136 7.50001 3.43835 7.5 3.50604V7.25004C7.5 7.58156 7.6317 7.8995 7.86612 8.13392C8.10054 8.36834 8.41848 8.50004 8.75 8.50004H12.494C12.5617 8.49996 12.6287 8.51363 12.6909 8.54021C12.7532 8.5668 12.8094 8.60574 12.8561 8.65469C12.9029 8.70364 12.9392 8.76157 12.9629 8.82497C12.9866 8.88837 12.9972 8.95593 12.994 9.02354C12.85 12.0725 10.3335 14.5 7.25 14.5C4.0745 14.5 1.5 11.9255 1.5 8.75004C1.5 5.66604 3.9275 3.14954 6.9765 3.00654C7.04403 3.00335 7.1115 3.0139 7.17484 3.03753C7.23818 3.06116 7.29606 3.0974 7.345 3.14404Z" fill="#FFE2A1"/>
<path d="M12 7l1.5 3 3.5.5-2.5 2.5.5 3.5L12 15l-3 1.5.5-3.5L7 10.5l3.5-.5L12 7z" fill="#52CAD1"/>
</svg> </svg>
</div> </div>
<div class="member-dialog__benefit-info"> <div class="member-dialog__benefit-info">
<span class="member-dialog__benefit-name">AI+投递助手</span> <span class="member-dialog__benefit-name">海量岗位数据</span>
<span class="member-dialog__benefit-desc">会员专享</span> <span class="member-dialog__benefit-desc">全网实时更新</span>
</div>
</div>
<div class="member-dialog__benefit-card">
<div class="member-dialog__benefit-icon">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 2C11.4696 2 10.9609 2.21071 10.5858 2.58579C10.2107 2.96086 10 3.46957 10 4C10 4.53043 10.2107 5.03914 10.5858 5.41421C10.9609 5.78929 11.4696 6 12 6C12.5304 6 13.0391 5.78929 13.4142 5.41421C13.7893 5.03914 14 4.53043 14 4C14 3.46957 13.7893 2.96086 13.4142 2.58579C13.0391 2.21071 12.5304 2 12 2Z" fill="#FFE2A1"/>
<path d="M3.33333 2.66663C2.6 2.66663 2 3.26663 2 3.99996V12.6666C2 13.4 2.6 14 3.33333 14H12C12.7333 14 13.3333 13.4 13.3333 12.6666V6.67329C12.9267 6.87329 12.48 6.99996 12 6.99996C10.3467 6.99996 9 5.65329 9 3.99996C9 3.51996 9.12667 3.07329 9.32667 2.66663H3.33333Z" fill="#FFE2A1"/>
</svg>
</div>
<div class="member-dialog__benefit-info">
<span class="member-dialog__benefit-name">校招公告速递</span>
<span class="member-dialog__benefit-desc">名企动态抢先看</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- 支付方式选择 --> <!-- 左右分割金边 -->
<div class="member-dialog__payment"> <div class="member-dialog__divider"></div>
<span class="member-dialog__payment-label">选择支付方式</span>
<div class="member-dialog__payment-methods"> <!-- 右侧内容区 -->
<div <div class="member-dialog__right">
class="member-dialog__payment-item" <!-- 顶部标题行 -->
:class="{ 'member-dialog__payment-item--wechat-active': selectedPayment === 'wechat' }" <div class="member-dialog__header">
@click="selectedPayment = 'wechat'" <h2 class="member-dialog__title">会员中心</h2>
> <div class="member-dialog__header-actions">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none"> <!-- 联系客服 -->
<path d="M14 8c0 3.3-2.7 6-6 6s-6-2.7-6-6 2.7-6 6-6 6 2.7 6 6z" fill="#07C160"/> <span class="member-dialog__contact-wrap">
<path d="M5.5 6.5c.5-.3 1.2-.1 1.5.4l.5 1 1.5-2c.3-.5 1-.6 1.5-.3.5.3.6 1 .3 1.5l-2.5 3.5c-.2.3-.5.4-.8.4-.3 0-.6-.1-.8-.4L5.2 8c-.3-.5-.2-1.2.3-1.5z" fill="white"/> <span class="member-dialog__contact">联系客服</span>
</svg> <div class="member-dialog__contact-qr">
<span class="member-dialog__payment-text member-dialog__payment-text--wechat">微信支付</span> <img src="@/assets/images/nav/kg-qcCode.png" alt="客服二维码" />
</div> <div class="member-dialog__contact-qr-arrow"></div>
<div </div>
class="member-dialog__payment-item" </span>
:class="{ 'member-dialog__payment-item--alipay-active': selectedPayment === 'alipay' }" <!-- 关闭按钮 -->
@click="selectedPayment = 'alipay'" <span class="member-dialog__close" @click="$emit('update:modelValue', false)"></span>
>
<svg width="16" height="16" viewBox="0 0 16 16" fill="none">
<rect width="16" height="16" rx="3" fill="#1677FF"/>
<text x="4" y="12" fill="white" font-size="10" font-weight="bold"></text>
</svg>
<span class="member-dialog__payment-text member-dialog__payment-text--alipay">支付宝支付</span>
</div> </div>
</div> </div>
</div>
<!-- 购买按钮 --> <!-- 套餐选择区域 -->
<button <div class="member-dialog__plans">
class="member-dialog__buy-btn" <div
:class="{ 'member-dialog__buy-btn--active': selectedPayment }" v-for="plan in plans"
@click="handleBuy" :key="plan.key"
>购买会员</button> class="member-dialog__plan-card"
:class="{ 'member-dialog__plan-card--active': selectedPlan === plan.key }"
</div> @click="selectedPlan = plan.key"
</div> >
<!-- 推荐角标 -->
<!-- ==================== 扫码支付弹窗 ==================== --> <div v-if="plan.recommend" class="member-dialog__plan-badge">超值推荐</div>
<div v-if="showQrCode" class="member-dialog-overlay member-dialog-overlay--qrcode" @click="handleCloseQrCode"> <!-- 套餐名称 -->
<div class="member-dialog member-dialog--qrcode" @click.stop> <div class="member-dialog__plan-name">{{ plan.name }}</div>
<!-- 价格行 -->
<!-- 顶部标题行 --> <div class="member-dialog__plan-price">
<div class="member-dialog__header"> <span class="member-dialog__plan-price-symbol">¥</span>
<div class="member-dialog__header-left"> <span class="member-dialog__plan-price-num">{{ plan.priceInt }}</span>
<h2 class="member-dialog__title">扫码支付</h2> <span v-if="plan.originalPrice" class="member-dialog__plan-original">{{ plan.originalPrice }}</span>
</div>
<!-- 标签描述 -->
<div class="member-dialog__plan-tag">{{ plan.tag }}</div>
</div>
</div> </div>
<div class="member-dialog__header-right">
<span class="member-dialog__close" @click="handleCloseQrCode"></span> <!-- 步骤一选择支付方式 + 底部应付金额购买按钮未创建订单时显示 -->
<div v-if="!showQrCode" class="member-dialog__step-pay">
<!-- 支付方式选择 -->
<div class="member-dialog__payment-section">
<span class="member-dialog__payment-label">选择支付方式</span>
<div class="member-dialog__payment-methods">
<!-- 微信支付 -->
<div
class="member-dialog__payment-item"
:class="{ 'member-dialog__payment-item--active': selectedPayment === 'wechat' }"
@click="selectedPayment = 'wechat'"
>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2639_1996)">
<path d="M20.8249 10.8533C21.3364 10.8533 21.8348 10.8933 22.32 10.96C21.4282 7 17.3364 4 12.4184 4C6.8446 4 2.32001 7.84 2.32001 12.5733C2.32001 15.3067 3.8282 17.72 6.17574 19.2933L4.85116 22L8.47083 20.4133C9.2446 20.6933 10.0577 20.92 10.9233 21.04C10.8053 20.52 10.7397 19.9867 10.7397 19.4267C10.7266 14.7067 15.2512 10.8533 20.8249 10.8533ZM15.7757 7.85333C15.9411 7.85333 16.1048 7.88644 16.2576 7.95077C16.4103 8.01509 16.5491 8.10938 16.666 8.22824C16.7829 8.3471 16.8757 8.4882 16.9389 8.6435C17.0022 8.7988 17.0348 8.96524 17.0348 9.13333C17.0348 9.30143 17.0022 9.46787 16.9389 9.62317C16.8757 9.77847 16.7829 9.91957 16.666 10.0384C16.5491 10.1573 16.4103 10.2516 16.2576 10.3159C16.1048 10.3802 15.9411 10.4133 15.7757 10.4133C15.4418 10.4133 15.1216 10.2785 14.8855 10.0384C14.6494 9.79838 14.5167 9.47281 14.5167 9.13333C14.5167 8.79386 14.6494 8.46828 14.8855 8.22824C15.1216 7.98819 15.4418 7.85333 15.7757 7.85333ZM9.04788 10.4267C8.71396 10.4267 8.39373 10.2918 8.15762 10.0518C7.92151 9.81172 7.78886 9.48614 7.78886 9.14667C7.78886 8.80719 7.92151 8.48162 8.15762 8.24157C8.39373 8.00152 8.71396 7.86667 9.04788 7.86667C9.38179 7.86667 9.70202 8.00152 9.93814 8.24157C10.1742 8.48162 10.3069 8.80719 10.3069 9.14667C10.3069 9.48614 10.1742 9.81172 9.93814 10.0518C9.70202 10.2918 9.38179 10.4267 9.04788 10.4267Z" fill="#07C160"/>
<path d="M29 19.6638C29 15.9818 25.1942 13 20.5 13C15.8058 13 12 15.9818 12 19.6638C12 23.3457 15.8058 26.3276 20.5 26.3276C21.2691 26.3276 22.0117 26.2239 22.7145 26.0683L27.3027 28L25.7114 24.8885C27.7005 23.6698 29 21.8029 29 19.6638ZM17.9407 19.2489C17.6889 19.2489 17.4428 19.1759 17.2335 19.0392C17.0241 18.9024 16.861 18.708 16.7646 18.4806C16.6683 18.2532 16.643 18.0029 16.6922 17.7615C16.7413 17.5201 16.8625 17.2983 17.0406 17.1243C17.2186 16.9502 17.4454 16.8317 17.6924 16.7836C17.9393 16.7356 18.1953 16.7603 18.4279 16.8545C18.6605 16.9487 18.8593 17.1082 18.9992 17.3129C19.1391 17.5175 19.2137 17.7582 19.2137 18.0043C19.227 18.6914 18.6435 19.2489 17.9407 19.2489ZM23.046 19.2489C22.7084 19.2489 22.3846 19.1178 22.1459 18.8844C21.9071 18.651 21.773 18.3344 21.773 18.0043C21.773 17.6742 21.9071 17.3577 22.1459 17.1243C22.3846 16.8909 22.7084 16.7597 23.046 16.7597C23.3836 16.7597 23.7074 16.8909 23.9462 17.1243C24.1849 17.3577 24.319 17.6742 24.319 18.0043C24.319 18.3344 24.1849 18.651 23.9462 18.8844C23.7074 19.1178 23.3836 19.2489 23.046 19.2489Z" fill="#07C160"/>
</g>
<defs>
<clipPath id="clip0_2639_1996">
<rect width="32" height="32" fill="white"/>
</clipPath>
</defs>
</svg>
<span class="member-dialog__payment-text">微信支付</span>
<!-- 选中圆圈 -->
<div class="member-dialog__payment-radio">
<div v-if="selectedPayment === 'wechat'" class="member-dialog__payment-radio-inner"></div>
</div>
</div>
<!-- 支付宝支付 -->
<div
class="member-dialog__payment-item"
:class="{ 'member-dialog__payment-item--active': selectedPayment === 'alipay' }"
@click="selectedPayment = 'alipay'"
>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2639_2002)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.4127 4.03125C17.5281 4.03125 17.6226 4.12374 17.6226 4.23954V7.82858H25.2414C25.3583 7.82858 25.4488 7.92605 25.4492 8.0431C25.4496 8.79249 25.2601 9.75641 24.8287 9.75641H17.623V12.2974H22.8164C23.0565 12.2974 23.2477 12.5015 23.2303 12.7419L23.2267 12.7891C23.2051 15.6153 22.2698 18.4489 20.7417 20.9244L21.0142 21.0439C23.4297 22.0928 26.0812 22.9505 29.3624 23.0535C29.7298 23.0652 30.0163 23.3761 29.9993 23.7449L29.9929 23.8687C29.8888 25.7353 29.3682 28.0312 27.4979 28.0312C27.2227 28.0312 26.9576 28.014 26.7016 27.9808C24.2628 27.6909 21.8177 26.1933 19.3166 24.526L18.775 24.1633L18.3641 23.8868C17.6939 24.5493 16.9634 25.1524 16.1769 25.6805C15.9834 25.8062 15.779 25.9218 15.5652 26.0275C13.5181 27.2551 11.1213 27.9891 8.45844 27.9895C4.76459 27.9895 2.05466 25.5465 2.00081 22.4783L2 22.3858L2.00081 22.3325C2.05288 19.2583 4.65006 16.8441 8.34497 16.7956L8.45841 16.7949C11.6748 16.7949 14.2916 17.8455 16.9109 19.0864L16.9248 19.0984L16.978 18.9897C17.6426 17.6065 18.1167 16.0147 18.3135 14.2254L8.16359 14.2252C8.10869 14.2252 8.05603 14.2033 8.01716 14.1645C7.97829 14.1256 7.95638 14.0728 7.95622 14.0178C7.95497 13.333 8.14369 12.2974 8.57666 12.2974H13.6419V9.75641H5.99781C5.88084 9.75641 5.79044 9.65934 5.79044 9.54188C5.79 8.83332 5.97956 7.82858 6.41087 7.82858H13.6419V5.79663L13.6428 5.73444C13.6712 4.76532 14.3841 4.03125 17.4127 4.03125ZM8.028 19.3837C5.69156 19.3837 3.76147 20.6349 3.71934 22.3791L3.71875 22.4185L3.72122 22.5201C3.72714 22.6636 3.74369 22.8064 3.77072 22.9475C4.40375 25.9708 10.6506 27.0115 15.1562 21.801L14.9053 21.6531C12.6859 20.3584 10.4044 19.3837 8.028 19.3837Z" fill="#1677FF"/>
</g>
<defs>
<clipPath id="clip0_2639_2002">
<rect width="32" height="32" fill="white"/>
</clipPath>
</defs>
</svg>
<span class="member-dialog__payment-text">支付宝支付</span>
<!-- 选中圆圈 -->
<div class="member-dialog__payment-radio">
<div v-if="selectedPayment === 'alipay'" class="member-dialog__payment-radio-inner"></div>
</div>
</div>
</div>
</div>
</div>
<!-- 底部栏步骤一显示应付金额+购买按钮步骤二显示二维码+已支付 -->
<div class="member-dialog__bottom-bar" :class="{ 'member-dialog__bottom-bar--qrcode': showQrCode }">
<!-- 步骤一应付金额 + 购买按钮 -->
<template v-if="!showQrCode">
<div class="member-dialog__footer-price">
<span class="member-dialog__footer-price-label">应付金额</span>
<span class="member-dialog__footer-price-symbol">¥</span>
<span class="member-dialog__footer-price-num">{{ currentPlan.priceInt }}</span>
</div>
<button
class="member-dialog__buy-btn"
:disabled="!selectedPayment"
@click="handleBuy"
>购买会员</button>
</template>
<!-- 步骤二扫码支付区域 -->
<template v-else>
<!-- 二维码 -->
<div class="member-dialog__qrcode-box">
<!-- 支付宝iframe 渲染 -->
<iframe
v-if="selectedPayment === 'alipay' && paymentFormHtml"
:srcdoc="paymentFormHtml"
frameborder="0"
class="member-dialog__qrcode-iframe qrcode-zhifubao"
scrolling="auto"
></iframe>
<!-- 微信qrcode.js 渲染 -->
<iframe
v-if="selectedPayment === 'wechat' && wechatCodeUrl"
:srcdoc="wechatQrHtml"
frameborder="0"
class="member-dialog__qrcode-iframe qrcode-wechat"
scrolling="no"
></iframe>
</div>
<!-- 右侧信息 -->
<div class="member-dialog__qrcode-info">
<div class="member-dialog__qrcode-price-row">
<span class="member-dialog__qrcode-price-num">¥{{ currentPlan.priceInt }}</span>
<span class="member-dialog__qrcode-tip">扫码完成支付</span>
</div>
<p class="member-dialog__qrcode-agreement">
开通即代表同意 <a href="javascript:;" @click.prevent="openMemberAgreement">会员服务协议</a>
</p>
<!-- 已支付成功按钮 -->
<button class="member-dialog__paid-btn" @click="handleConfirmPaid">我已支付成功</button>
</div>
</template>
</div> </div>
</div> </div>
<!-- 二维码区域 -->
<div class="member-dialog__qrcode-content">
<!-- 支付宝iframe 渲染支付表单 -->
<div v-if="selectedPayment === 'alipay' && paymentFormHtml" class="member-dialog__qrcode-image">
<iframe
:srcdoc="paymentFormHtml"
frameborder="0"
class="member-dialog__payment-iframe"
scrolling="auto"
></iframe>
</div>
<!-- 微信使用 qrcode.js 渲染二维码 -->
<div v-if="selectedPayment === 'wechat' && wechatCodeUrl" class="member-dialog__qrcode-image">
<iframe
:srcdoc="wechatQrHtml"
frameborder="0"
class="member-dialog__wechat-qr-iframe"
scrolling="no"
></iframe>
</div>
<!-- 金额和提示 -->
<div class="member-dialog__qrcode-price-row">
<span class="member-dialog__qrcode-price">¥{{ currentPlan.priceInt }}</span>
<span class="member-dialog__qrcode-tip">扫码完成支付</span>
</div>
<!-- 协议提示 -->
<p class="member-dialog__qrcode-agreement">
开通即代表同意 <a href="javascript:;" @click.prevent="openMemberAgreement">会员服务协议</a>
</p>
</div>
<!-- 已支付成功按钮 -->
<button class="member-dialog__paid-btn" @click="handleConfirmPaid">已支付成功</button>
</div> </div>
</div> </div>
@@ -203,19 +250,14 @@ const store = useStore()
// ==================== ==================== // ==================== ====================
/** 套餐项类型(包含后端完整数据 + 前端展示字段) */ /** 套餐项类型 */
interface PlanItem { interface PlanItem {
key: string key: string
name: string name: string
/** 整数价格(元),用于显示 */
priceInt: string priceInt: string
/** 划线价(元) */
originalPrice: string originalPrice: string
/** 标签描述(接口tag字段,如"轻量体验"、"低至¥0.56/天" */
tag: string tag: string
/** 是否推荐 */
recommend?: boolean recommend?: boolean
/** 后端原始数据,下单时使用 */
raw: MemberProduct raw: MemberProduct
} }
@@ -224,22 +266,22 @@ interface PlanItem {
/** 当前选中的套餐 key */ /** 当前选中的套餐 key */
const selectedPlan = ref('') const selectedPlan = ref('')
/** 当前选中的支付方式wechat / alipay),默认不选 */ /** 当前选中的支付方式 */
const selectedPayment = ref('') const selectedPayment = ref('')
/** 是否显示扫码支付弹窗 */ /** 是否显示扫码支付区域 */
const showQrCode = ref(false) const showQrCode = ref(false)
/** 支付宝表单 HTML(用于 iframe 渲染) */ /** 支付宝表单 HTML */
const paymentFormHtml = ref('') const paymentFormHtml = ref('')
/** 微信支付 code_url(用于生成二维码) */ /** 微信支付 code_url */
const wechatCodeUrl = ref('') const wechatCodeUrl = ref('')
/** 微信二维码 iframe srcdoc HTML */ /** 微信二维码 iframe srcdoc */
const wechatQrHtml = computed(() => { const wechatQrHtml = computed(() => {
if (!wechatCodeUrl.value) return '' if (!wechatCodeUrl.value) return ''
return `<!DOCTYPE html><html><head><meta charset="UTF-8"><script src="https://cdn.jsdelivr.net/npm/qrcodejs@1.0.0/qrcode.min.js"><\/script><style>body{display:flex;align-items:center;justify-content:center;margin:0;height:100%;}</style></head><body><div id="qrcode"></div><script>new QRCode(document.getElementById("qrcode"),{text:"${wechatCodeUrl.value}",width:210,height:210,colorDark:"#000000",colorLight:"#ffffff",correctLevel:QRCode.CorrectLevel.H});<\/script></body></html>` return `<!DOCTYPE html><html><head><meta charset="UTF-8"><script src="https://cdn.jsdelivr.net/npm/qrcodejs@1.0.0/qrcode.min.js"><\/script><style>body{display:flex;align-items:center;justify-content:center;margin:0;height:100%;}</style></head><body><div id="qrcode"></div><script>new QRCode(document.getElementById("qrcode"),{text:"${wechatCodeUrl.value}",width:160,height:160,colorDark:"#000000",colorLight:"#ffffff",correctLevel:QRCode.CorrectLevel.H});<\/script></body></html>`
}) })
/** 当前订单ID */ /** 当前订单ID */
@@ -248,12 +290,12 @@ const orderId = ref('')
/** 是否正在创建订单 */ /** 是否正在创建订单 */
const creatingOrder = ref(false) const creatingOrder = ref(false)
/** 协议预览弹窗显示状态 */ /** 协议预览弹窗 */
const showAgreementDialog = ref(false) const showAgreementDialog = ref(false)
// ==================== ==================== // ==================== ====================
/** 监听弹窗开关 — 打开时锁定背景滚动,关闭时恢复并重置状态 */ /** 监听弹窗开关 */
watch(() => props.modelValue, (val) => { watch(() => props.modelValue, (val) => {
document.body.style.overflow = val ? 'hidden' : '' document.body.style.overflow = val ? 'hidden' : ''
if (!val) { if (!val) {
@@ -274,18 +316,14 @@ const currentPlan = computed(() => {
// ==================== ==================== // ==================== ====================
/** 套餐列表(从接口获取) */ /** 套餐列表 */
const plans = ref<PlanItem[]>([]) const plans = ref<PlanItem[]>([])
/** 后端商品数据转换为前端套餐项 */ /** 后端商品数据转换 */
function mapProductToPlan(product: MemberProduct): PlanItem { function mapProductToPlan(product: MemberProduct): PlanItem {
// 100
const priceYuan = product.price / 100 const priceYuan = product.price / 100
const originalPriceYuan = product.originalPrice ? product.originalPrice / 100 : 0 const originalPriceYuan = product.originalPrice ? product.originalPrice / 100 : 0
// 使 productName
const name = product.productName const name = product.productName
//
const priceDisplay = Number.isInteger(priceYuan) ? String(priceYuan) : priceYuan.toFixed(2) const priceDisplay = Number.isInteger(priceYuan) ? String(priceYuan) : priceYuan.toFixed(2)
const originalDisplay = originalPriceYuan > priceYuan const originalDisplay = originalPriceYuan > priceYuan
? `¥${Number.isInteger(originalPriceYuan) ? originalPriceYuan : originalPriceYuan.toFixed(2)}` ? `¥${Number.isInteger(originalPriceYuan) ? originalPriceYuan : originalPriceYuan.toFixed(2)}`
@@ -309,7 +347,6 @@ async function loadMemberProducts() {
if (res.data && res.data.length) { if (res.data && res.data.length) {
const sorted = [...res.data].sort((a, b) => a.sortOrder - b.sortOrder) const sorted = [...res.data].sort((a, b) => a.sortOrder - b.sortOrder)
plans.value = sorted.map(mapProductToPlan) plans.value = sorted.map(mapProductToPlan)
//
const featured = plans.value.find(p => p.recommend) const featured = plans.value.find(p => p.recommend)
selectedPlan.value = featured ? featured.key : plans.value[0].key selectedPlan.value = featured ? featured.key : plans.value[0].key
} }
@@ -318,7 +355,6 @@ async function loadMemberProducts() {
} }
} }
/** 组件挂载时加载商品列表 */
onMounted(() => { onMounted(() => {
loadMemberProducts() loadMemberProducts()
}) })
@@ -352,8 +388,6 @@ async function handleBuy() {
wechatCodeUrl.value = '' wechatCodeUrl.value = ''
} }
showQrCode.value = true showQrCode.value = true
//
// confirmPaymentPolling()
} }
} catch (e) { } catch (e) {
console.error('创建订单失败', e) console.error('创建订单失败', e)
@@ -362,67 +396,18 @@ async function handleBuy() {
} }
} }
// /** */ /** 点击"我已支付成功"按钮 */
// let pollTimer: ReturnType<typeof setInterval> | null = null
// /**
// *
// *
// */
// async function confirmPaymentPolling() {
// const startTime = Date.now()
// const timeout = 5 * 60 * 1000 // 5
// const interval = 500
//
// if (pollTimer) {
// clearInterval(pollTimer)
// pollTimer = null
// }
//
// pollTimer = setInterval(async () => {
// try {
// const res = await fetchOrderDetail(orderId.value)
// const status = res.data?.status
//
// if (status === 1) {
// clearInterval(pollTimer!)
// pollTimer = null
// showQrCode.value = false
// ElMessage.success('')
// emit('update:modelValue', false)
// store.dispatch('loadMemberStatus')
// } else if (status === 2 || status === 3) {
// clearInterval(pollTimer!)
// pollTimer = null
// showQrCode.value = false
// ElMessage.error('')
// } else if (Date.now() - startTime >= timeout) {
// clearInterval(pollTimer!)
// pollTimer = null
// showQrCode.value = false
// ElMessage.error('')
// }
// } catch (e) {
// console.error('', e)
// }
// }, interval)
// }
/** 点击"已支付成功"按钮 — 手动查询一次订单状态 */
async function handleConfirmPaid() { async function handleConfirmPaid() {
if (!orderId.value) return if (!orderId.value) return
try { try {
const res = await fetchOrderDetail(orderId.value) const res = await fetchOrderDetail(orderId.value)
const status = res.data?.status const status = res.data?.status
if (status === 1) { if (status === 1) {
//
showQrCode.value = false showQrCode.value = false
ElMessage.success('开通成功') ElMessage.success('开通成功')
emit('update:modelValue', false) emit('update:modelValue', false)
// vuex
store.dispatch('loadMemberStatus') store.dispatch('loadMemberStatus')
} else { } else {
//
ElMessage.warning('未查询到支付订单,请再次确认') ElMessage.warning('未查询到支付订单,请再次确认')
} }
} catch (e) { } catch (e) {
@@ -431,11 +416,6 @@ async function handleConfirmPaid() {
} }
} }
/** 关闭扫码支付弹窗 */
function handleCloseQrCode() {
showQrCode.value = false
}
/** 打开会员服务协议 */ /** 打开会员服务协议 */
function openMemberAgreement() { function openMemberAgreement() {
showAgreementDialog.value = true showAgreementDialog.value = true
+2 -2
View File
@@ -245,7 +245,7 @@
<div class="h1 border-EDF9FA-bottom-2 mrl14"></div> <div class="h1 border-EDF9FA-bottom-2 mrl14"></div>
<!-- 技能 --> <!-- 技能 -->
<div ref="skillsRef" class="profile-page-content__card" :class="{ 'profile-page-content__card-hover': editingModule !== 'skills' }"> <div ref="skillsRef" class="profile-page-content__card mtb16" :class="{ 'profile-page-content__card-hover': editingModule !== 'skills' }">
<template v-if="editingModule !== 'skills'"> <template v-if="editingModule !== 'skills'">
<div class="profile-page-content__card-header"> <div class="profile-page-content__card-header">
<h3 class="profile-page-content__card-title">技能</h3> <h3 class="profile-page-content__card-title">技能</h3>
@@ -270,7 +270,7 @@
<div class="h1 border-EDF9FA-bottom-2 mrl14"></div> <div class="h1 border-EDF9FA-bottom-2 mrl14"></div>
<!-- 证书 --> <!-- 证书 -->
<div ref="certificateRef" class="profile-page-content__card" :class="{ 'profile-page-content__card-hover': editingModule !== 'certificate' }"> <div ref="certificateRef" class="profile-page-content__card mtb16" :class="{ 'profile-page-content__card-hover': editingModule !== 'certificate' }">
<template v-if="editingModule !== 'certificate'"> <template v-if="editingModule !== 'certificate'">
<div class="profile-page-content__card-header"> <div class="profile-page-content__card-header">
<h3 class="profile-page-content__card-title">证书</h3> <h3 class="profile-page-content__card-title">证书</h3>
+13 -2
View File
@@ -7,8 +7,8 @@
<div class="profile-edit-inline__fields-row"> <div class="profile-edit-inline__fields-row">
<div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">学校</label><input class="profile-edit-inline__input" placeholder="请输入学校名称" v-model="form.school" /></div> <div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">学校</label><input class="profile-edit-inline__input" placeholder="请输入学校名称" v-model="form.school" /></div>
<div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">专业</label><input class="profile-edit-inline__input" placeholder="请输入专业名称" v-model="form.major" /></div> <div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">专业</label><input class="profile-edit-inline__input" placeholder="请输入专业名称" v-model="form.major" /></div>
<div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">学历</label><select class="profile-edit-inline__input" v-model="form.degree"><option value="大专">大专</option><option value="本科">本科</option><option value="硕士">硕士</option><option value="博士">博士</option></select></div> <div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">学历</label><select class="profile-edit-inline__input" v-model="form.degree"><option :value="1">大专</option><option :value="2">本科</option><option :value="3">硕士</option><option :value="4">博士</option></select></div>
<div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">学历类型</label><select class="profile-edit-inline__input" v-model="form.studyType"><option value="全日制">全日制</option><option value="非全日制">非全日制</option></select></div> <div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">学历类型</label><select class="profile-edit-inline__input" v-model="form.studyType"><option :value="0">全日制</option><option :value="1">非全日制</option></select></div>
<div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">就读时间</label> <div class="profile-edit-inline__field-item"><label class="profile-edit-inline__label">就读时间</label>
<div class="profile-edit-inline__date-range"> <div class="profile-edit-inline__date-range">
<el-date-picker v-model="form.startDate" type="month" placeholder="开始" format="YYYY-MM" value-format="YYYY-MM" class="profile-edit-inline__date-picker" :teleported="true" popper-class="profile-drawer-date-popper" /> <el-date-picker v-model="form.startDate" type="month" placeholder="开始" format="YYYY-MM" value-format="YYYY-MM" class="profile-edit-inline__date-picker" :teleported="true" popper-class="profile-drawer-date-popper" />
@@ -180,6 +180,17 @@ function initForm() {
aiPolishResult.value = '' aiPolishResult.value = ''
if (props.initialData) { if (props.initialData) {
form.value = { ...props.initialData } form.value = { ...props.initialData }
// degree studyType
if (props.moduleType === 'education') {
const degreeMap: Record<string, number> = { '大专': 1, '本科': 2, '硕士': 3, '博士': 4 }
const studyTypeMap: Record<string, number> = { '全日制': 0, '非全日制': 1 }
if (typeof form.value.degree === 'string') {
form.value.degree = degreeMap[form.value.degree] ?? (Number(form.value.degree) || null)
}
if (typeof form.value.studyType === 'string') {
form.value.studyType = studyTypeMap[form.value.studyType] ?? (Number(form.value.studyType) || null)
}
}
// description // description
if (props.initialData.description?.length) { if (props.initialData.description?.length) {
descriptionText.value = props.initialData.description.map((d: DescriptionParagraph) => d.text).join('\n') descriptionText.value = props.initialData.description.map((d: DescriptionParagraph) => d.text).join('\n')
+1 -1
View File
@@ -105,7 +105,7 @@ watch(() => props.modelValue, async (val) => {
const inviteCode = computed(() => store.state.userInfo?.inviteCode || 'NOVA2026') const inviteCode = computed(() => store.state.userInfo?.inviteCode || 'NOVA2026')
/** 邀请链接地址 */ /** 邀请链接地址 */
const inviteUrl = computed(() => `https://www.offerpai.com.cn/invite?code=${inviteCode.value}`) const inviteUrl = computed(() => `https://www.offerpai.com.cn/?invite_code=${inviteCode.value}`)
/** 复制链接到剪贴板 */ /** 复制链接到剪贴板 */
async function handleCopy() { async function handleCopy() {

Some files were not shown because too many files have changed in this diff Show More