pc-metal/src/views/MetalPlate/index.vue

<template>
  <div class="metal_plate_container" id="metal_plate_container">
    <Header />
    <HomeScreen />
    <div class="main_content_wrap">
      <ThreeCard />
      <HeaderLine title="CNC机加工能力" id="cnc" />
      <CncProcess />
      <HeaderLine title="质量检测设备" />
      <CheckEquipment />
      <HeaderLine title="CNC样件" />
      <CncSample />
      <HeaderLine title="手板加工能力" id="hand" />
      <HandPlate />
      <HeaderLine title="钣金加工能力" id="metal" />
      <MetalPlateProcess />
      <HeaderLine title="工厂环境" />
      <FactoryEnvironment />
      <HeaderLine title="合作客户" />
      <Partner />
      <HeaderLine title="不止于此" />
      <LinkCard />
    </div>
    <NewBottomMetal />
  </div>
</template>

<script setup>
import { onMounted } from 'vue'
import NewBottomMetal from 'cpns/MetalPlate/Bottom/NewBottomMetal'
import HomeScreen from 'cpns/MetalPlate/HomeScreen'
import Header from 'cpns/MetalPlate/Header'
import ThreeCard from 'cpns/MetalPlate/ThreeCard'
import HeaderLine from 'cpns/design/HeaderLine'
import Partner from 'cpns/MetalPlate/Partner'
import FactoryEnvironment from 'cpns/MetalPlate/FactoryEnvironment'
import CncProcess from 'cpns/MetalPlate/CncProcess'
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) {
    const element = document.getElementById('metal')
    element.scrollIntoView() // 将元素滚动到可见区域
  }
  if (location.href.indexOf('#cnc') != -1) {
    const element = document.getElementById('cnc')
    element.scrollIntoView() // 将元素滚动到可见区域
  }
  if (location.href.indexOf('#hand-board') != -1) {
    const element = document.getElementById('hand')
    element.scrollIntoView() // 将元素滚动到可见区域
  }
})
</script>

<style lang="scss" scoped>
.metal_plate_container {
  box-sizing: border-box;
  background: #f5f7fd;
  .main_content_wrap {
    padding: 0 245px;
    padding-bottom: 143px;
    padding-top: 28px;
  }
}
</style>