index.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. <template>
  2. <view class="content">
  3. <view class="top">
  4. <view class="inputBox">
  5. <img src="../../static/img/icon_search.png" alt="" class="searchImg">
  6. <input v-model="vin" type="text" placeholder="请输入17位车架号查询" class="topInput" @confirm="inputconfirm">
  7. <!-- <image src="../../static/img/icon_camera.png" mode="" class="cameraImg"></image> -->
  8. </view>
  9. </view>
  10. <!-- <view class="history">
  11. <view class="historyTop">
  12. <view class="historyTopTxt">历史搜索</view>
  13. <image src="../../static/img/icon_delete.png" mode="" class="historyDelImg"></image>
  14. </view>
  15. <view v-for="(item,index) in 3" class="historyLIneBox">
  16. <view class="historyLIne" @click="gogroup2('LVHFC1663G6003140')">LVHFC1663G6003140</view>
  17. </view>
  18. </view> -->
  19. </view>
  20. </template>
  21. <script>
  22. export default {
  23. data() {
  24. return {
  25. vin: 'LVHFC1663G6003140'
  26. }
  27. },
  28. onLoad() {
  29. },
  30. methods: {
  31. inputconfirm(){
  32. console.log(this.vin)
  33. this.gogroup()
  34. },
  35. gogroup(){
  36. uni.navigateTo({
  37. url:'group?vin='+this.vin
  38. })
  39. },
  40. gogroup2(vin){
  41. uni.navigateTo({
  42. url:'group?vin='+vin
  43. })
  44. }
  45. }
  46. }
  47. </script>
  48. <style scoped>
  49. .comment{
  50. padding-bottom: constant(safe-area-inset-bottom);
  51. padding-bottom: env(safe-area-inset-bottom);
  52. }
  53. .top{
  54. height: 96rpx;
  55. border-bottom: 1px solid #EEEEEE;
  56. padding-top: 24rpx;
  57. }
  58. .searchImg{
  59. width: 40rpx;
  60. height: 40rpx;
  61. margin-top: 16rpx;
  62. margin-left: 20rpx;
  63. }
  64. .inputBox{
  65. width: 702rpx;
  66. height: 72rpx;
  67. background: #F4F5F7;
  68. border-radius: 36rpx;
  69. margin-left: 24rpx;
  70. display:flex;
  71. position: relative;
  72. }
  73. .topInput{
  74. font-size: 28rpx;
  75. height: 72rpx;
  76. line-height: 72rpx;
  77. padding-left: 16rpx;
  78. width: 500rpx;
  79. }
  80. .cameraImg{
  81. position: absolute;
  82. width: 40rpx;
  83. height: 40rpx;
  84. top: 16rpx;
  85. right: 20rpx;
  86. }
  87. .history{
  88. padding: 24rpx;
  89. }
  90. .historyTop{
  91. display: flex;
  92. justify-content: space-between;
  93. }
  94. .historyDelImg{
  95. width: 34rpx;height: 34rpx;
  96. }
  97. .historyTopTxt{
  98. font-size: 28rpx;
  99. font-weight: 400;
  100. color: #666666;
  101. line-height: 34rpx;
  102. }
  103. .historyLIne{
  104. color: #333333;font-size: 24rpx;
  105. height: 64rpx;
  106. background: #F4F5F7;
  107. border-radius: 32rpx;
  108. line-height: 64rpx;
  109. padding: 0 24rpx;
  110. margin-top: 20rpx;
  111. }
  112. .historyLIneBox{
  113. display: flex;
  114. }
  115. </style>