mirror of
https://gitee.com/niucloud-team/niucloud-admin.git
synced 2025-12-14 03:32:48 +00:00
41 lines
1.5 KiB
Vue
41 lines
1.5 KiB
Vue
<template>
|
|
<u-tabbar :value="value" @change="tabbarChange" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true"
|
|
:inactive-color="tabbar.textColor" :active-color="tabbar.textHoverColor" v-if="tabbar">
|
|
<block v-for="item in tabbar.list">
|
|
<u-tabbar-item :style="{'background-color': tabbar.backgroundColor}" :text="item.text"
|
|
:icon="img(value == item.link.url ? item.iconSelectPath : item.iconPath)" :name="item.link.url"
|
|
v-if="tabbar.type == 1"></u-tabbar-item>
|
|
<u-tabbar-item :style="{'background-color': tabbar.backgroundColor}"
|
|
:icon="img(value == item.link.url ? item.iconSelectPath : item.iconPath)" :name="item.link.url"
|
|
v-if="tabbar.type == 2"></u-tabbar-item>
|
|
<u-tabbar-item :style="{'background-color': tabbar.backgroundColor}" :text="item.text" :name="item.link.url"
|
|
v-if="tabbar.type == 3"></u-tabbar-item>
|
|
</block>
|
|
</u-tabbar>
|
|
<view class="tab-bar-placeholder"></view>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import { redirect, currRoute, img } from '@/utils/common'
|
|
import useConfigStore from '@/stores/config'
|
|
|
|
const tabbar = computed(() => {
|
|
return useConfigStore().tabbar
|
|
})
|
|
|
|
const value = computed(() => {
|
|
return '/' + currRoute()
|
|
})
|
|
|
|
const tabbarChange = (name : string) => {
|
|
redirect({ url: `${name}` })
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.tab-bar-placeholder {
|
|
padding-bottom: calc(constant(safe-area-inset-bottom) + 112rpx);
|
|
padding-bottom: calc(env(safe-area-inset-bottom) + 112rpx);
|
|
}
|
|
</style> |