猎聘

package-lock.json

@@ -1,5 +1,5 @@
 {
-  "name": "门墩招聘小程序",
+  "name": "menduner-uniapp-recruit",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {

pages.json

@@ -258,6 +258,24 @@
 					"style": {
 						"navigationBarTitleText": "我的分享码"
 					}
+				},
+				{
+					"path": "headhunting/index",
+					"style": {
+						"navigationBarTitleText": "门墩儿猎头"
+					}
+				},
+				{
+					"path": "headhunting/pages/details",
+					"style": {
+						"navigationBarTitleText": "门墩儿猎头资质"
+					}
+				},
+				{
+					"path": "headhunting/pages/service",
+					"style": {
+						"navigationBarTitleText": "我们的服务"
+					}
 				}
 			]
 		}

pages/index/position.vue

@@ -115,7 +115,7 @@ const filterList = ref([
 ])
 
 const gridList = [
-  { label: '门墩儿猎头', icon: '/static/img/headhunting.png', path: '' },
+  { label: '门墩儿猎头', icon: '/static/img/headhunting.png', path: '/pagesB/headhunting/index' },
   { label: '精选企业', icon: '/static/img/enterprise.png', path: '/pagesB/recommendEnterprise/index' },
   { label: '酒店英语', icon: '/static/img/group.png', path: '' },
   { label: '早报资讯', icon: '/static/img/information.png', id: 'morningNews' },

pagesB/headhunting/components/nav.vue

@@ -0,0 +1,107 @@
+<template>
+  <view class="main-top">
+    <view class="main-top-nav">
+      <view class="main-top-nav-logo">
+        <image
+          src="https://minio.citupro.com/dev/menduner/poster.png"
+          mode="aspectFill"
+        />
+        <view class="gun"></view>
+        <text>中国</text>
+      </view>
+      <view class="main-top-nav-title">
+        <uni-icons :type="show ? 'closeempty' : 'bars'" color="#FFF" size="30" @tap="handleShow"/>
+      </view>
+    </view>
+    <view class="panel" :class="{active: show}">
+      <uni-list>
+        <uni-list-item class="panel-item" showArrow title="我们的服务" @tap="handleTo('/pagesB/headhunting/pages/service')" />
+        <uni-list-item class="panel-item" showArrow title="候选人" @tap="handleClick('/pages/index/position')"/>
+        <uni-list-item class="panel-item" showArrow title="联系我们" />
+      </uni-list>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+const show = ref(false)
+
+
+const handleShow = () => {
+  show.value = !show.value
+}
+
+const handleClick = (path) => {
+  uni.switchTab({ url: path })
+}
+
+const handleTo = (path) => {
+  uni.navigateTo({ url: path })
+}
+</script>
+
+<style lang="scss" scoped>
+$rootColor: #00695c;
+.main-top {
+  position: sticky;
+  top: 0;
+  background: $rootColor;
+  z-index: 999;
+  &-nav {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    height: 120rpx;
+    padding: 10rpx 20rpx;
+    box-sizing: border-box;
+    &-logo {
+      // width: 300rpx;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      .gun {
+        height: 75rpx;
+        width: 6rpx;
+        background: #fff;
+        margin: 0 20rpx;
+      }
+      text {
+        color: #fff;
+        font-size: 32rpx;
+        font-weight: 600;
+      }
+      image {
+        width: 180rpx;
+        height: 75rpx;
+        // margin-bottom: 12rpx;
+      }
+    }
+
+    &-title {
+      height: 100%;
+      display: flex;
+      align-items: center;
+      color: #fff;
+    }
+    
+  }
+}
+.panel {
+  overflow: hidden;
+  height: 0;
+  transition: all 0.3s;
+  &.active {
+    height: auto;
+  }
+  &-item {
+    
+  }
+}
+:deep(.uni-list-item) {
+  background: #000 !important;
+  background-color: #000 !important;
+}
+
+</style>

pagesB/headhunting/index.vue

