forked from angelo/web-retail-h5
190 lines
5.6 KiB
Vue
190 lines
5.6 KiB
Vue
<!--
|
|
* @Descripttion:
|
|
* @version:
|
|
* @Author: kBank
|
|
* @Date: 2022-11-21 15:11:22
|
|
-->
|
|
<template>
|
|
<view>
|
|
<u-tabbar :value="current?current:0"
|
|
v-if="user.skin==0"
|
|
@change="tabbarChange"
|
|
:fixed="true"
|
|
:placeholder="false"
|
|
:border="false"
|
|
:safeAreaInsetBottom="true"
|
|
inactiveColor="#666666"
|
|
activeColor="#333333">
|
|
<u-tabbar-item :text="$t('ENU_MENU_10')">
|
|
<image class="u-page__item__slot-icon"
|
|
slot="active-icon"
|
|
src="@/static/images/one1.png"></image>
|
|
<image class="u-page__item__slot-icon"
|
|
slot="inactive-icon"
|
|
src="@/static/images/one2.png"></image>
|
|
</u-tabbar-item>
|
|
<u-tabbar-item :text="$t('ENU_APPROVE_B_522')">
|
|
<image class="u-page__item__slot-icon"
|
|
slot="active-icon"
|
|
src="@/static/images/two1.png"></image>
|
|
<image class="u-page__item__slot-icon"
|
|
slot="inactive-icon"
|
|
src="@/static/images/two2.png"></image>
|
|
</u-tabbar-item>
|
|
<u-tabbar-item :text="$t('ENU_MENU_30')">
|
|
<image class="u-page__item__slot-icon"
|
|
slot="active-icon"
|
|
src="@/static/images/five1.jpg"></image>
|
|
<image class="u-page__item__slot-icon"
|
|
slot="inactive-icon"
|
|
src="@/static/images/five2.jpg"></image>
|
|
</u-tabbar-item>
|
|
<u-tabbar-item :text="$t('N_I_194')"
|
|
:badge="shopCarLength">
|
|
<image class="u-page__item__slot-icon"
|
|
slot="active-icon"
|
|
src="@/static/images/three1.png"></image>
|
|
<image class="u-page__item__slot-icon"
|
|
slot="inactive-icon"
|
|
src="@/static/images/three2.png"></image>
|
|
</u-tabbar-item>
|
|
|
|
<u-tabbar-item :text="$t('w_0350')">
|
|
<image class="u-page__item__slot-icon"
|
|
slot="active-icon"
|
|
src="@/static/images/fore1.png"></image>
|
|
<image class="u-page__item__slot-icon"
|
|
slot="inactive-icon"
|
|
src="@/static/images/fore2.png"></image>
|
|
</u-tabbar-item>
|
|
</u-tabbar>
|
|
<u-tabbar :value="current?current:0"
|
|
class="greenEd"
|
|
v-if="user.skin==2"
|
|
@change="tabbarChange"
|
|
:fixed="true"
|
|
:placeholder="false"
|
|
:border="false"
|
|
:safeAreaInsetBottom="true"
|
|
inactiveColor="#666666"
|
|
activeColor="#333333">
|
|
<u-tabbar-item :text="$t('ENU_MENU_10')">
|
|
<image class="u-page__item__slot-icon1"
|
|
slot="active-icon"
|
|
src="@/static/images/one11.jpg"></image>
|
|
<image class="u-page__item__slot-icon1"
|
|
slot="inactive-icon"
|
|
src="@/static/images/one11.jpg"></image>
|
|
</u-tabbar-item>
|
|
<u-tabbar-item :text="$t('ENU_APPROVE_B_522')">
|
|
<image class="u-page__item__slot-icon1"
|
|
slot="active-icon"
|
|
src="@/static/images/two11.jpg"></image>
|
|
<image class="u-page__item__slot-icon1"
|
|
slot="inactive-icon"
|
|
src="@/static/images/two11.jpg"></image>
|
|
</u-tabbar-item>
|
|
<u-tabbar-item :text="$t('ENU_MENU_30')">
|
|
<image class="u-page__item__slot-icon2"
|
|
slot="active-icon"
|
|
src="@/static/images/five11.jpg"></image>
|
|
<image class="u-page__item__slot-icon2"
|
|
slot="inactive-icon"
|
|
src="@/static/images/five11.jpg"></image>
|
|
</u-tabbar-item>
|
|
<u-tabbar-item :text="$t('N_I_194')"
|
|
:badge="shopCarLength">
|
|
<image class="u-page__item__slot-icon1"
|
|
slot="active-icon"
|
|
src="@/static/images/three11.jpg"></image>
|
|
<image class="u-page__item__slot-icon1"
|
|
slot="inactive-icon"
|
|
src="@/static/images/three11.jpg"></image>
|
|
</u-tabbar-item>
|
|
|
|
<u-tabbar-item :text="$t('w_0350')">
|
|
<image class="u-page__item__slot-icon1"
|
|
slot="active-icon"
|
|
src="@/static/images/fore11.jpg"></image>
|
|
<image class="u-page__item__slot-icon1"
|
|
slot="inactive-icon"
|
|
src="@/static/images/fore11.jpg"></image>
|
|
</u-tabbar-item>
|
|
</u-tabbar>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from "vuex";
|
|
export default {
|
|
props: {
|
|
current: Number,
|
|
},
|
|
data() {
|
|
return {
|
|
list: [
|
|
{
|
|
text: this.$t('ENU_MENU_10'),
|
|
path: 'pages/index/index',
|
|
},
|
|
{
|
|
text: this.$t('ENU_APPROVE_B_522'),
|
|
path: 'pages/email/index',
|
|
},
|
|
{
|
|
text: this.$t('ENU_MENU_30'),
|
|
path: 'pages/specialArea/index',
|
|
},
|
|
{
|
|
text: this.$t('N_I_194'),
|
|
path: 'pages/shoppingCar/index',
|
|
},
|
|
|
|
{
|
|
text: this.$t('w_0350'),
|
|
path: 'pages/mine/index',
|
|
},
|
|
],
|
|
}
|
|
},
|
|
computed: {
|
|
...mapGetters(['shopCarLength','user']),
|
|
},
|
|
methods: {
|
|
tabbarChange(e) {
|
|
uni.switchTab({
|
|
url: '/' + this.list[e].path,
|
|
})
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.u-page__item__slot-icon {
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
.u-page__item__slot-icon1 {
|
|
width: 35px;
|
|
height: 35px;
|
|
// margin-bottom: 20px
|
|
}
|
|
.u-page__item__slot-icon2 {
|
|
width: 35px;
|
|
height: 35px;
|
|
// margin-bottom: 20px
|
|
}
|
|
.greenEd{
|
|
::v-deep .u-tabbar__content{
|
|
background: linear-gradient(to bottom, #fff, #b6fdda);
|
|
}
|
|
::v-deep .u-tabbar__content__item-wrapper{
|
|
height: 80px
|
|
}
|
|
::v-deep .u-tabbar-item{
|
|
// margin-bottom: 30px;
|
|
}
|
|
}
|
|
</style>
|