maochaoying 2 years ago
parent
commit
ea631d5873
  1. 6
      src/components/TopNav/index.vue
  2. 5
      src/views/Index/components/Cooperation/index.vue
  3. 4
      src/views/Index/components/Culture/Card/index.vue
  4. 1
      src/views/Index/components/Recruit/index.vue
  5. 33
      src/views/Index/components/Service/Card/index.vue
  6. 14
      src/views/Index/components/Service/index.vue
  7. 2
      src/views/Index/components/SoftHardwareDetail/Card/index.vue
  8. 2
      src/views/Index/components/SoftHardwareSummary/index.vue

6
src/components/TopNav/index.vue

@ -13,9 +13,7 @@
<li :class="getActiveClass([5, 6, 7, 8])" @click="scrollToPage(5)"> <li :class="getActiveClass([5, 6, 7, 8])" @click="scrollToPage(5)">
软硬件研发 软硬件研发
</li> </li>
<li :class="getActiveClass([10, 11])" @click="scrollToPage(10)">
结构开发
</li>
<li :class="getActiveClass([11])" @click="scrollToPage(11)">结构开发</li>
<li :class="getActiveClass([13])" @click="scrollToPage(13)">企业文化</li> <li :class="getActiveClass([13])" @click="scrollToPage(13)">企业文化</li>
<li :class="getActiveClass([14])" @click="scrollToPage(14)">加入我们</li> <li :class="getActiveClass([14])" @click="scrollToPage(14)">加入我们</li>
<li :class="getActiveClass([16])" @click="scrollToPage(16)">联系我们</li> <li :class="getActiveClass([16])" @click="scrollToPage(16)">联系我们</li>
@ -43,7 +41,7 @@ const getActiveClass = index => {
const scrollToPage = index => { const scrollToPage = index => {
// //
swiperStore.swiper.slideTo(index, 1000, false)
swiperStore.swiper.slideTo(index, 0, false)
if (index == 3) { if (index == 3) {
setTimeout(() => { setTimeout(() => {
countStore.countAdd() countStore.countAdd()

5
src/views/Index/components/Cooperation/index.vue

@ -130,7 +130,6 @@ const showEmpty = ref(true)
.cooperation_container { .cooperation_container {
width: 100%; width: 100%;
height: 100%; height: 100%;
// background: $common_bg;
position: absolute; position: absolute;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -301,8 +300,8 @@ const showEmpty = ref(true)
} }
} }
.img_wrap:hover { .img_wrap:hover {
background: rgba(0, 0, 0, 0.2);
transform: scale(1.04);
// background: rgba(0, 0, 0, 0.2);
transform: scale(1.1);
} }
} }
} }

4
src/views/Index/components/Culture/Card/index.vue

@ -103,7 +103,7 @@ const getTips = () => {
box-sizing: border-box; box-sizing: border-box;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
height: 100%; height: 100%;
padding: 46px 45px 100px 45px;
padding: 36px 45px 90px 45px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
@ -169,7 +169,7 @@ const getTips = () => {
color: #ffffff; color: #ffffff;
position: absolute; position: absolute;
word-break: break-all; word-break: break-all;
top: 235px;
top: 215px;
writing-mode: vertical-lr; writing-mode: vertical-lr;
letter-spacing: 3px; letter-spacing: 3px;
} }

1
src/views/Index/components/Recruit/index.vue

@ -132,6 +132,7 @@ const showEmpty = ref(true)
color: #646a73; color: #646a73;
font-family: 'SourceHanSansLight'; font-family: 'SourceHanSansLight';
letter-spacing: 2px; letter-spacing: 2px;
animation-duration: 0.5s;
} }
} }
.content { .content {

33
src/views/Index/components/Service/Card/index.vue

@ -1,22 +1,26 @@
<template> <template>
<div :class="getClassName()"> <div :class="getClassName()">
<div class="alpha">
<div :class="noBtn ? 'alpha noani' : 'alpha ani'">
<div class="wrapo"> <div class="wrapo">
<p class="title">{{ title }}</p> <p class="title">{{ title }}</p>
<p class="en">{{ title_en }}</p> <p class="en">{{ title_en }}</p>
</div> </div>
<div id="service_liji_btn" class="btn" @click="toPage()">立即探索</div>
<div id="service_liji_btn" class="btn" @click="toPage()" v-if="!noBtn">
立即探索
</div>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { useSwiperStore } from '@/store'
import { useSwiperStore, useCountStore } from '@/store'
const countStore = useCountStore()
const swiperStore = useSwiperStore() const swiperStore = useSwiperStore()
const props = defineProps({ const props = defineProps({
title: String, title: String,
i: String, i: String,
title_en: String, title_en: String,
noBtn: Boolean,
}) })
const getClassName = () => { const getClassName = () => {
if (props.i == '1') { if (props.i == '1') {
@ -45,13 +49,13 @@ const toPage = () => {
index = 3 index = 3
} }
if (props.i == '2') { if (props.i == '2') {
index = 10
index = 11
} }
if (props.i == '3') { if (props.i == '3') {
index = 5 index = 5
} }
if (props.i == '4') { if (props.i == '4') {
index = 8
index = 5
} }
if (props.i == '5') { if (props.i == '5') {
index = 11 index = 11
@ -59,7 +63,18 @@ const toPage = () => {
if (props.i == '6') { if (props.i == '6') {
index = 12 index = 12
} }
swiperStore.swiper.slideTo(index, 1000, false)
swiperStore.swiper.slideTo(index, 0, false)
if (index == 3) {
setTimeout(() => {
countStore.countAdd()
})
}
if (index == 5) {
setTimeout(() => {
countStore.countAddI()
})
}
//
} }
</script> </script>
@ -144,7 +159,7 @@ const toPage = () => {
background-size: 100% 100%; background-size: 100% 100%;
} }
.alpha:hover {
.ani:hover {
background-color: #283fe7; background-color: #283fe7;
padding: 55px 0; padding: 55px 0;
opacity: 0.8; opacity: 0.8;
@ -153,4 +168,8 @@ const toPage = () => {
top: 56%; top: 56%;
} }
} }
.noani:hover {
background-color: #283fe7;
opacity: 0.8;
}
</style> </style>

14
src/views/Index/components/Service/index.vue

@ -29,8 +29,18 @@
<Card title="结构设计" title_en="STRUCTURAL DESIGN" i="2" /> <Card title="结构设计" title_en="STRUCTURAL DESIGN" i="2" />
<Card title="硬件研发" title_en="HARDWARE DEVELOPMENT" i="4" /> <Card title="硬件研发" title_en="HARDWARE DEVELOPMENT" i="4" />
<Card title="软件研发" title_en="SOFTWARE DEVELOPMENT" i="3" /> <Card title="软件研发" title_en="SOFTWARE DEVELOPMENT" i="3" />
<Card title="样机制作" title_en="PROTOTYPE PRODUCTION" i="5" />
<Card title="产品量产" title_en="VOLUME PRODUCTION" i="6" />
<Card
title="样机制作"
:noBtn="true"
title_en="PROTOTYPE PRODUCTION"
i="5"
/>
<Card
title="产品量产"
:noBtn="true"
title_en="VOLUME PRODUCTION"
i="6"
/>
</div> </div>
<div class="bottom_container" id="bottom_container"> <div class="bottom_container" id="bottom_container">
<p id="bottom_font_save">Save 30%</p> <p id="bottom_font_save">Save 30%</p>

2
src/views/Index/components/SoftHardwareDetail/Card/index.vue

@ -94,7 +94,7 @@ const getImgSrc = () => {
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
flex-direction: column; flex-direction: column;
padding: 26px 0 0 0;
// padding: 26px 0 0 0;
box-sizing: border-box; box-sizing: border-box;
transition-property: all; transition-property: all;
transition-duration: 0.4s; transition-duration: 0.4s;

2
src/views/Index/components/SoftHardwareSummary/index.vue

@ -331,7 +331,7 @@ const showEmpty = ref(true)
} }
} }
.img_card_wrap_grid:hover { .img_card_wrap_grid:hover {
background: rgba(0, 0, 0, 0.3);
// background: rgba(0, 0, 0, 0.3);
img { img {
transform: scale(1.1); transform: scale(1.1);
} }

Loading…
Cancel
Save