@@ -0,0 +1,257 @@
+<template>
+  <view class="main">
+    <Nav></Nav>
+    <view class="main-header">
+      <!-- <uni-title type="h1" align="center" title="门墩儿猎头"></uni-title> -->
+      <view>我们深知卓越的领导力是企业业绩增长的关键。我们专注于为企业提供精准的人才洞见，助力企业在人才招聘、培养和晋升方面做出明智选择，从而优化高管团队的整体表现，推动企业持续发展。</view>
+    </view>
+    <view class="main-panel">
+        <view class="box" v-for="item in list" :key="item.title">
+          <text class="top">{{ item.title }}</text>
+          {{ item.desc }}
+        </view>
+      </view>
+    <view class="main-nav">
+      <view class="main-nav-item" v-for="item in service" :key="item.id" @tap="handleToDetails(item.id)">{{ item.title }}</view>
+    </view>
+    <view class="main-body">
+      <view>
+        <view class="title">依托在高管寻聘和领导力咨询方面的深厚专业知识，我们的顾问可进行跨行业、跨部门和跨地区的合作，以便更好地服务我们的客户。 我们帮助组织寻找和培养优秀的领导者，提高团队效力，支持战略或文化转型。</view>
+        <uni-title type="h1" title="我们的顾问" align="center"></uni-title>
+        <swiper
+          class="swiper"
+          circular
+          :indicator-dots="true"
+          :autoplay="true"
+          :interval="2000"
+          :duration="500"
+        >
+          <swiper-item v-for="item in consultant" :key="item.id">
+            <view class="swiper-item">
+              <image
+                :src="item.avatar"
+                mode="heightFix"
+              />
+              <text>{{ item.enName }}</text>
+            </view>
+          </swiper-item>
+        </swiper>
+      </view>
+      <view>
+        <uni-title type="h1" title="我们的办公地点" align="center"></uni-title>
+        <view class="main-body-office">
+          <view v-for="item in countryOffice" :key="item.name" class="main-body-office-item">
+            <image
+              :src="item.url"
+              mode="widthFix"
+            />
+            <view class="text">{{ item.name }}</view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <uni-title type="h1" title="联系我们" align="center"></uni-title>
+    <view class="main-footer">
+      <uni-title type="h3" title="欢迎关注，了解门墩儿的新动态。"></uni-title>
+      <view class="subTitle">门墩儿在所有主流社交媒体都有账号。欢迎关注我们，以便了解关于发展趋势和领导力问题的最新见解。</view>
+      <view class="main-footer-contact">
+        <view class="main-footer-contact-item"><text>猎头顾问</text>：姚嘉庆 Julia Yao</view>
+        <view class="main-footer-contact-item"><text>邮箱</text>：Julia.yao@menduner.com</view>
+        <view class="main-footer-contact-item"><text>手机</text>：18501626969</view>
+        <view class="qr">
+          <image
+            src="https://minio.citupro.com/dev/menduner/official-account-code4.jpg"
+            mode="scaleToFill"
+          />
+          <view class="subTitle">关注menduner公众号</view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+<!-- 猎头 -->
+<script setup>
+import Nav from './components/nav'
+// import { ref }  from 'vue'
+const consultant = [
+  { country: '苏州', enName: '田森博士（Simon Tian）', id: 'simon', avatar: 'https://minio.citupro.com/dev/menduner/consultant/simon.png' },
+  { country: '北京', enName: '潘青海先生（Peter Pan）', id: 'peter', avatar: 'https://minio.citupro.com/dev/menduner/consultant/peter.png' },
+  { country: '北京', enName: '姚嘉庆女士（Julia Yao）', id: 'julia', avatar: 'https://minio.citupro.com/dev/menduner/consultant/julie.png' }
+]
+// 数值示例
+const list = [
+  { title: '1500家+', desc: '服务企业' },
+  { title: '70%', desc: '拥有本科及以上学历人群' },
+  { title: '12种', desc: '涉及行业' }
+]
+// 服务
+const service = [
+  { title: '高级管理精英甄选', id: 'selection-senior-management-elite' },
+  { title: '人才发展储备策略', id: 'talent-development-reserve-strategy' },
+  { title: '管理者能力提升方案', id: 'manager-capability-enhancement-plan' },
+  { title: '卓越成长轨迹', id: 'excellent-growth-trajectory' },
+  { title: '高管信誉与资质验证', id: 'senior-management-elite-verification' },
+  { title: '多样化的人才网络', id: 'diversified-talent-network' }
+]
+// 办公地点
+const countryOffice = [
+  { name: '苏州', desc: '苏州识喜识谊信息科技有限公司', url: 'https://minio.menduner.com/dev/menduner/suzhou.png' },
+  { name: '北京', desc: '苏州识喜识谊信息科技有限公司', url: 'https://minio.menduner.com/dev/menduner/beijin.png' },
+  { name: '广州', desc: '苏州识喜识谊信息科技有限公司', url: 'https://minio.menduner.com/dev/menduner/guangzhou.png' }
+]
+const handleToDetails = (id) => {
+  uni.navigateTo({
+    url: `/pagesB/headhunting/pages/details?type=${id}`
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+$rootColor: #00695c;
+.main {
+  
+  &-header {
+    width: 100%;
+    height: 300rpx;
+    background: url('https://minio.menduner.com/dev/menduner/banner.png') no-repeat;
+    background-position: center;
+    background-size: 100% 100%;
+    font-weight: 600;
+    font-size: 24rpx;
+    color: #FFF;
+    text-align: center;
+    padding: 0 40rpx;
+    line-height: 46rpx;
+    box-sizing: border-box;
+    position: relative;
+    display: flex;
+    align-items: center;
+    
+  }
+  &-panel {
+    margin: 20px 0;
+    height: 80rpx;
+    width: 100%;
+    // background: rgba(255, 255, 255, 0.5);
+    color: $rootColor;
+    // position: absolute;
+    // bottom: 0;
+    // left: 0;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 20rpx;
+    margin: 20rpx 0;
+    .box {
+      flex: 1;
+      display: flex;
+      justify-content: center;
+      flex-direction: column;
+      font-weight: 600;
+      align-items: center;
+      .top {
+        font-size: 40rpx;
+      }
+    }
+  }
+  &-nav {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-around;
+    padding-top: 20rpx;
+    margin: 20px 0;
+    &-item {
+      width: 30%;
+      font-size: 20rpx;
+      color: $rootColor;
+      border: 1px solid $rootColor;
+      padding: 20rpx 0;
+      margin-bottom: 20rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+
+  &-body {
+    margin: 20px 0;
+    .title {
+      padding: 40rpx 30rpx;
+      text-align: center;
+      font-size: 24rpx;
+      background: rgba(0,0,0,.1);
+      color: $rootColor;
+    }
+    .swiper {
+      height: 600rpx;
+      &-item {
+        display: flex;
+        flex-direction: column;
+        // justify-content: center;
+        align-items: center;
+      }
+    }
+    &-office {
+      display: flex;
+      justify-content: space-around;
+      &-item {
+        width: 30%;
+        position: relative;
+        image {
+          width: 100%;
+        }
+        .text {
+          position: absolute;
+          top: 0;
+          left: 0;
+          width: 100%;
+          height: 100%;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          background: rgba(76, 76, 78, 0.6);
+          font-size: 36rpx;
+          font-weight: 600;
+          color: #FFF;
+        }
+      }
+    }
+  }
+  &-footer {
+    width: 100%;
+    padding: 20rpx;
+    box-sizing: border-box;
+    background: #e8f0f7;
+    .subTitle {
+      font-size: 24rpx;
+      margin-bottom: 20rpx;
+      line-height: 40rpx;
+      color: #666;
+    }
+    &-contact {
+      &-item {
+        margin-bottom: 20rpx;
+        text {
+          display: inline-block;
+          width: 140rpx;
+          text-align-last: justify;
+        }
+      }
+      
+    }
+    .qr {
+      image {
+        width: 240rpx;
+        height: 240rpx;
+        margin-bottom: 10rpx;
+      }
+      width: 100%;
+      display: flex;
+      justify-content: center;
+      flex-direction: column;
+      align-items: center;
+      margin-top: 20rpx;
+    }
+  }
+}
+</style>

pagesB/headhunting/pages/details.vue

@@ -0,0 +1,13 @@
+<template>
+  <view>
+
+  </view>
+</template>
+
+<script setup>
+
+</script>
+
+<style lang="scss" scoped>
+
+</style>

pagesB/headhunting/pages/service.vue

@@ -0,0 +1,131 @@
+<template>
+  <view>
+    <Nav></Nav>
+    <view class="banner">
+      <text>Menduner aids corporate development through the strategy of precision talent selection.</text>
+    </view>
+    
+    <view class="box">
+      <uni-title type="h1" title="我们的服务" align="center"></uni-title>
+      <view class="subTitle">
+        我们深知卓越的领导力是企业业绩增长的关键。我们专注于为企业提供精准的人才洞见，助力企业在人才招聘、培养和晋升方面做出明智选择，从而优化高管团队的整体表现，推动企业持续发展。
+      </view>
+      <view class="box-main">
+        <view v-for="item in service" :key="item.id" class="content">
+          <uni-title type="h4" :title="item.title"></uni-title>
+          <view class="subTitle">{{ item.desc }}</view>
+        </view>
+      </view>
+    </view>
+    <view class="box">
+      <view v-for="item in list" :key="item.title">
+        <uni-title type="h1" :title="item.title" align="center"></uni-title>
+        <view class="subTitle mb-3"> {{ item.desc }} </view>
+        <view class="subTitle mb-3"> {{ item.subDesc }} </view>
+        <view class="tapBox">
+          <text v-for="_item in item.items" :key="_item.id" class="tap">{{ _item.title }} </text>
+        </view>
+      </view>
+      
+    </view>
+  </view>
+</template>
+
+<script setup>
+import Nav from '../components/nav'
+// 我们的服务
+const service = [
+  { title: '高级管理精英甄选 >>', desc: '我们有能力挖掘具备卓越领导力、深远战略眼光及高效执行能力的行业翘楚。', active: false, id: 'selection-senior-management-elite' },
+  { title: '人才发展储备策略 >>', desc: '我们能协助企业构建系统化的人才培养与储备体系，确保组织持续拥有适应未来发展的高素质人才梯队。', id: 'talent-development-reserve-strategy' },
+  { title: '管理者能力提升方案 >>', desc: '我们将根据管理者的能力制定个性化提升方案，聚焦领导力、决策力与团队管理能力等综合提升，以实战培训与持续发展计划为核心。', id: 'manager-capability-enhancement-plan' },
+  { title: '卓越成长轨迹 >>', desc: '酒店职业经理人在持续学习、勇于挑战与不断自我超越中所展现出的非凡成长历程与成就路径。', active: false, id: 'excellent-growth-trajectory' },
+  { title: '高管信誉与资质验证 >>', desc: '是确保企业高层管理者具备专业能力、诚信品质与合法资质的综合评估过程。', active: false, id: 'senior-management-elite-verification' },
+  { title: '多样化的人才网络 >>', desc: '我们是人力资源一体化平台，涵盖不同背景、技能与经验的人才资源库，促进企业创新与多元化发展。', active: false, id: 'diversified-talent-network' }
+]
+const list = [
+  {
+    title: '我们服务的行业 - 酒店业',
+    desc: '我们致力于为酒店行业领域提供深度与广度兼具的服务，全面覆盖了酒店集团总部、业主公司、连锁酒店及公寓，以及单体酒店等多个关键层面。这不仅体现了对酒店行业多元化生态的深刻理解，更彰显了我们对于满足不同客户需求、推动行业发展的坚定承诺。',
+    subDesc: '我们全方位服务于酒店行业的多个细分领域，致力于为客户提供专业、高效且个性化的服务。我们坚信通过努力与付出将能够为酒店行业的繁荣发展贡献一份力量。',
+    items: [
+      { title: '酒店集团总部', id: 'hotel-group-headquarters' },
+      { title: '业主公司', id: 'owner-company' },
+      { title: '连锁酒店及公寓', id: 'chain-hotels-and-apartments' },
+      { title: '单体酒店', id: 'single-hotel' }
+    ]
+  },
+  {
+    title: '我们服务的行业 - 泛服务业',
+    desc: '在泛服务业的广阔天地里，我们正以前所未有的热情与智慧，推动着一系列关键领域的革新与进步。这些领域，包括新餐饮、邮轮产业、高端民宿、旅游及地产、体育与休闲业、会展业、医院与博物馆等，共同织就了一幅多元化高品质的服务业生态画卷。',
+    subDesc: '泛服务业的各个领域正以蓬勃的姿态，推动着经济的繁荣和社会的进步。未来，随着科技的不断进步和消费者需求的日益多样化，泛服务业将继续迎来新的发展机遇和挑战，我们期待着在这一广阔的舞台上，共同书写更加辉煌的篇章。',
+    items: [
+      { title: '新餐饮', id: 'new-catering' },
+      { title: '高端民宿', id: 'high-end-cottage' },
+      { title: '高端康养', id: 'high-end-consumption' },
+      { title: '会展业', id: 'exhibition-industry' },
+      { title: '游轮产业', id: 'cruise-industry' },
+      { title: '旅游及地产', id: 'tourism-and-real-estate' },
+      { title: '体育与休闲业', id: 'sports-and-leisure-industry' },
+      { title: '医院与博物馆', id: 'hospital-and-museum' }
+    ]
+  }
+]
+
+</script>
+
+<style lang="scss" scoped>
+
+$rootColor: #00695c;
+.mb-3 {
+  margin-bottom: 30rpx;
+}
+.banner {
+  width: 100%;
+  height: 400rpx;
+  line-height: 40rpx;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 40rpx;
+  box-sizing: border-box;
+  color: #fff;
+  background-image: url(https://minio.citupro.com/dev/menduner/headhunting/service-bg.jpg);
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  background-position: center center;
+  font-family: FFScalaSansWebBold, Georgia, Utopia, Charter, sans-serif;
+  font-style: normal;
+}
+.box {
+  padding: 20rpx;
+  &-main {
+    padding: 20rpx;
+    
+    .content {
+      background: #f5f5f5;
+      padding: 0 20rpx 20rpx 20rpx;
+      margin-bottom: 20rpx;
+    }
+  }
+}
+.subTitle {
+  padding: 0 20rpx;
+  font-size: 24rpx;
+  margin-bottom: 20rpx;
+  line-height: 40rpx;
+  color: #666;
+}
+.tapBox {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
+  padding-bottom: 30rpx;
+}
+.tap {
+  color: $rootColor;
+  font-size: 28rpx;
+  padding: 10rpx;
+  display: inline-block;
+}
+</style>