Merge branch 'dev' of https://git.citupro.com/zhengnaiwen_citu/menduner into dev

src/plugins/curtain/components/message.vue

@@ -7,11 +7,11 @@
       :persistent="persistent || false"
     >
       <div class="white-bgc pa-5" style="border-radius: 2px; max-height: 600px; overflow-y: auto;">
-        <div :class="['d-flex', {'flex-column': componentMap[name]}, 'align-center', {'mb-5': componentMap[name]}]">
+        <div :class="['d-flex', {'flex-column': name}, 'align-center', {'mb-5': name}]">
           <!-- 前置图标 -->
           <span
             v-if="icon"
-            :style="{color: iconColor? iconColor : color, fontSize: iconFontSize}"
+            :style="{color: iconColor? iconColor : color, fontSize: iconFontSize + 'px'}"
             :class="[icon]"
             class="ml-2 mr-2"
           ></span>
@@ -21,7 +21,7 @@
         </div>
       </div>
       <div class="text-center mt-3">
-        <span style="color: white; font-size: 28px;" class="mdi mdi-close-circle-outline cursor-pointer" @click="dialog = false"></span>
+        <span style="color: white; font-size: 50px;" class="mdi mdi-close-circle-outline cursor-pointer" @click="dialog = false"></span>
       </div>
     </v-dialog>
   </v-app>
