MrShi
30 分钟以前 59bfd0b8bbbf0ee94ec68e4a3a1a6e536d0ad8fd
small-program/components/custom-tabbar/custom-tabbar.vue
@@ -3,21 +3,22 @@
      <view class="custom-tabbar" :style="{ paddingBottom: safeAreaBottom + 'px' }">
         <view class="tabbar-item" v-for="(item, index) in tabList" :key="index" @click="switchTab(item)">
            <image class="tabbar-icon" :src="currentIndex === index ? item.selectedIconPath : item.iconPath" mode="aspectFit"></image>
            <text class="tabbar-text" :class="{ active: currentIndex === index }">{{ item.text }}</text>
            <text class="tabbar-text" :class="{ active: currentIndex === index, shop: userType === 1 }">{{ item.text }}</text>
         </view>
      </view>
      <view class="tabbar-placeholder" :style="{ height: '100px' }"></view>
      <auth-login :show="showLogin" @close="showLogin = false"></auth-login>
   </view>
</template>
<script>
   import { mapState } from 'vuex'
   export default {
      name: 'CustomTabbar',
      data() {
         return {
            safeAreaBottom: 0,
            showLogin: false,
            memberTabList: [
               {
                  text: '首页',
@@ -49,7 +50,7 @@
                  text: '首页',
                  pagePath: '/shop/pages/store-home/store-home',
                  iconPath: '/static/icon/nav_home@2x.png',
                  selectedIconPath: '/static/icon/nav_home_sel@2x.png'
                  selectedIconPath: '/static/shopTabbar/nav_home_sel@2x.png'
               },
               {
                  text: '钱包',
@@ -61,19 +62,19 @@
                  text: '消息',
                  pagePath: '/shop/pages/message/message',
                  iconPath: '/static/icon/nav_xiaoxi@2x.png',
                  selectedIconPath: '/static/icon/nav_xiaoxi_sel@2x.png'
                  selectedIconPath: '/static/shopTabbar/nav_xiaoxi_sel@2x.png'
               },
               {
                  text: '我的',
                  pagePath: '/shop/pages/mine/mine',
                  iconPath: '/static/icon/nav_wode@2x.png',
                  selectedIconPath: '/static/icon/nav_wode_sel@2x.png'
                  selectedIconPath: '/static/shopTabbar/nav_wode_sel@2x.png'
               }
            ]
         }
      },
      computed: {
         ...mapState(['userType']),
         ...mapState(['userType', 'token']),
         currentIndex() {
            const pages = getCurrentPages()
            const currentPage = pages[pages.length - 1]
@@ -98,6 +99,10 @@
            this.safeAreaBottom = systemInfo.safeAreaInsets.bottom || 0
         },
         switchTab(item) {
            if (item.pagePath === '/pages/itinerary/itinerary' && !this.token) {
               this.showLogin = true
               return
            }
            const currentPath = getCurrentPages()[getCurrentPages().length - 1].$page.fullPath
            if (this.userType === 1) {
               if (currentPath !== item.pagePath) {
@@ -107,6 +112,9 @@
               }
            } else {
               if (currentPath !== item.pagePath) {
                  if(item.pagePath ==='/pages/itinerary/itinerary'){
                     uni.setStorageSync("orderStatus",-1)
                  }
                  uni.switchTab({
                     url: item.pagePath
                  })
@@ -161,5 +169,9 @@
      &.active {
         color: #1ba8fa;
      }
      &.shop.active {
         color: #004096;
      }
   }
</style>