Tabbar.vue 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. <template >
  2. <view >
  3. <u-tabbar
  4. :class="{
  5. springclass:spring
  6. }"
  7. v-model="myCurrent" :list="tabbarList"
  8. :inactiveColor="inColor" :bgColor="bgColor"
  9. :before-switch="beforeSwitch" :activeColor="acColor" :height="spring?('120rpx' ):(elderStatus ? '120rpx' : '110rpx')" :icon-size="elderStatus ? '56rpx' : '40rpx'"></u-tabbar>
  10. </view>
  11. </template>
  12. <script>
  13. export default {
  14. name:"tabbarJob",
  15. props:{
  16. spring:false,
  17. current: 0,
  18. elderStatus: false,
  19. bgColor: {
  20. type: String,
  21. default: '#ffffff'
  22. },
  23. inColor: {
  24. type: String,
  25. default: '#A8B0AD'
  26. },
  27. acColor: {
  28. type: String,
  29. default: '#009143'
  30. },
  31. },
  32. data() {
  33. return {
  34. activeColor:"#5098FF",
  35. oldindex:this.current,
  36. myCurrent:this.current,
  37. tabbarList: [{
  38. iconPath: "home-3-line",
  39. selectedIconPath: "home-3-fill",
  40. text: '主页 ',
  41. count: 0,
  42. isDot: true,
  43. customIcon: true,
  44. pagePath2:"/pages/index/index",
  45. },
  46. {
  47. // iconPath: img4,
  48. // selectedIconPath: img3,
  49. iconPath: "gift",
  50. selectedIconPath: "gift-fill",
  51. text: '活动',
  52. midButton: true,
  53. //customIcon: true,
  54. pagePath2:"/pages/index/activity",
  55. },
  56. {
  57. iconPath: "road-map-line",
  58. selectedIconPath: "road-map-fill",
  59. text: '找桩',
  60. midButton: true,
  61. customIcon: true,
  62. pagePath2:"/pages/searchPile/searchPile",
  63. },
  64. {
  65. iconPath: "user-5-line",
  66. selectedIconPath: "user-5-fill",
  67. text: '我的',
  68. count: 0,
  69. isDot: false,
  70. customIcon: true,
  71. pagePath2:"/pages/user/index",
  72. }
  73. ],
  74. };
  75. },methods:{
  76. setcount(c){
  77. this.myCurrent=c
  78. },
  79. beforeSwitch(index){
  80. if(index==this.current){
  81. return false
  82. }
  83. var url =this.tabbarList[index].pagePath2;
  84. uni.navigateTo({
  85. url: url
  86. })
  87. if(index==1){
  88. this.myCurrent=this.oldindex;
  89. return false;
  90. }else{
  91. return true;
  92. }
  93. },
  94. },mounted(){
  95. console.log("mountedmountedmountedmountedmounted")
  96. if(this.spring){
  97. var img1=require('@/assets/img/spring/2025/index2.png')
  98. var img2=require('@/assets/img/spring/2025/index3.png')
  99. var img3=require('@/assets/img/spring/2025/index4.png')
  100. var img4=require('@/assets/img/spring/2025/index5.png')
  101. this.tabbarList[0].iconPath=img1
  102. this.tabbarList[0].selectedIconPath=img1
  103. this.tabbarList[1].iconPath=img2
  104. this.tabbarList[1].selectedIconPath=img2
  105. this.tabbarList[2].iconPath=img3
  106. this.tabbarList[2].selectedIconPath=img3
  107. this.tabbarList[3].iconPath=img4
  108. this.tabbarList[3].selectedIconPath=img4
  109. this.acColor="red"
  110. }
  111. },destroyed(){
  112. }
  113. }
  114. </script>
  115. <style>
  116. </style>