@@ -41,8 +41,8 @@ defineProps({
     default: '450'
   },
   iconFontSize: {
-    type: String,
-    default: '50px'
+    type: [String, Number],
+    default: '50'
   },
   color: {
     type: String,

src/views/headhunting/index.vue

@@ -1,20 +1,90 @@
 <!-- 门墩儿猎寻服务 -->
 <template>
-  <div class="headhunting">
-    <!-- <div class="headhunting-title">高端人才猎寻</div> -->
-    <!-- <div class="headhunting-guidance" @click="showDialog = true">免费咨询</div> -->
-    <!-- <div class="headhunting-content pa-8 py-10">
-      <formItem ref="formRef" ></formItem>
-      <div class="text-center">
-        <v-btn color="#198dff" style="width: 350px;" @click="handleSubmit">提交</v-btn>
+  <div class="default-width">
+    <div class="d-flex align-center" style="position: relative;">
+      <div style="width: 150px; height: 80px;">
+        <v-img src="../../assets/logo.png"  aspect-ratio="16/9" width="150" height="80"></v-img>
       </div>
-    </div> -->
-    
-    <div class="logo-box">
-      <v-img src="../../assets/logo.png"  aspect-ratio="16/9" width="150" height="80"></v-img>
+      <h2 class="ml-10">高端猎寻服务</h2>
+      <div class="highlight-color contact" @click="showDialog = true">联系我们</div>
     </div>
 
-    <v-btn color="primary" size="large" style="width: 200px; position: absolute; right: 20%; bottom: 190px;" @click="showDialog = true">联系门墩儿猎聘</v-btn>
+    <div class="mt-5" style="width: 100%; height: 600px;">
+      <img src="https://minio.citupro.com/dev/menduner/headhunting.jpg">
+    </div>
+
+    <div class="mt-10">
+      <h1 class="text-center highlight-color">公司简介</h1>
+      <div class="d-flex">
+        <div class="text-center" style="margin-right: 50px;">
+          <v-img width="250" height="300" aspect-ratio="16/9" src="https://minio.citupro.com/dev/menduner/ceo.jpg"></v-img>
+          <div>田森先生（Simon Tian）</div>
+        </div>
+        <div style="flex: 1;">
+          <p style="text-indent: 2em; line-height: 2em;" class="mt-5">门墩儿招聘平台（mendunerhr.com）是一家专注于酒店与泛服务业的职业发展与招聘网络平台。该平台由行业资深人士创立，
+            息技术和大数据，为酒店业的高端人才提供职业发展服务，并为企业客户提供人才解决方案和战略建议。以下是对门墩儿招聘平台的详细介绍：</p>
+          <div class="mt-3">
+            <div v-for="(k, i) in introduce" :key="i" class="mb-5">
+              <h3 class="mb-3">{{ k.title }}</h3>
+              <ul v-for="(j, index) in k.children" :key="index">
+                <li>{{ j }}</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 精英猎头用门墩儿猎寻，猎寻优质人选 -->
+    <div class="my-10">
+      <h1 class="text-center highlight-color">精英猎头用门墩儿猎寻，猎寻优质人选</h1>
+      <div class="d-flex mt-3">
+        <v-img src="https://minio.citupro.com/dev/menduner/example.png" contain width="600" height="400"></v-img>
+        <div class="mt-7 ml-10" style="flex: 1">
+          <div v-for="(k, i) in list" :key="i" class="d-flex flex-column align-start mb-7">
+            <h2>{{ k.title }}</h2>
+            <div class="color-999 font-size-15 mt-3">{{ k.desc }}</div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 成功案例 -->
+    <div>
+      <h1 class="text-center highlight-color">门墩儿的成功案例</h1>
+      <div class="mt-5">
+        <div v-for="(k, i) in successCases" :key="i" class="mb-10">
+          <div style="line-height: 2em;">
+            <span class="font-weight-bold">{{ k.title }}</span>
+            {{ k.desc }}
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 和TA们一起 使用门墩儿猎寻招聘吧 -->
+    <div>
+      <h1 class="text-center highlight-color">和TA们一起 使用门墩儿猎寻招聘吧</h1>
+      <v-img src="https://minio.citupro.com/dev/menduner/ad.jpg" contain width="1184" height="300" class="img-ad"></v-img>
+    </div>
+
+    <div class="mt-10 d-flex align-center justify-space-between" style="border-top: 1px solid #ccc; height: 150px;">
+      <div>
+        <div style="width: 150px; height: 80px;">
+          <v-img src="../../assets/logo.png"  aspect-ratio="16/9" width="150" height="80"></v-img>
+        </div>
+      </div>
+      <div class="d-flex">
+        <div>
+          <v-img :width="100" cover aspect-ratio="16/9" src="https://minio.citupro.com/dev/static/mendunerCode.jpg" style="height: 100px;"></v-img>
+          <div class="mt-2" style="text-align: center;">微信公众号</div>
+        </div>
+        <div class="ml-10">
+          <v-img :width="100" cover aspect-ratio="16/9" src="https://minio.citupro.com/dev/menduner/miniProgram.jpg" style="height: 100px;"></v-img>
+          <div class="mt-2" style="text-align: center;">火苗儿小程序</div>
+        </div>
+      </div>
+    </div>
 
     <CtDialog
       :visible="showDialog"
@@ -37,6 +107,59 @@ import { huntSubmit } from '@/api/headhunting'
 import { useI18n } from '@/hooks/web/useI18n'; const { t } = useI18n()
 defineOptions({ name: 'headhunting-index'})
 
+const list = [
+  { title: '高效猎寻人才', desc: '招聘服务：平台只能推荐+猎头顾问精准搜索，高效猎寻' },
+  { title: '拓宽猎企服务', desc: '企业服务：猎企接单+平台接单结合，提供猎头顾问收益' },
+  { title: '高效管理列企', desc: '职位管理、资源管理、数据看板一体的企业管理系统' }
+]
+
+// 公司简介
+const introduce = [
+  {
+    title: '平台背景与定位',
+    children: [
+      '创建背景：门墩儿平台具有有丰富酒店从业经验的田森先生（Simon Tian）一手创办。Simon Tian凭借多年的行业经验和人脉，致力于推动酒店行业的发展，为高端人才和企业用户提供优质的社交平台与专业职场发展服务。',
+      '平台定位：门墩儿是首家面向酒店从业者、酒店雇主和业主的职业发展及招聘网络平台。它不仅服务于酒店业的经理或总监级以上人员，也支持青年英才，为他们提供定制职业规划，助力职业发展。'
+    ]
+  },
+  {
+    title: '服务内容',
+    children: [
+      '招聘服务：门墩儿积极携手酒店管理公司及业主等企业客户，通过名誉顾问委员会和导师委员会，提供人才解决方案和战略建议。平台从庞大的人才储备库中筛选最为匹配的人才，满足企业客户的招聘需求。',
+      '信息整合与发布：门墩儿通过其官方渠道（如微信公众号、网站等），将全国酒店的空缺职位、新任命、新酒店、行业观察等不同方向的信息与分散的资源与需求进行集中整合，成为从业者们了解行业动态、找寻发展机会的贴心资讯与服务平台。'
+    ]
+  },
+  {
+    title: '发展历程与成就',
+    children: [
+      '职业发展服务：门墩儿通过定制职业规划和人才筛选，为酒店行业的高端人才提供职业发展服务。平台汇聚了国内酒店业的资深人士，形成了一个高质量的社交网络，帮助从业者拓展人脉、获取行业资讯和职业发展机会。',
+      '取得成就：过去几年中，门墩儿平台已与多家酒店企业合作，助力了数千名酒店人的职业发展。同时，平台还通过线上及线下的全方位服务，全面覆盖酒店业精英人群，助力企业雇主品牌的不断提升。'
+    ]
+  },
+  {
+    title: '未来发展',
+    children: [
+      '门墩儿平台将继续秉承“酒店人服务酒店人”的理念，稳扎稳打，助力中国酒店人的职业发展。同时，平台还将不断拓展服务领域和范围，为酒店及泛服务业提供更加全面、专业的职业发展与招聘服务。在未来，门墩儿有望成为行业内领先的职业发展与招聘平台之一，为行业的持续发展贡献更多的力量。',
+    ]
+  },
+  {
+    title: '产品服务',
+    children: [
+      '通过战略布局与产品迭代，门墩儿逐渐形成多样化模式为核心，科技赋能的Saas产品矩阵。',
+    ]
+  }
+]
+
+// 成功案例
+const successCases = [
+  { title: '案例背景：', desc: '某知名科技公司（以下简称“A公司”）在快速发展的过程中，遇到了技术领军人才短缺的瓶颈。为了突破这一限制，A公司决定寻求专业的猎头服务，以快速定位并吸引行业内的顶尖技术人才。在众多猎头公司中，A公司选择了以其专业、高效和精准著称的“门墩儿猎头服务”。' },
+  { title: '需求分析：', desc: '门墩儿猎头服务的专业顾问团队首先与A公司的HR团队进行了深入的沟通，详细了解了A公司的企业文化、业务模式、技术需求以及对候选人的具体要求。通过全面的需求分析，确定了猎寻目标为具有丰富行业经验、精通前沿技术、并具备良好团队协作能力的技术总监。' },
+  { title: '市场调研：', desc: '基于需求分析的结果，门墩儿猎头服务启动了广泛的市场调研。他们利用自己强大的人才数据库、行业资源网络和先进的搜索技术，在全国范围内甚至全球范围内搜寻符合A公司要求的候选人。' },
+  { title: '候选人筛选与评估：', desc: '候选人筛选与评估：经过细致的筛选和初步评估，门墩儿猎头服务从众多候选人中挑选出了几位最具潜力的候选人。随后，他们安排了专业的面试评估流程，包括技能测试、行为面试、案例分析等环节，以全面评估候选人的综合素质和与A公司的匹配度。' },
+  { title: '推荐与谈判：', desc: '在确认了几位合适的候选人后，门墩儿猎头服务向A公司提交了详细的候选人推荐报告，并安排了候选人与A公司的直接面谈。在面谈过程中，门墩儿猎头服务的顾问团队全程陪同，提供专业的建议和支持，帮助双方更好地了解彼此。最终，A公司成功录用了其中一位技术总监' },
+  { title: '后续跟进：', desc: '在候选人入职后，门墩儿猎头服务并未停止服务。他们继续与A公司和候选人保持联系，关注候选人的工作表现和发展情况，并提供必要的支持和协助。同时，他们也定期与A公司沟通，收集反馈意见，以便不断优化和改进猎头服务。' },
+]
+
 const showDialog = ref(false)
 
 // 提交
@@ -61,52 +184,26 @@ const handleSubmit = async () => {
 </script>
 
 <style scoped lang="scss">
-.headhunting {
-  position: relative;
+.highlight-color {
+  color: #007eb4;
+}
+// 毛玻璃效果
+.img-ad {  
+  display: block;
   width: 100%;
-  height: 100%;
-  background-image: url('https://minio.citupro.com/dev/menduner/headhunting0826.jpg');
-  background-size: cover;
-  background-position: center;
+  height: auto;
+  filter: blur(2px);
 }
-// .headhunting::before {
-//   content: ""; /* 必须添加，因为伪元素是空的 */
-//   position: absolute; /* 绝对定位，相对于最近的已定位（即非static）祖先元素 */
-//   top: 0; /* 遮罩层顶部与元素顶部对齐 */
-//   left: 0; /* 遮罩层左侧与元素左侧对齐 */
-//   right: 0; /* 遮罩层右侧与元素右侧对齐 */
-//   bottom: 0; /* 遮罩层底部与元素底部对齐 */
-//   background-color: rgba(0, 0, 0, 0.1); /* 遮罩层颜色，半透明黑色 */
-//   // z-index: -1; /* 确保遮罩层在背景图片之下（通常不需要，因为伪元素默认就在内容之下） */
-// }
-.headhunting-title {
+.contact {
   position: absolute;
-  top: 45px;
-  left: 122px;
-  font-size: 24px;
+  right: 0;
+  top: 22px;
   font-weight: bold;
-}
-.headhunting-guidance {
-  position: absolute;
-  top: 45px;
-  right: 200px;
-  font-size: 18px;
-  // color: var(--v-error-base);
-  color: #000;
+  font-size: 24px;
   cursor: pointer;
   text-decoration: underline;
 }
-.headhunting-content {
-  position: absolute;
-  top: 460px;
-  right: 450px;
-  width: 350px;
-  background-color: #fff;
-  border-radius: 5px;
-}
-.logo-box {
-  position: absolute;
-  left: 10%;
-  top: 10px;
+ul li {
+  list-style: none;
 }
 </style>