首页

src/components/HeadLine.vue

@@ -51,14 +51,13 @@ const props = defineProps({
   display: flex;
   flex-direction: column;
   align-items: center;
-  padding: 18px 0;
+  padding: 26px 0;
   box-sizing: border-box;
   .title_h2 {
-    font-size: 18px;
+    font-size: 21px;
     font-family: Source Han Sans CN;
     font-weight: 500;
     color: #191919;
-    margin-bottom: 10px;
     display: flex;
     align-items: center;
   }

src/components/SubNavigation.vue

@@ -12,6 +12,7 @@
         <p class="icon"></p>
       </div>
       <div class="btn_wrap">
+        <div class="btn" @click="toPage('/')">首页</div>
         <div class="btn" @click="toPage('/company')">公司简介</div>
         <div class="btn" @click="toPage('/case-show')">案例展示</div>
         <div class="btn" @click="toPage('/contact')">联系我们</div>

src/components/Top.vue

@@ -4,7 +4,11 @@
       istop && isFirstSwiper ? 'top_container' : 'top_container container_bg'
     "
   >
-    <img class="newlogo" :src="newpage ? NewLogo : NewLogo2" alt="" />
+    <img
+      class="newlogo"
+      :src="newpage ? NewLogo : hardLogo ? HardLogo2 : NewLogo2"
+      alt=""
+    />
     <img
       class="fold_icon"
       :src="istop && isFirstSwiper ? Icon : Icon1"
@@ -47,6 +51,7 @@ import NewLogo from '@/static/img/banner/newlogo.png'
 import NewLogo2 from '@/static/img/banner/newlogo2.png'
 import Icon from '@/static/img/banner/liebiao.png'
 import Icon1 from '@/static/img/banner/liebiao2.png'
+import HardLogo2 from '@/static/img/newpage/hard_logo.png'
 import Logo1 from '@/static/img/banner/logo2.png'
 import { useRouter, useRoute } from 'vue-router'
 const route = useRoute()
@@ -59,6 +64,9 @@ const props = defineProps({
   newpage: {
     type: Boolean,
   },
+  hardLogo: {
+    type: Boolean,
+  },
 })
 
 const openDrawer = () => {

src/pages/Hardware.vue

@@ -1,18 +1,37 @@
 <template>
   <div class="hardware_container">
-    <div class="top_wrap"><Top /></div>
+    <div class="top_wrap"><Top :hardLogo="true" /></div>
     <img :src="Home1" class="bg" alt="" />
     <Card :caseList="getData()" />
+    <HeadLine title="专家" themeTitle="电机控制" />
+    <div class="img_wrap">
+      <img :src="Dian" class="img" alt="" />
+      <div class="gif_wrap">
+        <img :src="Gif2" class="left_img" alt="" />
+        <img :src="SAccelerate" class="right_img" alt="" />
+      </div>
+      <div class="gif_wrap">
+        <img :src="Gif1" class="left_img" alt="" />
+        <img :src="TAccelerate" class="right_img" alt="" />
+      </div>
+    </div>
     <img :src="Home2" class="bg" alt="" />
+    <img :src="Home5" class="bg" alt="" />
   </div>
 </template>
 
 <script setup>
 import Top from 'cpns/Top'
 import HeadLine from 'cpns/HeadLine'
-import Home1 from '@/static/img/newpage/home1.png'
+import Dian from '@/static/img/hardware/dianji.png'
+import Home1 from '@/static/img/newpage/home3.png'
+import SAccelerate from '@/static/img/hardware/s-accelerate.png'
+import TAccelerate from '@/static/img/hardware/t-accelerate.png'
 import Home2 from '@/static/img/newpage/home4.png'
+import Home5 from '@/static/img/newpage/home5.png'
 import Card from 'cpns/Card'
+import Gif1 from '@/static/img/hardware/1.gif'
+import Gif2 from '@/static/img/hardware/2.gif'
 import { caseList, hardCaseList } from '@/mock'
 import { useRoute } from 'vue-router'
 const route = useRoute()
@@ -31,6 +50,24 @@ const getData = () => {
   overflow: hidden;
   padding-bottom: 12px;
   background: #f6f6f6;
+  .img_wrap {
+    padding: 0 7px;
+    .gif_wrap {
+      display: flex;
+      align-items: center;
+      margin-bottom: 5px;
+      border-radius: 3px;
+      overflow: hidden;
+      .left_img {
+        width: 133px;
+        height: 67px;
+      }
+      .right_img {
+        width: 63%;
+        height: 67px;
+      }
+    }
+  }
   .top_wrap {
     position: absolute;
     left: 0;
@@ -44,5 +81,9 @@ const getData = () => {
     width: 100vw;
     height: auto;
   }
+  .img {
+    width: 100%;
+    height: auto;
+  }
 }
 </style>