Compare commits
24
Commits
8cd21e7b98
..
test
| Author | SHA1 | Date | |
|---|---|---|---|
 xuxin
|
351190a6d8 | ||
|
xuxin
|
d556170969 | ||
|
xuxin
|
1e103627f8 | ||
|
xuxin
|
8b9ebd6ddc | ||
|
xuxin
|
5abd6d27d6 | ||
|
xuxin
|
bb7a8c55b2 | ||
|
xuxin
|
a0f01dd697 | ||
|
xuxin
|
58a027296a | ||
|
xuxin
|
010a80be81 | ||
|
xuxin
|
6c03793daf | ||
|
xuxin
|
33ecccdcb0 | ||
|
xuxin
|
d429bae98a | ||
|
xuxin
|
0b9f2e7333 | ||
|
xuxin
|
db46766d48 | ||
|
xuxin
|
27d2592d06 | ||
|
xuxin
|
c81c9b79dd | ||
|
xuxin
|
5f4aab8d04 | ||
|
xuxin
|
15971bffd9 | ||
|
xuxin
|
bf84da7783 | ||
|
xuxin
|
0911760e27 | ||
|
xuxin
|
66026f211c | ||
|
xuxin
|
7abe158dbb | ||
|
xuxin
|
aed2535ab2 | ||
|
xuxin
|
5f723e5573 |
Vendored
+3
-3
@@ -13,6 +13,7 @@ declare module 'vue' {
|
||||
export interface GlobalComponents {
|
||||
AgentApplyProgress: typeof import('./src/components/AgentApplyProgress.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']
|
||||
AgentJobPreviewPanel: typeof import('./src/components/AgentJobPreviewPanel.vue')['default']
|
||||
AgentMatchJobAdd: typeof import('./src/components/AgentMatchJobAdd.vue')['default']
|
||||
@@ -30,17 +31,15 @@ declare module 'vue' {
|
||||
ElDialog: typeof import('element-plus/es')['ElDialog']
|
||||
ElIcon: typeof import('element-plus/es')['ElIcon']
|
||||
ElInput: typeof import('element-plus/es')['ElInput']
|
||||
ElOption: typeof import('element-plus/es')['ElOption']
|
||||
ElRadio: typeof import('element-plus/es')['ElRadio']
|
||||
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
|
||||
ElSelect: typeof import('element-plus/es')['ElSelect']
|
||||
ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
|
||||
ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem']
|
||||
ElSwitch: typeof import('element-plus/es')['ElSwitch']
|
||||
ElTooltip: typeof import('element-plus/es')['ElTooltip']
|
||||
FullscreenLoading: typeof import('./src/components/FullscreenLoading.vue')['default']
|
||||
HelloWorld: typeof import('./src/components/HelloWorld.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']
|
||||
JobDislikeDialog: typeof import('./src/components/JobDislikeDialog.vue')['default']
|
||||
JobFeedbackDialog: typeof import('./src/components/JobFeedbackDialog.vue')['default']
|
||||
@@ -49,6 +48,7 @@ declare module 'vue' {
|
||||
JobResumeCustomDialog: typeof import('./src/components/JobResumeCustomDialog.vue')['default']
|
||||
JobResumeCustomEditPanel: typeof import('./src/components/JobResumeCustomEditPanel.vue')['default']
|
||||
JobResumeTemplate: typeof import('./src/components/JobResumeTemplate.vue')['default']
|
||||
JobStatsOverview: typeof import('./src/components/JobStatsOverview.vue')['default']
|
||||
LoginDialog: typeof import('./src/components/LoginDialog.vue')['default']
|
||||
MemberAccessDialog: typeof import('./src/components/MemberAccessDialog.vue')['default']
|
||||
MemberDialog: typeof import('./src/components/MemberDialog.vue')['default']
|
||||
|
||||
+10
@@ -7,6 +7,16 @@
|
||||
<title>Offer派 - 大学生AI求职平台 | 智能岗位匹配·一键自动网申·AI简历优化</title>
|
||||
<meta name="description" content="Offer派是专为大学生打造的AI求职平台，提供智能岗位匹配、一键自动网申、岗位定制简历、内推人脉直通等功能，让校招求职效率提升80%。" />
|
||||
<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>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
@@ -20,6 +20,7 @@
|
||||
"vuex": "^4.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/chrome": "^0.2.2",
|
||||
"@types/markdown-it": "^14.1.2",
|
||||
"@types/node": "^24.10.1",
|
||||
"@vitejs/plugin-vue": "^6.0.2",
|
||||
|
||||
Generated
+28
@@ -36,6 +36,9 @@ importers:
|
||||
specifier: ^4.1.0
|
||||
version: 4.1.0(vue@3.5.29(typescript@5.9.3))
|
||||
devDependencies:
|
||||
'@types/chrome':
|
||||
specifier: ^0.2.2
|
||||
version: 0.2.2
|
||||
'@types/markdown-it':
|
||||
specifier: ^14.1.2
|
||||
version: 14.1.2
|
||||
@@ -490,9 +493,21 @@ packages:
|
||||
'@sxzz/popperjs-es@2.11.8':
|
||||
resolution: {integrity: sha512-wOwESXvvED3S8xBmcPWHs2dUuzrE4XiZeFu7e1hROIJkm02a49N120pmOXxY33sBb6hArItm5W5tcg1cBtV+HQ==}
|
||||
|
||||
'@types/chrome@0.2.2':
|
||||
resolution: {integrity: sha512-8rSMZ4cvo2xmaSyQg0sN5yRL7oiDkntLoiHxUhfwQnv1mvnkrdoZ25SlNrKWmYKaeP50WvrfWj1pmc02+U9KKw==}
|
||||
|
||||
'@types/estree@1.0.8':
|
||||
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':
|
||||
resolution: {integrity: sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==}
|
||||
|
||||
@@ -1365,8 +1380,21 @@ snapshots:
|
||||
|
||||
'@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/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/lodash-es@4.17.12':
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
google-site-verification: google18c40aea647ea1cd.html
|
||||
@@ -1,12 +1,15 @@
|
||||
<template>
|
||||
<el-config-provider :locale="zhCn">
|
||||
<RouterView />
|
||||
<!-- 全局登录弹窗 -->
|
||||
<LoginDialog />
|
||||
</el-config-provider>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { RouterView } from 'vue-router'
|
||||
import zhCn from 'element-plus/es/locale/lang/zh-cn'
|
||||
import LoginDialog from '@/components/LoginDialog.vue'
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
+1
-3
@@ -301,9 +301,7 @@ export interface OptimizeResumeParams {
|
||||
*/
|
||||
export function optimizeAgentResume(params: OptimizeResumeParams) {
|
||||
return aiService.post('/job-agent/optimize-resume', params, {
|
||||
headers: {
|
||||
Token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VySWQiOjIwMzUyNTM4OTg5MTk4NzA0NjUsInV1SWQiOiI2MmQ5MDE2NTcyNzY0ZmNjODNjZTIyYjRjODA5ZmU5MiJ9.eE-Q5rio5J5kxkS-XPYdmk-1Tgvg6kj6NGoKWMFNU14',
|
||||
},
|
||||
|
||||
}).then(res => res.data)
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,178 @@
|
||||
import request from '@/utils/request'
|
||||
import type { ApiResult } from '@/api/auth'
|
||||
|
||||
// ==================== 校招公告列表接口 ====================
|
||||
|
||||
/** Instant 时间结构（Java Instant 序列化格式） */
|
||||
export interface InstantTime {
|
||||
/** 从 1970-01-01T00:00:00Z 起的秒数 */
|
||||
seconds: number
|
||||
/** 纳秒偏移（0 ~ 999999999） */
|
||||
nanos?: number
|
||||
}
|
||||
|
||||
/** 校招公告列表请求参数 */
|
||||
export interface AnnouncementListParams {
|
||||
/** 当前页码，从1开始 */
|
||||
pageNum?: number
|
||||
/** 每页条数 */
|
||||
pageSize?: number
|
||||
/** 关键字 */
|
||||
keyword?: string
|
||||
/** 发布时间起（不含） */
|
||||
publishTimeStart?: InstantTime | null
|
||||
/** 发布时间止（含） */
|
||||
publishTimeEnd?: InstantTime | null
|
||||
/** 投递截止时间起（不含） */
|
||||
applyEndTimeStart?: InstantTime | null
|
||||
/** 投递截止时间止（含） */
|
||||
applyEndTimeEnd?: InstantTime | null
|
||||
/** 公司类型列表 */
|
||||
companyTypes?: string[]
|
||||
/** 学历要求列表 */
|
||||
educationNames?: string[]
|
||||
/** 招聘届数列表 */
|
||||
recruitYears?: number[]
|
||||
/** 批次列表 */
|
||||
batchNames?: string[]
|
||||
/** 岗位大类列表 */
|
||||
categoryNames?: string[]
|
||||
/** 热招城市列表 */
|
||||
cityNames?: string[]
|
||||
/** 行业列表 */
|
||||
industryNames?: string[]
|
||||
/** 标签列表 */
|
||||
tagNames?: string[]
|
||||
}
|
||||
|
||||
/** 校招公告列表项 */
|
||||
export interface AnnouncementItem {
|
||||
/** 公告ID */
|
||||
id: number
|
||||
/** 公司ID */
|
||||
companyId: number
|
||||
/** 公司名称 */
|
||||
companyName: string
|
||||
/** 公司logo */
|
||||
logoUrl: string
|
||||
/** 公告标题 */
|
||||
title: string
|
||||
/** 专业要求 */
|
||||
majorRequire: string
|
||||
/** 发布时间（毫秒时间戳） */
|
||||
publishTime: number | null
|
||||
/** 投递结束时间 */
|
||||
applyEndTime: InstantTime | null
|
||||
/** 投递截止描述 */
|
||||
applyEndDesc: string
|
||||
/** 行业列表 */
|
||||
industryNames: string[]
|
||||
/** 岗位大类列表 */
|
||||
categoryNames: string[]
|
||||
/** 热招城市列表 */
|
||||
cityNames: string[]
|
||||
/** 学历要求列表 */
|
||||
educationNames: string[]
|
||||
/** 招聘届数列表 */
|
||||
recruitYears: number[]
|
||||
/** 批次列表 */
|
||||
batchNames: string[]
|
||||
}
|
||||
|
||||
/** 校招公告分页数据 */
|
||||
export interface AnnouncementPageData {
|
||||
/** 当前页码 */
|
||||
pageNum: number
|
||||
/** 每页条数 */
|
||||
pageSize: number
|
||||
/** 总记录数 */
|
||||
total: number
|
||||
/** 数据列表 */
|
||||
list: AnnouncementItem[]
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取校招公告分页列表
|
||||
* POST /public/recruitAnnouncement/page
|
||||
*/
|
||||
export function fetchAnnouncementList(params: AnnouncementListParams = {}) {
|
||||
return request.post<any, ApiResult<AnnouncementPageData>>('/public/recruitAnnouncement/page', {
|
||||
pageNum: params.pageNum ?? 1,
|
||||
pageSize: params.pageSize ?? 10,
|
||||
...params,
|
||||
})
|
||||
}
|
||||
|
||||
// ==================== 校招公告详情接口 ====================
|
||||
|
||||
/** 校招公告详情数据 */
|
||||
export interface AnnouncementDetail {
|
||||
/** 公告ID */
|
||||
id: number
|
||||
/** 公司ID */
|
||||
companyId: number
|
||||
/** 公司名称 */
|
||||
companyName: string
|
||||
/** 公司logo */
|
||||
logoUrl: string
|
||||
/** 公司类型 */
|
||||
companyType: string
|
||||
/** 公告标题 */
|
||||
title: string
|
||||
/** 公司简介 */
|
||||
companyIntro: string
|
||||
/** 面向对象 */
|
||||
targetAudience: string
|
||||
/** 专业要求 */
|
||||
majorRequire: string
|
||||
/** 招聘岗位 */
|
||||
recruitPosition: string
|
||||
/** 备注 */
|
||||
remark: string
|
||||
/** 是否笔试 */
|
||||
writtenExam: string
|
||||
/** 投递开始时间 */
|
||||
applyStartTime: InstantTime | null
|
||||
/** 投递结束时间 */
|
||||
applyEndTime: InstantTime | null
|
||||
/** 投递截止描述 */
|
||||
applyEndDesc: string
|
||||
/** 专属内推码 */
|
||||
inviteCode: string
|
||||
/** 信息来源说明 */
|
||||
source: string
|
||||
/** 发布时间 */
|
||||
publishTime: InstantTime | null
|
||||
/** 清洗状态 */
|
||||
cleanStatus: number
|
||||
/** 状态 */
|
||||
status: number
|
||||
/** 创建时间 */
|
||||
createTime: InstantTime | null
|
||||
/** 更新时间 */
|
||||
updateTime: InstantTime | null
|
||||
/** 行业列表 */
|
||||
industryNames: string[]
|
||||
/** 岗位大类列表 */
|
||||
categoryNames: string[]
|
||||
/** 热招城市列表 */
|
||||
cityNames: string[]
|
||||
/** 学历要求列表 */
|
||||
educationNames: string[]
|
||||
/** 招聘届数列表 */
|
||||
recruitYears: number[]
|
||||
/** 批次列表 */
|
||||
batchNames: string[]
|
||||
/** 标签列表 */
|
||||
tagNames: string[]
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取校招公告详情
|
||||
* GET /public/recruitAnnouncement/detail
|
||||
*/
|
||||
export function fetchAnnouncementDetail(id: string) {
|
||||
return request.get<any, ApiResult<AnnouncementDetail>>('/public/recruitAnnouncement/detail', {
|
||||
params: { id },
|
||||
})
|
||||
}
|
||||
@@ -54,6 +54,19 @@ export async function smsLogin(mobileNumber: string, code: string, inviteCode?:
|
||||
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
|
||||
|
||||
+100
-3
@@ -3,6 +3,16 @@ import aiService from '@/utils/aiRequest'
|
||||
import type { ApiResult } from '@/api/auth'
|
||||
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
|
||||
/** 岗位标题 */
|
||||
title: string
|
||||
/** 薪资描述 */
|
||||
salary?: string
|
||||
/** 公司全称 */
|
||||
companyName: string
|
||||
/** 公司简称 */
|
||||
companyShortName: string
|
||||
/** 公司类型（如"上市企业"） */
|
||||
companyType: string
|
||||
/** 公司Logo URL */
|
||||
companyLogoUrl?: string
|
||||
/** 公司标签列表（如 ["新能源汽车", "乘用车制造", "10000人以上"]） */
|
||||
companyTags: string[]
|
||||
/** 地区名称 */
|
||||
@@ -41,13 +55,19 @@ export interface JobListItem {
|
||||
sourceUrl: string
|
||||
/** 是否已收藏 */
|
||||
isFavorite: boolean
|
||||
/** 投递状态（null=未投递，0=已投递 1=面试中 2=有Offer 3=未通过 4=已结束） */
|
||||
applicationStatus?: number | null
|
||||
/** 岗位状态：0=有效 1=已下架 2=已过期 */
|
||||
status: number
|
||||
/** 发布日期 */
|
||||
expireAt?: string | null
|
||||
/** 脚本名字 */
|
||||
pyname?: string
|
||||
/** 综合匹配分（0-100） */
|
||||
matchScore: number
|
||||
/** 匹配度详情 */
|
||||
matchDetail: MatchDetail
|
||||
/** 招聘分类：0=社招 1=校招 2=实习 */
|
||||
/** 招聘分类：0=社招 1=校招 2=实习 3=其他 */
|
||||
recruitCategory?: number
|
||||
/** 学历要求 0=不限 1=大专 2=本科 3=硕士 4=博士 */
|
||||
education?: number
|
||||
@@ -87,11 +107,62 @@ export interface JobListParams {
|
||||
statusFilter?: number[]
|
||||
/** 搜索关键词 */
|
||||
keyword?: string
|
||||
/** 招聘分类 0=校招 1=实习 2=社招 3=其他 */
|
||||
/** 招聘分类 0=社招 1=校招 2=实习 3=其他 */
|
||||
recruitCategory?: number
|
||||
/** 排除岗位ID列表（用于推荐时排除已推荐过的） */
|
||||
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')
|
||||
}
|
||||
|
||||
// ==================== 求职意向 ====================
|
||||
@@ -138,7 +209,33 @@ export function saveJobIntention(data: JobIntention) {
|
||||
* @param params 岗位列表查询参数
|
||||
*/
|
||||
export function fetchJobList(params: JobListParams = {}) {
|
||||
return request.post<any, ApiResult<JobPageData>>('/job/list', {
|
||||
return request.post<any, ApiResult<JobPageData>>('/public/job/list', {
|
||||
pageNum: params.pageNum ?? 1,
|
||||
pageSize: params.pageSize ?? 15,
|
||||
...params,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取筛选岗位数量
|
||||
* 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: 458 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 504 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 448 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 524 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: 79 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 |
@@ -450,6 +450,9 @@ body:not(#_) {
|
||||
.flex-warp{
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.flex0{
|
||||
flex: 0;
|
||||
}
|
||||
.flex1{
|
||||
flex: 1;
|
||||
}
|
||||
@@ -531,6 +534,11 @@ body:not(#_) {
|
||||
.color-2{
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.color-2F7DEA{
|
||||
color: #2F7DEA;
|
||||
}
|
||||
|
||||
.color-3{
|
||||
color: #333;
|
||||
}
|
||||
@@ -583,6 +591,10 @@ body:not(#_) {
|
||||
.color-9B9EAB{
|
||||
color:#9B9EAB;
|
||||
}
|
||||
.color-D31414{
|
||||
color: #D31414;
|
||||
}
|
||||
|
||||
.color-accent{
|
||||
color:$accent;
|
||||
}
|
||||
@@ -897,6 +909,9 @@ body:not(#_) {
|
||||
.max-w1200{
|
||||
max-width: 12rem;
|
||||
}
|
||||
.max-w602{
|
||||
max-width: 6.02rem;
|
||||
}
|
||||
.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;}
|
||||
.w100{width: 1rem;}
|
||||
@@ -919,12 +934,14 @@ body:not(#_) {
|
||||
.w244{width: 2.44rem;}
|
||||
.w263{width: 2.63rem;}
|
||||
.w444{width: 4.44rem;}
|
||||
.w706{width: 7.06rem;}
|
||||
.w1200{width:12rem}
|
||||
|
||||
/*height*/
|
||||
.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;}
|
||||
.h100{height: 1rem;}
|
||||
.h452{height: 4.52rem;}
|
||||
|
||||
//行高
|
||||
.lh0{line-height: 0rem;}
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
|
||||
&__job-title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.27rem;
|
||||
}
|
||||
@@ -126,7 +126,7 @@
|
||||
// 步骤名称
|
||||
&__step-name {
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
line-height: 0.19rem;
|
||||
|
||||
&--done {
|
||||
|
||||
@@ -0,0 +1,225 @@
|
||||
// Agent浏览器插件安装步骤指引组件样式
|
||||
@use '../variables' as *;
|
||||
|
||||
/* 组件最外层容器 */
|
||||
.agent-browser-guide {
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
|
||||
/* Tab切换栏 */
|
||||
.agent-browser-guide__tabs {
|
||||
display: flex;
|
||||
border-bottom: 1px solid #F0F0F0;
|
||||
margin-bottom: 0.16rem;
|
||||
padding: 0 0.32rem;
|
||||
}
|
||||
|
||||
/* 单个Tab */
|
||||
.agent-browser-guide__tab {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.06rem;
|
||||
padding: 0.14rem 0.24rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 450;
|
||||
color: $text-middle;
|
||||
cursor: pointer;
|
||||
border-bottom: 2px solid transparent;
|
||||
transition: color 0.2s, border-color 0.2s;
|
||||
flex: 1;
|
||||
justify-content: center;
|
||||
|
||||
&:hover {
|
||||
color: $accent;
|
||||
}
|
||||
|
||||
&--active {
|
||||
color: $accent;
|
||||
font-weight: 600;
|
||||
border-bottom-color: $accent;
|
||||
}
|
||||
|
||||
svg {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* 链接样式 */
|
||||
.agent-browser-guide__link {
|
||||
color: $accent;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
/* URL截断文本 */
|
||||
.agent-browser-guide__url-text {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
max-width: 2.8rem;
|
||||
}
|
||||
|
||||
/* 步骤内容区域 */
|
||||
.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;
|
||||
|
||||
&--wide {
|
||||
width: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.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;
|
||||
white-space: nowrap;
|
||||
|
||||
&: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 {
|
||||
font-size: 0.22rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
margin-bottom: 0.04rem;
|
||||
line-height: 0.29rem;
|
||||
@@ -127,7 +127,7 @@
|
||||
// 岗位名称
|
||||
&__title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.27rem;
|
||||
}
|
||||
@@ -208,7 +208,7 @@
|
||||
background: transparent;
|
||||
border: none;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $accent;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
@@ -232,7 +232,7 @@
|
||||
border: none;
|
||||
border-radius: 0.08rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
transition: all 0.2s ease;
|
||||
@@ -291,7 +291,7 @@
|
||||
border: 1px solid $accent;
|
||||
border-radius: 0.22rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
|
||||
@@ -325,7 +325,7 @@
|
||||
border: none;
|
||||
border-radius: 0.22rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
|
||||
|
||||
@@ -60,7 +60,7 @@
|
||||
/* 标题文字 */
|
||||
&__title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.24rem;
|
||||
}
|
||||
@@ -89,7 +89,7 @@
|
||||
/* 岗位标题 */
|
||||
&__job-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.32rem;
|
||||
margin: 0 0 0.08rem;
|
||||
@@ -221,7 +221,7 @@
|
||||
|
||||
&__company-name {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.24rem;
|
||||
}
|
||||
|
||||
@@ -57,7 +57,7 @@
|
||||
// 区块标题
|
||||
&__section-title {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
line-height: 0.21rem;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
@@ -297,7 +297,7 @@
|
||||
|
||||
&__edit-dialog-title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
line-height: 0.24rem;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
@@ -451,7 +451,7 @@
|
||||
|
||||
&__title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.24rem;
|
||||
}
|
||||
@@ -464,6 +464,7 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.16rem;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
|
||||
/* 步骤卡片 */
|
||||
@@ -471,6 +472,8 @@
|
||||
border: 1px solid #F0F0F0;
|
||||
border-radius: 0.12rem;
|
||||
padding: 0.16rem 0.2rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
&__step-row {
|
||||
@@ -478,6 +481,7 @@
|
||||
align-items: flex-start;
|
||||
gap: 0.12rem;
|
||||
margin-bottom: 0.16rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
&__step-num {
|
||||
@@ -489,7 +493,7 @@
|
||||
background: #EDF9FA;
|
||||
border-radius: 0.08rem;
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $accent;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
@@ -500,7 +504,7 @@
|
||||
|
||||
&__step-title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.24rem;
|
||||
margin: 0 0 0.04rem;
|
||||
@@ -523,6 +527,7 @@
|
||||
background: $bg-main;
|
||||
border-radius: 0.12rem;
|
||||
height: 0.44rem;
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
|
||||
&__download-name {
|
||||
@@ -542,7 +547,7 @@
|
||||
border-radius: 0.08rem;
|
||||
color: $bg-white;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
|
||||
@@ -557,6 +562,7 @@
|
||||
align-items: flex-start;
|
||||
gap: 0.24rem;
|
||||
margin-bottom: 0.16rem;
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
|
||||
&__browser-link {
|
||||
@@ -599,9 +605,10 @@
|
||||
/* 步骤示意图 */
|
||||
&__step-img {
|
||||
width: 100%;
|
||||
max-width: 4rem;
|
||||
max-width: 3.52rem;
|
||||
border-radius: 0.08rem;
|
||||
margin-top: 0.12rem;
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -60,7 +60,7 @@
|
||||
/* 标题文字 */
|
||||
&__title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.24rem;
|
||||
}
|
||||
@@ -136,7 +136,7 @@
|
||||
/* 岗位标题 */
|
||||
&__card-title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.27rem;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -56,15 +56,11 @@
|
||||
|
||||
// ==================== 下拉面板 ====================
|
||||
&__panel {
|
||||
position: absolute;
|
||||
top: calc(100% + 0.06rem);
|
||||
left: 0;
|
||||
width: 3.6rem;
|
||||
background: $bg-white;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: 0.1rem;
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
|
||||
z-index: 100;
|
||||
padding: 0.1rem;
|
||||
|
||||
// 只显示一栏时缩窄面板
|
||||
|
||||
@@ -57,15 +57,11 @@
|
||||
|
||||
// ==================== 下拉面板 ====================
|
||||
&__panel {
|
||||
position: absolute;
|
||||
top: calc(100% + 0.06rem);
|
||||
left: 0;
|
||||
width: 4.8rem;
|
||||
background: $bg-white;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: 0.1rem;
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
|
||||
z-index: 100;
|
||||
padding: 0.1rem;
|
||||
|
||||
// 只显示一栏时缩窄面板
|
||||
|
||||
@@ -42,7 +42,7 @@
|
||||
|
||||
&__title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
line-height: 0.24rem;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
@@ -1398,9 +1398,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 立即去投递按钮
|
||||
// 下载专属简历按钮
|
||||
&__submit-btn {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
height: 0.48rem;
|
||||
background: $btn-dark;
|
||||
color: $bg-white;
|
||||
@@ -1415,6 +1415,20 @@
|
||||
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%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 右侧滑入动画
|
||||
|
||||
@@ -0,0 +1,101 @@
|
||||
@use '../variables' as *;
|
||||
|
||||
.job-stats-overview {
|
||||
/* 固定宽度卡片 */
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
width: 3.25rem;
|
||||
padding: 0.24rem 0.20rem;
|
||||
background: linear-gradient(180deg, #EDF9FA 0%, #FFFFFF 20.63%);
|
||||
border: 1px solid #F0F0F0;
|
||||
box-shadow: 0 0.02rem 0.06rem rgba(15, 23, 42, 0.025);
|
||||
border-radius: 0.12rem;
|
||||
font-size: 0.14rem;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 1.8rem;
|
||||
|
||||
/* 右上角装饰图片 */
|
||||
&__icon {
|
||||
position: absolute;
|
||||
top: 0.10rem;
|
||||
right: 0.10rem;
|
||||
width: 0.86rem;
|
||||
height: 0.72rem;
|
||||
object-fit: contain;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* 内容纵向居中容器 */
|
||||
&__inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
gap: 0.32rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 标题区域 */
|
||||
&__header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 0.04rem;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-weight: 600;
|
||||
font-size: 0.18rem;
|
||||
line-height: 0.24rem;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
&__date {
|
||||
font-weight: 330;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.19rem;
|
||||
color: #64748B;
|
||||
}
|
||||
|
||||
/* 数据指标行 */
|
||||
&__metrics {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
gap: 0.20rem;
|
||||
}
|
||||
|
||||
/* 单个指标 */
|
||||
&__metric-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.04rem;
|
||||
}
|
||||
|
||||
&__metric-num {
|
||||
font-weight: 600;
|
||||
font-size: 0.30rem;
|
||||
line-height: 0.40rem;
|
||||
color: $accent;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&__metric-label {
|
||||
font-weight: 330;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.19rem;
|
||||
color: #6A7282;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 竖线分隔 */
|
||||
&__divider {
|
||||
width: 0;
|
||||
height: 0.52rem;
|
||||
border-left: 1px solid #F0F0F0;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,376 @@
|
||||
@use '../variables' as *;
|
||||
|
||||
/* 登录弹窗遮罩层 */
|
||||
.login-dialog-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: var(--app-height, 100vh);
|
||||
background: rgba(0, 0, 0, 0.45);
|
||||
z-index: 2050;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* 弹窗底座盒子 */
|
||||
.login-dialog-box {
|
||||
font-size: 0.14rem;
|
||||
position: relative;
|
||||
width: 5.6rem;
|
||||
min-height: 4.57rem;
|
||||
background: radial-gradient(58.14% 30.59% at 100% 0%, #D2F2F3 0%, #FFFFFF 100%);
|
||||
border: 1px solid #F0F0F0;
|
||||
border-radius: 0.32rem;
|
||||
padding: 0.48rem 0.6rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 关闭按钮 */
|
||||
.login-dialog-box__close {
|
||||
position: absolute;
|
||||
top: 0.2rem;
|
||||
right: 0.24rem;
|
||||
width: 0.32rem;
|
||||
height: 0.32rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
border-radius: 50%;
|
||||
transition: background 0.2s;
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
svg {
|
||||
width: 0.2rem;
|
||||
height: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Logo 行 */
|
||||
.login-dialog-box__logo-row {
|
||||
width: 100%;
|
||||
margin-bottom: 0.4rem;
|
||||
|
||||
img {
|
||||
width: 1.6rem;
|
||||
height: 0.4rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 表单包裹 */
|
||||
.login-dialog-box__form-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.24rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 标题 */
|
||||
.login-dialog-box__heading {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.05rem;
|
||||
}
|
||||
|
||||
.login-dialog-box__title {
|
||||
font-weight: 700;
|
||||
font-size: 0.24rem;
|
||||
line-height: 0.22rem;
|
||||
color: #18181A;
|
||||
}
|
||||
|
||||
.login-dialog-box__subtitle {
|
||||
font-weight: 400;
|
||||
font-size: 0.14rem;
|
||||
margin-top: 0.08rem;
|
||||
margin-bottom: 0.08rem;
|
||||
color: #616367;
|
||||
|
||||
> span:nth-child(2) {
|
||||
color: $accent;
|
||||
}
|
||||
}
|
||||
|
||||
/* 手机号输入行 */
|
||||
.login-dialog-box__phone-row {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 0.56rem;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #C8C9CD;
|
||||
box-shadow: 0 0.08rem 0.20rem rgba(15, 83, 87, 0.05);
|
||||
border-radius: 0.12rem;
|
||||
}
|
||||
|
||||
.login-dialog-box__phone-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 0.18rem;
|
||||
height: 0.18rem;
|
||||
margin-left: 0.16rem;
|
||||
flex-shrink: 0;
|
||||
|
||||
svg {
|
||||
width: 0.18rem;
|
||||
height: 0.18rem;
|
||||
}
|
||||
}
|
||||
|
||||
.login-dialog-box__country-label {
|
||||
margin-left: 0.06rem;
|
||||
font-weight: 500;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.15rem;
|
||||
color: #202124;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.login-dialog-box__country-chevron {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 0.20rem;
|
||||
height: 0.20rem;
|
||||
flex-shrink: 0;
|
||||
cursor: pointer;
|
||||
|
||||
svg {
|
||||
width: 0.20rem;
|
||||
height: 0.20rem;
|
||||
}
|
||||
}
|
||||
|
||||
.login-dialog-box__input-divider {
|
||||
width: 1px;
|
||||
height: 0.30rem;
|
||||
background: #E7F2F3;
|
||||
margin: 0 0.16rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.login-dialog-box__phone-input {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
border: none;
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.15rem;
|
||||
color: #202124;
|
||||
outline: none;
|
||||
|
||||
&::placeholder {
|
||||
color: #939599;
|
||||
}
|
||||
}
|
||||
|
||||
/* 发送验证码按钮 */
|
||||
.login-dialog-box__send-btn {
|
||||
width: 100%;
|
||||
height: 0.43rem;
|
||||
background: linear-gradient(90deg, #4FC2C9 0%, #42A8B3 100%);
|
||||
box-shadow: 0 0.16rem 0.30rem rgba(15, 83, 87, 0.15);
|
||||
border-radius: 0.12rem;
|
||||
border: none;
|
||||
font-weight: 600;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.15rem;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
transition: opacity 0.2s;
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
&:not(:disabled):hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
||||
/* OTP 验证码输入 */
|
||||
.login-dialog-box__otp-wrap {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 0.1rem;
|
||||
width: 100%;
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
.login-dialog-box__otp-hidden-input {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 0;
|
||||
z-index: 2;
|
||||
font-size: 0.16rem;
|
||||
caret-color: transparent;
|
||||
}
|
||||
|
||||
.login-dialog-box__otp-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 0.56rem;
|
||||
height: 0.56rem;
|
||||
background: #FAFBFC;
|
||||
border: 1px solid #E2E8F0;
|
||||
border-radius: 0.12rem;
|
||||
transition: border-color 0.2s, background 0.2s;
|
||||
}
|
||||
|
||||
.login-dialog-box__otp-box--active {
|
||||
background: #F3FFFD;
|
||||
border: 1px solid $accent;
|
||||
}
|
||||
|
||||
.login-dialog-box__otp-box--filled {
|
||||
background: #F3FFFD;
|
||||
border: 2px solid $accent;
|
||||
}
|
||||
|
||||
.login-dialog-box__otp-digit {
|
||||
font-weight: 700;
|
||||
font-size: 0.24rem;
|
||||
line-height: 0.29rem;
|
||||
color: #132034;
|
||||
}
|
||||
|
||||
/* 闪烁光标 */
|
||||
.login-dialog-box__otp-cursor {
|
||||
display: inline-block;
|
||||
width: 2px;
|
||||
height: 0.28rem;
|
||||
background: $accent;
|
||||
border-radius: 1px;
|
||||
animation: login-dialog-otp-blink 1s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes login-dialog-otp-blink {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0; }
|
||||
}
|
||||
|
||||
/* 验证码状态提示 */
|
||||
.login-dialog-box__sms-status {
|
||||
width: 100%;
|
||||
font-size: 0.13rem;
|
||||
line-height: 0.16rem;
|
||||
color: #64748B;
|
||||
text-align: left;
|
||||
margin-top: -0.14rem;
|
||||
margin-bottom: -0.06rem;
|
||||
}
|
||||
|
||||
.login-dialog-box__sms-status--error {
|
||||
color: #EF4444;
|
||||
}
|
||||
|
||||
/* 状态按钮（步骤二） */
|
||||
.login-dialog-box__status-btn {
|
||||
width: 100%;
|
||||
height: 0.43rem;
|
||||
background: linear-gradient(90deg, $btn-dark 0%, $btn-dark-hover 100%);
|
||||
border-radius: 0.12rem;
|
||||
border: none;
|
||||
font-weight: 600;
|
||||
font-size: 0.14rem;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.08rem;
|
||||
transition: opacity 0.2s;
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.7;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
&:not(:disabled):hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
||||
/* 登录中转圈动画 */
|
||||
.login-dialog-box__spinner {
|
||||
display: inline-block;
|
||||
width: 0.18rem;
|
||||
height: 0.18rem;
|
||||
border: 2px solid rgba(255, 255, 255, 0.3);
|
||||
border-top-color: #FFFFFF;
|
||||
border-radius: 50%;
|
||||
animation: login-dialog-spin 0.7s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes login-dialog-spin {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* 协议勾选 */
|
||||
.login-dialog-box__agreement {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.06rem;
|
||||
}
|
||||
|
||||
.login-dialog-box__checkbox {
|
||||
box-sizing: border-box;
|
||||
width: 0.18rem;
|
||||
height: 0.18rem;
|
||||
background: #FFFFFF;
|
||||
border: 1.5px solid #CBD5E1;
|
||||
border-radius: 0.04rem;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: all 0.2s;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.login-dialog-box__checkbox--checked {
|
||||
background: #4FC2C9;
|
||||
border-color: #4FC2C9;
|
||||
}
|
||||
|
||||
.login-dialog-box__check-icon {
|
||||
font-size: 0.11rem;
|
||||
color: #FFFFFF;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.login-dialog-box__agreement-text {
|
||||
font-weight: 400;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.15rem;
|
||||
color: #616367;
|
||||
}
|
||||
|
||||
.login-dialog-box__agreement-link {
|
||||
font-weight: 500;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.15rem;
|
||||
color: #42A8B3;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
// 会员弹窗样式（新版）
|
||||
// 会员弹窗样式 — 新版黑金左右布局
|
||||
@use '../variables' as *;
|
||||
|
||||
// 遮罩层
|
||||
@@ -10,82 +10,163 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
// 扫码支付弹窗的遮罩层级更高
|
||||
&--qrcode {
|
||||
z-index: 2400;
|
||||
}
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
|
||||
// 弹窗主体
|
||||
// 弹窗主体 — 左右布局
|
||||
.member-dialog {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 0.24rem 0.32rem;
|
||||
gap: 0.24rem;
|
||||
width: 4.8rem;
|
||||
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;
|
||||
width: 6.49rem;
|
||||
height: 4rem;
|
||||
border-radius: 0.16rem;
|
||||
box-shadow: 0 0.025rem 0.05rem rgba(60, 38, 13, 0.22);
|
||||
border: 0.00625rem solid #D9B873;
|
||||
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;
|
||||
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 {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
&__header-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.04rem;
|
||||
&__title {
|
||||
font-weight: 600;
|
||||
font-size: 0.18rem;
|
||||
line-height: 0.24rem;
|
||||
color: #1F160F;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__header-right {
|
||||
&__header-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
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 {
|
||||
position: relative;
|
||||
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 {
|
||||
display: none;
|
||||
position: absolute;
|
||||
@@ -122,7 +214,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 二维码弹出框底部箭头
|
||||
&__contact-qr-arrow {
|
||||
position: absolute;
|
||||
bottom: -0.07rem;
|
||||
@@ -133,7 +224,6 @@
|
||||
border-left: 0.08rem solid transparent;
|
||||
border-right: 0.08rem solid transparent;
|
||||
border-top: 0.08rem solid $bg-white;
|
||||
filter: drop-shadow(0 0.02rem 0.02rem rgba(0, 0, 0, 0.05));
|
||||
}
|
||||
|
||||
&__close {
|
||||
@@ -143,355 +233,378 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.14rem;
|
||||
color: $text-middle;
|
||||
color: #2F343B;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: $text-dark;
|
||||
color: #1F160F;
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 套餐选择区域 ====================
|
||||
&__plans {
|
||||
display: flex;
|
||||
gap: 0.13rem;
|
||||
width: 100%;
|
||||
gap: 0.2rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
&__plan-card {
|
||||
box-sizing: border-box;
|
||||
width: 1.2rem;
|
||||
height: 1.4rem;
|
||||
background: #FFFDF8;
|
||||
border: 1px solid #E7C991;
|
||||
border-radius: 0.08rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.12rem 0.16rem;
|
||||
gap: 0.04rem;
|
||||
width: 1.3rem;
|
||||
height: 1.01rem;
|
||||
background: $bg-white;
|
||||
border: 1px solid #F0F0F0;
|
||||
border-radius: 0.08rem;
|
||||
gap: 0.08rem;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.2s;
|
||||
position: relative;
|
||||
transition: border-color 0.2s, box-shadow 0.2s;
|
||||
|
||||
&:hover {
|
||||
border-color: $accent;
|
||||
border-color: #B77D24;
|
||||
}
|
||||
|
||||
// 选中状态 — 粗边框
|
||||
// 选中态
|
||||
&--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;
|
||||
top: -0.1rem;
|
||||
left: 10%;
|
||||
top: -0.12rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
white-space: nowrap;
|
||||
background: $accent;
|
||||
color: $bg-white;
|
||||
font-size: 0.1rem;
|
||||
padding: 0.02rem 0.08rem;
|
||||
border-radius: 0.08rem;
|
||||
font-weight: 620;
|
||||
background: #C28A2F;
|
||||
border: 0.00625rem solid #F0D091;
|
||||
border-radius: 0.075rem;
|
||||
padding: 0.04rem 0.12rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.16rem;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
&__plan-name {
|
||||
font-weight: 450;
|
||||
font-weight: 600;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.19rem;
|
||||
text-align: center;
|
||||
color: $text-dark;
|
||||
color: #1F160F;
|
||||
}
|
||||
|
||||
&__plan-price {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
align-items: baseline;
|
||||
justify-content: center;
|
||||
gap: 0.04rem;
|
||||
padding: 0.04rem 0;
|
||||
}
|
||||
|
||||
&__plan-price-symbol {
|
||||
font-weight: 450;
|
||||
font-weight: 600;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.19rem;
|
||||
color: $text-dark;
|
||||
color: #1F160F;
|
||||
}
|
||||
|
||||
&__plan-price-num {
|
||||
font-weight: 630;
|
||||
font-size: 0.24rem;
|
||||
line-height: 0.18rem;
|
||||
color: $text-dark;
|
||||
font-weight: 600;
|
||||
font-size: 0.28rem;
|
||||
line-height: 0.37rem;
|
||||
color: #1F160F;
|
||||
}
|
||||
|
||||
&__plan-original-price {
|
||||
&__plan-original {
|
||||
font-weight: 330;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.16rem;
|
||||
text-decoration: line-through;
|
||||
color: $text-light;
|
||||
color: #7A7D82;
|
||||
margin-left: 0.04rem;
|
||||
}
|
||||
|
||||
&__plan-daily {
|
||||
&__plan-tag {
|
||||
font-weight: 330;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.16rem;
|
||||
text-align: center;
|
||||
color: $accent;
|
||||
color: #3B2A1E;
|
||||
}
|
||||
|
||||
// ==================== 会员权益区域 ====================
|
||||
&__benefits {
|
||||
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;
|
||||
// ==================== 支付方式选择（步骤一） ====================
|
||||
&__step-pay {
|
||||
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 {
|
||||
width: 0.4rem;
|
||||
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-section {
|
||||
margin-bottom: 0.16rem;
|
||||
}
|
||||
|
||||
&__payment-label {
|
||||
font-weight: 450;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.19rem;
|
||||
color: $text-dark;
|
||||
color: #1F160F;
|
||||
display: block;
|
||||
margin-bottom: 0.08rem;
|
||||
}
|
||||
|
||||
&__payment-methods {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.24rem;
|
||||
}
|
||||
|
||||
&__payment-item {
|
||||
box-sizing: border-box;
|
||||
width: 1.88rem;
|
||||
height: 0.58rem;
|
||||
background: #FFFDF8;
|
||||
border: 1px solid #E7C991;
|
||||
border-radius: 0.08rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.04rem 0.08rem;
|
||||
gap: 0.06rem;
|
||||
border-radius: 0.04rem;
|
||||
padding: 0 0.2rem;
|
||||
gap: 0.12rem;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
position: relative;
|
||||
transition: border-color 0.2s;
|
||||
|
||||
svg {
|
||||
width: 0.16rem;
|
||||
height: 0.16rem;
|
||||
width: 0.32rem;
|
||||
height: 0.32rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
// 微信选中态
|
||||
&--wechat-active {
|
||||
background: #EBFEF4;
|
||||
}
|
||||
|
||||
// 支付宝选中态
|
||||
&--alipay-active {
|
||||
background: #EBF3FF;
|
||||
// 选中态
|
||||
&--active {
|
||||
border-color: #B77D24;
|
||||
}
|
||||
}
|
||||
|
||||
&__payment-text {
|
||||
font-weight: 620;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.18rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.13rem;
|
||||
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 {
|
||||
color: #1677FF;
|
||||
.member-dialog__payment-item--active & {
|
||||
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 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0.08rem 0.12rem;
|
||||
height: 0.35rem;
|
||||
background: #AEE6EA;
|
||||
padding: 0.08rem 0.24rem;
|
||||
height: 0.33rem;
|
||||
background: #C88E35;
|
||||
border: 1px solid #F0D091;
|
||||
box-shadow: 0 0.02rem 0.05rem rgba(154, 104, 32, 0.18);
|
||||
border-radius: 0.08rem;
|
||||
border: none;
|
||||
font-weight: 450;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.19rem;
|
||||
color: $bg-white;
|
||||
cursor: default;
|
||||
opacity: 0.4;
|
||||
transition: background 0.2s, opacity 0.2s;
|
||||
font-weight: 600;
|
||||
font-size: 0.13rem;
|
||||
line-height: 0.15rem;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
border: 1px solid #F0D091;
|
||||
transition: opacity 0.2s;
|
||||
|
||||
// 选择了支付方式后变为主题色、不透明、可点击
|
||||
&--active {
|
||||
background: $accent;
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $accent-hover;
|
||||
}
|
||||
&:disabled {
|
||||
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;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
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;
|
||||
gap: 0.12rem;
|
||||
}
|
||||
|
||||
&__qrcode-price-row {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
gap: 0.08rem;
|
||||
align-items: center;
|
||||
gap: 0.04rem;
|
||||
}
|
||||
|
||||
&__qrcode-price {
|
||||
font-weight: 630;
|
||||
&__qrcode-price-symbol {
|
||||
font-weight: 600;
|
||||
font-size: 0.18rem;
|
||||
color: #1F160F;
|
||||
}
|
||||
|
||||
&__qrcode-price-num {
|
||||
font-size: 0.32rem;
|
||||
line-height: 0.25rem;
|
||||
color: $text-dark;
|
||||
font-weight: 600;
|
||||
line-height: 0.37rem;
|
||||
color: #1F160F;
|
||||
}
|
||||
|
||||
&__qrcode-tip {
|
||||
font-weight: 330;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.1rem;
|
||||
color: $text-dark;
|
||||
line-height: 0.19rem;
|
||||
color: #1F160F;
|
||||
margin-left: 0.08rem;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
&__qrcode-agreement {
|
||||
font-weight: 330;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.19rem;
|
||||
color: $text-light;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.16rem;
|
||||
color: #3B2A1E;
|
||||
margin: 0;
|
||||
|
||||
a {
|
||||
color: $text-light;
|
||||
color: #A86718;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: $accent;
|
||||
color: #A86718;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 已支付成功按钮
|
||||
// 我已支付成功按钮
|
||||
&__paid-btn {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0.08rem 0.12rem;
|
||||
height: 0.35rem;
|
||||
background: $accent;
|
||||
padding: 0.08rem 0.24rem;
|
||||
height: 0.33rem;
|
||||
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: none;
|
||||
font-weight: 450;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.19rem;
|
||||
color: $bg-white;
|
||||
font-weight: 600;
|
||||
font-size: 0.13rem;
|
||||
line-height: 0.15rem;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
transition: opacity 0.2s;
|
||||
|
||||
&:hover {
|
||||
background: $accent-hover;
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -251,17 +251,15 @@
|
||||
|
||||
&__tag {
|
||||
font-size: 0.12rem;
|
||||
color: $text-dark;
|
||||
background: $bg-main;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: 0.16rem;
|
||||
padding: 0.05rem 0.16rem;
|
||||
color: $accent;
|
||||
background: #fff;
|
||||
border: 1px solid $accent;
|
||||
border-radius: 0.04rem;
|
||||
padding: 0.05rem 0.08rem;
|
||||
transition: all 0.2s;
|
||||
|
||||
&:hover {
|
||||
border-color: $accent;
|
||||
color: $accent;
|
||||
background: $theme-color;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -351,4 +349,14 @@
|
||||
color: #64748B;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
// 个人概述文本
|
||||
&__summary-text {
|
||||
font-size: 0.14rem;
|
||||
line-height: 1.7;
|
||||
color: #374151;
|
||||
padding: 0 0.14rem 0.12rem;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -55,15 +55,11 @@
|
||||
|
||||
// ==================== 下拉面板 ====================
|
||||
&__panel {
|
||||
position: absolute;
|
||||
top: calc(100% + 0.06rem);
|
||||
left: 0;
|
||||
width: 4.2rem;
|
||||
background: $bg-white;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: 0.1rem;
|
||||
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
|
||||
z-index: 100;
|
||||
padding: 0.1rem;
|
||||
|
||||
// level=2 时只有两栏，面板收窄
|
||||
|
||||
@@ -12,6 +12,14 @@
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
|
||||
// 窄版模式（window.innerWidth < 1440）
|
||||
&--narrow {
|
||||
width: 0.8rem;
|
||||
padding: 0.16rem 0.10rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&__header {
|
||||
display: flex;
|
||||
@@ -21,6 +29,12 @@
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
// 窄版header居中
|
||||
&--narrow &__header {
|
||||
justify-content: center;
|
||||
padding: 0.1rem 0;
|
||||
}
|
||||
|
||||
&__avatar {
|
||||
width: 0.36rem;
|
||||
height: 0.36rem;
|
||||
@@ -43,6 +57,12 @@
|
||||
width: 1.32rem;
|
||||
height: 0.34rem;
|
||||
display: block;
|
||||
|
||||
// 窄版logo
|
||||
&--narrow {
|
||||
width: 0.46rem;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
&__menu {
|
||||
@@ -52,7 +72,13 @@
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
// 窄版菜单宽度撑满
|
||||
&--narrow &__menu {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&__item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
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 {
|
||||
width: 0.2rem;
|
||||
height: 0.2rem;
|
||||
object-fit: contain;
|
||||
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 {
|
||||
|
||||
}
|
||||
|
||||
// 窄版label字号缩小
|
||||
&--narrow &__item-label {
|
||||
font-size: 0.11rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__badge {
|
||||
background: #e85635;
|
||||
color: #fff;
|
||||
@@ -118,6 +171,39 @@
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
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 {
|
||||
@@ -126,6 +212,48 @@
|
||||
gap: 0.04rem;
|
||||
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 {
|
||||
@@ -478,84 +606,120 @@
|
||||
|
||||
// ==================== 邀请会员卡片 ====================
|
||||
.side-nav__referral-card {
|
||||
position: relative;
|
||||
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;
|
||||
padding: 0.16rem;
|
||||
box-sizing: border-box;
|
||||
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 {
|
||||
font-size: 0.16rem;
|
||||
font-size: 0.18rem;
|
||||
font-weight: 630;
|
||||
color: #FFFFFF;
|
||||
line-height: 0.21rem;
|
||||
color: #1A1A1A;
|
||||
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 {
|
||||
font-size: 0.10rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 330;
|
||||
color: #EAFBFC;
|
||||
line-height: 0.13rem;
|
||||
margin-top: 0.04rem;
|
||||
color: #6A7282;
|
||||
line-height: 0.19rem;
|
||||
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 {
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 0.02rem 0.06rem rgba(26, 26, 26, 0.05);
|
||||
border-radius: 0.06rem;
|
||||
padding: 0.10rem 0.08rem;
|
||||
margin-top: 0.10rem;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
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 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 0.08rem;
|
||||
}
|
||||
|
||||
.side-nav__referral-label {
|
||||
font-size: 0.10rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 330;
|
||||
color: #6B7280;
|
||||
line-height: 0.13rem;
|
||||
color: #6A7282;
|
||||
line-height: 0.19rem;
|
||||
}
|
||||
|
||||
.side-nav__referral-value {
|
||||
font-size: 0.10rem;
|
||||
font-weight: 620;
|
||||
color: #52CAD1;
|
||||
line-height: 0.13rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 450;
|
||||
line-height: 0.19rem;
|
||||
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 {
|
||||
width: 100%;
|
||||
height: 0.02rem;
|
||||
background: #D7F1F3;
|
||||
border-radius: 9999px;
|
||||
margin-top: 0.06rem;
|
||||
height: 0.06rem;
|
||||
background: #EDF9FA;
|
||||
border-radius: 0.06rem;
|
||||
margin-top: 0.1rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.side-nav__referral-fill {
|
||||
height: 100%;
|
||||
background: #52CAD1;
|
||||
border-radius: 9999px;
|
||||
}
|
||||
|
||||
.side-nav__referral-divider {
|
||||
width: 100%;
|
||||
border-top: 0.01rem solid #8C8C8C;
|
||||
margin-top: 0.08rem;
|
||||
border-radius: 0.06rem;
|
||||
}
|
||||
|
||||
.side-nav__referral-tip {
|
||||
font-size: 0.10rem;
|
||||
font-size: 0.12rem;
|
||||
font-weight: 330;
|
||||
color: #1A1A1A;
|
||||
line-height: 0.13rem;
|
||||
margin-top: 0.08rem;
|
||||
color: #6A7282;
|
||||
line-height: 0.16rem;
|
||||
margin-top: 0.06rem;
|
||||
|
||||
strong {
|
||||
font-weight: 630;
|
||||
@@ -563,16 +727,22 @@
|
||||
}
|
||||
|
||||
.side-nav__referral-action {
|
||||
font-size: 0.11rem;
|
||||
font-weight: 620;
|
||||
color: #52CAD1;
|
||||
line-height: 0.15rem;
|
||||
text-align: center;
|
||||
margin-top: 0.08rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 0.40rem;
|
||||
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;
|
||||
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -680,12 +850,13 @@
|
||||
bottom: calc(100% + 0.08rem);
|
||||
left: 0;
|
||||
width: 100%;
|
||||
min-width: 1.65rem;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #F0F0F0;
|
||||
box-shadow: 0px 0.02rem 0.08rem rgba(0, 0, 0, 0.04);
|
||||
border-radius: 0.08rem;
|
||||
overflow: hidden;
|
||||
z-index: 100;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.side-nav__account-popup-header {
|
||||
|
||||
@@ -12,12 +12,15 @@
|
||||
@use './pages/login.scss';
|
||||
@use './pages/mentor.scss';
|
||||
@use './pages/mentor-detail.scss';
|
||||
@use './pages/announcement.scss';
|
||||
@use './pages/announcement-detail.scss';
|
||||
|
||||
// 组件样式
|
||||
@use './components/hello-world.scss';
|
||||
@use './components/side-nav.scss';
|
||||
@use './components/ai-chat.scss';
|
||||
@use './components/job-page-header.scss';
|
||||
@use './components/job-stats-overview.scss';
|
||||
@use './components/job-goal-dialog.scss';
|
||||
@use './components/settings-dialog.scss';
|
||||
@use './components/member-dialog.scss';
|
||||
@@ -44,6 +47,8 @@
|
||||
@use './components/member-access-dialog.scss';
|
||||
@use './components/step-progress-overlay.scss';
|
||||
@use './components/mentor-aside-panel.scss';
|
||||
@use './components/agent-browser-install-guide.scss';
|
||||
@use './components/login-dialog.scss';
|
||||
|
||||
// 全局样式（优先级最高）
|
||||
@use './auto.scss';
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
font-size: 0.14rem;
|
||||
// 主内容区域（左侧导航栏右边的部分）
|
||||
&__content {
|
||||
margin-left: 2.2rem;
|
||||
margin-left: var(--nav-width, 2.2rem);
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
height: var(--app-height, 100vh);
|
||||
@@ -279,8 +279,6 @@
|
||||
border-radius: 0.12rem;
|
||||
max-height: calc(var(--app-height, 100vh) - 1.4rem);
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
scrollbar-width: none; // Firefox
|
||||
-ms-overflow-style: none; // IE/Edge
|
||||
|
||||
@@ -679,6 +677,78 @@
|
||||
margin-bottom: 0.16rem;
|
||||
}
|
||||
|
||||
// 第2步投递偏好开关容器
|
||||
&__step2-pref-switches {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.12rem;
|
||||
}
|
||||
|
||||
// 第2步开关项
|
||||
&__step2-switch-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0.2rem 0.24rem;
|
||||
background: #F9FAFB;
|
||||
border-radius: 0.12rem;
|
||||
}
|
||||
|
||||
// 第2步开关文字区
|
||||
&__step2-switch-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.04rem;
|
||||
}
|
||||
|
||||
// 第2步开关标签
|
||||
&__step2-switch-label {
|
||||
font-size: 0.15rem;
|
||||
font-weight: 500;
|
||||
line-height: 0.21rem;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
// 第2步开关描述
|
||||
&__step2-switch-desc {
|
||||
font-size: 0.13rem;
|
||||
font-weight: 330;
|
||||
line-height: 0.18rem;
|
||||
color: $text-middle;
|
||||
}
|
||||
|
||||
// 第2步自定义开关
|
||||
&__step2-toggle {
|
||||
position: relative;
|
||||
width: 0.44rem;
|
||||
height: 0.24rem;
|
||||
background: #E5E7EB;
|
||||
border-radius: 0.12rem;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
flex-shrink: 0;
|
||||
|
||||
&--on {
|
||||
background: $accent;
|
||||
|
||||
.agent-page__step2-toggle-dot {
|
||||
left: 0.22rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 第2步开关圆点
|
||||
&__step2-toggle-dot {
|
||||
position: absolute;
|
||||
width: 0.18rem;
|
||||
height: 0.18rem;
|
||||
left: 0.04rem;
|
||||
top: 0.03rem;
|
||||
background: #FFFFFF;
|
||||
border-radius: 50%;
|
||||
transition: left 0.2s;
|
||||
}
|
||||
|
||||
// 第2步功能说明区域 — 全宽
|
||||
&__step2-faq {
|
||||
width: 100%;
|
||||
@@ -690,7 +760,7 @@
|
||||
|
||||
&__step2-faq-title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $accent;
|
||||
margin-bottom: 0.13rem;
|
||||
}
|
||||
@@ -706,7 +776,7 @@
|
||||
|
||||
&__step2-faq-item-title {
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
margin-bottom: 0.08rem;
|
||||
}
|
||||
@@ -746,13 +816,14 @@
|
||||
padding: 0.12rem 0.16rem;
|
||||
min-width: 1.6rem;
|
||||
height: 0.43rem;
|
||||
background: #F3F4F6;
|
||||
background: #fff;
|
||||
border-radius: 0.12rem;
|
||||
cursor: pointer;
|
||||
box-sizing: border-box;
|
||||
user-select: none;
|
||||
transition: border-color 0.2s ease;
|
||||
width: 1.6rem;
|
||||
width: 100%;
|
||||
border: 1px solid #F0F0F0;
|
||||
|
||||
&:hover { border-color: darken($border-color, 10%); }
|
||||
}
|
||||
@@ -972,7 +1043,6 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.16rem;
|
||||
padding: 0.24rem;
|
||||
}
|
||||
|
||||
// 单个步骤卡片
|
||||
@@ -1014,7 +1084,7 @@
|
||||
background: #EDF9FA;
|
||||
border-radius: 0.08rem;
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $accent;
|
||||
flex-shrink: 0;
|
||||
line-height: 1;
|
||||
@@ -1029,7 +1099,7 @@
|
||||
// 步骤标题
|
||||
&__install-card-title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
margin: 0 0 0.04rem;
|
||||
line-height: 0.24rem;
|
||||
@@ -1087,7 +1157,7 @@
|
||||
border-radius: 0.08rem;
|
||||
color: $bg-white;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
cursor: pointer;
|
||||
transition: opacity 0.2s ease;
|
||||
white-space: nowrap;
|
||||
@@ -1156,7 +1226,6 @@
|
||||
|
||||
// 完成页占位图标
|
||||
&__complete-icon {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
margin-bottom: 0.32rem;
|
||||
|
||||
@@ -1344,7 +1413,7 @@
|
||||
border-radius: 0.08rem;
|
||||
background: $bg-white;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-middle;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
@@ -1373,7 +1442,7 @@
|
||||
border: none;
|
||||
border-radius: 0.08rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $bg-white;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
@@ -1773,7 +1842,7 @@
|
||||
/* 标题文字 */
|
||||
&__title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 520;
|
||||
font-weight: 620;
|
||||
color: $text-dark;
|
||||
line-height: 0.24rem;
|
||||
}
|
||||
@@ -1868,3 +1937,127 @@
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,532 @@
|
||||
@use '../variables' as *;
|
||||
|
||||
// ==================== 校招公告详情页 ====================
|
||||
|
||||
.announcement-detail {
|
||||
font-size: 0.14rem;
|
||||
width: 100%;
|
||||
height: var(--app-height, 100vh);
|
||||
overflow: hidden;
|
||||
min-width: 12.8rem;
|
||||
|
||||
// 主内容区（与 JobDetail 一致，通过 margin-left 避开侧边栏）
|
||||
&__content {
|
||||
margin-left: var(--nav-width, 2.2rem);
|
||||
flex: 1;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
background: $bg-main;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
|
||||
// 页面标题
|
||||
&__page-title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 600;
|
||||
color: $text-dark;
|
||||
line-height: 0.24rem;
|
||||
}
|
||||
|
||||
&__page-subtitle {
|
||||
font-size: 0.12rem;
|
||||
color: $text-middle;
|
||||
line-height: 0.16rem;
|
||||
}
|
||||
|
||||
// 返回按钮行
|
||||
&__back-row {
|
||||
padding: 0 0.24rem;
|
||||
margin-bottom: 0.12rem;
|
||||
}
|
||||
|
||||
&__back-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.04rem;
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
font-size: 0.14rem;
|
||||
color: $text-middle;
|
||||
padding: 0;
|
||||
|
||||
&:hover {
|
||||
color: $accent;
|
||||
}
|
||||
}
|
||||
|
||||
&__back-icon {
|
||||
width: 0.16rem;
|
||||
height: 0.16rem;
|
||||
}
|
||||
|
||||
// 主体内容可滚动区域
|
||||
&__body {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 0 0.24rem 0.24rem;
|
||||
}
|
||||
|
||||
// 两列布局（公司卡片下方）
|
||||
&__layout {
|
||||
display: flex;
|
||||
gap: 0.12rem;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
// 左侧主详情
|
||||
&__left {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
background: #fff;
|
||||
padding: 0.24rem 0.32rem;
|
||||
border-radius: 0.08rem;
|
||||
}
|
||||
|
||||
// 右侧边栏
|
||||
&__right {
|
||||
width: 4.24rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 顶部公司信息卡片（独占一行） ====================
|
||||
|
||||
.announcement-detail__company-card {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.24rem 0.32rem;
|
||||
background: $bg-white;
|
||||
border: 1px solid #F0F0F0;
|
||||
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.04);
|
||||
border-radius: 0.08rem;
|
||||
margin-bottom: 0.12rem;
|
||||
}
|
||||
|
||||
.announcement-detail__company-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__company-logo {
|
||||
width: 0.66rem;
|
||||
height: 0.66rem;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
flex-shrink: 0;
|
||||
|
||||
&--default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #EDF9FA;
|
||||
}
|
||||
}
|
||||
|
||||
.announcement-detail__company-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.12rem;
|
||||
}
|
||||
|
||||
.announcement-detail__company-name-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__company-name {
|
||||
font-size: 0.24rem;
|
||||
font-weight: 600;
|
||||
color: $text-dark;
|
||||
line-height: 0.32rem;
|
||||
}
|
||||
|
||||
.announcement-detail__company-tags {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 0.12rem;
|
||||
}
|
||||
|
||||
.announcement-detail__tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.03rem 0.06rem;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.16rem;
|
||||
border-radius: 0.04rem;
|
||||
|
||||
&--type {
|
||||
background: #FEF3F2;
|
||||
color: #B42318;
|
||||
}
|
||||
|
||||
&--gray {
|
||||
background: #F3F4F6;
|
||||
color: $text-middle;
|
||||
}
|
||||
}
|
||||
|
||||
.announcement-detail__company-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__btn-outline {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.08rem 0.16rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 450;
|
||||
color: $accent;
|
||||
background: transparent;
|
||||
border: 1px solid $accent;
|
||||
border-radius: 0.08rem;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
|
||||
&:hover {
|
||||
background: #EDF9FA;
|
||||
}
|
||||
}
|
||||
|
||||
.announcement-detail__btn-primary {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.08rem 0.16rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 450;
|
||||
color: #FFFFFF;
|
||||
background: $accent;
|
||||
border: 1px solid $accent;
|
||||
border-radius: 0.08rem;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
|
||||
&:hover {
|
||||
background: $accent-hover;
|
||||
border-color: $accent-hover;
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 岗位速览卡片 ====================
|
||||
|
||||
.announcement-detail__overview-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0.16rem 0.24rem;
|
||||
gap: 0.16rem;
|
||||
background: linear-gradient(180deg, #EDF9FA 0%, #FFFFFF 20.63%);
|
||||
border: 1px solid #AEE6EA;
|
||||
border-radius: 0.08rem;
|
||||
margin-bottom: 0.24rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-title-row {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
gap: 0.12rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-title {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 600;
|
||||
color: $text-dark;
|
||||
line-height: 0.21rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-date {
|
||||
font-size: 0.12rem;
|
||||
font-weight: 330;
|
||||
color: $text-middle;
|
||||
line-height: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-deadline {
|
||||
font-size: 0.14rem;
|
||||
font-weight: 380;
|
||||
color: $text-dark;
|
||||
line-height: 0.19rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-body {
|
||||
display: flex;
|
||||
gap: 0.24rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-fields {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
// 每行两个字段横排，align-items: stretch 保证同行等高
|
||||
.announcement-detail__overview-row {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
gap: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-direction {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.04rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-field {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.04rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-label {
|
||||
font-size: 0.12rem;
|
||||
font-weight: 330;
|
||||
color: $text-middle;
|
||||
line-height: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__overview-value {
|
||||
font-size: 0.14rem;
|
||||
font-weight: 380;
|
||||
color: $text-dark;
|
||||
line-height: 0.19rem;
|
||||
}
|
||||
|
||||
// ==================== 公告标题 ====================
|
||||
|
||||
.announcement-detail__main-title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: 600;
|
||||
color: $text-dark;
|
||||
line-height: 0.32rem;
|
||||
margin-bottom: 0.24rem;
|
||||
}
|
||||
|
||||
// ==================== 详情正文段落 ====================
|
||||
|
||||
.announcement-detail__section {
|
||||
margin-bottom: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__section-title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 600;
|
||||
color: $accent;
|
||||
line-height: 0.24rem;
|
||||
margin-bottom: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__section-content {
|
||||
font-size: 0.14rem;
|
||||
font-weight: 330;
|
||||
color: $text-dark;
|
||||
line-height: 0.19rem;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
// ==================== 右侧边栏卡片 ====================
|
||||
|
||||
.announcement-detail__aside-card {
|
||||
background: $bg-white;
|
||||
border: 1px solid #F0F0F0;
|
||||
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.04);
|
||||
border-radius: 0.08rem;
|
||||
padding: 0.24rem 0.32rem;
|
||||
margin-bottom: 0.12rem;
|
||||
}
|
||||
|
||||
.announcement-detail__aside-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 0.24rem;
|
||||
}
|
||||
|
||||
.announcement-detail__aside-title {
|
||||
font-size: 0.18rem;
|
||||
font-weight: 600;
|
||||
color: $accent;
|
||||
line-height: 0.24rem;
|
||||
}
|
||||
|
||||
.announcement-detail__aside-more {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.04rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 450;
|
||||
color: $text-middle;
|
||||
cursor: pointer;
|
||||
|
||||
svg {
|
||||
width: 0.19rem;
|
||||
height: 0.19rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $accent;
|
||||
}
|
||||
}
|
||||
|
||||
.announcement-detail__aside-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.16rem;
|
||||
}
|
||||
|
||||
// ==================== 企业其他岗位列表项 ====================
|
||||
|
||||
.announcement-detail__job-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__job-item-main {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.announcement-detail__job-item-title {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 600;
|
||||
color: $text-dark;
|
||||
line-height: 0.21rem;
|
||||
display: block;
|
||||
margin-bottom: 0.08rem;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 2.56rem;
|
||||
}
|
||||
|
||||
.announcement-detail__job-item-tags {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.08rem;
|
||||
}
|
||||
|
||||
.announcement-detail__job-item-score {
|
||||
text-align: right;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.announcement-detail__job-item-score-num {
|
||||
display: block;
|
||||
font-size: 0.22rem;
|
||||
font-weight: 600;
|
||||
line-height: 0.29rem;
|
||||
}
|
||||
|
||||
.announcement-detail__job-item-score-label {
|
||||
display: block;
|
||||
font-size: 0.12rem;
|
||||
font-weight: 450;
|
||||
line-height: 0.16rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.announcement-detail__job-divider {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 0;
|
||||
border-bottom: 1px solid #F0F0F0;
|
||||
}
|
||||
|
||||
// ==================== 通用灰色chip ====================
|
||||
|
||||
.announcement-detail__chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.03rem 0.06rem;
|
||||
background: #F3F4F6;
|
||||
border-radius: 0.04rem;
|
||||
font-size: 0.12rem;
|
||||
font-weight: 380;
|
||||
color: $text-middle;
|
||||
line-height: 0.16rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// ==================== 校招推荐列表项 ====================
|
||||
|
||||
.announcement-detail__rec-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 0.1rem;
|
||||
position: relative;
|
||||
padding-bottom: 0.16rem;
|
||||
}
|
||||
|
||||
.announcement-detail__rec-logo {
|
||||
width: 0.4rem;
|
||||
height: 0.4rem;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
flex-shrink: 0;
|
||||
|
||||
&--default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #EDF9FA;
|
||||
}
|
||||
}
|
||||
|
||||
.announcement-detail__rec-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.04rem;
|
||||
}
|
||||
|
||||
.announcement-detail__rec-company {
|
||||
font-size: 0.16rem;
|
||||
font-weight: 600;
|
||||
color: #111827;
|
||||
line-height: 0.21rem;
|
||||
}
|
||||
|
||||
.announcement-detail__rec-positions {
|
||||
font-size: 0.14rem;
|
||||
font-weight: 330;
|
||||
color: $text-middle;
|
||||
line-height: 0.19rem;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.announcement-detail__rec-tags {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 0.04rem;
|
||||
}
|
||||
@@ -0,0 +1,555 @@
|
||||
// 校招公告页面样式
|
||||
@use '../variables' as *;
|
||||
|
||||
.announcement-page {
|
||||
display: flex;
|
||||
|
||||
&__content {
|
||||
margin-left: var(--nav-width, 2.2rem);
|
||||
flex: 1;
|
||||
padding-bottom: 0.18rem;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
background: $bg-main;
|
||||
font-size: 0.14rem;
|
||||
}
|
||||
|
||||
// 页面标题
|
||||
&__title {
|
||||
font-size: 0.24rem;
|
||||
font-weight: 700;
|
||||
color: $text-dark;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
&__subtitle {
|
||||
font-size: 0.13rem;
|
||||
color: $text-light;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// 筛选条件外层
|
||||
&__filters-bar {
|
||||
border-radius: 0.12rem;
|
||||
margin: 0 0.24rem 0.12rem 0.24rem;
|
||||
}
|
||||
|
||||
// 筛选面板 + 统计卡片横向排列
|
||||
&__filters-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
gap: 0.12rem;
|
||||
}
|
||||
|
||||
// 筛选面板
|
||||
&__filters-panel {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
background: $bg-white;
|
||||
border: 1px solid #F0F0F0;
|
||||
box-shadow: 0px 2px 6px rgba(15, 23, 42, 0.025);
|
||||
border-radius: 0.12rem;
|
||||
padding: 0.12rem 0.16rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.12rem;
|
||||
}
|
||||
|
||||
// 筛选行
|
||||
&__filter-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 0.08rem 0.16rem;
|
||||
background: $bg-white;
|
||||
}
|
||||
|
||||
&__filter-row-inner {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
gap: 0.16rem;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
// 筛选行标题
|
||||
&__filter-row-label {
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.16rem;
|
||||
font-weight: 380;
|
||||
color: $text-middle;
|
||||
flex-shrink: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// chip组外层
|
||||
&__filter-chips-wrap {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 0.08rem;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
|
||||
> .industry-selector,
|
||||
> .job-category-selector,
|
||||
> .region-selector {
|
||||
flex-shrink: 0;
|
||||
margin-left: auto;
|
||||
align-self: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
// chip组
|
||||
&__filter-chips {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
gap: 0.08rem;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
// 筛选chip
|
||||
&__filter-chip {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0.04rem 0.08rem;
|
||||
background: #F3F4F6;
|
||||
border-radius: 0.04rem;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.16rem;
|
||||
font-weight: 330;
|
||||
color: $text-dark;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
user-select: none;
|
||||
transition: all 0.15s;
|
||||
border: 1px solid transparent;
|
||||
|
||||
&:hover {
|
||||
background: #E8F8F9;
|
||||
color: $accent;
|
||||
}
|
||||
|
||||
&--active {
|
||||
background: #F4FBFB;
|
||||
border-color: $accent;
|
||||
color: $accent;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
&--active-solid {
|
||||
background: $accent;
|
||||
color: #FFFFFF;
|
||||
font-weight: 600;
|
||||
border-color: $accent;
|
||||
}
|
||||
}
|
||||
|
||||
// 底部筛选行
|
||||
&__filter-row--bottom {}
|
||||
|
||||
// 下拉按钮组容器
|
||||
&__filter-dropdowns {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.08rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
// 下拉按钮项
|
||||
&__dropdown-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.02rem;
|
||||
padding: 0.04rem 0.08rem;
|
||||
border: 1px solid #F0F0F0;
|
||||
border-radius: 0.04rem;
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.16rem;
|
||||
font-weight: 330;
|
||||
color: $text-dark;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
user-select: none;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
border-color: $accent;
|
||||
color: $accent;
|
||||
}
|
||||
|
||||
.el-range-separator {
|
||||
padding-bottom: 0.03rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
&__dropdown-arrow {
|
||||
width: 0.12rem;
|
||||
height: 0.12rem;
|
||||
color: $text-middle;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
// 下拉菜单面板
|
||||
&__filter-dropdown {
|
||||
position: absolute;
|
||||
top: calc(100% + 0.06rem);
|
||||
left: 0;
|
||||
background: $bg-white;
|
||||
border: 1px solid #E8E8E8;
|
||||
border-radius: 0.08rem;
|
||||
padding: 0.04rem 0;
|
||||
box-shadow: 0 0.04rem 0.12rem rgba(0, 0, 0, 0.08);
|
||||
z-index: 20;
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
// 下拉菜单选项
|
||||
&__filter-dropdown-item {
|
||||
padding: 0.06rem 0.16rem;
|
||||
font-size: 0.12rem;
|
||||
color: $text-dark;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
transition: all 0.15s;
|
||||
|
||||
&:hover {
|
||||
background: $theme-color;
|
||||
color: $accent-hover;
|
||||
}
|
||||
|
||||
&--active {
|
||||
color: $accent;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
// 清空筛选按钮
|
||||
&__clear-filters {
|
||||
font-size: 0.12rem;
|
||||
color: $text-middle;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
|
||||
&:hover {
|
||||
color: $accent;
|
||||
}
|
||||
}
|
||||
|
||||
// 搜索框
|
||||
&__search-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: $bg-white;
|
||||
border-radius: 0.08rem;
|
||||
padding: 0.10rem 0.14rem;
|
||||
border: 1px solid #F0F0F0;
|
||||
|
||||
&:focus-within {
|
||||
border-color: $accent;
|
||||
}
|
||||
}
|
||||
|
||||
&__search-svg {
|
||||
width: 0.14rem;
|
||||
height: 0.14rem;
|
||||
color: $text-light;
|
||||
margin-right: 0.08rem;
|
||||
flex-shrink: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&__search-input {
|
||||
flex: 1;
|
||||
background: transparent;
|
||||
border: none;
|
||||
outline: none;
|
||||
color: $text-dark;
|
||||
font-size: 0.12rem;
|
||||
|
||||
&::placeholder {
|
||||
color: $text-light;
|
||||
}
|
||||
}
|
||||
|
||||
// 热门搜索标签
|
||||
&__hot-search-label {
|
||||
font-size: 0.12rem;
|
||||
color: $text-middle;
|
||||
white-space: nowrap;
|
||||
margin-right: 0.07rem;
|
||||
}
|
||||
|
||||
&__hot-search-tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 0.24rem;
|
||||
padding: 0 0.1rem;
|
||||
border-radius: 0.04rem;
|
||||
font-size: 0.12rem;
|
||||
color: $accent;
|
||||
background: $bg-white;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
user-select: none;
|
||||
transition: all 0.15s;
|
||||
margin-right: 0.07rem;
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&--active {
|
||||
background: $accent;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
// 列表区域
|
||||
&__list {
|
||||
overflow-y: auto;
|
||||
height: calc(var(--app-height, 100vh) - 3.4rem);
|
||||
padding: 0 0.24rem 0.2rem;
|
||||
}
|
||||
|
||||
// 表头
|
||||
&__table-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.10rem 0.12rem;
|
||||
background: #F4FBFB;
|
||||
border-radius: 0.08rem 0.08rem 0 0;
|
||||
border-bottom: 1px solid #F0F0F0;
|
||||
font-size: 0.12rem;
|
||||
font-weight: 600;
|
||||
color: $text-dark;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 5;
|
||||
gap: 0.2rem;
|
||||
>span{
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
// 表格行
|
||||
&__table-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.12rem;
|
||||
background: $bg-white;
|
||||
border-bottom: 1px solid #F6F6F6;
|
||||
font-size: 0.12rem;
|
||||
color: $text-dark;
|
||||
transition: background 0.15s;
|
||||
gap: 0.2rem;
|
||||
|
||||
&:hover {
|
||||
background: $theme-color;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
>span{
|
||||
flex: 1;
|
||||
}
|
||||
>div{
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
// 表头列宽
|
||||
&__th, &__td {
|
||||
flex-shrink: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__th--time, &__td--time { min-width: 0.7rem; }
|
||||
&__th--company, &__td--company { width: 1.8rem; flex-shrink: 1; }
|
||||
&__th--title, &__td--title { width: 1.8rem; flex: 1; min-width: 1rem; }
|
||||
&__th--position, &__td--position { width: 1.5rem; }
|
||||
&__th--target, &__td--target { width: 1.2rem; }
|
||||
&__th--major, &__td--major { width: 1.6rem; }
|
||||
&__th--batch, &__td--batch { width: 1rem; }
|
||||
&__th--deadline, &__td--deadline { width: 0.9rem; }
|
||||
|
||||
// 公司信息列
|
||||
&__td--company {
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
&__company-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.08rem;
|
||||
}
|
||||
|
||||
&__company-logo {
|
||||
width: 0.32rem;
|
||||
height: 0.32rem;
|
||||
border-radius: 0.06rem;
|
||||
border: 1px solid #F4F4F4;
|
||||
flex-shrink: 0;
|
||||
object-fit: cover;
|
||||
|
||||
&--default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: $bg-white;
|
||||
}
|
||||
}
|
||||
|
||||
&__company-text {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
&__company-name {
|
||||
font-size: 0.13rem;
|
||||
font-weight: 500;
|
||||
color: $text-dark;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__company-tags {
|
||||
display: flex;
|
||||
gap: 0.04rem;
|
||||
margin-top: 0.02rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
&__company-tag {
|
||||
font-size: 0.11rem;
|
||||
padding: 0.01rem 0.04rem;
|
||||
border-radius: 0.02rem;
|
||||
white-space: nowrap;
|
||||
|
||||
&--industry {
|
||||
background: #EDF9FA;
|
||||
color: $accent;
|
||||
}
|
||||
}
|
||||
|
||||
// 多行单元格
|
||||
&__td--position, &__td--target {
|
||||
white-space: normal;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.02rem;
|
||||
}
|
||||
|
||||
&__cell-line {
|
||||
font-size: 0.12rem;
|
||||
color: $text-dark;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__cell-sub {
|
||||
font-size: 0.11rem;
|
||||
color: $text-light;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__recruit-year {
|
||||
font-size: 0.12rem;
|
||||
color: #175CD3;
|
||||
background: #EFF8FF;
|
||||
padding: 0 0.08rem;
|
||||
border-radius: 0.04rem;
|
||||
display: inline-block;
|
||||
align-self: flex-start;
|
||||
height: 0.24rem;
|
||||
line-height: 0.24rem;
|
||||
}
|
||||
|
||||
// 空状态
|
||||
&__empty {
|
||||
text-align: center;
|
||||
font-size: 0.14rem;
|
||||
color: $text-light;
|
||||
}
|
||||
|
||||
&__empty-img {
|
||||
width: 1.24rem;
|
||||
height: 1.3rem;
|
||||
display: block;
|
||||
margin: 1rem auto 0.2rem;
|
||||
}
|
||||
|
||||
&__empty-title {
|
||||
font-size: 0.14rem;
|
||||
color: $text-light;
|
||||
margin-bottom: 0.08rem;
|
||||
}
|
||||
|
||||
&__empty-subtitle {
|
||||
font-size: 0.14rem;
|
||||
color: $text-light;
|
||||
}
|
||||
|
||||
&__empty-link {
|
||||
color: $accent;
|
||||
text-decoration: underline;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
opacity: 0.75;
|
||||
}
|
||||
}
|
||||
|
||||
// 加载状态
|
||||
&__loading-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.08rem;
|
||||
padding: 0.24rem 0;
|
||||
font-size: 0.13rem;
|
||||
color: $text-light;
|
||||
}
|
||||
|
||||
&__loading-spinner {
|
||||
width: 0.18rem;
|
||||
height: 0.18rem;
|
||||
border: 2px solid rgba(0, 0, 0, 0.1);
|
||||
border-top-color: $accent;
|
||||
border-radius: 50%;
|
||||
animation: announcement-spin 0.6s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes announcement-spin {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
&__loading-more {
|
||||
text-align: center;
|
||||
padding: 0.16rem 0;
|
||||
font-size: 0.12rem;
|
||||
color: $text-light;
|
||||
}
|
||||
}
|
||||
@@ -344,7 +344,7 @@
|
||||
&__quote-avatar {
|
||||
width: 0.38rem;
|
||||
height: 0.38rem;
|
||||
background: #D9E3EA;
|
||||
//background: #D9E3EA;
|
||||
border-radius: 50%;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@@ -142,18 +142,21 @@
|
||||
|
||||
// 主标题
|
||||
&__title {
|
||||
font-size: 0.54rem;
|
||||
font-size: 0.48rem;
|
||||
font-weight: 600;
|
||||
line-height: 0.71rem;
|
||||
letter-spacing: -0.03rem;
|
||||
line-height: 0.61rem;
|
||||
letter-spacing: 0.03rem;
|
||||
color: #111;
|
||||
margin: 0;
|
||||
>span{
|
||||
width: 1.51rem;
|
||||
}
|
||||
}
|
||||
|
||||
// 副标题描述
|
||||
&__desc {
|
||||
font-size: 0.2rem;
|
||||
line-height: 0.325rem;
|
||||
font-size: 0.16rem;
|
||||
line-height: 0.2rem;
|
||||
color: #9ca3af;
|
||||
margin-top: 0.1rem;
|
||||
}
|
||||
@@ -162,12 +165,11 @@
|
||||
&__cta {
|
||||
margin-top: 0.69rem;
|
||||
width: 1.84rem;
|
||||
height: 0.56rem;
|
||||
//line-height: 0.24rem;
|
||||
height: 0.52rem;
|
||||
border-radius: 0.16rem;
|
||||
background: linear-gradient(90deg, rgba(82, 202, 209, 1) 0%, rgba(83, 217, 200, 1) 100%);
|
||||
background: $accent;
|
||||
color: #fff;
|
||||
font-size: 0.18rem;
|
||||
font-size: 0.15rem;
|
||||
font-weight: 600;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
@@ -178,8 +180,9 @@
|
||||
// 右侧卡片区
|
||||
&__right {
|
||||
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;
|
||||
background: #FCFEFE;
|
||||
}
|
||||
|
||||
&__right-top{
|
||||
@@ -365,25 +368,25 @@
|
||||
.stat-card {
|
||||
background: #fff;
|
||||
border-radius: 0.16rem;
|
||||
width: 2.03rem;
|
||||
height: 1.87rem;
|
||||
width: 1.9rem;
|
||||
height: 1.9rem;
|
||||
text-align: center;
|
||||
padding-top:0.38rem;
|
||||
box-shadow: 0 0.06rem 0.2rem rgba(0, 0, 0, 0.05);
|
||||
|
||||
// 大数字
|
||||
&__num {
|
||||
font-size: 0.48rem;
|
||||
font-size: 0.38rem;
|
||||
font-weight: 900;
|
||||
color: #52CAD1;
|
||||
color: #2A8186;
|
||||
line-height: 0.63rem;
|
||||
}
|
||||
|
||||
// 描述文字
|
||||
&__label {
|
||||
font-size: 0.16rem;
|
||||
font-size: 0.13rem;
|
||||
line-height: 0.22rem;
|
||||
color: #9ca3af;
|
||||
color: #8D9399;
|
||||
margin-top: 0.12rem;
|
||||
letter-spacing: 0.0035rem;
|
||||
}
|
||||
@@ -391,7 +394,7 @@
|
||||
|
||||
// ==================== 岗位展示区 ====================
|
||||
.home-jobs-showcase {
|
||||
padding: 1rem 0;
|
||||
padding: 0.85rem 0 0.7rem 0;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
@@ -441,20 +444,20 @@
|
||||
|
||||
// 副标题
|
||||
&__sub {
|
||||
font-size: 0.2rem;
|
||||
font-size: 0.15rem;
|
||||
line-height: 0.28rem;
|
||||
color: #999;
|
||||
margin-top: 0.2rem;
|
||||
margin-top: 0.19rem;
|
||||
}
|
||||
|
||||
// 玻璃态展示盒子
|
||||
&__box {
|
||||
margin-top: 0.6rem;
|
||||
margin-top: 0.87rem;
|
||||
background: 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);
|
||||
backdrop-filter: blur(100px);
|
||||
border-radius: 0.4rem;
|
||||
border-radius: 0.1rem;
|
||||
padding: 0.64rem 0;
|
||||
}
|
||||
|
||||
@@ -472,7 +475,7 @@
|
||||
|
||||
.ticker-track {
|
||||
display: flex;
|
||||
gap: 0.16rem;
|
||||
gap: 0.30rem;
|
||||
width: max-content;
|
||||
animation: ticker-scroll 20s linear infinite;
|
||||
}
|
||||
@@ -483,16 +486,16 @@
|
||||
.showcase-stat {
|
||||
text-align: center;
|
||||
&__num {
|
||||
font-size: 0.48rem;
|
||||
font-size: 0.40rem;
|
||||
line-height: 0.6rem;
|
||||
font-weight: 900;
|
||||
color: #1d1d1d;
|
||||
.accent { color: $accent; }
|
||||
color: #2A8186;
|
||||
.accent { color: #2A8186; }
|
||||
}
|
||||
&__label {
|
||||
font-size: 0.18rem;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.28rem;
|
||||
color: #64748b;
|
||||
color: #8D9399;
|
||||
margin-top: 0.08rem;
|
||||
}
|
||||
}
|
||||
@@ -500,7 +503,7 @@
|
||||
// 单个岗位滚动卡片
|
||||
.job-ticker {
|
||||
flex-shrink: 0;
|
||||
background: rgba(30, 30, 46, 0.9);
|
||||
background: #12383A;
|
||||
backdrop-filter: blur(36px);
|
||||
border-radius: 0.12rem;
|
||||
padding: 0.2rem 0.24rem;
|
||||
@@ -545,16 +548,17 @@
|
||||
min-width: 0;
|
||||
|
||||
h2 {
|
||||
font-size: 0.48rem;
|
||||
font-size: 0.34rem;
|
||||
font-weight: 600;
|
||||
line-height: 0.63rem;
|
||||
line-height: 0.43rem;
|
||||
letter-spacing: 0.02rem;
|
||||
color: #111;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 0.2rem;
|
||||
line-height: 0.325rem;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.2rem;
|
||||
color: #999;
|
||||
margin-top: 0.16rem;
|
||||
}
|
||||
@@ -566,12 +570,13 @@
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.12rem;
|
||||
padding: 0.15rem 0.4rem;
|
||||
border-radius: 0.16rem;
|
||||
background: #111111;
|
||||
padding: 0 0.22rem;
|
||||
border-radius: 0.12rem;
|
||||
background: $accent;
|
||||
color: #fff;
|
||||
font-size: 0.16rem;
|
||||
line-height: 0.28rem;
|
||||
font-size: 0.12rem;
|
||||
height: 0.42rem;
|
||||
line-height: 0.42rem;
|
||||
font-weight: 600;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
@@ -582,7 +587,8 @@
|
||||
}
|
||||
svg {
|
||||
flex-shrink: 0;
|
||||
color: $btn-dark;
|
||||
color: #fff;
|
||||
font-size: 0.12rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1069,7 +1075,7 @@
|
||||
margin-bottom: 0.8rem;
|
||||
|
||||
h2 {
|
||||
font-size: 0.48rem;
|
||||
font-size: 0.38rem;
|
||||
line-height: 0.48rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.012rem;
|
||||
@@ -1077,12 +1083,12 @@
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 0.16rem;
|
||||
font-size: 0.15rem;
|
||||
line-height: 0.24rem;
|
||||
color: #9ca3af;
|
||||
letter-spacing: 0.0rem;
|
||||
text-transform: uppercase;
|
||||
margin-top: 0.24rem;
|
||||
margin-top: 0.14rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1612,10 +1618,18 @@
|
||||
margin: 0.6rem auto 0;
|
||||
text-align: center;
|
||||
padding-top: 0.4rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 0.2rem;
|
||||
|
||||
|
||||
p {
|
||||
font-size: 0.12rem;
|
||||
line-height: 0.16rem;
|
||||
color: #9ca3af;
|
||||
}
|
||||
a{
|
||||
font-size: 0.12rem;
|
||||
text-decoration: none;
|
||||
color: #9ca3af;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
// ==================== 岗位详情页 ====================
|
||||
.job-detail {
|
||||
&__content {
|
||||
margin-left: 2.2rem;
|
||||
margin-left: var(--nav-width, 2.2rem);
|
||||
margin-right: var(--chat-width, 3.6rem);
|
||||
flex: 1;
|
||||
height: var(--app-height, 100vh);
|
||||
@@ -167,14 +167,15 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.08rem 0.16rem;
|
||||
width: 0.88rem;
|
||||
height: 0.37rem;
|
||||
line-height: 0.37rem;
|
||||
background: $accent;
|
||||
border: 1px solid $accent;
|
||||
border-radius: 0.08rem;
|
||||
color: $bg-white;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 600;
|
||||
line-height: 0.19rem;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
|
||||
|
||||
+747
-382
File diff suppressed because it is too large
Load Diff
@@ -177,7 +177,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.12rem;
|
||||
width: 3.41rem;
|
||||
width: 4rem;
|
||||
|
||||
img{
|
||||
width: 1.6rem;
|
||||
@@ -230,12 +230,12 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.24rem;
|
||||
width: 3.41rem;
|
||||
width: 4rem;
|
||||
}
|
||||
|
||||
/* 标题 */
|
||||
.login-view__heading {
|
||||
width: 3.41rem;
|
||||
width: 4rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.05rem;
|
||||
@@ -243,15 +243,16 @@
|
||||
|
||||
.login-view__title {
|
||||
font-weight: 700;
|
||||
font-size: 0.18rem;
|
||||
font-size: 0.24rem;
|
||||
line-height: 0.22rem;
|
||||
color: #18181A;
|
||||
}
|
||||
|
||||
.login-view__subtitle {
|
||||
font-weight: 400;
|
||||
font-size: 0.10rem;
|
||||
line-height: 0.12rem;
|
||||
font-size: 0.14rem;
|
||||
margin-top: 0.08rem;
|
||||
margin-bottom: 0.08rem;
|
||||
color: #616367;
|
||||
|
||||
>span:nth-child(2){
|
||||
@@ -264,12 +265,12 @@
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 3.41rem;
|
||||
height: 0.40rem;
|
||||
width: 4rem;
|
||||
height: 0.56rem;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #C8C9CD;
|
||||
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 {
|
||||
margin-left: 0.06rem;
|
||||
font-weight: 500;
|
||||
font-size: 0.12rem;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.15rem;
|
||||
color: #202124;
|
||||
white-space: nowrap;
|
||||
@@ -330,7 +331,7 @@
|
||||
border: none;
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
font-size: 0.12rem;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.15rem;
|
||||
color: #202124;
|
||||
outline: none;
|
||||
@@ -342,14 +343,14 @@
|
||||
|
||||
/* ==================== 发送验证码按钮（步骤一） ==================== */
|
||||
.login-view__send-btn {
|
||||
width: 3.41rem;
|
||||
height: 0.40rem;
|
||||
width: 4rem;
|
||||
height: 0.43rem;
|
||||
background: linear-gradient(90deg, #4FC2C9 0%, #42A8B3 100%);
|
||||
box-shadow: 0 0.16rem 0.30rem rgba(15, 83, 87, 0.15);
|
||||
border-radius: 0.08rem;
|
||||
border-radius: 0.12rem;
|
||||
border: none;
|
||||
font-weight: 600;
|
||||
font-size: 0.12rem;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.15rem;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
@@ -391,8 +392,8 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 0.42rem;
|
||||
height: 0.46rem;
|
||||
width: 0.56rem;
|
||||
height: 0.56rem;
|
||||
background: #FAFBFC;
|
||||
border: 1px solid #E2E8F0;
|
||||
border-radius: 0.12rem;
|
||||
@@ -401,7 +402,7 @@
|
||||
|
||||
.login-view__otp-box--active {
|
||||
background: #F3FFFD;
|
||||
border: 2px solid $accent;
|
||||
border: 1px solid $accent;
|
||||
}
|
||||
|
||||
.login-view__otp-box--filled {
|
||||
@@ -444,13 +445,13 @@
|
||||
}
|
||||
|
||||
.login-view__sms-status--error {
|
||||
color: #E85635;
|
||||
color: #EF4444;
|
||||
}
|
||||
|
||||
/* ==================== 状态按钮（步骤二） ==================== */
|
||||
.login-view__status-btn {
|
||||
width: 100%;
|
||||
height: 0.4rem;
|
||||
height: 0.43rem;
|
||||
background: linear-gradient(90deg, $btn-dark 0%, $btn-dark-hover 100%);
|
||||
border-radius: 0.12rem;
|
||||
border: none;
|
||||
@@ -494,7 +495,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.06rem;
|
||||
width: 3.41rem;
|
||||
width: 4rem;
|
||||
}
|
||||
|
||||
.login-view__checkbox {
|
||||
@@ -547,7 +548,7 @@
|
||||
|
||||
/* ==================== 简历上传阶段 — 右侧面板 ==================== */
|
||||
.login-view__form-wrap--resume {
|
||||
width: 3.41rem;
|
||||
width: 4rem;
|
||||
}
|
||||
|
||||
/* 上传区域 */
|
||||
@@ -592,15 +593,16 @@
|
||||
|
||||
.login-view__upload-btn {
|
||||
height: 0.4rem;
|
||||
line-height: 0.4rem;
|
||||
line-height: 0.43rem;
|
||||
background: linear-gradient(90deg, $btn-dark 0%, $btn-dark-hover 100%);
|
||||
border: none;
|
||||
border-radius: 0.08rem;
|
||||
font-size: 0.16rem;
|
||||
font-size: 0.14rem;
|
||||
font-weight: 600;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
transition: opacity 0.2s;
|
||||
margin-bottom: -0.1rem;
|
||||
|
||||
&:hover {
|
||||
opacity: 0.9;
|
||||
@@ -610,7 +612,7 @@
|
||||
/* 解析中状态 — 新版步骤面板 */
|
||||
.login-view__parse-panel {
|
||||
box-sizing: border-box;
|
||||
width: 3.41rem;
|
||||
width: 4rem;
|
||||
padding: 0.24rem;
|
||||
background: #F6FFFF;
|
||||
border: 1px solid #D6F1EF;
|
||||
@@ -767,13 +769,13 @@
|
||||
|
||||
/* 解析中按钮（禁用样式） */
|
||||
.login-view__parse-btn {
|
||||
width: 3.41rem;
|
||||
height: 0.40rem;
|
||||
width: 4rem;
|
||||
height: 0.43rem;
|
||||
background: #A6EAE7;
|
||||
border-radius: 0.08rem;
|
||||
border: none;
|
||||
font-weight: 600;
|
||||
font-size: 0.12rem;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.15rem;
|
||||
color: #FFFFFF;
|
||||
cursor: not-allowed;
|
||||
@@ -782,7 +784,7 @@
|
||||
/* ==================== 状态4：上传成功面板 ==================== */
|
||||
.login-view__success-panel {
|
||||
box-sizing: border-box;
|
||||
width: 3.41rem;
|
||||
width: 4rem;
|
||||
padding: 0.28rem 0.24rem;
|
||||
background: #F6FFFB;
|
||||
border: 1px solid #BCEED7;
|
||||
@@ -863,13 +865,13 @@
|
||||
|
||||
/* 进入后台按钮 */
|
||||
.login-view__success-btn {
|
||||
width: 3.41rem;
|
||||
height: 0.40rem;
|
||||
width: 4rem;
|
||||
height: 0.43rem;
|
||||
background: #4FC2C9;
|
||||
border-radius: 0.08rem;
|
||||
border: none;
|
||||
font-weight: 600;
|
||||
font-size: 0.12rem;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.15rem;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
@@ -883,7 +885,7 @@
|
||||
/* ==================== 状态3：上传失败面板 ==================== */
|
||||
.login-view__failed-panel {
|
||||
box-sizing: border-box;
|
||||
width: 3.41rem;
|
||||
width: 4rem;
|
||||
padding: 0.28rem 0.24rem;
|
||||
background: #FFFBFA;
|
||||
border: 1px solid #FADBD5;
|
||||
@@ -964,14 +966,14 @@
|
||||
|
||||
/* 重新上传按钮 */
|
||||
.login-view__failed-btn {
|
||||
width: 3.41rem;
|
||||
height: 0.40rem;
|
||||
width: 4rem;
|
||||
height: 0.43rem;
|
||||
background: linear-gradient(90deg, #4FC2C9 0%, #42A8B3 100%);
|
||||
box-shadow: 0 0.16rem 0.30rem rgba(15, 83, 87, 0.15);
|
||||
border-radius: 0.08rem;
|
||||
border: none;
|
||||
font-weight: 600;
|
||||
font-size: 0.12rem;
|
||||
font-size: 0.14rem;
|
||||
line-height: 0.15rem;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
@@ -990,4 +992,5 @@
|
||||
color: #999;
|
||||
padding-top: 0.3rem;
|
||||
border-top: 1px solid #E7F2F3;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
margin-left: 2.2rem;
|
||||
margin-left: var(--nav-width, 2.2rem);
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
margin-left: 2.2rem;
|
||||
margin-left: var(--nav-width, 2.2rem);
|
||||
}
|
||||
|
||||
// 左侧主内容区
|
||||
@@ -92,6 +92,13 @@
|
||||
&:hover {
|
||||
background: #EDF9FA;
|
||||
}
|
||||
|
||||
// 小屏（视口宽度 < 1440px）只显示第一个标签
|
||||
@media (max-width: 1439px) {
|
||||
& ~ & {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 搜索框
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
// ==================== 个人资料页 ====================
|
||||
.profile-page {
|
||||
&__content {
|
||||
margin-left: 2.2rem;
|
||||
margin-left: var(--nav-width, 2.2rem);
|
||||
flex: 1;
|
||||
padding-bottom: 0.12rem;
|
||||
height: var(--app-height, 100vh);
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
// ==================== 简历详情页 ====================
|
||||
.resume-detail {
|
||||
&__content {
|
||||
margin-left: 2.2rem;
|
||||
margin-left: var(--nav-width, 2.2rem);
|
||||
flex: 1;
|
||||
padding-bottom: 0.24rem;
|
||||
height: var(--app-height, 100vh);
|
||||
@@ -726,7 +726,7 @@
|
||||
background: $bg-white;
|
||||
border: 1px solid $accent;
|
||||
border-radius: 0.04rem;
|
||||
padding: 0.05rem 0.14rem;
|
||||
padding: 0.05rem 0.08rem;
|
||||
transition: all 0.2s;
|
||||
|
||||
&:hover {
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
// ==================== 简历列表页 ====================
|
||||
.resume-page {
|
||||
&__content {
|
||||
margin-left: 2.2rem;
|
||||
margin-left: var(--nav-width, 2.2rem);
|
||||
flex: 1;
|
||||
height: var(--app-height, 100vh);
|
||||
box-sizing: border-box;
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
/**
|
||||
* 业务配置文件 — 集中管理可开关的业务策略
|
||||
*/
|
||||
|
||||
/** 是否开启"个人资料为空时强制跳转到登录页简历上传"机制 */
|
||||
export const ENABLE_FORCE_RESUME_UPLOAD = true
|
||||
|
||||
/** 浏览器插件目标版本（用于判断用户是否需要更新插件） */
|
||||
export const PLUGIN_TARGET_VERSION = '0.1.1'
|
||||
@@ -155,8 +155,12 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue'
|
||||
import { useStore } from 'vuex'
|
||||
import { createChannelBridge } from '@/utils/channelBridge'
|
||||
import type { JobListItem } from '@/api/jobs'
|
||||
|
||||
const store = useStore()
|
||||
|
||||
// ==================== Props ====================
|
||||
|
||||
const props = defineProps<{
|
||||
@@ -286,8 +290,29 @@ function handleContinueApply() {
|
||||
emit('continueApply')
|
||||
}
|
||||
|
||||
/** 前往投递 */
|
||||
function handleGoApply() {
|
||||
/** 前往投递 — 跨域 put 投递链接给插件 */
|
||||
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')
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,238 @@
|
||||
<!-- Agent页面 - 浏览器插件安装步骤指引组件（双Tab切换） -->
|
||||
<template>
|
||||
<div class="agent-browser-guide">
|
||||
<!-- 顶部Tab切换 -->
|
||||
<div class="agent-browser-guide__tabs">
|
||||
<div
|
||||
class="agent-browser-guide__tab"
|
||||
:class="{ 'agent-browser-guide__tab--active': activeTab === 'edge' }"
|
||||
@click="activeTab = 'edge'"
|
||||
>
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip_tab_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="#0C59A4"/>
|
||||
<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="#35C1F1"/>
|
||||
</g>
|
||||
<defs><clipPath id="clip_tab_edge"><rect width="16" height="16" fill="white"/></clipPath></defs>
|
||||
</svg>
|
||||
<span>Edge商店下载</span>
|
||||
</div>
|
||||
<div
|
||||
class="agent-browser-guide__tab"
|
||||
:class="{ 'agent-browser-guide__tab--active': activeTab === 'manual' }"
|
||||
@click="activeTab = 'manual'"
|
||||
>
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip_tab_chrome)">
|
||||
<path d="M8 12.45C10.46 12.45 12.45 10.46 12.45 8C12.45 5.54 10.46 3.55 8 3.55C5.54 3.55 3.55 5.54 3.55 8C3.55 10.46 5.54 12.45 8 12.45" fill="white"/>
|
||||
<path d="M2.24 5.81C1.91 5.24 1.52 4.63 1.07 4C0.37 5.22 0 6.6 0 8C0 9.41 0.37 10.78 1.07 12C1.77 13.22 2.78 14.23 4 14.93C5.22 15.63 6.6 16 8 16C8.74 14.97 9.24 14.22 9.5 13.77C10.01 12.89 10.66 11.63 11.46 10V10C11.11 10.61 10.61 11.11 10 11.46C9.39 11.82 8.7 12 8 12C7.3 12 6.61 11.82 6 11.46C5.39 11.11 4.89 10.61 4.54 10C3.44 7.97 2.68 6.57 2.24 5.81Z" fill="#229342"/>
|
||||
<path d="M8 16C9.05 16 10.09 15.79 11.06 15.39C12.03 14.99 12.91 14.4 13.66 13.66C14.4 12.91 14.99 12.03 15.39 11.06C15.79 10.09 16 9.05 16 8C16 6.6 15.63 5.22 14.93 4C13.41 3.85 12.29 3.78 11.57 3.78C10.75 3.78 9.56 3.85 8 4L8 4C8.7 4 9.39 4.19 10 4.54C10.61 4.89 11.11 5.39 11.46 6C11.82 6.61 12 7.3 12 8C12 8.7 11.82 9.39 11.46 10L8 16Z" fill="#FBC116"/>
|
||||
<path d="M8 11.17C9.75 11.17 11.17 9.75 11.17 8C11.17 6.25 9.75 4.83 8 4.83C6.25 4.83 4.83 6.25 4.83 8C4.83 9.75 6.25 11.17 8 11.17Z" fill="#1A73E8"/>
|
||||
<path d="M8 4H14.93C14.23 2.78 13.22 1.77 12 1.07C10.78 0.37 9.4 0 8 0C6.6 0 5.22 0.37 4 1.07C2.78 1.77 1.77 2.78 1.07 4L4.54 10L4.54 10C4.19 9.39 4 8.7 4 8C4 7.3 4.18 6.61 4.54 6C4.89 5.39 5.39 4.89 6 4.54C6.61 4.18 7.3 4 8 4Z" fill="#E33B2E"/>
|
||||
</g>
|
||||
<defs><clipPath id="clip_tab_chrome"><rect width="16" height="16" fill="white"/></clipPath></defs>
|
||||
</svg>
|
||||
<span>Chrome/Edge手动安装</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tab1: Edge商店下载（3步） -->
|
||||
<div v-if="activeTab === 'edge'" 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">打开 Edge 扩展商店中的「<a class="agent-browser-guide__link" :href="edgeStoreUrl" target="_blank">Offer派智能投递助手</a>」页面，点击右上角「获取」。</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 商店链接 + 跳转按钮 -->
|
||||
<div class="agent-browser-guide-drawer__download-box agent-browser-guide-drawer__download-box--wide">
|
||||
<span class="agent-browser-guide-drawer__download-name agent-browser-guide__url-text">{{ edgeStoreUrlDisplay }}</span>
|
||||
<button class="agent-browser-guide-drawer__download-btn" @click="openEdgeStore">
|
||||
<svg viewBox="0 0 16 16" fill="none" width="14" height="14"><path d="M6 3h7v7M13 3L3 13" 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/edge-step1.png" alt="Edge商店获取插件" 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>
|
||||
<!-- 步骤2示意图 -->
|
||||
<img src="@/assets/images/agent-setting/edge-step2.png" alt="添加扩展" class="agent-browser-guide-drawer__step-img" />
|
||||
</div>
|
||||
|
||||
<!-- 步骤3：固定插件 -->
|
||||
<div class="agent-browser-guide-drawer__card">
|
||||
<div>
|
||||
<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">点击浏览器右上角的「扩展」图标，找到「Offer派智能投递助手」，点击右侧的固钉图标，将插件固定到工具栏，方便后续使用。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 步骤3示意图 -->
|
||||
<img src="@/assets/images/agent-setting/edge-step3.png" alt="固定插件" class="agent-browser-guide-drawer__step-img" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tab2: Chrome/Edge手动安装（4步，保留原内容） -->
|
||||
<div v-if="activeTab === 'manual'" 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_chrome2)">
|
||||
<path d="M8 12.45C10.46 12.45 12.45 10.46 12.45 8C12.45 5.54 10.46 3.55 8 3.55C5.54 3.55 3.55 5.54 3.55 8C3.55 10.46 5.54 12.45 8 12.45" fill="white"/>
|
||||
<path d="M2.24 5.81C1.91 5.24 1.52 4.63 1.07 4C0.37 5.22 0 6.6 0 8C0 9.41 0.37 10.78 1.07 12C1.77 13.22 2.78 14.23 4 14.93C5.22 15.63 6.6 16 8 16C8.74 14.97 9.24 14.22 9.5 13.77C10.01 12.89 10.66 11.63 11.46 10V10C11.11 10.61 10.61 11.11 10 11.46C9.39 11.82 8.7 12 8 12C7.3 12 6.61 11.82 6 11.46C5.39 11.11 4.89 10.61 4.54 10C3.44 7.97 2.68 6.57 2.24 5.81Z" fill="#229342"/>
|
||||
<path d="M8 16C9.05 16 10.09 15.79 11.06 15.39C12.03 14.99 12.91 14.4 13.66 13.66C14.4 12.91 14.99 12.03 15.39 11.06C15.79 10.09 16 9.05 16 8C16 6.6 15.63 5.22 14.93 4C13.41 3.85 12.29 3.78 11.57 3.78C10.75 3.78 9.56 3.85 8 4L8 4C8.7 4 9.39 4.19 10 4.54C10.61 4.89 11.11 5.39 11.46 6C11.82 6.61 12 7.3 12 8C12 8.7 11.82 9.39 11.46 10L8 16Z" fill="#FBC116"/>
|
||||
<path d="M8 11.17C9.75 11.17 11.17 9.75 11.17 8C11.17 6.25 9.75 4.83 8 4.83C6.25 4.83 4.83 6.25 4.83 8C4.83 9.75 6.25 11.17 8 11.17Z" fill="#1A73E8"/>
|
||||
<path d="M8 4H14.93C14.23 2.78 13.22 1.77 12 1.07C10.78 0.37 9.4 0 8 0C6.6 0 5.22 0.37 4 1.07C2.78 1.77 1.77 2.78 1.07 4L4.54 10L4.54 10C4.19 9.39 4 8.7 4 8C4 7.3 4.18 6.61 4.54 6C4.89 5.39 5.39 4.89 6 4.54C6.61 4.18 7.3 4 8 4Z" fill="#E33B2E"/>
|
||||
</g>
|
||||
<defs><clipPath id="clip0_guide_chrome2"><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_edge2)">
|
||||
<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="#0C59A4"/>
|
||||
<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="#35C1F1"/>
|
||||
</g>
|
||||
<defs><clipPath id="clip0_guide_edge2"><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：加载未打包的扩展程序 -->
|
||||
<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 dflex flex-warp">
|
||||
<div>
|
||||
<h4 class="agent-browser-guide-drawer__step-title">点击加载未打包的扩展程序</h4>
|
||||
<p class="agent-browser-guide-drawer__step-desc">点击「加载未打包的扩展程序」，选择直接包含 static 文件夹的「Offer派智能投递助手」文件夹</p>
|
||||
</div>
|
||||
<img src="@/assets/images/agent-setting/4-1.png" alt="加载扩展" class="agent-browser-guide-drawer__step-img" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- 步骤4示意图 -->
|
||||
|
||||
<img src="@/assets/images/agent-setting/4-2.png" alt="加载扩展" class="agent-browser-guide-drawer__step-img" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
/** 当前激活的Tab */
|
||||
const activeTab = ref<'edge' | 'manual'>('edge')
|
||||
|
||||
/** Edge扩展商店地址 */
|
||||
const edgeStoreUrl = 'https://microsoftedge.microsoft.com/addons/detail/offer派智能投递助手/jianshixingqiu'
|
||||
/** Edge商店地址展示文本（截断显示） */
|
||||
const edgeStoreUrlDisplay = 'https://microsoftedge.microsoft.com/addons/detai...'
|
||||
|
||||
/** 插件zip下载地址 */
|
||||
const extensionDownloadUrl = 'https://offerpie.oss-cn-guangzhou.aliyuncs.com/extension/Offer派智能投递助手.zip'
|
||||
|
||||
/** 跳转Edge商店 */
|
||||
function openEdgeStore() {
|
||||
window.open(edgeStoreUrl, '_blank')
|
||||
}
|
||||
|
||||
/** 下载插件zip包 */
|
||||
function downloadExtension() {
|
||||
window.open(extensionDownloadUrl, '_blank')
|
||||
}
|
||||
|
||||
/** 复制文本到剪贴板 */
|
||||
function copyToClipboard(text: string) {
|
||||
navigator.clipboard.writeText(text).then(() => {
|
||||
ElMessage.success('已复制到剪贴板')
|
||||
}).catch(() => {
|
||||
ElMessage.error('复制失败，请手动复制')
|
||||
})
|
||||
}
|
||||
|
||||
/** 暴露方法给父组件调用 */
|
||||
defineExpose({ downloadExtension })
|
||||
</script>
|
||||
@@ -250,141 +250,7 @@
|
||||
</div>
|
||||
|
||||
<!-- 步骤内容 -->
|
||||
<div class="agent-browser-guide-drawer__body">
|
||||
<!-- 步骤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>
|
||||
<AgentBrowserInstallGuide />
|
||||
</div>
|
||||
</div>
|
||||
</Transition>
|
||||
@@ -399,6 +265,7 @@ import { ElMessage } from 'element-plus'
|
||||
import { formatEmploymentType } from '@/stores/index'
|
||||
import JobGoalDialog from '@/components/JobGoalDialog.vue'
|
||||
import RegionSelector from '@/components/tools/RegionSelector.vue'
|
||||
import AgentBrowserInstallGuide from '@/components/AgentBrowserInstallGuide.vue'
|
||||
import { saveProfile, fetchProfile, fetchEducation } from '@/api/profile'
|
||||
import { resolveRegionName } from '@/utils/region'
|
||||
import { resolveIndustryName } from '@/utils/industry'
|
||||
@@ -662,9 +529,6 @@ async function handleSavePreference() {
|
||||
/** 浏览器插件安装教程抽屉是否显示 */
|
||||
const showBrowserGuideDrawer = ref(false)
|
||||
|
||||
/** 插件下载地址 */
|
||||
const extensionDownloadUrl = 'https://offerpie.oss-cn-guangzhou.aliyuncs.com/extension/chrome-mv3-prod.rar'
|
||||
|
||||
/** 打开浏览器安装指引抽屉 */
|
||||
function openBrowserGuide(_browser: string) {
|
||||
showBrowserGuideDrawer.value = true
|
||||
@@ -675,20 +539,6 @@ function closeBrowserGuideDrawer() {
|
||||
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 () => {
|
||||
|
||||
+545
-314
File diff suppressed because it is too large
Load Diff
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user