myPromote.vue 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <template>
  2. <view>
  3. <view class="cu-bar search bg-white">
  4. <view class="search-form round">
  5. <text class="cuIcon-search"></text>
  6. <input v-model="keyword" :adjust-position="false" type="text" placeholder="输入用户/商家/商场名称"
  7. confirm-type="search"></input>
  8. </view>
  9. <view class="action">
  10. 搜索
  11. </view>
  12. </view>
  13. <view class="tag">
  14. <view @click="selectedIndex=index" class="cu-tag round sm margin-right-40" :class="selectedIndex==index?'selected':'in_selected'"
  15. v-for="(item,index) in keywordList" :key="index">
  16. {{item}}
  17. </view>
  18. </view>
  19. </view>
  20. </template>
  21. <script>
  22. export default {
  23. data() {
  24. return {
  25. keyword: '',
  26. keywordList: ['全部', '推广用户', '推广商家', '推广商场'],
  27. selectedIndex: 0,
  28. }
  29. },
  30. methods: {
  31. }
  32. }
  33. </script>
  34. <style lang="scss" scoped>
  35. .tag {
  36. background-color: #FFFFFF;
  37. padding: 0 30rpx 20rpx;
  38. .selected {
  39. background-color: #FCE7D2;
  40. color: #F39248
  41. }
  42. .in_selected{
  43. background-color: #f0f0f0;
  44. color: #999999;
  45. }
  46. }
  47. </style>