header.vue 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. <template>
  2. <view class="">
  3. <view class="flex-y-center header">
  4. <view class="flex-grow-1 flex-center" :class="[act_index==1?'active':'']"
  5. @click="onHeader('/storeInfoIng/goodsWarehousing/index')">
  6. 商品入库
  7. </view>
  8. <view class="line"></view>
  9. <view class="flex-grow-1 flex-center" :class="[act_index==2?'active':'']" @click="onHeader('/storeInfoIng/goodsWarehousing/scan')">
  10. 扫码入库
  11. </view>
  12. <!-- <view class="line"></view>
  13. <view class="flex-grow-1 flex-center" :class="[act_index==3?'active':'']" @click="onHeader('/storeInfoIng/goodsWarehousing/record')">
  14. 入库记录
  15. </view> -->
  16. </view>
  17. <view style="height: 80rpx;"></view>
  18. </view>
  19. </template>
  20. <script>
  21. export default {
  22. props:{
  23. act_index:{
  24. type:[Number,String],
  25. default:1
  26. }
  27. },
  28. data() {
  29. return {
  30. }
  31. },
  32. methods:{
  33. onHeader(url) {
  34. uni.redirectTo({
  35. url:url
  36. })
  37. },
  38. }
  39. }
  40. </script>
  41. <style>
  42. .header {
  43. text-align: center;
  44. height: 80rpx;
  45. border-bottom: 1px solid #f1f1f1;
  46. border-top: 1px solid #f1f1f1f1;
  47. font-size: 28rpx;
  48. position: fixed;
  49. left: 0;
  50. top: 0;
  51. width: 100%;
  52. background-color: #FFF;
  53. z-index: 999;
  54. }
  55. .header .flex-grow-1 {
  56. height: 100%;
  57. }
  58. .header .active {
  59. background: #3b93fc;
  60. color: #FFFFFF;
  61. border-radius: 4rpx;
  62. }
  63. .line {
  64. width: 1rpx;
  65. height: 50rpx;
  66. background-color: #ccc;
  67. }
  68. </style>