Skip to content

W
wanyou_website
Commit 7723e50f by yang
Options

提交

parent 86966886
Showing with 19 additions and 926 deletions
src/components/HeaderNav.vue
...@@ -99,17 +99,6 @@ export default { ...@@ -99,17 +99,6 @@ export default {
hideDropdown() { hideDropdown() {
this.showDropdown = false this.showDropdown = false
}, },
// 切换移动端菜单
toggleMobileMenu() {
// 可以在这里添加移动端菜单逻辑
console.log('切换移动端菜单')
},
// 导航到指定路由
navigateTo(route) {
this.$router.push(route)
}
} }
} }
</script> </script>
......
src/views/Case.vue
...@@ -166,18 +166,14 @@ ...@@ -166,18 +166,14 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 使用Footer组件 -->
<Footer/>
</div> </div>
</template> </template>
<script> <script>
import Footer from '@/components/Footer.vue'
import HeroSection from '@/components/HeroSection.vue' import HeroSection from '@/components/HeroSection.vue'
import SecondHeader from '../components/second_header.vue'; import SecondHeader from '../components/second_header.vue';
export default { export default {
components: { components: {
Footer,
HeroSection, HeroSection,
SecondHeader SecondHeader
}, },
......
src/views/Cooperation.vue
...@@ -55,23 +55,23 @@ ...@@ -55,23 +55,23 @@
<div class="section_2 flex-col"> <div class="section_2 flex-col">
<div class="group_8 flex-row justify-between"> <div class="group_8 flex-row justify-between">
<img class="label_3" <img class="label_3"
src="https://lanhu-oss-proxy.lanhuapp.com/9ae0c50708d3811f546921825a2d3fa6"/> src="@/assets/cooperation/image_1.png"/>
<span class="text_11">核心优势</span> <span class="text_11">核心优势</span>
</div> </div>
<div class="group_9 flex-row justify-between"> <div class="group_9 flex-row justify-between">
<div class="image-text_4 flex-row"> <div class="image-text_4 flex-row">
<div class="image-text_5 flex-row justify-between"> <div class="image-text_5 flex-row justify-between">
<img class="image_11" <img class="image_11"
src="https://lanhu-oss-proxy.lanhuapp.com/6202bb94663b19ad6c2ac2468bd6b114"/> src="@/assets/cooperation/image_2.png"/>
<span <span
class="paragraph_2">永久产权：设备归购买方所有，无后续租金压力，长期收益最大化。<br/>高利润回报：单次服务收费500-2000元（视项目而定），按日均5客测算，年营收可达90万+，回本周期约1.5年。</span> class="paragraph_2">永久产权：设备归购买方所有，无后续租金压力，长期收益最大化。<br/>高利润回报：单次服务收费500-2000元（视项目而定），按日均5客测算，年营收可达90万+，回本周期约1.5年。</span>
</div> </div>
<img class="image_12" <img class="image_12"
src="https://lanhu-oss-proxy.lanhuapp.com/daaba6c1e2f4f6d83dc5db4dff83814b"/> src="@/assets/cooperation/image_3.png"/>
</div> </div>
<div class="image-text_6 flex-row justify-between"> <div class="image-text_6 flex-row justify-between">
<img class="image_13" <img class="image_13"
src="https://lanhu-oss-proxy.lanhuapp.com/ecadedb43eb3002d18a6f8e9cd666549"/> src="@/assets/cooperation/image_4.png"/>
<span class="text-group_4">增值服务溢价：可搭配健康管理套餐（如检测+调理+跟踪服务），提升客单价30%以上。</span> <span class="text-group_4">增值服务溢价：可搭配健康管理套餐（如检测+调理+跟踪服务），提升客单价30%以上。</span>
</div> </div>
</div> </div>
...@@ -81,34 +81,30 @@ ...@@ -81,34 +81,30 @@
<div class="section_3 flex-col"> <div class="section_3 flex-col">
<div class="block_1 flex-row justify-between"> <div class="block_1 flex-row justify-between">
<img class="label_4" <img class="label_4"
src="https://lanhu-oss-proxy.lanhuapp.com/2930710b3c35396711d7365cfc8cd7aa"/> src="@/assets/cooperation/image_5.png"/>
<span class="text_12">政策支持</span> <span class="text_12">政策支持</span>
</div> </div>
<div class="block_2 flex-row"> <div class="block_2 flex-row">
<div class="image-text_7 flex-row justify-between"> <div class="image-text_7 flex-row justify-between">
<img class="image_14" <img class="image_14"
src="https://lanhu-oss-proxy.lanhuapp.com/165d2d27cb2ce1fcd37fab6e20412891"/> src="@/assets/cooperation/image_6.png"/>
<span class="text-group_5">采购5台以上享9折优惠，赠送AI健康管理系统</span> <span class="text-group_5">采购5台以上享9折优惠，赠送AI健康管理系统</span>
</div> </div>
<img class="image_15" <img class="image_15"
src="https://lanhu-oss-proxy.lanhuapp.com/b2c1c3375eed6c0ec48ef279fc14314a"/> src="@/assets/cooperation/image_7.png"/>
<span class="text_13">免费提供市场推广方案及标准化运营培训</span> <span class="text_13">免费提供市场推广方案及标准化运营培训</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- 使用Footer组件替代重复的页脚代码 -->
<Footer/>
</div> </div>
</template> </template>
<script> <script>
import Footer from '@/components/Footer.vue'
import HeroSection from '@/components/HeroSection.vue' import HeroSection from '@/components/HeroSection.vue'
import SecondHeader from '../components/second_header.vue'; import SecondHeader from '../components/second_header.vue';
export default { export default {
components: { components: {
Footer,
HeroSection, HeroSection,
SecondHeader SecondHeader
}, },
...@@ -125,126 +121,11 @@ export default { ...@@ -125,126 +121,11 @@ export default {
.page { .page {
position: relative; position: relative;
width: 100vw; width: 100vw;
height: 194.07vw; height: 170vw;
overflow: hidden; overflow: hidden;
} }
.group_1 {
position: relative;
width: 100vw;
background: url(https://lanhu-oss-proxy.lanhuapp.com/207a3c6f31a38b69fd78f7c87ca142e3) 100% no-repeat;
background-size: 100% 100%;
}
.group_2 {
height: 51.05vw;
background: url(https://lanhu-oss-proxy.lanhuapp.com/2b7f9140ab9837f16056fcf9cf5c0d69) 100% no-repeat;
background-size: 100% 100%;
width: 100vw;
}
.group_3 {
width: 94.8vw;
height: 4.95vw;
margin: 0.93vw 0 0 2.6vw;
}
.image_1 {
width: 6.25vw;
height: 4.95vw;
}
.text_1 {
width: 40.11vw;
height: 1.05vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.04vw;
font-family: OPPOSans-M;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 3.75vw;
margin: 1.92vw 0 0 4.68vw;
}
.label_1 {
width: 1.67vw;
height: 1.67vw;
margin: 1.66vw 0 0 42.08vw;
}
.text-wrapper_1 {
width: 76.25vw;
height: 4.28vw;
margin: 16.25vw 0 0 13.48vw;
}
.text_2 {
width: 28.75vw;
height: 3.03vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 4.16vw;
font-family: Gilroy-Bold;
font-weight: 700;
text-align: left;
white-space: nowrap;
line-height: 3.75vw;
}
.paragraph_1 {
width: 40.99vw;
height: 4.28vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.87vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: left;
line-height: 2.19vw;
}
.text-wrapper_2 {
width: 7.4vw;
height: 1.83vw;
margin: 0.52vw 0 0 13.43vw;
}
.text_3 {
width: 7.4vw;
height: 1.83vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.87vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 2.19vw;
}
.image-wrapper_1 {
width: 0.27vw;
height: 3.08vw;
margin: 1.56vw 0 0 13.54vw;
}
.image_2 {
width: 0.27vw;
height: 3.08vw;
}
.group_4 {
width: 86.46vw;
height: 5.21vw;
margin: 12.44vw 0 0 13.54vw;
}
.group_5 { .group_5 {
width: 100vw;
height: 124.85vw;
margin-bottom: 18.18vw;
} }
.box_2 { .box_2 {
...@@ -265,7 +146,6 @@ export default { ...@@ -265,7 +146,6 @@ export default {
rgba(0, 199, 218, 1) 100%, rgba(0, 199, 218, 1) 100%,
rgba(0, 199, 218, 1) 100%); rgba(0, 199, 218, 1) 100%);
width: 14.8vw; width: 14.8vw;
height: 2.45vw;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(0, 82, 217, 1); color: rgba(0, 82, 217, 1);
font-size: 2.5vw; font-size: 2.5vw;
...@@ -273,14 +153,11 @@ export default { ...@@ -273,14 +153,11 @@ export default {
font-weight: 700; font-weight: 700;
text-align: left; text-align: left;
white-space: nowrap; white-space: nowrap;
line-height: 1.57vw;
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} }
.text_9 { .text_9 {
width: 22.66vw;
height: 1.67vw;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(67, 67, 67, 1); color: rgba(67, 67, 67, 1);
font-size: 1.66vw; font-size: 1.66vw;
...@@ -288,7 +165,6 @@ export default { ...@@ -288,7 +165,6 @@ export default {
font-weight: normal; font-weight: normal;
text-align: left; text-align: left;
white-space: nowrap; white-space: nowrap;
line-height: 1.57vw;
margin-top: 2.35vw; margin-top: 2.35vw;
} }
...@@ -318,7 +194,7 @@ export default { ...@@ -318,7 +194,7 @@ export default {
.box_4 { .box_4 {
height: 20.84vw; height: 20.84vw;
background: url(https://lanhu-oss-proxy.lanhuapp.com/67a493082695a3f58d67ef6c72d55695) 0vw -0.89vw no-repeat; background: url(@/assets/cooperation/bg_1.png) 0vw -0.89vw no-repeat;
background-size: 75.78vw 21.71vw; background-size: 75.78vw 21.71vw;
width: 72.92vw; width: 72.92vw;
} }
...@@ -407,7 +283,7 @@ export default { ...@@ -407,7 +283,7 @@ export default {
.section_2 { .section_2 {
height: 20.84vw; height: 20.84vw;
background: url(https://lanhu-oss-proxy.lanhuapp.com/c8c632c3bb1a2a7c478843472c5e1b5d) 0vw -0.89vw no-repeat; background: url(@/assets/cooperation/bg_2.png) 0vw -0.89vw no-repeat;
background-size: 75.78vw 21.71vw; background-size: 75.78vw 21.71vw;
width: 72.92vw; width: 72.92vw;
} }
...@@ -509,7 +385,7 @@ export default { ...@@ -509,7 +385,7 @@ export default {
.section_3 { .section_3 {
height: 20.84vw; height: 20.84vw;
background: url(https://lanhu-oss-proxy.lanhuapp.com/e0e75443e13f44edccc9ae79a6925133) 0vw -0.89vw no-repeat; background: url(@/assets/cooperation/bg_3.png) 0vw -0.89vw no-repeat;
background-size: 75.78vw 21.71vw; background-size: 75.78vw 21.71vw;
width: 72.92vw; width: 72.92vw;
} }
...@@ -587,140 +463,4 @@ export default { ...@@ -587,140 +463,4 @@ export default {
line-height: 1.67vw; line-height: 1.67vw;
margin-left: 1.15vw; margin-left: 1.15vw;
} }
.group_10 {
position: absolute;
left: 0;
top: 175.84vw;
width: 100vw;
height: 18.23vw;
background: url(https://lanhu-oss-proxy.lanhuapp.com/eb515c59a85f9cf5047b65e709c0acc9) 100% no-repeat;
background-size: 100% 100%;
justify-content: flex-center;
}
.box_7 {
width: 34.85vw;
height: 8.91vw;
margin: 4.68vw 0 0 13.48vw;
}
.text_14 {
width: 6.88vw;
height: 1.15vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.14vw;
font-family: MicrosoftYaHei-Bold;
font-weight: 700;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
margin-left: 0.06vw;
}
.text_15 {
width: 30.11vw;
height: 0.84vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.83vw;
font-family: MicrosoftYaHei-Semibold;
font-weight: 600;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
margin-top: 1.15vw;
}
.text-wrapper_4 {
width: 16.25vw;
height: 1.15vw;
margin: 2.65vw 0 0 0.1vw;
}
.text_16 {
width: 4.54vw;
height: 1.15vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.14vw;
font-family: MicrosoftYaHei-Bold;
font-weight: 700;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
}
.text_17 {
width: 2.3vw;
height: 1.15vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.14vw;
font-family: MicrosoftYaHei-Bold;
font-weight: 700;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
}
.text-wrapper_5 {
width: 34.8vw;
height: 0.84vw;
margin: 1.14vw 0 0 0.05vw;
}
.text_18 {
width: 9.8vw;
height: 0.84vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.83vw;
font-family: MicrosoftYaHei-Semibold;
font-weight: 600;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
}
.text_19 {
width: 20.84vw;
height: 0.84vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.83vw;
font-family: MicrosoftYaHei-Semibold;
font-weight: 600;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
}
.paragraph_3 {
width: 7.5vw;
height: 2.19vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.93vw;
font-family: MicrosoftYaHei-Bold;
font-weight: 700;
text-align: right;
line-height: 1.25vw;
margin: 8.02vw 0 0 20.41vw;
}
.image_16 {
width: 8.86vw;
height: 8.86vw;
margin: 4.68vw 13.54vw 0 1.35vw;
}
.image_17 {
position: absolute;
left: 79.43vw;
top: -2.6vw;
width: 5.21vw;
height: 5.21vw;
}
</style> </style>
\ No newline at end of file
src/views/Product.vue
...@@ -134,12 +134,9 @@ ...@@ -134,12 +134,9 @@
<span class="text_35">*&nbsp;注:内容参考科普文献，效果因人而异，不做任何医疗承诺。</span> <span class="text_35">*&nbsp;注:内容参考科普文献，效果因人而异，不做任何医疗承诺。</span>
</div> </div>
</div> </div>
<!-- 使用Footer组件 -->
<Footer/>
</div> </div>
</template> </template>
<script setup> <script setup>
import Footer from '@/components/Footer.vue'
import SecondHeader from '../components/second_header.vue'; import SecondHeader from '../components/second_header.vue';
</script> </script>
<style src="./common.css"/> <style src="./common.css"/>
......
src/views/Serve.vue
...@@ -177,18 +177,14 @@ ...@@ -177,18 +177,14 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 使用Footer组件替代重复的页脚代码 -->
<Footer/>
</div> </div>
</template> </template>
<script> <script>
import Footer from '@/components/Footer.vue'
import HeroSection from '@/components/HeroSection.vue' import HeroSection from '@/components/HeroSection.vue'
import SecondHeader from '../components/second_header.vue'; import SecondHeader from '../components/second_header.vue';
export default { export default {
components: { components: {
Footer,
HeroSection, HeroSection,
SecondHeader SecondHeader
}, },
......
src/views/agent.vue
...@@ -132,18 +132,14 @@ ...@@ -132,18 +132,14 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 使用Footer组件替代重复的页脚代码 -->
<Footer/>
</div> </div>
</template> </template>
<script> <script>
import Footer from '@/components/Footer.vue'
import HeroSection from '@/components/HeroSection.vue' import HeroSection from '@/components/HeroSection.vue'
import SecondHeader from '../components/second_header.vue'; import SecondHeader from '../components/second_header.vue';
export default { export default {
components: { components: {
Footer,
HeroSection, HeroSection,
SecondHeader SecondHeader
}, },
...@@ -160,18 +156,10 @@ export default { ...@@ -160,18 +156,10 @@ export default {
.page { .page {
position: relative; position: relative;
width: 100vw; width: 100vw;
height: 159.9vw; height: 140vw;
overflow: hidden; overflow: hidden;
} }
.box_1 {
position: relative;
width: 100vw;
height: 159.9vw;
background: url(@/assets/agent/bg_1.png) 100% no-repeat;
background-size: 100% 100%;
}
.block_3 { .block_3 {
width: 100vw; width: 100vw;
height: 90.68vw; height: 90.68vw;
...@@ -196,7 +184,6 @@ export default { ...@@ -196,7 +184,6 @@ export default {
rgba(0, 199, 218, 1) 100%, rgba(0, 199, 218, 1) 100%,
rgba(0, 199, 218, 1) 100%); rgba(0, 199, 218, 1) 100%);
width: 12.4vw; width: 12.4vw;
height: 2.4vw;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(0, 82, 217, 1); color: rgba(0, 82, 217, 1);
font-size: 2.5vw; font-size: 2.5vw;
...@@ -204,14 +191,12 @@ export default { ...@@ -204,14 +191,12 @@ export default {
font-weight: 700; font-weight: 700;
text-align: left; text-align: left;
white-space: nowrap; white-space: nowrap;
line-height: 1.57vw;
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} }
.text_9 { .text_9 {
width: 22.04vw; width: 22.04vw;
height: 1.83vw;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(67, 67, 67, 1); color: rgba(67, 67, 67, 1);
font-size: 1.66vw; font-size: 1.66vw;
...@@ -219,8 +204,7 @@ export default { ...@@ -219,8 +204,7 @@ export default {
font-weight: normal; font-weight: normal;
text-align: left; text-align: left;
white-space: nowrap; white-space: nowrap;
line-height: 1.57vw; margin-top: 1.33vw;
margin-top: 2.45vw;
} }
.box_3 { .box_3 {
......
src/views/lease.vue
...@@ -100,18 +100,14 @@ ...@@ -100,18 +100,14 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 使用Footer组件替代重复的页脚代码 -->
<Footer/>
</div> </div>
</template> </template>
<script> <script>
import Footer from '@/components/Footer.vue'
import HeroSection from '@/components/HeroSection.vue' import HeroSection from '@/components/HeroSection.vue'
import SecondHeader from '../components/second_header.vue'; import SecondHeader from '../components/second_header.vue';
export default { export default {
components: { components: {
Footer,
HeroSection, HeroSection,
SecondHeader SecondHeader
}, },
...@@ -128,234 +124,10 @@ export default { ...@@ -128,234 +124,10 @@ export default {
.page { .page {
position: relative; position: relative;
width: 100vw; width: 100vw;
height: 194.07vw; height: 170vw;
overflow: hidden; overflow: hidden;
} }
.group_1 {
position: relative;
width: 100vw;
height: 194.07vw;
background: url(@/assets/lease/bg_1.png) 100% no-repeat;
background-size: 100% 100%;
}
.section_1 {
width: 100vw;
height: 51.05vw;
background: url(@/assets/lease/merge_bg.png) 100% no-repeat;
background-size: 100% 100%;
}
.image_1 {
width: 6.25vw;
height: 4.95vw;
margin: 0.93vw 0 0 2.6vw;
}
.box_1 {
width: 40.21vw;
height: 30.53vw;
margin: 2.86vw 0 0 4.58vw;
}
.text_1 {
width: 40.11vw;
height: 1.05vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.04vw;
font-family: OPPOSans-M;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 3.75vw;
margin-left: 0.11vw;
}
.text_2 {
width: 28.75vw;
height: 3.03vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 4.16vw;
font-family: Gilroy-Bold;
font-weight: 700;
text-align: left;
white-space: nowrap;
line-height: 3.75vw;
margin: 18.22vw 0 0 0.05vw;
}
.text_3 {
width: 7.4vw;
height: 1.83vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.87vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 2.19vw;
margin-top: 1.78vw;
}
.image_2 {
width: 0.27vw;
height: 3.08vw;
margin: 1.56vw 0 0 0.1vw;
}
.box_2 {
height: 51.05vw;
background: url(@/assets/lease/bg_2.png) 100% no-repeat;
background-size: 100% 100%;
margin-left: 2.61vw;
width: 43.75vw;
position: relative;
}
.image-wrapper_1 {
width: 1.67vw;
height: 1.67vw;
margin: 2.6vw 0 0 39.47vw;
}
.label_1 {
width: 1.67vw;
height: 1.67vw;
}
.text-wrapper_1 {
width: 40.99vw;
height: 4.28vw;
margin: 17.86vw 0 24.63vw -7.5vw;
}
.paragraph_1 {
width: 40.99vw;
height: 4.28vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.87vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: left;
line-height: 2.19vw;
}
.group_2 {
position: absolute;
left: -42.7vw;
top: 45.84vw;
width: 86.46vw;
height: 5.21vw;
background: url(@/assets/lease/bg_3.png) 100% no-repeat;
background-size: 100% 100%;
}
.text_4 {
width: 9.28vw;
height: 1.57vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.56vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: center;
white-space: nowrap;
line-height: 2.19vw;
margin: 1.82vw 0 0 4.47vw;
}
.text-wrapper_2 {
height: 5.21vw;
background: url(@/assets/lease/bg_4.png) 100% no-repeat;
background-size: 100% 100%;
margin-left: 4.54vw;
width: 18.23vw;
}
.text_5 {
width: 9.28vw;
height: 1.57vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.56vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: center;
white-space: nowrap;
line-height: 2.19vw;
margin: 1.82vw 0 0 4.42vw;
}
.text_6 {
width: 7.77vw;
height: 1.57vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.56vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: center;
white-space: nowrap;
line-height: 2.19vw;
margin: 1.82vw 0 0 5.2vw;
}
.image_3 {
width: 0.06vw;
height: 2.3vw;
margin: 1.45vw 0 0 5.15vw;
}
.text_7 {
width: 7.71vw;
height: 1.52vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.56vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: center;
white-space: nowrap;
line-height: 2.19vw;
margin: 1.87vw 0 0 5.26vw;
}
.image_4 {
width: 0.06vw;
height: 2.3vw;
margin: 1.45vw 0 0 5.2vw;
}
.image-text_1 {
width: 4.38vw;
height: 1.05vw;
margin: 2.03vw 2.6vw 0 6.56vw;
}
.text-group_1 {
width: 2.56vw;
height: 0.73vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.93vw;
font-family: Gilroy-Medium;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 2.19vw;
margin-top: 0.21vw;
}
.thumbnail_1 {
width: 0.94vw;
height: 1.05vw;
}
.section_2 { .section_2 {
width: 100vw; width: 100vw;
height: 124.85vw; height: 124.85vw;
...@@ -380,7 +152,6 @@ export default { ...@@ -380,7 +152,6 @@ export default {
rgba(0, 199, 218, 1) 100%, rgba(0, 199, 218, 1) 100%,
rgba(0, 199, 218, 1) 100%); rgba(0, 199, 218, 1) 100%);
width: 14.8vw; width: 14.8vw;
height: 2.45vw;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(0, 82, 217, 1); color: rgba(0, 82, 217, 1);
font-size: 2.5vw; font-size: 2.5vw;
...@@ -388,14 +159,11 @@ export default { ...@@ -388,14 +159,11 @@ export default {
font-weight: 700; font-weight: 700;
text-align: left; text-align: left;
white-space: nowrap; white-space: nowrap;
line-height: 1.57vw;
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} }
.text_9 { .text_9 {
width: 22.66vw;
height: 1.67vw;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(67, 67, 67, 1); color: rgba(67, 67, 67, 1);
font-size: 1.66vw; font-size: 1.66vw;
...@@ -403,7 +171,6 @@ export default { ...@@ -403,7 +171,6 @@ export default {
font-weight: normal; font-weight: normal;
text-align: left; text-align: left;
white-space: nowrap; white-space: nowrap;
line-height: 1.57vw;
margin-top: 2.35vw; margin-top: 2.35vw;
} }
......
src/views/operator.vue
...@@ -44,34 +44,30 @@ ...@@ -44,34 +44,30 @@
<img class="image_6" src="@/assets/operator/main_image.png"/> <img class="image_6" src="@/assets/operator/main_image.png"/>
</div> </div>
</div> </div>
<!-- 使用Footer组件替代重复的页脚代码 -->
<Footer/>
</div> </div>
</template> </template>
<script> <script>
import Footer from '@/components/Footer.vue'
import HeroSection from '@/components/HeroSection.vue' import HeroSection from '@/components/HeroSection.vue'
import SecondHeader from '../components/second_header.vue'; import SecondHeader from '../components/second_header.vue';
export default { export default {
components: { components: {
Footer,
HeroSection, HeroSection,
SecondHeader SecondHeader
}, },
data() { data() {
return { return {
loopData0: [{ loopData0: [{
lanhuimage0: '@/assets/operator/card_1.png', lanhuimage0: 'src/assets/operator/card_1.png',
}, },
{ {
lanhuimage0: '@/assets/operator/card_2.png', lanhuimage0: 'src/assets/operator/card_2.png',
}, },
{ {
lanhuimage0: '@/assets/operator/card_3.png', lanhuimage0: 'src/assets/operator/card_3.png',
}, },
{ {
lanhuimage0: '@/assets/operator/card_4.png', lanhuimage0: 'src/assets/operator/card_4.png',
}, },
], ],
loopData1: [{ loopData1: [{
...@@ -102,228 +98,10 @@ export default { ...@@ -102,228 +98,10 @@ export default {
.page { .page {
position: relative; position: relative;
width: 100vw; width: 100vw;
height: 128.65vw; height: 105vw;
overflow: hidden; overflow: hidden;
} }
.section_1 {
position: relative;
width: 100vw;
height: 128.65vw;
background: url(@/assets/operator/bg_1.png) 100% no-repeat;
background-size: 100% 100%;
}
.box_1 {
width: 100vw;
height: 51.05vw;
background: url(@/assets/operator/merge_bg.png) 100% no-repeat;
background-size: 100% 100%;
}
.image_1 {
width: 6.25vw;
height: 4.95vw;
margin: 0.93vw 0 0 2.6vw;
}
.box_2 {
width: 40.21vw;
height: 30.53vw;
margin: 2.86vw 0 0 4.58vw;
}
.text_1 {
width: 40.11vw;
height: 1.05vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.04vw;
font-family: OPPOSans-M;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 3.75vw;
margin-left: 0.11vw;
}
.text_2 {
width: 28.75vw;
height: 3.03vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 4.16vw;
font-family: Gilroy-Bold;
font-weight: 700;
text-align: left;
white-space: nowrap;
line-height: 3.75vw;
margin: 18.22vw 0 0 0.05vw;
}
.text_3 {
width: 7.4vw;
height: 1.83vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.87vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: left;
white-space: nowrap;
line-height: 2.19vw;
margin-top: 1.78vw;
}
.image_2 {
width: 0.27vw;
height: 3.08vw;
margin: 1.56vw 0 0 0.1vw;
}
.box_3 {
height: 51.05vw;
background: url(@/assets/operator/bg_2.png) 100% no-repeat;
background-size: 100% 100%;
margin-left: 2.61vw;
width: 43.75vw;
position: relative;
}
.image-wrapper_1 {
width: 1.67vw;
height: 1.67vw;
margin: 2.6vw 0 0 39.47vw;
}
.label_1 {
width: 1.67vw;
height: 1.67vw;
}
.text-wrapper_1 {
width: 40.99vw;
height: 4.28vw;
margin: 17.86vw 0 24.63vw -7.5vw;
}
.paragraph_1 {
width: 40.99vw;
height: 4.28vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.87vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: left;
line-height: 2.19vw;
}
.group_1 {
position: absolute;
left: -42.7vw;
top: 45.84vw;
width: 86.46vw;
height: 5.21vw;
background: url(@/assets/operator/bg_3.png) 100% no-repeat;
background-size: 100% 100%;
}
.text_4 {
width: 9.28vw;
height: 1.57vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.56vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: center;
white-space: nowrap;
line-height: 2.19vw;
margin: 1.82vw 0 0 4.47vw;
}
.image_3 {
width: 0.06vw;
height: 2.3vw;
margin: 1.92vw 0 0 4.47vw;
}
.text_5 {
width: 9.28vw;
height: 1.57vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.56vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: center;
white-space: nowrap;
line-height: 2.19vw;
margin: 1.82vw 0 0 4.42vw;
}
.text-wrapper_2 {
height: 5.21vw;
background: url(@/assets/operator/bg_4.png) 100% no-repeat;
background-size: 100% 100%;
margin-left: 4.43vw;
width: 18.23vw;
}
.text_6 {
width: 7.77vw;
height: 1.57vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.56vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: center;
white-space: nowrap;
line-height: 2.19vw;
margin: 1.82vw 0 0 5.31vw;
}
.text_7 {
width: 7.71vw;
height: 1.52vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.56vw;
font-family: OPPOSans-R;
font-weight: normal;
text-align: center;
white-space: nowrap;
line-height: 2.19vw;
margin: 1.87vw 0 0 5.31vw;
}
.image-text_1 {
width: 4.38vw;
height: 1.05vw;
margin: 2.03vw 2.6vw 0 11.82vw;
}
.text-group_1 {
width: 2.56vw;
height: 0.73vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.93vw;
font-family: Gilroy-Medium;
font-weight: 500;
text-align: left;
white-space: nowrap;
line-height: 2.19vw;
margin-top: 0.21vw;
}
.thumbnail_1 {
width: 0.94vw;
height: 1.05vw;
}
.box_4 { .box_4 {
width: 100vw; width: 100vw;
height: 59.43vw; height: 59.43vw;
...@@ -449,156 +227,4 @@ export default { ...@@ -449,156 +227,4 @@ export default {
width: 11.46vw; width: 11.46vw;
height: 19.12vw; height: 19.12vw;
} }
.box_6 {
position: absolute;
left: 0;
top: 110.42vw;
width: 100vw;
height: 18.23vw;
background: url(@/assets/operator/bg_6.png) 100% no-repeat;
background-size: 100% 100%;
justify-content: flex-center;
}
.box_7 {
width: 34.85vw;
height: 8.91vw;
margin: 4.68vw 0 0 13.48vw;
}
.text_12 {
width: 6.88vw;
height: 1.15vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.14vw;
font-family: MicrosoftYaHei-Bold;
font-weight: 700;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
margin-left: 0.06vw;
}
.text_13 {
width: 30.11vw;
height: 0.84vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.83vw;
font-family: MicrosoftYaHei-Semibold;
font-weight: 600;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
margin-top: 1.15vw;
}
.text-wrapper_3 {
width: 16.25vw;
height: 1.15vw;
margin: 2.65vw 0 0 0.1vw;
}
.text_14 {
width: 4.54vw;
height: 1.15vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.14vw;
font-family: MicrosoftYaHei-Bold;
font-weight: 700;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
}
.text_15 {
width: 2.3vw;
height: 1.15vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 1.14vw;
font-family: MicrosoftYaHei-Bold;
font-weight: 700;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
}
.text-wrapper_4 {
width: 34.8vw;
height: 0.84vw;
margin: 1.14vw 0 0 0.05vw;
}
.text_16 {
width: 9.8vw;
height: 0.84vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.83vw;
font-family: MicrosoftYaHei-Semibold;
font-weight: 600;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
}
.text_17 {
width: 20.84vw;
height: 0.84vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.83vw;
font-family: MicrosoftYaHei-Semibold;
font-weight: 600;
text-align: left;
white-space: nowrap;
line-height: 1.25vw;
}
.paragraph_2 {
width: 7.5vw;
height: 2.19vw;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 0.93vw;
font-family: MicrosoftYaHei-Bold;
font-weight: 700;
text-align: right;
line-height: 1.25vw;
margin: 8.02vw 0 0 20.41vw;
}
.image-wrapper_3 {
background-color: rgba(255, 255, 255, 1);
border-radius: 30px;
height: 8.86vw;
width: 8.86vw;
margin: 4.68vw 13.54vw 0 1.35vw;
}
.image_7 {
width: 6.25vw;
height: 6.15vw;
margin: 1.35vw 0 0 1.3vw;
}
.image-wrapper_4 {
height: 5.21vw;
background: url(@/assets/operator/bg_7.png) 100% no-repeat;
background-size: 100% 100%;
width: 5.21vw;
position: absolute;
left: 79.43vw;
top: -2.6vw;
}
.image_8 {
width: 1.36vw;
height: 0.73vw;
margin: 2.23vw 0 0 1.92vw;
}
</style> </style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment