You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
65 lines
2.0 KiB
65 lines
2.0 KiB
<template>
|
|
<!-- Footer Start -->
|
|
<footer class="footer-wrap">
|
|
<ul class="footer">
|
|
<li class="footer-item" :class="{active: $route.path=='/home'}">
|
|
<router-link to="/" class="footer-link">
|
|
<i class="icon-home icli"></i>
|
|
<span>首頁</span>
|
|
</router-link>
|
|
</li>
|
|
<li class="footer-item" :class="{active: $route.path=='/article'}">
|
|
<router-link to="/article?id=145" class="footer-link">
|
|
<i class="icon-share-alt-square-solid icli"></i>
|
|
<span>品牌故事</span>
|
|
</router-link>
|
|
</li>
|
|
<li class="footer-item" :class="{active: $route.path=='/card'}">
|
|
<router-link to="/card" class="footer-link">
|
|
<i class="icon-local-convenience-store icli"></i>
|
|
<span>立即購買</span>
|
|
</router-link>
|
|
</li>
|
|
<!-- <li class="footer-item" :class="{active: $route.path=='/category'}">
|
|
<router-link to="/category" class="footer-link">
|
|
<i class="icon-cart-variant icli"></i>
|
|
<span>線上商店</span>
|
|
</router-link>
|
|
</li> -->
|
|
<li class="footer-item">
|
|
<a href="https://card.slash1000.com" class="footer-link">
|
|
<i class="icon-card-account-details icli"></i>
|
|
<span>電子名片</span>
|
|
</a>
|
|
</li>
|
|
<li class="footer-item" :class="{active: $route.path=='/user/info'}">
|
|
<router-link to="/user/info" class="footer-link">
|
|
<i class="icon-account icli"></i>
|
|
<span>我的</span>
|
|
</router-link>
|
|
</li>
|
|
</ul>
|
|
</footer>
|
|
<!-- Footer End -->
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted } from 'vue'
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
|
|
const active = ref('Home')
|
|
|
|
onMounted(async () => {
|
|
await router.isReady()
|
|
// console.log(route.name)
|
|
active.value = route.name
|
|
})
|
|
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
</style>
|