薪酬信息，简历指导页面开发

pages.json

@@ -125,6 +125,24 @@
           "navigationBarTitleText": "社保登录",
           "navigationStyle": "custom"
         }
+      },
+      {
+        "path": "pages/resume-guide/resume-guide",
+        "style": {
+          "navigationBarTitleText": "简历制作指导"
+        }
+      },
+      {
+        "path": "pages/resume-guide/resume-example",
+        "style": {
+          "navigationBarTitleText": "简历示例"
+        }
+      },
+      {
+        "path": "pages/service/salary-info",
+        "style": {
+          "navigationBarTitleText": "薪酬信息"
+        }
       }
     ],
     "subpackages": [

pages/index/components/index-one.vue

@@ -74,6 +74,18 @@
                 </view> -->
             </view>
             
+            <!-- H5端专用按钮 -->
+            <!-- #ifdef H5 -->
+            <view class="h5-action-buttons" v-if="shouldShowJobSeekerContent">
+                <view class="h5-action-btn press-button" @click="handleH5SalaryClick">
+                    <view class="btn-text">薪酬信息</view>
+                </view>
+                <view class="h5-action-btn press-button" @click="handleServiceClick('resume-creation')">
+                    <view class="btn-text">简历指导</view>
+                </view>
+            </view>
+            <!-- #endif -->
+            
             <!-- 服务功能网格 -->
             <!-- #ifndef H5 -->
             <view class="service-grid" v-if="shouldShowJobSeekerContent">
@@ -93,7 +105,7 @@
                     <view class="service-icon service-icon-3">
                         <IconfontIcon name="jianli" :size="48" color="#FFFFFF" />
                     </view>
-                    <view class="service-title">简历制作</view>
+                    <view class="service-title">简历指导</view>
                 </view>
                 <view class="service-item press-button" @click="handleServiceClick('labor-policy')">
                     <view class="service-icon service-icon-4">
@@ -143,11 +155,11 @@
                     </view>
                     <view class="service-title">职业规划推荐</view>
                 </view>
-                <view class="service-item press-button" @click="navToTestPage">
+                <view class="service-item press-button" @click="handleSalaryInfoClick">
-                    <view class="service-icon service-icon-10">
+                    <view class="service-icon service-icon-12">
-                        <uni-icons type="gear-filled" size="32" color="#FFFFFF"></uni-icons>
+                        <uni-icons type="money-filled" size="32" color="#FFFFFF"></uni-icons>
                     </view>
-                    <view class="service-title">测试页面</view>
+                    <view class="service-title">薪酬信息</view>
                 </view>
             </view>
             <!-- #endif -->
@@ -751,9 +763,13 @@ const handleLiveClick = () => {
     // #endif
 };
 
-// 跳转到测试页面
+// 处理薪酬信息点击
-const navToTestPage = () => {
+const handleSalaryInfoClick = () => {
-    navTo('/pages/test/homepage-test');
+    navTo('/pages/service/salary-info');
+};
+const handleH5SalaryClick = () => {
+    const salaryUrl = "https://www.mohrss.gov.cn/SYrlzyhshbzb/laodongguanxi_/fwyd/202506/t20250627_544623.html";
+    window.location.assign(salaryUrl);
 };
 
 async function loadData() {
@@ -844,7 +860,7 @@ function navToService(serviceType) {
     const serviceRoutes = {
         'service-guidance': '/pages/service/guidance',
         'public-recruitment': '/pages/service/public-recruitment', 
-        'resume-creation': '/packageA/pages/myResume/myResume',
+        'resume-creation': '/pages/resume-guide/resume-guide',
         'labor-policy': '/pages/service/labor-policy',
         'skill-training': '/pages/service/skill-training',
         // 'skill-evaluation': '/pages/service/skill-evaluation',
@@ -1283,6 +1299,29 @@ defineExpose({ loadData });
         background-size: cover;
         background-position: center;
 
+// H5端专用按钮样式
+.h5-action-buttons
+    padding: 16rpx 28rpx
+    display: flex
+    gap: 16rpx
+    .h5-action-btn
+        flex: 1
+        height: 60rpx
+        background:#FFFFFF
+        border-radius: 8rpx
+        display: flex
+        align-items: center
+        justify-content: center
+        transition: opacity 0.2s ease
+        box-shadow: 0rpx 8rpx 20rpx 0rpx rgba(37, 107, 250, 0.3)
+        &:active
+            opacity: 0.8
+        
+        .btn-text
+            font-family: 'PingFangSC-Regular', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, 'Microsoft YaHei', sans-serif
+            font-weight: 400
+            font-size: 26rpx
+            color: #256BFA
 // 服务功能网格样式
 .service-grid
     padding: 20rpx 28rpx
@@ -1378,13 +1417,9 @@ defineExpose({ loadData });
         .service-icon-12
             background: linear-gradient(135deg, #4CAF50 0%, #81C784 100%)
             position: relative
-            &::before
+            display: flex
-                content: '💰'
+            align-items: center
-                position: absolute
+            justify-content: center
-                top: 50%
-                left: 50%
-                transform: translate(-50%, -50%)
-                font-size: 32rpx
         .service-icon-13
             background: linear-gradient(135deg, #607D8B 0%, #90A4AE 100%)
             position: relative

pages/resume-guide/resume-example.vue

@@ -0,0 +1,513 @@
+<template>
+  <AppLayout backGorundColor="#FFFFFF">
+    <view class="resume-example-container">
+      <!-- 职业选择 -->
+      <view class="job-selector">
+        <view 
+          class="job-option" 
+          :class="{ active: selectedJob === job.value }"
+          v-for="job in jobTypes" 
+          :key="job.value"
+          @click="selectJob(job.value)"
+        >
+          {{ job.label }}
+        </view>
+      </view>
+
+      <!-- 简历示例内容 -->
+      <view class="resume-content">
+        <view class="resume-header">
+          <view class="name">{{ resumeData.name }}</view>
+          <view class="contact-info">
+            <text v-if="resumeData.phone">{{ resumeData.phone }} | </text>
+            <text v-if="resumeData.email">{{ resumeData.email }} | </text>
+            <text v-if="resumeData.location">{{ resumeData.location }}</text>
+          </view>
+        </view>
+
+        <view class="resume-section" v-if="resumeData.education && resumeData.education.length > 0">
+          <view class="section-title">教育背景</view>
+          <view class="section-content">
+            <view class="education-item" v-for="(edu, index) in resumeData.education" :key="index">
+              <view class="edu-header">
+                <text class="school">{{ edu.school }}</text>
+                <text class="date">{{ edu.date }}</text>
+              </view>
+              <view class="degree">{{ edu.degree }} - {{ edu.major }}</view>
+              <view class="desc" v-if="edu.desc">{{ edu.desc }}</view>
+            </view>
+          </view>
+        </view>
+
+        <view class="resume-section" v-if="resumeData.skills && resumeData.skills.length > 0">
+          <view class="section-title">技能专长</view>
+          <view class="section-content">
+            <view class="skills-grid">
+              <view class="skill-tag" v-for="(skill, index) in resumeData.skills" :key="index">
+                {{ skill }}
+              </view>
+            </view>
+          </view>
+        </view>
+
+        <view class="resume-section" v-if="resumeData.experience && resumeData.experience.length > 0">
+          <view class="section-title">工作经历</view>
+          <view class="section-content">
+            <view class="experience-item" v-for="(exp, index) in resumeData.experience" :key="index">
+              <view class="exp-header">
+                <text class="company">{{ exp.company }}</text>
+                <text class="date">{{ exp.date }}</text>
+              </view>
+              <view class="position">{{ exp.position }}</view>
+              <view class="responsibilities">
+                <view class="resp-item" v-for="(resp, idx) in exp.responsibilities" :key="idx">
+                  {{ resp }}
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+
+        <view class="resume-section" v-if="resumeData.projects && resumeData.projects.length > 0">
+          <view class="section-title">项目经验</view>
+          <view class="section-content">
+            <view class="project-item" v-for="(project, index) in resumeData.projects" :key="index">
+              <view class="project-header">
+                <text class="project-name">{{ project.name }}</text>
+                <text class="date">{{ project.date }}</text>
+              </view>
+              <view class="project-role">{{ project.role }}</view>
+              <view class="project-desc">{{ project.desc }}</view>
+              <view class="achievements">
+                <view class="achievement-item" v-for="(ach, idx) in project.achievements" :key="idx">
+                  ● {{ ach }}
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </AppLayout>
+</template>
+
+<script setup>
+import { ref, computed } from 'vue';
+
+// 职业类型选项
+const jobTypes = [
+  { label: '软件工程师', value: 'software-engineer' },
+  { label: '产品经理', value: 'product-manager' },
+  { label: '市场营销', value: 'marketing' },
+  { label: '财务会计', value: 'accountant' },
+  { label: '人力资源', value: 'hr' }
+];
+
+// 当前选中的职业
+const selectedJob = ref('software-engineer');
+
+// 选择职业
+const selectJob = (jobValue) => {
+  selectedJob.value = jobValue;
+};
+
+// 不同职业的简历数据
+const resumeSamples = {
+  'software-engineer': {
+    name: '张伟',
+    phone: '138-0000-0000',
+    email: 'zhangwei@example.com',
+    location: '北京市',
+    education: [
+      {
+        school: '清华大学',
+        date: '2016.09 - 2020.06',
+        degree: '本科',
+        major: '计算机科学与技术',
+        desc: '主修课程：数据结构、算法设计、数据库原理、操作系统'
+      }
+    ],
+    experience: [
+      {
+        company: '腾讯科技有限公司',
+        date: '2022.07 - 至今',
+        position: '高级前端工程师',
+        responsibilities: [
+          '负责公司核心产品的前端架构设计和开发',
+          '主导团队技术选型，推动Vue3 + TypeScript技术栈落地',
+          '优化前端性能，页面加载速度提升40%',
+          '指导初级工程师，提升团队整体技术水平'
+        ]
+      },
+      {
+        company: '阿里巴巴集团',
+        date: '2020.07 - 2022.06',
+        position: '前端工程师',
+        responsibilities: [
+          '参与电商平台前端开发，使用Vue.js框架',
+          '负责商品详情页和购物车模块开发',
+          '优化页面响应速度，用户体验评分提升25%',
+          '编写技术文档，协助测试团队完成测试用例'
+        ]
+      }
+    ],
+    skills: [
+      'Vue.js', 'React', 'JavaScript', 'TypeScript', 'HTML5', 'CSS3',
+      'Node.js', 'Webpack', 'Git', '小程序开发', '响应式设计'
+    ],
+    projects: [
+      {
+        name: '电商平台前端重构项目',
+        date: '2023.03 - 2023.09',
+        role: '前端技术负责人',
+        desc: '主导公司核心电商平台的前端重构工作，提升用户体验和系统性能',
+        achievements: [
+          '采用微前端架构，实现多团队协同开发',
+          '页面加载速度提升40%，用户停留时长增加25%',
+          '代码可维护性大幅提升，bug率降低30%'
+        ]
+      }
+    ]
+  },
+  'product-manager': {
+    name: '李娜',
+    phone: '139-0000-0000',
+    email: 'lina@example.com',
+    location: '上海市',
+    education: [
+      {
+        school: '复旦大学',
+        date: '2015.09 - 2019.06',
+        degree: '本科',
+        major: '工商管理',
+        desc: '主修课程：市场营销、消费者行为学、战略管理'
+      }
+    ],
+    experience: [
+      {
+        company: '字节跳动',
+        date: '2021.05 - 至今',
+        position: '高级产品经理',
+        responsibilities: [
+          '负责短视频产品功能规划和迭代优化',
+          '分析用户行为数据，制定产品策略',
+          '协调设计、开发、运营团队推进项目落地',
+          '跟踪竞品动态，持续优化产品体验'
+        ]
+      },
+      {
+        company: '美团',
+        date: '2019.07 - 2021.04',
+        position: '产品经理',
+        responsibilities: [
+          '负责外卖商家端产品功能设计',
+          '通过数据分析发现业务增长点',
+          '推动商户入驻流程优化，提升转化率15%',
+          '组织跨部门会议，推进项目进度'
+        ]
+      }
+    ],
+    skills: [
+      '产品设计', '数据分析', '用户研究', 'Axure', 'SQL',
+      '项目管理', '沟通协调', '市场调研', '竞品分析'
+    ],
+    projects: [
+      {
+        name: '智能推荐系统优化',
+        date: '2023.01 - 2023.06',
+        role: '项目经理',
+        desc: '优化平台内容推荐算法，提升用户粘性和内容消费时长',
+        achievements: [
+          '推荐准确率提升20%，用户满意度显著提高',
+          '日活跃用户增长12%，内容消费时长增加18%',
+          '项目获公司年度创新奖'
+        ]
+      }
+    ]
+  },
+  'marketing': {
+    name: '王强',
+    phone: '136-0000-0000',
+    email: 'wangqiang@example.com',
+    location: '广州市',
+    education: [
+      {
+        school: '中山大学',
+        date: '2017.09 - 2021.06',
+        degree: '本科',
+        major: '市场营销',
+        desc: '主修课程：市场营销学、消费者心理学、品牌管理'
+      }
+    ],
+    experience: [
+      {
+        company: '宝洁公司',
+        date: '2021.08 - 至今',
+        position: '品牌推广专员',
+        responsibilities: [
+          '负责洗护用品品牌线上线下推广活动策划',
+          '分析市场数据，制定营销策略',
+          '协调广告公司和媒体资源',
+          '跟踪活动效果，撰写分析报告'
+        ]
+      }
+    ],
+    skills: [
+      '品牌推广', '社交媒体营销', '数据分析', '活动策划',
+      '广告投放', 'SEO/SEM', '内容营销', '客户关系管理'
+    ],
+    projects: [
+      {
+        name: '新品上市推广 campaign',
+        date: '2023.03 - 2023.05',
+        role: '推广负责人',
+        desc: '负责公司新款洗发水产品上市的全渠道推广活动',
+        achievements: [
+          '首月销售额突破500万元，超出预期目标20%',
+          '社交媒体话题阅读量超1000万次',
+          '成功签约10位知名KOL进行产品推广'
+        ]
+      }
+    ]
+  },
+  'accountant': {
+    name: '陈丽',
+    phone: '137-0000-0000',
+    email: 'chenli@example.com',
+    location: '深圳市',
+    education: [
+      {
+        school: '厦门大学',
+        date: '2018.09 - 2022.06',
+        degree: '本科',
+        major: '会计学',
+        desc: '主修课程：财务会计、成本会计、税法、审计'
+      }
+    ],
+    experience: [
+      {
+        company: '德勤会计师事务所',
+        date: '2022.07 - 至今',
+        position: '审计员',
+        responsibilities: [
+          '参与多家上市公司年度财务报表审计',
+          '编制审计工作底稿，整理审计证据',
+          '协助项目经理完成审计报告',
+          '与客户沟通解决审计过程中发现的问题'
+        ]
+      }
+    ],
+    skills: [
+      '财务报表分析', '税务筹划', '审计', 'Excel', 'SAP',
+      '财务软件', '成本核算', '风险控制', '财务制度设计'
+    ],
+    projects: [
+      {
+        name: '制造业企业年度审计',
+        date: '2023.09 - 2024.01',
+        role: '审计小组成员',
+        desc: '参与大型制造企业的年度财务报表审计工作',
+        achievements: [
+          '发现并纠正财务处理错误3处，涉及金额约200万元',
+          '优化审计流程，提高工作效率15%',
+          '协助企业完善内控制度，获得客户高度评价'
+        ]
+      }
+    ]
+  },
+  'hr': {
+    name: '赵敏',
+    phone: '135-0000-0000',
+    email: 'zhaomin@example.com',
+    location: '杭州市',
+    education: [
+      {
+        school: '浙江大学',
+        date: '2019.09 - 2023.06',
+        degree: '本科',
+        major: '人力资源管理',
+        desc: '主修课程：人力资源管理、组织行为学、薪酬管理'
+      }
+    ],
+    experience: [
+      {
+        company: '华为技术有限公司',
+        date: '2023.07 - 至今',
+        position: '人力资源专员',
+        responsibilities: [
+          '负责员工招聘、面试安排和入职培训',
+          '协助制定员工绩效考核方案',
+          '处理员工关系问题，维护良好工作氛围',
+          '管理员工档案和薪酬福利'
+        ]
+      }
+    ],
+    skills: [
+      '招聘面试', '员工培训', '绩效管理', '劳动关系',
+      '薪酬福利', 'HR系统', '沟通协调', '团队建设'
+    ],
+    projects: [
+      {
+        name: '新员工培训体系优化',
+        date: '2024.01 - 2024.03',
+        role: '项目负责人',
+        desc: '优化公司新员工培训体系，提升培训效果',
+        achievements: [
+          '建立标准化培训流程，培训满意度提升25%',
+          '开发在线学习平台，节省培训成本30%',
+          '新员工试用期通过率提高至95%'
+        ]
+      }
+    ]
+  }
+};
+
+// 当前显示的简历数据
+const resumeData = computed(() => {
+  return resumeSamples[selectedJob.value] || resumeSamples['software-engineer'];
+});
+</script>
+
+<style lang="scss" scoped>
+.resume-example-container {
+  padding: 32rpx;
+  background: #FFFFFF;
+  min-height: 100vh;
+}
+
+.job-selector {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16rpx;
+  margin-bottom: 32rpx;
+  
+  .job-option {
+    padding: 16rpx 24rpx;
+    background: #F5F5F5;
+    border-radius: 6rpx;
+    font-size: 26rpx;
+    color: #666666;
+    cursor: pointer;
+    
+    &.active {
+      background: #1A1A1A;
+      color: #FFFFFF;
+    }
+  }
+}
+
+.resume-content {
+  background: #FFFFFF;
+  border-radius: 8rpx;
+  padding: 32rpx;
+  border: 1rpx solid #F0F0F0;
+}
+
+.resume-header {
+  text-align: center;
+  margin-bottom: 32rpx;
+  padding-bottom: 24rpx;
+  border-bottom: 1rpx solid #F0F0F0;
+  
+  .name {
+    font-size: 40rpx;
+    font-weight: 600;
+    color: #1A1A1A;
+    margin-bottom: 16rpx;
+  }
+  
+  .contact-info {
+    font-size: 26rpx;
+    color: #666666;
+    line-height: 1.6;
+  }
+}
+
+.resume-section {
+  margin-bottom: 32rpx;
+  
+  &:last-child {
+    margin-bottom: 0;
+  }
+  
+  .section-title {
+    font-size: 32rpx;
+    font-weight: 600;
+    color: #1A1A1A;
+    margin-bottom: 20rpx;
+    padding-bottom: 12rpx;
+    border-bottom: 1rpx solid #F0F0F0;
+  }
+  
+  .section-content {
+    padding-left: 0;
+  }
+}
+
+.education-item, .experience-item, .project-item {
+  margin-bottom: 24rpx;
+  
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.edu-header, .exp-header, .project-header {
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 8rpx;
+  
+  .school, .company, .project-name {
+    font-size: 28rpx;
+    font-weight: 600;
+    color: #1A1A1A;
+  }
+  
+  .date {
+    font-size: 24rpx;
+    color: #666666;
+  }
+}
+
+.degree, .position, .project-role {
+  font-size: 26rpx;
+  color: #1A1A1A;
+  margin-bottom: 8rpx;
+  font-weight: 500;
+}
+
+.desc, .project-desc {
+  font-size: 24rpx;
+  color: #666666;
+  line-height: 1.5;
+}
+
+.responsibilities, .achievements {
+  margin-top: 8rpx;
+  
+  .resp-item, .achievement-item {
+    font-size: 24rpx;
+    color: #666666;
+    line-height: 1.6;
+    margin-bottom: 6rpx;
+    
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
+
+.skills-grid {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16rpx;
+  
+  .skill-tag {
+    padding: 12rpx 20rpx;
+    background: #F5F5F5;
+    border-radius: 4rpx;
+    font-size: 22rpx;
+    color: #1A1A1A;
+  }
+}
+</style>

pages/resume-guide/resume-guide.vue

@@ -0,0 +1,246 @@
+<template>
+  <AppLayout back-gorund-color="#FFFFFF">
+    <view class="resume-guide-container">
+      <!-- 页面标题 -->
+      <view class="page-header">
+        <view class="page-title">简历制作指导</view>
+        <view class="page-subtitle">打造专业简历，提升求职成功率</view>
+      </view>
+
+      <!-- 简历制作步骤 -->
+      <view class="guide-section">
+        <view class="section-title">制作步骤</view>
+        <view class="steps-list">
+          <view class="step-card" v-for="(step, index) in steps" :key="index">
+            <view class="step-header">
+              <view class="step-number">步骤{{ index + 1 }}</view>
+              <view class="step-title">{{ step.title }}</view>
+            </view>
+            <view class="step-desc">{{ step.desc }}</view>
+          </view>
+        </view>
+      </view>
+
+      <!-- 简历写作技巧 -->
+      <view class="guide-section">
+        <view class="section-title">写作技巧</view>
+        <view class="tips-list">
+          <view class="tip-item" v-for="(tip, index) in tips" :key="index">
+            <view class="tip-content">
+              <view class="tip-title">{{ tip.title }}</view>
+              <view class="tip-desc">{{ tip.desc }}</view>
+            </view>
+          </view>
+        </view>
+      </view>
+
+      <!-- 常见错误提醒 -->
+      <view class="guide-section">
+        <view class="section-title">避坑指南</view>
+        <view class="warnings-list">
+          <view class="warning-item" v-for="(warning, index) in warnings" :key="index">
+            <view class="warning-content">
+              <view class="warning-title">{{ warning.title }}</view>
+              <view class="warning-desc">{{ warning.desc }}</view>
+            </view>
+          </view>
+        </view>
+      </view>
+
+      <!-- 行动按钮 -->
+      <view class="action-buttons">
+        <view class="primary-button button-click" @click="startCreateResume">
+          开始制作简历
+        </view>
+        <view class="secondary-button button-click" @click="viewExampleResume">
+          查看简历示例
+        </view>
+      </view>
+    </view>
+  </AppLayout>
+</template>
+
+<script setup>
+import { inject, ref } from 'vue';
+const { navTo } = inject('globalFunction');
+
+// 制作步骤数据
+const steps = ref([
+  { title: '基本信息', desc: '填写真实姓名、联系方式、邮箱等基本信息' },
+  { title: '教育背景', desc: '按时间倒序填写学历信息，突出最高学历' },
+  { title: '技能特长', desc: '列出与目标岗位相关的专业技能' },
+  { title: '工作经历', desc: '详细描述工作职责和成就，使用量化数据' },
+  { title: '项目经验', desc: '展示参与的重要项目，突出个人贡献' }
+]);
+
+// 写作技巧数据
+const tips = ref([
+  { title: '简洁明了', desc: '简历内容控制在1-2页，重点突出，避免冗长' },
+  { title: '目标导向', desc: '根据应聘岗位调整简历内容，突出相关经验' },
+  { title: '量化成果', desc: '使用具体数字展示工作成果，如"提升效率30%"' },
+  { title: '关键词优化', desc: '包含行业关键词，提高简历被搜索到的概率' },
+  { title: '格式规范', desc: '使用标准字体，保持排版整洁，避免错别字' }
+]);
+
+// 常见错误数据
+const warnings = ref([
+  { title: '信息不完整', desc: '确保联系方式、教育经历等重要信息完整' },
+  { title: '夸大事实', desc: '如实描述个人能力，避免过度包装' },
+  { title: '格式混乱', desc: '保持统一的字体、字号和排版风格' },
+  { title: '缺乏针对性', desc: '针对不同岗位调整简历内容' }
+]);
+
+// 开始制作简历
+const startCreateResume = () => {
+  navTo('/packageA/pages/myResume/myResume');
+};
+
+// 查看简历示例
+const viewExampleResume = () => {
+  navTo('/pages/resume-guide/resume-example');
+};
+</script>
+
+<style lang="scss" scoped>
+.resume-guide-container {
+  padding: 32rpx;
+  background: #FFFFFF;
+  min-height: 100vh;
+}
+
+.page-header {
+  text-align: center;
+  margin-bottom: 28rpx;
+  padding: 12rpx 0;
+  
+  .page-title {
+    font-size: 40rpx;
+    font-weight: 600;
+    color: #1A1A1A;
+    margin-bottom: 16rpx;
+  }
+  
+  .page-subtitle {
+    font-size: 28rpx;
+    color: #666666;
+  }
+}
+
+.guide-section {
+  background: #FFFFFF;
+  border-radius: 12rpx;
+  padding: 32rpx 0;
+  margin-bottom: 24rpx;
+  border: 1rpx solid #F0F0F0;
+}
+
+.section-title {
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #1A1A1A;
+  margin-bottom: 24rpx;
+  padding-bottom: 16rpx;
+  border-bottom: 1rpx solid #F0F0F0;
+  padding-left: 20rpx;
+}
+
+.steps-list {
+  .step-card {
+    background: #FFFFFF;
+    // border-radius: 8rpx;
+    padding: 24rpx;
+    border-bottom: 1rpx solid #F0F0F0;
+    margin-bottom: 20rpx;
+    
+    &:last-child {
+      margin-bottom: 0;
+    }
+    
+    .step-header {
+      display: flex;
+      align-items: center;
+      margin-bottom: 12rpx;
+      
+      .step-number {
+        font-size: 24rpx;
+        font-weight: 600;
+        color: #1A1A1A;
+        margin-right: 16rpx;
+        background: #F5F5F5;
+        padding: 4rpx 12rpx;
+        border-radius: 4rpx;
+      }
+      
+      .step-title {
+        font-size: 28rpx;
+        font-weight: 600;
+        color: #1A1A1A;
+      }
+    }
+    
+    .step-desc {
+      font-size: 24rpx;
+      color: #666666;
+      line-height: 1.4;
+    }
+  }
+}
+
+.tips-list, .warnings-list {
+  .tip-item, .warning-item {
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: 24rpx;
+    padding:0 20rpx;
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
+
+.tip-item, .warning-item {
+  .tip-content, .warning-content {
+    flex: 1;
+    
+    .tip-title, .warning-title {
+      font-size: 28rpx;
+      font-weight: 600;
+      color: #1A1A1A;
+      margin-bottom: 8rpx;
+    }
+    
+    .tip-desc, .warning-desc {
+      font-size: 24rpx;
+      color: #666666;
+      line-height: 1.5;
+    }
+  }
+}
+
+.action-buttons {
+  margin-top: 40rpx;
+  padding: 0 20rpx;
+  
+  .primary-button, .secondary-button {
+    height: 88rpx;
+    border-radius: 8rpx;
+    text-align: center;
+    line-height: 88rpx;
+    font-size: 30rpx;
+    font-weight: 500;
+    margin-bottom: 20rpx;
+  }
+  
+  .primary-button {
+    background: #1A1A1A;
+    color: #FFFFFF;
+  }
+  
+  .secondary-button {
+    background: #FFFFFF;
+    color: #1A1A1A;
+    border: 1rpx solid #D9D9D9;
+  }
+}
+
+</style>

pages/service/salary-info.vue

@@ -0,0 +1,12 @@
+<template>
+  <web-view class="salary-info-container" src="https://www.mohrss.gov.cn/SYrlzyhshbzb/laodongguanxi_/fwyd/202506/t20250627_544623.html"></web-view>
+</template>
+
+
+<style lang="scss" scoped>
+.salary-info-container {
+  padding: 30rpx;
+  background: #F5F5F5;
+  min-height: 100vh;
+}
+</style>