|
|
@@ -1,59 +1,62 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <van-tabbar v-model="ActiveMessage" @change="tabBarChange" active-color="#0057ba" inactive-color="#222">
|
|
|
- <van-tabbar-item name="home">
|
|
|
- <span>首页</span>
|
|
|
- <template #icon>
|
|
|
- <van-icon :name="tabBarActive == 'home' ? honeselect: home"/>
|
|
|
- </template>
|
|
|
- </van-tabbar-item>
|
|
|
-<!-- <van-tabbar-item name="ai" >-->
|
|
|
-<!-- <span>AI参谋</span>-->
|
|
|
-<!-- <template #icon>-->
|
|
|
-<!-- <van-icon :name="tabBarActive == 'ai' ? aiselect : ai"/>-->
|
|
|
-<!-- </template>-->
|
|
|
-<!-- </van-tabbar-item>-->
|
|
|
- <van-tabbar-item name="deviceWithin">
|
|
|
- <span>计划内</span>
|
|
|
- <template #icon>
|
|
|
- <van-icon :name="tabBarActive == 'deviceWithin' ? jihuaselect : jihua"/>
|
|
|
- </template>
|
|
|
- </van-tabbar-item>
|
|
|
- <van-tabbar-item name="outsidelist">
|
|
|
- <span>计划外</span>
|
|
|
- <template #icon>
|
|
|
- <van-icon :name="tabBarActive == 'outsidelist' ? outselect : out"/>
|
|
|
- </template>
|
|
|
- </van-tabbar-item>
|
|
|
- <van-tabbar-item name="MyList">
|
|
|
- <span>我的</span>
|
|
|
- <template #icon>
|
|
|
- <van-icon :name="tabBarActive == 'MyList' ? storeselect : store"/>
|
|
|
- </template>
|
|
|
- </van-tabbar-item>
|
|
|
- </van-tabbar>
|
|
|
- </div>
|
|
|
-
|
|
|
+ <div class="tabBar">
|
|
|
+ <van-tabbar
|
|
|
+ v-model="ActiveMessage"
|
|
|
+ @change="tabBarChange"
|
|
|
+ active-color="#0057ba"
|
|
|
+ inactive-color="#222">
|
|
|
+ <van-tabbar-item name="home">
|
|
|
+ <span>首页</span>
|
|
|
+ <template #icon>
|
|
|
+ <van-icon :name="tabBarActive == 'home' ? honeselect : home" />
|
|
|
+ </template>
|
|
|
+ </van-tabbar-item>
|
|
|
+ <!-- <van-tabbar-item name="ai" >-->
|
|
|
+ <!-- <span>AI参谋</span>-->
|
|
|
+ <!-- <template #icon>-->
|
|
|
+ <!-- <van-icon :name="tabBarActive == 'ai' ? aiselect : ai"/>-->
|
|
|
+ <!-- </template>-->
|
|
|
+ <!-- </van-tabbar-item>-->
|
|
|
+ <van-tabbar-item name="deviceWithin">
|
|
|
+ <span>计划内</span>
|
|
|
+ <template #icon>
|
|
|
+ <van-icon :name="tabBarActive == 'deviceWithin' ? jihuaselect : jihua" />
|
|
|
+ </template>
|
|
|
+ </van-tabbar-item>
|
|
|
+ <van-tabbar-item name="outsidelist">
|
|
|
+ <span>计划外</span>
|
|
|
+ <template #icon>
|
|
|
+ <van-icon :name="tabBarActive == 'outsidelist' ? outselect : out" />
|
|
|
+ </template>
|
|
|
+ </van-tabbar-item>
|
|
|
+ <van-tabbar-item name="MyList">
|
|
|
+ <span>我的</span>
|
|
|
+ <template #icon>
|
|
|
+ <van-icon :name="tabBarActive == 'MyList' ? storeselect : store" />
|
|
|
+ </template>
|
|
|
+ </van-tabbar-item>
|
|
|
+ </van-tabbar>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import home from "@/assets/Icon/home.png";
|
|
|
-import honeselect from "@/assets/Icon/hone-select.png";
|
|
|
-import jihua from "@/assets/Icon/jihua.png";
|
|
|
-import jihuaselect from "@/assets/Icon/jihuaselect.png";
|
|
|
-import out from "@/assets/Icon/out.png";
|
|
|
-import outselect from "@/assets/Icon/outselect.png";
|
|
|
-import store from "@/assets/Icon/store.png";
|
|
|
-import storeselect from "@/assets/Icon/storeselect.png";
|
|
|
-import ai from "@/assets/Icon/ai.png";
|
|
|
-import aiselect from "@/assets/Icon/aiselect.png";
|
|
|
+import home from '@/assets/Icon/home.png';
|
|
|
+import honeselect from '@/assets/Icon/hone-select.png';
|
|
|
+import jihua from '@/assets/Icon/jihua.png';
|
|
|
+import jihuaselect from '@/assets/Icon/jihuaselect.png';
|
|
|
+import out from '@/assets/Icon/out.png';
|
|
|
+import outselect from '@/assets/Icon/outselect.png';
|
|
|
+import store from '@/assets/Icon/store.png';
|
|
|
+import storeselect from '@/assets/Icon/storeselect.png';
|
|
|
+import ai from '@/assets/Icon/ai.png';
|
|
|
+import aiselect from '@/assets/Icon/aiselect.png';
|
|
|
export default {
|
|
|
- name: "tabBar",
|
|
|
+ name: 'tabBar',
|
|
|
props: {
|
|
|
tabBarActive: {
|
|
|
type: String,
|
|
|
- default: 'home'
|
|
|
- }
|
|
|
+ default: 'home',
|
|
|
+ },
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
@@ -68,26 +71,34 @@ export default {
|
|
|
out: out,
|
|
|
outselect: outselect,
|
|
|
tabBarAct: this.tabBarActive,
|
|
|
- show:false
|
|
|
- }
|
|
|
+ show: false,
|
|
|
+ };
|
|
|
},
|
|
|
computed: {
|
|
|
ActiveMessage: {
|
|
|
get() {
|
|
|
- return this.tabBarAct = this.tabBarActive;
|
|
|
+ return (this.tabBarAct = this.tabBarActive);
|
|
|
},
|
|
|
set(newValue) {
|
|
|
return newValue;
|
|
|
- }
|
|
|
- }
|
|
|
+ },
|
|
|
+ },
|
|
|
},
|
|
|
methods: {
|
|
|
tabBarChange(index) {
|
|
|
- if(localStorage.getItem('loginName')=='lihaoyang.sm'||localStorage.getItem('loginName')=='zhangjunyang.sm'){
|
|
|
- this.show=true
|
|
|
+ if (
|
|
|
+ localStorage.getItem('loginName') == 'lihaoyang.sm' ||
|
|
|
+ localStorage.getItem('loginName') == 'zhangjunyang.sm'
|
|
|
+ ) {
|
|
|
+ this.show = true;
|
|
|
}
|
|
|
- this.$router.push({name: index + ""})
|
|
|
+ this.$router.push({ name: index + '' });
|
|
|
},
|
|
|
- }
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss">
|
|
|
+.tabBar {
|
|
|
+ z-index: 99999999;
|
|
|
}
|
|
|
-</script>
|
|
|
+</style>
|