WindowBird/ct
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

广告清理

Browse Source
This commit is contained in:
WindowBird 2025-10-21 14:06:42 +08:00
parent 703060ecb7
commit e64a070422
4 changed files with 285 additions and 285 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

500
app/components/index/Carousel.vue
View File

@ -1,284 +1,284 @@
<template> <!--<template>-->
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> <!-- <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">-->
<ol class="carousel-indicators" style="background-color: rgba(0,0,0,0.08);"> <!-- <ol class="carousel-indicators" style="background-color: rgba(0,0,0,0.08);">-->
<li <!-- <li-->
v-for="(item, index) in carouselItems" <!-- v-for="(item, index) in carouselItems"-->
:key="index" <!-- :key="index"-->
:class="{ active: index === currentSlide }" <!-- :class="{ active: index === currentSlide }"-->
:data-slide-to="index" <!-- :data-slide-to="index"-->
:data-target="`#carousel-example-generic`" <!-- :data-target="`#carousel-example-generic`"-->
@click="goToSlide(index)" <!-- @click="goToSlide(index)"-->
/> <!-- />-->
</ol> <!-- </ol>-->
<!-- Wrapper for slides --> <!-- &lt;!&ndash; Wrapper for slides &ndash;&gt;-->
<div class="carousel-inner" role="listbox"> <!-- <div class="carousel-inner" role="listbox">-->
<div <!-- <div-->
v-for="(item, index) in carouselItems" <!-- v-for="(item, index) in carouselItems"-->
:key="index" <!-- :key="index"-->
:class="{ active: index === currentSlide }" <!-- :class="{ active: index === currentSlide }"-->
class="item" <!-- class="item"-->
> <!-- >-->
<img <!-- <img-->
:alt="item.alt" <!-- :alt="item.alt"-->
:src="item.image" <!-- :src="item.image"-->
style="width: 100%;" <!-- style="width: 100%;"-->
> <!-- >-->
<div v-if="item.caption" class="carousel-caption"> <!-- <div v-if="item.caption" class="carousel-caption">-->
<h2>{{ item.caption.title }}</h2> <!-- <h2>{{ item.caption.title }}</h2>-->
<ul v-if="item.caption.links" class="list-unstyled hidden-xs hidden-sm"> <!-- <ul v-if="item.caption.links" class="list-unstyled hidden-xs hidden-sm">-->
<li v-for="(link, linkIndex) in item.caption.links" :key="linkIndex"> <!-- <li v-for="(link, linkIndex) in item.caption.links" :key="linkIndex">-->
<a :href="link.href" :target="link.target"> <!-- <a :href="link.href" :target="link.target">-->
<img :alt="link.alt" :src="link.image"> <!-- <img :alt="link.alt" :src="link.image">-->
</a> <!-- </a>-->
<span/>{{ link.text }} <!-- <span/>{{ link.text }}-->
</li> <!-- </li>-->
</ul> <!-- </ul>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
<!-- Controls --> <!-- &lt;!&ndash; Controls &ndash;&gt;-->
<a <!-- <a-->
class="left carousel-control" <!-- class="left carousel-control"-->
data-slide="prev" <!-- data-slide="prev"-->
href="#carousel-example-generic" <!-- href="#carousel-example-generic"-->
role="button" <!-- role="button"-->
@click.prevent="previousSlide" <!-- @click.prevent="previousSlide"-->
> <!-- >-->
<span aria-hidden="true" class="glyphicon glyphicon-chevron-left"/> <!-- <span aria-hidden="true" class="glyphicon glyphicon-chevron-left"/>-->
<span class="sr-only">Previous</span> <!-- <span class="sr-only">Previous</span>-->
</a> <!-- </a>-->
<a <!-- <a-->
class="right carousel-control" <!-- class="right carousel-control"-->
data-slide="next" <!-- data-slide="next"-->
href="#carousel-example-generic" <!-- href="#carousel-example-generic"-->
role="button" <!-- role="button"-->
@click.prevent="nextSlide" <!-- @click.prevent="nextSlide"-->
> <!-- >-->
<span aria-hidden="true" class="glyphicon glyphicon-chevron-right"/> <!-- <span aria-hidden="true" class="glyphicon glyphicon-chevron-right"/>-->
<span class="sr-only">Next</span> <!-- <span class="sr-only">Next</span>-->
</a> <!-- </a>-->
</div> <!-- </div>-->
</template> <!--</template>-->
<script lang="ts" setup> <!--<script lang="ts" setup>-->
import {ref, onMounted, onUnmounted} from 'vue' <!--import {ref, onMounted, onUnmounted} from 'vue'-->
// 响应式数据 <!--// 响应式数据-->
const currentSlide = ref(2) // 默认显示第三张图片 <!--const currentSlide = ref(2) // 默认显示第三张图片-->
const autoPlayInterval = ref<NodeJS.Timeout | null>(null) <!--const autoPlayInterval = ref<NodeJS.Timeout | null>(null)-->
// 轮播图数据 <!--// 轮播图数据-->
const carouselItems = [ <!--const carouselItems = [-->
{ <!-- {-->
image: '/www.yuxiit.com/img/yuxiupdata/banner_2021_1.png', <!-- image: '/www.yuxiit.com/img/yuxiupdata/banner_2021_1.png',-->
alt: '成本降低，效率更高' <!-- alt: '成本降低，效率更高'-->
}, <!-- },-->
{ <!-- {-->
image: '/www.yuxiit.com/img/yuxiupdata/banner_2021_2.png', <!-- image: '/www.yuxiit.com/img/yuxiupdata/banner_2021_2.png',-->
alt: '成本降低，效率更高' <!-- alt: '成本降低，效率更高'-->
}, <!-- },-->
{ <!-- {-->
image: '/www.yuxiit.com/img/yuxiupdata/index23.png', <!-- image: '/www.yuxiit.com/img/yuxiupdata/index23.png',-->
alt: '共享单车最佳拍档', <!-- alt: '共享单车最佳拍档',-->
} <!-- }-->
] <!--]-->
// 方法 <!--// 方法-->
const goToSlide = (index: number) => { <!--const goToSlide = (index: number) => {-->
currentSlide.value = index <!-- currentSlide.value = index-->
} <!--}-->
const nextSlide = () => { <!--const nextSlide = () => {-->
currentSlide.value = (currentSlide.value + 1) % carouselItems.length <!-- currentSlide.value = (currentSlide.value + 1) % carouselItems.length-->
} <!--}-->
const previousSlide = () => { <!--const previousSlide = () => {-->
currentSlide.value = currentSlide.value === 0 ? carouselItems.length - 1 : currentSlide.value - 1 <!-- currentSlide.value = currentSlide.value === 0 ? carouselItems.length - 1 : currentSlide.value - 1-->
} <!--}-->
const startAutoPlay = () => { <!--const startAutoPlay = () => {-->
autoPlayInterval.value = setInterval(() => { <!-- autoPlayInterval.value = setInterval(() => {-->
nextSlide() <!-- nextSlide()-->
}, 5000) // 5秒自动切换 <!-- }, 5000) // 5秒自动切换-->
} <!--}-->
const stopAutoPlay = () => { <!--const stopAutoPlay = () => {-->
if (autoPlayInterval.value) { <!-- if (autoPlayInterval.value) {-->
clearInterval(autoPlayInterval.value) <!-- clearInterval(autoPlayInterval.value)-->
autoPlayInterval.value = null <!-- autoPlayInterval.value = null-->
} <!-- }-->
} <!--}-->
// 生命周期 <!--// 生命周期-->
onMounted(() => { <!--onMounted(() => {-->
startAutoPlay() <!-- startAutoPlay()-->
}) <!--})-->
onUnmounted(() => { <!--onUnmounted(() => {-->
stopAutoPlay() <!-- stopAutoPlay()-->
}) <!--})-->
</script> <!--</script>-->
<style scoped> <!--<style scoped>-->
.carousel { <!--.carousel {-->
position: relative; <!-- position: relative;-->
} <!--}-->
.carousel-inner { <!--.carousel-inner {-->
position: relative; <!-- position: relative;-->
width: 100%; <!-- width: 100%;-->
overflow: hidden; <!-- overflow: hidden;-->
} <!--}-->
.carousel-inner > .item { <!--.carousel-inner > .item {-->
position: relative; <!-- position: relative;-->
display: none; <!-- display: none;-->
transition: 0.6s ease-in-out left; <!-- transition: 0.6s ease-in-out left;-->
} <!--}-->
.carousel-inner > .item.active { <!--.carousel-inner > .item.active {-->
display: block; <!-- display: block;-->
} <!--}-->
.carousel-inner > .item > img { <!--.carousel-inner > .item > img {-->
display: block; <!-- display: block;-->
width: 100%; <!-- width: 100%;-->
height: auto; <!-- height: auto;-->
} <!--}-->
.carousel-indicators { <!--.carousel-indicators {-->
position: absolute; <!-- position: absolute;-->
bottom: 10px; <!-- bottom: 10px;-->
left: 50%; <!-- left: 50%;-->
z-index: 15; <!-- z-index: 15;-->
width: 60%; <!-- width: 60%;-->
padding-left: 0; <!-- padding-left: 0;-->
margin-left: -30%; <!-- margin-left: -30%;-->
text-align: center; <!-- text-align: center;-->
list-style: none; <!-- list-style: none;-->
} <!--}-->
.carousel-indicators li { <!--.carousel-indicators li {-->
display: inline-block; <!-- display: inline-block;-->
width: 10px; <!-- width: 10px;-->
height: 10px; <!-- height: 10px;-->
margin: 1px; <!-- margin: 1px;-->
text-indent: -999px; <!-- text-indent: -999px;-->
cursor: pointer; <!-- cursor: pointer;-->
background-color: #000 \9; <!-- background-color: #000 \9;-->
background-color: rgba(0, 0, 0, 0); <!-- background-color: rgba(0, 0, 0, 0);-->
border: 1px solid #fff; <!-- border: 1px solid #fff;-->
border-radius: 10px; <!-- border-radius: 10px;-->
} <!--}-->
.carousel-indicators .active { <!--.carousel-indicators .active {-->
width: 12px; <!-- width: 12px;-->
height: 12px; <!-- height: 12px;-->
margin: 0; <!-- margin: 0;-->
background-color: #fff; <!-- background-color: #fff;-->
} <!--}-->
.carousel-control { <!--.carousel-control {-->
position: absolute; <!-- position: absolute;-->
top: 0; <!-- top: 0;-->
bottom: 0; <!-- bottom: 0;-->
left: 0; <!-- left: 0;-->
width: 15%; <!-- width: 15%;-->
font-size: 20px; <!-- font-size: 20px;-->
color: #fff; <!-- color: #fff;-->
text-align: center; <!-- text-align: center;-->
text-shadow: 0 1px 2px rgba(0, 0, 0, .6); <!-- text-shadow: 0 1px 2px rgba(0, 0, 0, .6);-->
background-color: rgba(0, 0, 0, 0); <!-- background-color: rgba(0, 0, 0, 0);-->
filter: alpha(opacity=50); <!-- filter: alpha(opacity=50);-->
opacity: .5; <!-- opacity: .5;-->
} <!--}-->
.carousel-control.right { <!--.carousel-control.right {-->
right: 0; <!-- right: 0;-->
left: auto; <!-- left: auto;-->
} <!--}-->
.carousel-control:hover, <!--.carousel-control:hover,-->
.carousel-control:focus { <!--.carousel-control:focus {-->
color: #fff; <!-- color: #fff;-->
text-decoration: none; <!-- text-decoration: none;-->
filter: alpha(opacity=70); <!-- filter: alpha(opacity=70);-->
opacity: .7; <!-- opacity: .7;-->
} <!--}-->
.carousel-control .icon-prev, <!--.carousel-control .icon-prev,-->
.carousel-control .icon-next, <!--.carousel-control .icon-next,-->
.carousel-control .glyphicon-chevron-left, <!--.carousel-control .glyphicon-chevron-left,-->
.carousel-control .glyphicon-chevron-right { <!--.carousel-control .glyphicon-chevron-right {-->
position: absolute; <!-- position: absolute;-->
top: 50%; <!-- top: 50%;-->
z-index: 5; <!-- z-index: 5;-->
display: inline-block; <!-- display: inline-block;-->
margin-top: -10px; <!-- margin-top: -10px;-->
} <!--}-->
.carousel-control .icon-prev, <!--.carousel-control .icon-prev,-->
.carousel-control .glyphicon-chevron-left { <!--.carousel-control .glyphicon-chevron-left {-->
left: 50%; <!-- left: 50%;-->
margin-left: -10px; <!-- margin-left: -10px;-->
} <!--}-->
.carousel-control .icon-next, <!--.carousel-control .icon-next,-->
.carousel-control .glyphicon-chevron-right { <!--.carousel-control .glyphicon-chevron-right {-->
right: 50%; <!-- right: 50%;-->
margin-right: -10px; <!-- margin-right: -10px;-->
} <!--}-->
.carousel-caption { <!--.carousel-caption {-->
position: absolute; <!-- position: absolute;-->
right: 15%; <!-- right: 15%;-->
bottom: 20px; <!-- bottom: 20px;-->
left: 15%; <!-- left: 15%;-->
z-index: 10; <!-- z-index: 10;-->
padding-top: 20px; <!-- padding-top: 20px;-->
padding-bottom: 20px; <!-- padding-bottom: 20px;-->
color: #fff; <!-- color: #fff;-->
text-align: center; <!-- text-align: center;-->
text-shadow: 0 1px 2px rgba(0, 0, 0, .6); <!-- text-shadow: 0 1px 2px rgba(0, 0, 0, .6);-->
} <!--}-->
.carousel-caption h2 { <!--.carousel-caption h2 {-->
font-size: 2.5em; <!-- font-size: 2.5em;-->
margin-bottom: 20px; <!-- margin-bottom: 20px;-->
} <!--}-->
.carousel-caption .list-unstyled { <!--.carousel-caption .list-unstyled {-->
list-style: none; <!-- list-style: none;-->
padding: 0; <!-- padding: 0;-->
margin: 0; <!-- margin: 0;-->
} <!--}-->
.carousel-caption .list-unstyled li { <!--.carousel-caption .list-unstyled li {-->
display: inline-block; <!-- display: inline-block;-->
margin: 0 10px; <!-- margin: 0 10px;-->
vertical-align: top; <!-- vertical-align: top;-->
} <!--}-->
.carousel-caption .list-unstyled a { <!--.carousel-caption .list-unstyled a {-->
color: #fff; <!-- color: #fff;-->
text-decoration: none; <!-- text-decoration: none;-->
} <!--}-->
.carousel-caption .list-unstyled img { <!--.carousel-caption .list-unstyled img {-->
width: 50px; <!-- width: 50px;-->
height: 50px; <!-- height: 50px;-->
margin-bottom: 10px; <!-- margin-bottom: 10px;-->
} <!--}-->
@media (max-width: 768px) { <!--@media (max-width: 768px) {-->
.carousel-caption h2 { <!-- .carousel-caption h2 {-->
font-size: 1.5em; <!-- font-size: 1.5em;-->
} <!-- }-->
.carousel-caption .list-unstyled { <!-- .carousel-caption .list-unstyled {-->
display: none; <!-- display: none;-->
} <!-- }-->
} <!--}-->
</style> <!--</style>-->

26
app/components/index/Logo.vue
View File

@ -1,14 +1,14 @@
<template> <!--<template>-->
<NuxtLink class="flex items-center" to="/public"> <!-- <NuxtLink class="flex items-center" to="/public">-->
<NuxtImg <!-- <NuxtImg-->
alt="创特物联" <!-- alt="创特物联"-->
class="h-12 w-auto dark:invert" <!-- class="h-12 w-auto dark:invert"-->
loading="eager" <!-- loading="eager"-->
src="https://cbu01.alicdn.com/img/ibank/O1CN01uZ3fTP1Bs31lE2Mlf_!!0-0-cib.jpg" <!-- src="https://cbu01.alicdn.com/img/ibank/O1CN01uZ3fTP1Bs31lE2Mlf_!!0-0-cib.jpg"-->
/> <!-- />-->
创特物联 <!-- 创特物联-->
</NuxtLink> <!-- </NuxtLink>-->
</template> <!--</template>-->
<script lang="ts" setup> <!--<script lang="ts" setup>-->
</script> <!--</script>-->

20
app/components/index/index.vue
View File

@ -7,12 +7,12 @@ import {
smartHardwareData smartHardwareData
} from '~/data/indexData' } from '~/data/indexData'
// 处理锚点链接 // // 处理锚点链接
const handleAnchorLinks = () => { // const handleAnchorLinks = () => {
if (window.location.hash) { // if (window.location.hash) {
history.replaceState('', document.title, window.location.pathname + window.location.search) // history.replaceState('', document.title, window.location.pathname + window.location.search)
} // }
} // }
// 解决方案标签页切换 // 解决方案标签页切换
const handleSolutionTabHover = (index: number) => { const handleSolutionTabHover = (index: number) => {
@ -46,7 +46,7 @@ const handleDropdownImageHover = (index: number) => {
} }
onMounted(() => { onMounted(() => {
handleAnchorLinks() // handleAnchorLinks()
// 绑定事件 // 绑定事件
const solutionTabs = document.querySelectorAll('.solution .items-body li') const solutionTabs = document.querySelectorAll('.solution .items-body li')
@ -66,9 +66,9 @@ onMounted(() => {
<!-- 轮播图 --> <!-- 轮播图 -->
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators" style="background-color: rgba(0,0,0,0.08);"> <ol class="carousel-indicators" style="background-color: rgba(0,0,0,0.08);">
<li data-slide-to="0" data-target="#carousel-example-generic" class="active"></li> <li class="active" data-slide-to="0" data-target="#carousel-example-generic"/>
<li data-slide-to="1" data-target="#carousel-example-generic"></li> <li data-slide-to="1" data-target="#carousel-example-generic"/>
<li data-slide-to="2" data-target="#carousel-example-generic"></li> <li data-slide-to="2" data-target="#carousel-example-generic"/>
</ol> </ol>
<div class="carousel-inner" role="listbox"> <div class="carousel-inner" role="listbox">

24
app/pages/index.vue
View File

@ -15,18 +15,18 @@ useHead({
{src: '/js/index.js'}, {src: '/js/index.js'},
{src: '/js/gopcOm.js'}, {src: '/js/gopcOm.js'},
{ // {
innerHTML: ` // innerHTML: `
var _hmt = _hmt || []; // var _hmt = _hmt || [];
(function() { // (function() {
var protocol = window.location.protocol === 'https:' ? 'https://' : 'http://'; // var protocol = window.location.protocol === 'https:' ? 'https://' : 'http://';
var hm = document.createElement("script"); // var hm = document.createElement("script");
hm.src = protocol + "hm.baidu.com/h.js?${pageConfig.baiduAnalytics}"; // hm.src = protocol + "hm.baidu.com/h.js?${pageConfig.baiduAnalytics}";
var s = document.getElementsByTagName("script")[0]; // var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s); // s.parentNode.insertBefore(hm, s);
})(); // })();
` // `
} // }
] ]
}) })
</script> </script>