路径变化

src/components/CustomerService/index.vue

@@ -99,7 +99,7 @@
 </template>
 
 <script setup>
-import CodePng from '@/assets/design/bottom/code1.png'
+import CodePng from '@/assets/design/bottom/code.png'
 import { useRoute } from 'vue-router'
 
 const route = useRoute()

src/components/MetalPlate/Bottom/NewBottomMetal.vue

@@ -38,18 +38,18 @@
               <span>商务咨询：</span>
               <p class="phone">
                 <span>1</span>
-                <span>8</span>
-                <span>7</span>
-                <span>0</span>
-                <span>1</span>
-                <span>0</span>
-                <span>1</span>
-                <span>2</span>
-                <span>6</span>
+                <span>5</span>
                 <span>6</span>
+                <span>2</span>
                 <span>4</span>
+                <span>9</span>
+                <span>6</span>
+                <span>2</span>
+                <span>2</span>
+                <span>9</span>
+                <span>0</span>
               </p>
-              <span>| 佟老师</span>
+              <span>| 杨老师</span>
             </div>
           </div>
         </div>
@@ -58,7 +58,7 @@
           <div class="title">电子邮箱 ｜ E-mail</div>
           <div class="info_text mb">
             <p>商务邮箱：info@iflytop.com</p>
-            <p>招聘邮箱：info@iflytop.com</p>
+            <p>招聘邮箱：hr@iflytop.com</p>
           </div>
           <div class="title">我们的位置 ｜ Position</div>
           <div class="info_text">

src/components/MetalPlate/Bottom/NewBottomWhiteMetal.vue

@@ -38,18 +38,18 @@
               <span>商务咨询：</span>
               <p class="phone">
                 <span>1</span>
-                <span>8</span>
-                <span>7</span>
-                <span>0</span>
-                <span>1</span>
-                <span>0</span>
-                <span>1</span>
-                <span>2</span>
-                <span>6</span>
+                <span>5</span>
                 <span>6</span>
+                <span>2</span>
                 <span>4</span>
+                <span>9</span>
+                <span>6</span>
+                <span>2</span>
+                <span>2</span>
+                <span>9</span>
+                <span>0</span>
               </p>
-              <span>| 佟老师</span>
+              <span>| 杨老师</span>
             </div>
           </div>
         </div>
@@ -58,7 +58,7 @@
           <div class="title">电子邮箱 ｜ E-mail</div>
           <div class="info_text mb">
             <p>商务邮箱：info@iflytop.com</p>
-            <p>招聘邮箱：info@iflytop.com</p>
+            <p>招聘邮箱：hr@iflytop.com</p>
           </div>
           <div class="title">我们的位置 ｜ Position</div>
           <div class="info_text">

src/components/MetalPlate/LinkCard/index.vue

@@ -0,0 +1,139 @@
+<template>
+  <div class="link_card_container">
+    <div class="card mr" @click="toPage('/')">
+      <img class="bg_img" :src="BG" alt="" />
+      <div class="modal">
+        <h1 class="title">整机开发</h1>
+        <div class="btn">
+          <p class="text">立即前往</p>
+          <img :src="Arrow" class="icon" alt="" />
+        </div>
+        <p class="en">Complete machine</p>
+      </div>
+    </div>
+    <div class="card" @click="toPage('/pc/hardware')">
+      <img class="bg_img" :src="BG" alt="" />
+      <div class="modal">
+        <h1 class="title">软硬件定制</h1>
+        <div class="btn">
+          <p class="text">立即前往</p>
+          <img :src="Arrow" class="icon" alt="" />
+        </div>
+        <p class="en">Hardware</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import BG from '@/assets/design/link/1.png'
+import Arrow from '@/assets/design/link/arrow.png'
+import { useRouter, useRoute } from 'vue-router'
+
+const router = useRouter()
+const route = useRoute()
+
+const toPage = (path, p) => {
+  window.location.href = `http://iflytop.com${path}`
+}
+</script>
+
+<style lang="scss" scoped>
+@keyframes btnAnimation {
+  0% {
+    transform: translateX(0);
+  }
+  25% {
+    transform: translateX(25px);
+  }
+  75% {
+    transform: translateX(-25px);
+  }
+  100% {
+    transform: translateX(0);
+  }
+}
+
+.link_card_container {
+  padding: 0 190px;
+  padding-bottom: 120px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  .card {
+    flex: 1;
+    height: 420px;
+    position: relative;
+    cursor: pointer;
+    .bg_img {
+      width: 100%;
+      height: auto;
+      object-fit: cover;
+    }
+    .modal {
+      position: absolute;
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(0, 0, 0, 0.86);
+      padding-left: 98px;
+      box-sizing: border-box;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: flex-start;
+      .title {
+        font-family: AlibabaPuHuiTi;
+        font-size: 76px;
+        font-weight: bold;
+        line-height: normal;
+        letter-spacing: 0.06em;
+        color: #f6f6f6;
+      }
+      .btn {
+        margin-top: 18px;
+        margin-bottom: 20px;
+        border-radius: 324px;
+        padding: 11px 24px;
+        background: #2a4ee1;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        .text {
+          font-family: Source Han Sans CN;
+          font-size: 16px;
+          font-weight: normal;
+          line-height: normal;
+          letter-spacing: 0.1em;
+          color: #ffffff;
+          margin-right: 15px;
+        }
+        .icon {
+          width: 19px;
+          height: 4px;
+        }
+      }
+      .en {
+        font-family: Poppins;
+        font-size: 30px;
+        font-weight: 500;
+        line-height: normal;
+        letter-spacing: 0em;
+        color: #ffffff;
+      }
+    }
+    &:hover {
+      .modal {
+        .btn {
+          animation-name: btnAnimation;
+          animation-duration: 1s;
+        }
+      }
+    }
+  }
+  .mr {
+    margin-right: 20px;
+  }
+}
+</style>

src/views/MetalPlate/index.vue

@@ -18,6 +18,8 @@
       <FactoryEnvironment />
       <HeaderLine title="合作客户" />
       <Partner />
+      <HeaderLine title="不止于此" />
+      <LinkCard />
     </div>
     <NewBottomMetal />
   </div>
@@ -37,6 +39,7 @@ import CheckEquipment from 'cpns/MetalPlate/CheckEquipment'
 import CncSample from 'cpns/MetalPlate/CncSample'
 import HandPlate from 'cpns/MetalPlate/HandPlate'
 import MetalPlateProcess from 'cpns/MetalPlate/MetalPlateProcess'
+import LinkCard from 'cpns/MetalPlate/LinkCard'
 
 onMounted(() => {
   if (location.href.indexOf('#sheet-metal') != -1) {