Browse Source

工厂展示

master
maochaoying 2 years ago
parent
commit
bc578e6471
  1. 31
      src/App.vue
  2. 10
      src/components/Cooperation.vue
  3. 1
      src/components/SubNavigation.vue
  4. 1
      src/components/Top.vue
  5. 23
      src/pages/Factory.vue
  6. 20
      src/pages/Hardware.vue
  7. 27
      src/pages/index.vue
  8. 2
      src/router/index.js
  9. BIN
      src/static/img/cooperate/total.jpg
  10. BIN
      src/static/img/factory/bg.jpg

31
src/App.vue

@ -1,7 +1,32 @@
<script setup></script>
<script setup>
import { ref } from 'vue'
import Bottom from 'cpns/Bottom'
const isDrag = ref(false)
const handlePress = e => {
//
isDrag.value = true
}
const handleRelease = e => {
//
isDrag.value = false
}
</script>
<template>
<router-view></router-view>
<div
class="app_container"
v-touch:press="handlePress"
v-touch:release="handleRelease"
>
<router-view></router-view>
<Bottom :isDrag="isDrag" />
</div>
</template>
<style scoped></style>
<style scoped lang="scss">
.app_container {
margin-bottom: $bottom-height;
}
</style>

10
src/components/Cooperation.vue

@ -9,7 +9,8 @@
:theme="theme"
/>
</div>
<div class="client_wrap">
<img :src="Total" alt="" class="total_img" />
<!-- <div class="client_wrap">
<div class="card">
<img :src="A1" alt="" class="img1" />
</div>
@ -32,12 +33,13 @@
<div class="card bg1"><img :src="A18" alt="" class="img18" /></div>
<div class="card"><img :src="A19" alt="" class="img19" /></div>
<div class="card bg1"><img :src="A20" alt="" class="img20" /></div>
</div>
</div> -->
</div>
</template>
<script setup>
import HeadLine from 'cpns/HeadLine'
import Total from '@/static/img/cooperate/total.jpg'
import A1 from '@/static/img/cooperate/cooperate1.png'
import A2 from '@/static/img/cooperate/cooperate2.png'
import A3 from '@/static/img/cooperate/cooperate3.png'
@ -71,6 +73,10 @@ const props = defineProps({
.header_wrap {
background: #fff;
}
.total_img {
width: 100vw;
height: auto;
}
.client_wrap {
display: grid;
grid-template-columns: repeat(4, 1fr);

1
src/components/SubNavigation.vue

@ -16,6 +16,7 @@
<div class="btn" @click="toPage('/case-show')">案例展示</div>
<div class="btn" @click="toPage('/contact')">联系我们</div>
<div class="btn" @click="toPage('/recruit')">招贤纳士</div>
<div class="btn" @click="toPage('/factory')">工厂展示</div>
<div class="btn" @click="toPage('/hardware')">软硬件研发</div>
<!-- <div class="btn" @click="toPage('/product')">产品研发</div> -->
</div>

1
src/components/Top.vue

@ -28,6 +28,7 @@
<div class="btn" @click="toPage('/case-show')">案例展示</div>
<div class="btn" @click="toPage('/contact')">联系我们</div>
<div class="btn" @click="toPage('/recruit')">招贤纳士</div>
<div class="btn" @click="toPage('/factory')">工厂展示</div>
<div class="btn" @click="toPage(`${isHard ? '/' : '/hardware'}`)">
{{ isHard ? '工业设计' : '软硬件研发' }}
</div>

23
src/pages/Factory.vue

@ -0,0 +1,23 @@
<template>
<div class="factory_container">
<SubNavigation title="公司简介" />
<img class="fac_img" :src="Fac" alt="" />
</div>
</template>
<script setup>
import SubNavigation from 'cpns/SubNavigation'
import Fac from '@/static/img/factory/bg.jpg'
</script>
<style lang="scss">
.factory_container {
padding-top: $sub-header-height;
background: #fff;
overflow: hidden;
.fac_img {
width: 100vw;
height: auto;
}
}
</style>

20
src/pages/Hardware.vue

@ -1,9 +1,5 @@
<template>
<div
class="hardware_home_container"
v-touch:press="handlePress"
v-touch:release="handleRelease"
>
<div class="hardware_home_container">
<Swiper page="hardware" />
<CaseShow />
<div class="img_wrap">
@ -36,7 +32,6 @@
</div>
<AboutUs />
<Cooperation />
<Bottom :isDrag="isDrag" />
</div>
</template>
@ -56,24 +51,11 @@ import SAccelerate from '@/static/img/hardware/s-accelerate.png'
import TAccelerate from '@/static/img/hardware/t-accelerate.png'
import Gif1 from '@/static/img/hardware/1.gif'
import Gif2 from '@/static/img/hardware/2.gif'
import { ref } from 'vue'
const isDrag = ref(false)
const handlePress = e => {
//
isDrag.value = true
}
const handleRelease = e => {
//
isDrag.value = false
}
</script>
<style lang="scss" scoped>
.hardware_home_container {
background: #f5f5f5;
margin-bottom: $bottom-height;
max-width: 100vw;
overflow: hidden;
.img_wrap {

27
src/pages/index.vue

@ -1,9 +1,5 @@
<template>
<div
class="home_container"
v-touch:press="handlePress"
v-touch:release="handleRelease"
>
<div class="home_container">
<Swiper />
<CaseShow />
<Hardware />
@ -14,7 +10,6 @@
<!-- <News /> -->
<Cooperation />
<Awards />
<Bottom :isDrag="isDrag" />
</div>
</template>
@ -29,24 +24,22 @@ import OneStop from 'cpns/OneStop'
import News from 'cpns/News'
import Cooperation from 'cpns/Cooperation'
import Awards from 'cpns/Awards'
import Bottom from 'cpns/Bottom'
import { ref } from 'vue'
const isDrag = ref(false)
// const isDrag = ref(false)
const handlePress = e => {
//
isDrag.value = true
}
const handleRelease = e => {
//
isDrag.value = false
}
// const handlePress = e => {
// //
// isDrag.value = true
// }
// const handleRelease = e => {
// //
// isDrag.value = false
// }
</script>
<style lang="scss" scoped>
.home_container {
margin-bottom: $bottom-height;
background: #f5f5f5;
max-width: 100vw;
overflow: hidden;

2
src/router/index.js

@ -9,6 +9,7 @@ const CaseShow = () => import('@/pages/CaseShow')
const Product = () => import('@/pages/Product')
const Hardware = () => import('@/pages/Hardware')
const QRCode = () => import('@/pages/QRCode')
const Factory = () => import('@/pages/Factory')
// 配置路由信息
const routes = [
@ -22,6 +23,7 @@ const routes = [
{ path: '/product', component: Product },
{ path: '/hardware', component: Hardware },
{ path: '/code', component: QRCode },
{ path: '/factory', component: Factory },
]
const router = createRouter({

BIN
src/static/img/cooperate/total.jpg

After

Width: 1080  |  Height: 1350  |  Size: 471 KiB

BIN
src/static/img/factory/bg.jpg

After

Width: 1080  |  Height: 2032  |  Size: 2.0 MiB

Loading…
Cancel
Save