maochaoying 2 years ago
parent
commit
aabe0b7cb1
  1. BIN
      src/assets/img/case/8.png
  2. BIN
      src/assets/img/contract/ditu.png
  3. 26
      src/style.scss
  4. 68
      src/views/Index/components/CasePictureList/index.vue
  5. 2
      src/views/Index/components/ContactUs/index.vue
  6. 2
      src/views/Index/components/MechanicalControl/index.vue

BIN
src/assets/img/case/8.png

Before

Width: 307  |  Height: 171  |  Size: 58 KiB

BIN
src/assets/img/contract/ditu.png

After

Width: 826  |  Height: 276  |  Size: 44 KiB

26
src/style.scss

@ -11,18 +11,18 @@ body {
width: 100%;
}
@font-face {
font-family: 'ZonaPro';
src: url(./assets/fonts/ZonaPro-ExtraBold.otf);
}
@font-face {
font-family: 'SourceHanSansLight';
src: url(./assets/fonts/SourceHanSansCN-ExtraLight.otf);
}
@font-face {
font-family: 'SourceHanSans';
src: url(./assets/fonts/SourceHanSansCN-Normal.otf);
}
// @font-face {
// font-family: 'ZonaPro';
// src: url(./assets/fonts/ZonaPro-ExtraBold.otf);
// }
// @font-face {
// font-family: 'SourceHanSansLight';
// src: url(./assets/fonts/SourceHanSansCN-ExtraLight.otf);
// }
// @font-face {
// font-family: 'SourceHanSans';
// src: url(./assets/fonts/SourceHanSansCN-Normal.otf);
// }
/*去除a标签下划线*/
a {
text-decoration: none;
@ -123,7 +123,7 @@ body {
right: 0 !important;
left: 90vw !important;
bottom: 90px !important;
width: 52px !important;
width: 68px !important;
.swiper-pagination-bullet {
width: 5px;
height: 5px;

68
src/views/Index/components/CasePictureList/index.vue

@ -59,44 +59,30 @@
<div class="pic_list">
<div class="scroll_container_case mb4" id="scroll_container_case_1">
<ul>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A1" alt="" /></li>
<li><img class="pic" :src="A2" alt="" /></li>
<li><img class="pic" :src="A3" alt="" /></li>
<li><img class="pic" :src="A4" alt="" /></li>
<li><img class="pic" :src="A5" alt="" /></li>
<li><img class="pic" :src="A6" alt="" /></li>
</ul>
</div>
<div class="scroll_container_case mb4" id="scroll_container_case_2">
<ul>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A7" alt="" /></li>
<li><img class="pic" :src="A8" alt="" /></li>
<li><img class="pic" :src="A9" alt="" /></li>
<li><img class="pic" :src="A10" alt="" /></li>
<li><img class="pic" :src="A11" alt="" /></li>
</ul>
</div>
<div class="scroll_container_case" id="scroll_container_case_3">
<ul>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A" alt="" /></li>
<li><img class="pic" :src="A12" alt="" /></li>
<li><img class="pic" :src="A13" alt="" /></li>
<li><img class="pic" :src="A14" alt="" /></li>
<li><img class="pic" :src="A15" alt="" /></li>
<li><img class="pic" :src="A16" alt="" /></li>
</ul>
</div>
<p class="zhezhao_right"></p>
@ -110,7 +96,22 @@
import Back from '@/assets/img/case/biaotiback.png'
import CountTo from 'cpns/CountTo'
import { ref, onMounted } from 'vue'
import A from '@/assets/img/case/8.png'
import A1 from '@/assets/img/case/anli1.png'
import A2 from '@/assets/img/case/anli2.png'
import A3 from '@/assets/img/case/anli3.png'
import A4 from '@/assets/img/case/anli4.png'
import A5 from '@/assets/img/case/anli5.png'
import A6 from '@/assets/img/case/anli6.png'
import A7 from '@/assets/img/case/anli7.png'
import A8 from '@/assets/img/case/anli8.png'
import A9 from '@/assets/img/case/anli9.png'
import A10 from '@/assets/img/case/anli10.png'
import A11 from '@/assets/img/case/anli11.png'
import A12 from '@/assets/img/case/anli12.png'
import A13 from '@/assets/img/case/anli13.png'
import A14 from '@/assets/img/case/anli14.png'
import A15 from '@/assets/img/case/anli15.png'
import A16 from '@/assets/img/case/anli16.png'
// Import Swiper Vue.js components
import { Swiper, SwiperSlide } from 'swiper/vue'
import { Autoplay } from 'swiper'
@ -158,6 +159,7 @@ const showEmpty = ref(false)
height: 100vh;
background: $common_bg;
position: relative;
overflow: hidden;
.case_picture_list_container {
width: 100%;
height: 100%;
@ -236,7 +238,7 @@ const showEmpty = ref(false)
right: 70px;
bottom: 0px;
width: 163px;
height: 200%;
height: 150%;
background: url(../../../../assets/img/case/zhezhao.png) no-repeat;
background-size: 100% 100%;
}
@ -246,7 +248,7 @@ const showEmpty = ref(false)
top: 0;
bottom: 0;
width: 163px;
height: 200%;
height: 150%;
transform: rotate(180deg);
background: url(../../../../assets/img/case/zhezhao.png) no-repeat;
background-size: 100% 100%;

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

@ -229,6 +229,8 @@ onMounted(() => {
flex: 1;
box-shadow: 0px 7px 24px 0px rgba(7, 7, 72, 0.05);
border-radius: 10px;
background: url(../../../../assets/img/contract/ditu.png) no-repeat;
background-size: 100% 100%;
}
}
.circle {

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

@ -54,8 +54,8 @@
</div>
</div>
<div class="right_img">
<img :src="Q1" class="img" alt="" />
<img :src="Q2" class="img" alt="" />
<img :src="Q1" class="img" alt="" />
</div>
</div>
</div>

Loading…
Cancel
Save