101 lines
2.4 KiB
Vue
101 lines
2.4 KiB
Vue
<template>
|
||
<div class="mobileBottom">
|
||
<div class="gridAdvBox" @touchstart.stop @touchmove.stop @touchend.stop>
|
||
<lazyImg class="gridAdv" :src="i.cover" v-for="i in state.advList" :key="i.id" @click="openAdv(i)" />
|
||
</div>
|
||
<div class="tip">
|
||
我们使用Cookies来改善您的使用体验。如您继续使用我们的网站，即表示你同意我们使用Cookies。阅读
|
||
<span @click="jumpPage('/mobilePrivacyPolicy')">隐私政策</span>
|
||
</div>
|
||
<div class="version">
|
||
CopyCopyright ©
|
||
<span @click="openPage(configStore?.appConfig?.officialUrl)">{{ configStore?.appConfig?.officialUrl }}</span>
|
||
since 2025
|
||
</div>
|
||
</div>
|
||
</template>
|
||
<script lang="ts" setup>
|
||
import { reactive } from 'vue';
|
||
import { useRouter } from 'vue-router';
|
||
import { useConfigStore } from '@/stores/config';
|
||
import { getAdItem } from '@/utils/getConfig';
|
||
import { AdType } from '@/enums/app';
|
||
import { jumpAdv } from '@/utils/index';
|
||
const router = useRouter();
|
||
const configStore = useConfigStore();
|
||
const state = reactive({
|
||
advList: <any>[],
|
||
});
|
||
|
||
const init = () => {
|
||
state.advList = getAdItem(AdType.BOTTOMGRIDADV);
|
||
};
|
||
|
||
init();
|
||
const jumpPage = (path: string) => {
|
||
router.push(path);
|
||
};
|
||
const openPage = (url: string) => {
|
||
window.open(url);
|
||
};
|
||
const openAdv = (item: any) => {
|
||
jumpAdv(item);
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.mobileBottom {
|
||
margin-top: 24px;
|
||
.gridAdvBox {
|
||
display: flex;
|
||
align-items: center;
|
||
margin: 0 0 22px 16px;
|
||
flex-wrap: nowrap;
|
||
overflow-x: auto;
|
||
|
||
.gridAdv {
|
||
width: 60px;
|
||
height: 60px;
|
||
flex-shrink: 0;
|
||
margin-right: 8px;
|
||
border-radius: 14px;
|
||
overflow: hidden;
|
||
:deep(img) {
|
||
border-radius: 14px;
|
||
}
|
||
}
|
||
}
|
||
.tip {
|
||
color: #9b9b9b;
|
||
text-align: center;
|
||
font-family: Roboto;
|
||
font-size: 9px;
|
||
font-style: normal;
|
||
font-weight: 300;
|
||
line-height: 16px; /* 177.778% */
|
||
span {
|
||
color: #fff;
|
||
text-decoration-line: underline;
|
||
text-decoration-style: solid;
|
||
text-decoration-skip-ink: auto;
|
||
text-decoration-thickness: auto;
|
||
text-underline-offset: auto;
|
||
text-underline-position: from-font;
|
||
}
|
||
}
|
||
.version {
|
||
color: #9b9b9b;
|
||
text-align: center;
|
||
font-family: Roboto;
|
||
font-size: 9px;
|
||
font-style: normal;
|
||
font-weight: 300;
|
||
line-height: 16px; /* 177.778% */
|
||
margin-bottom: 120px;
|
||
span {
|
||
color: #3185f4;
|
||
}
|
||
}
|
||
}
|
||
</style>
|