nav.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. <template>
  2. <view class="" >
  3. <!-- 自定义导航 -->
  4. <view class="zdyNavBox">
  5. <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
  6. <view class="zdyNav">
  7. <view class="zdyNavLeft">
  8. <image src="../../static/img/nav_icon_back.png" mode="aspectFit" class="backImg" @click="goback"></image>
  9. <view class="navsx"></view>
  10. <image src="../../static/img/nav_icon_home.png" mode="" class="homeImg" @click="gohome"></image>
  11. </view>
  12. <view class="zdyNavTitle">{{title}}</view>
  13. <view style="width: 250rpx;"></view>
  14. </view>
  15. </view>
  16. <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
  17. <view style="height: 44px;"></view>
  18. </view>
  19. </template>
  20. <script>
  21. export default {
  22. props:['title','iStatusBarHeight','cj'],
  23. data() {
  24. return {
  25. }
  26. },
  27. onLoad(opt) {
  28. //this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
  29. },
  30. onShow() {
  31. },
  32. methods: {
  33. goback() {
  34. uni.navigateBack({
  35. delta: 1
  36. })
  37. },
  38. gohome(){
  39. //console.log(23+this.cj)
  40. if(this.cj==3){
  41. //console.log(123)
  42. uni.switchTab({
  43. url:'../../index/index'
  44. })
  45. }else{
  46. uni.switchTab({
  47. url:'../index/index'
  48. })
  49. }
  50. },
  51. }
  52. }
  53. </script>
  54. <style scoped>
  55. .zdyNavBox{
  56. width: 100vw;
  57. background: #FFFFFF;
  58. position: fixed;
  59. top: 0;
  60. left: 0;
  61. z-index: 9999999;
  62. }
  63. .zdyNav{
  64. height: 44px;
  65. display: flex;
  66. justify-content: space-between;
  67. align-items: center;
  68. }
  69. .backImg{
  70. width: 44rpx;
  71. height: 44rpx;
  72. /* margin-left: 10rpx; */
  73. /* margin-right: 20rpx; */
  74. }
  75. .navsx{
  76. width: 2rpx;
  77. height: 44rpx;
  78. background: #e1e1e1;
  79. margin: 0 26rpx 0rpx 18rpx;
  80. }
  81. .homeImg{
  82. width: 44rpx;
  83. height: 44rpx;
  84. }
  85. .zdyNavLeft{
  86. display: flex;
  87. align-items: center;
  88. border: 1px solid #e1e1e1;
  89. margin-left: 15rpx;
  90. border-radius: 35rpx;
  91. padding: 10rpx 23rpx 8rpx 13rpx;
  92. }
  93. .zdyNavTitle{
  94. width: 100vw;
  95. height: 44px;
  96. background: #FFFFFF;
  97. text-align: center;
  98. font-size: 34rpx;
  99. line-height: 44px;
  100. }
  101. </style>