提交 d79805a5 编写于 作者: 璃白.'s avatar 璃白. 🌻

add spm

上级 210771ea
...@@ -191,7 +191,7 @@ ...@@ -191,7 +191,7 @@
"id": "1" "id": "1"
}, },
{ {
"name": "5折banner", "name": "5折活动-banner",
"imgUrl": "https://devbit-static.oss-cn-beijing.aliyuncs.com/ai100/icon/banner/1697714511964.jpg", "imgUrl": "https://devbit-static.oss-cn-beijing.aliyuncs.com/ai100/icon/banner/1697714511964.jpg",
"destUrl": "/dev/console/billing/pay", "destUrl": "/dev/console/billing/pay",
"id": "2" "id": "2"
......
...@@ -6,6 +6,9 @@ ...@@ -6,6 +6,9 @@
</div> </div>
<a <a
href="/dev/console/billing/pay" href="/dev/console/billing/pay"
v-view="{
el: '5折活动-悬浮广告'
}"
v-click="{ v-click="{
el: '5折活动-悬浮广告' el: '5折活动-悬浮广告'
}" }"
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="max-w-6xl m-auto"> <div class="max-w-6xl m-auto">
<div class="sm:rounded-lg px-4 sm:px-10 py-4 pb-10 bg-white"> <div class="sm:rounded-lg px-4 sm:px-10 py-4 pb-10 bg-white">
<h2 class="text-lg font-medium text-gray-600 py-2">逻辑电量充能</h2> <h2 class="text-lg font-medium text-gray-600 py-2">逻辑电量充能</h2>
<div class="py-2 grid grid-cols-1 gap-2 sm:gap-4 sm:grid-cols-4"> <div class="py-2 flex flex-wrap gap-x-4 gap-y-4">
<div <div
v-for="item in goods" v-for="item in goods"
:key="item.name" :key="item.name"
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
:class="{ :class="{
'ring-[#EBB305] ring-2': item.id === payGood.id 'ring-[#EBB305] ring-2': item.id === payGood.id
}" }"
class="relative rounded-lg border border-gray-200 px-2 sm:px-6 py-4 sm:py-4 shadow-sm flex justify-center items-center space-x-3 hover:border-yellow-400 focus-within:ring-2 focus-within:ring-yellow-500" class="relative rounded-lg w-full sm:w-[236px] border border-gray-200 px-2 sm:px-6 py-4 sm:py-4 shadow-sm flex justify-center items-center space-x-3 hover:border-yellow-400 focus-within:ring-2 focus-within:ring-yellow-500"
> >
<div class="flex-shrink-0"> <div class="flex-shrink-0">
<img <img
......
...@@ -12,6 +12,9 @@ ...@@ -12,6 +12,9 @@
<div class="h-[30px] flex items-center m-8 rounded-full"> <div class="h-[30px] flex items-center m-8 rounded-full">
<div <div
class="notice-main" class="notice-main"
v-view="{
el: '5折活动-dashboard顶部广告'
}"
v-click="{ v-click="{
el: '5折活动-dashboard顶部广告' el: '5折活动-dashboard顶部广告'
}" }"
......
...@@ -6,8 +6,15 @@ ...@@ -6,8 +6,15 @@
:class="store.switchcheck ? 'bg-[#efefef] text-black' : 'bg-black'" :class="store.switchcheck ? 'bg-[#efefef] text-black' : 'bg-black'"
:style="props.wrapStyle" :style="props.wrapStyle"
> >
<div class="inline-flex relative" :class="store.switchcheck ? 'tab-item' : 'notab-item'"> <div
<div v-for="(item, index) in tabs" :key="index" @click="changeTab(item, index)"> class="inline-flex relative"
:class="store.switchcheck ? 'tab-item' : 'notab-item'"
>
<div
v-for="(item, index) in tabs"
:key="index"
@click="changeTab(item, index)"
>
<nuxt-link <nuxt-link
v-if="item.path" v-if="item.path"
:to="item.path" :to="item.path"
...@@ -16,7 +23,8 @@ ...@@ -16,7 +23,8 @@
}" }"
class="text-sm lg:w-24 w-20 h-7 flex items-center justify-center z-10 rounded-full lg:mx-0 mx-0.5" class="text-sm lg:w-24 w-20 h-7 flex items-center justify-center z-10 rounded-full lg:mx-0 mx-0.5"
:class="store.switchcheck ? 'text-black ' : 'text-white'" :class="store.switchcheck ? 'text-black ' : 'text-white'"
>{{ item.name }}</nuxt-link> >{{ item.name }}</nuxt-link
>
<div <div
:style=" :style="
props.itemStyle + `${curTab == index ? props.activeStyle : ''}` props.itemStyle + `${curTab == index ? props.activeStyle : ''}`
...@@ -25,19 +33,31 @@ ...@@ -25,19 +33,31 @@
curTab == index ? 'router-link-active bg-indigo-600' : '' curTab == index ? 'router-link-active bg-indigo-600' : ''
} `" } `"
v-else v-else
>{{ item.name }}</div> >
{{ item.name }}
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="lg:block hidden" v-if="isShow"> <div class="lg:block hidden" v-if="isShow">
<div class="h-12 relative flex items-center"> <div class="h-12 relative flex items-center">
<img src="@/assets/imgs/Adhorn.png" class="w-[34px] h-[34px] absolute ml-3" alt /> <img
src="@/assets/imgs/Adhorn.png"
class="w-[34px] h-[34px] absolute ml-3"
alt
/>
<div <div
class="bg-gradient-to-b from-yellow-200 via-white to-white float-right flex items-center m-8 rounded-full" class="bg-gradient-to-b from-yellow-200 via-white to-white float-right flex items-center m-8 rounded-full"
> >
<div class="notice-main" v-click="{ <div
class="notice-main"
v-click="{
el: '5折活动-小喇叭广告'
}"
v-view="{
el: '5折活动-小喇叭广告' el: '5折活动-小喇叭广告'
}"> }"
>
<span class="notice text-sm text-red-800"> <span class="notice text-sm text-red-800">
<a href="/dev/console/billing/pay"> <a href="/dev/console/billing/pay">
<span>电量充值限时低至5折,所有工具全部适用!</span> <span>电量充值限时低至5折,所有工具全部适用!</span>
......
...@@ -100,12 +100,18 @@ ...@@ -100,12 +100,18 @@
<div class="h-full lg:block hidden"> <div class="h-full lg:block hidden">
<div> <div>
<el-carousel :interval="3000" :loop="true" height="32vw"> <el-carousel :interval="3000" :loop="true" height="32vw">
<el-carousel-item v-for="(item, index) in recommendData.pcindex" :key="index"> <el-carousel-item
v-for="(item, index) in recommendData.pcindex"
:key="index"
v-click="{
el: item.name
}"
>
<a :href="item.destUrl"> <a :href="item.destUrl">
<img <img
class="cursor-pointer w-full h-full" class="cursor-pointer w-full h-full"
:src="item.imgUrl" :src="item.imgUrl"
style="width:100%;height: 100%;object-fit:contain" style="width: 100%; height: 100%; object-fit: contain"
/> />
</a> </a>
</el-carousel-item> </el-carousel-item>
...@@ -117,12 +123,15 @@ ...@@ -117,12 +123,15 @@
<div class="h-full lg:hidden block"> <div class="h-full lg:hidden block">
<div> <div>
<el-carousel :interval="3000" :loop="true" height="45vw"> <el-carousel :interval="3000" :loop="true" height="45vw">
<el-carousel-item v-for="(item, index) in recommendData.appindex" :key="index"> <el-carousel-item
v-for="(item, index) in recommendData.appindex"
:key="index"
>
<a :href="item.destUrl"> <a :href="item.destUrl">
<img <img
class="cursor-pointer w-full h-full" class="cursor-pointer w-full h-full"
:src="item.imgUrl" :src="item.imgUrl"
style="width:100%;height: 100%;object-fit:contain" style="width: 100%; height: 100%; object-fit: contain"
/> />
</a> </a>
</el-carousel-item> </el-carousel-item>
...@@ -137,12 +146,12 @@ ...@@ -137,12 +146,12 @@
> >
<div <div
class="w-[205px] flex items-center flex-col justify-center cursor-pointer h-24 text-[14px] font-bold font-AlimamaShuHeiTi-Bold font-AlimamaShuHeiTi text-white opacity-60 leading-6" class="w-[205px] flex items-center flex-col justify-center cursor-pointer h-24 text-[14px] font-bold font-AlimamaShuHeiTi-Bold font-AlimamaShuHeiTi text-white opacity-60 leading-6"
v-for="(item,index) in newIntList" v-for="(item, index) in newIntList"
:class="[ :class="[
{ selestyle: cationflag == index }, { selestyle: cationflag == index },
{ nostyle: cationflag !== index } { nostyle: cationflag !== index }
]" ]"
@click="intclick(item,index)" @click="intclick(item, index)"
:key="index" :key="index"
> >
<img :src="item.destImg" class="w-[48px] h-[47px] mb-2" alt /> <img :src="item.destImg" class="w-[48px] h-[47px] mb-2" alt />
...@@ -158,8 +167,8 @@ ...@@ -158,8 +167,8 @@
<div class="grid grid-cols-2 gap-4 sm:grid-cols-4 sm:gap-6 sm:pb-8 p-4"> <div class="grid grid-cols-2 gap-4 sm:grid-cols-4 sm:gap-6 sm:pb-8 p-4">
<div <div
class="flex items-center flex-col justify-center cursor-pointer h-[190px] text-[16px] font-bold font-AlimamaShuHeiTi-Bold font-AlimamaShuHeiTi bg-gradient-to-b from-white/5 to-white/[.01] text-white leading-10 py-3 rounded-md mt-5" class="flex items-center flex-col justify-center cursor-pointer h-[190px] text-[16px] font-bold font-AlimamaShuHeiTi-Bold font-AlimamaShuHeiTi bg-gradient-to-b from-white/5 to-white/[.01] text-white leading-10 py-3 rounded-md mt-5"
v-for="(item,index) in newIntList" v-for="(item, index) in newIntList"
@click="intclick(item,index)" @click="intclick(item, index)"
:key="index" :key="index"
> >
<img :src="item.destImg" class="w-[50px] h-[50px] mb-2" alt /> <img :src="item.destImg" class="w-[50px] h-[50px] mb-2" alt />
...@@ -176,7 +185,7 @@ ...@@ -176,7 +185,7 @@
<el-dialog <el-dialog
v-model="showAd" v-model="showAd"
class="my-dialog" class="my-dialog"
style="background-color: rgba(0,0,0,0); box-shadow:none;" style="background-color: rgba(0, 0, 0, 0); box-shadow: none"
width="35%" width="35%"
@close="dialogfn" @close="dialogfn"
center center
...@@ -196,11 +205,17 @@ ...@@ -196,11 +205,17 @@
<el-dialog <el-dialog
v-model="showAd" v-model="showAd"
class="my-dialog" class="my-dialog"
style="background-color: rgba(0,0,0,0); box-shadow:none;" style="background-color: rgba(0, 0, 0, 0); box-shadow: none"
width="100%" width="100%"
center center
> >
<img :src="adListData.imgUrl" alt /> <img
v-view="{
el: '5折活动-弹窗广告'
}"
:src="adListData.imgUrl"
alt
/>
<a :href="adListData.destUrl"> <a :href="adListData.destUrl">
<img src="@/assets/imgs/popbutton.png" alt /> <img src="@/assets/imgs/popbutton.png" alt />
</a> </a>
...@@ -238,6 +253,7 @@ import aigcImgIcon from "@/assets/imgs/aigcImgIcon.svg"; ...@@ -238,6 +253,7 @@ import aigcImgIcon from "@/assets/imgs/aigcImgIcon.svg";
import aigcPromptIcon from "@/assets/imgs/aigcPromptIcon.svg"; import aigcPromptIcon from "@/assets/imgs/aigcPromptIcon.svg";
import recommendData from "@/assets/data/recommend.json"; import recommendData from "@/assets/data/recommend.json";
const store = useStore(); const store = useStore();
const route = useRoute();
const showAd = ref<any>(false); const showAd = ref<any>(false);
const isadver = ref<any>(); const isadver = ref<any>();
...@@ -281,6 +297,15 @@ const Adopen = () => { ...@@ -281,6 +297,15 @@ const Adopen = () => {
const dialogfn = () => { const dialogfn = () => {
console.log("触发关闭"); console.log("触发关闭");
localStorage.setItem("eject", "1"); localStorage.setItem("eject", "1");
const utm_source = route?.query?.utm_source || "默认渠道";
window._czc &&
window._czc.push([
"_trackEvent",
"点击",
"5折活动-弹窗广告",
0,
utm_source
]);
}; };
// 控制动画 // 控制动画
...@@ -296,13 +321,13 @@ const Adsus = () => { ...@@ -296,13 +321,13 @@ const Adsus = () => {
for (let index = 0; index < classList.length; index++) { for (let index = 0; index < classList.length; index++) {
const element = classList[index]; const element = classList[index];
element.addEventListener("mouseover", function() { element.addEventListener("mouseover", function () {
for (let index2 = 0; index2 < classList.length; index2++) { for (let index2 = 0; index2 < classList.length; index2++) {
const element = classList.item(index2) as any; const element = classList.item(index2) as any;
element.style.animationPlayState = "paused"; element.style.animationPlayState = "paused";
} }
}); });
element.addEventListener("mouseout", function() { element.addEventListener("mouseout", function () {
for (let index2 = 0; index2 < classList.length; index2++) { for (let index2 = 0; index2 < classList.length; index2++) {
const element = classList.item(index2) as any; const element = classList.item(index2) as any;
element.style.animationPlayState = "running"; element.style.animationPlayState = "running";
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册