myPromote.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. <template>
  2. <view>
  3. <view class="search">
  4. <u-search border-color="#fff" bg-color="#fff" placeholder="输入商家/商场/用户名称" v-model="keyword"></u-search>
  5. </view>
  6. <view class="content">
  7. <view class="flex text-bold" style="padding:0 20rpx 0 40rpx">
  8. <view class="area1">
  9. 加入时间
  10. </view>
  11. <view class="area2">
  12. 名称
  13. </view>
  14. <view class="area3">
  15. 推广类型
  16. </view>
  17. </view>
  18. <view class="item" v-for="(item,index) in 4" :key="index">
  19. <view class="area1 flex flex-direction justify-end padding-left-20" >
  20. 2021-08-10 18:10:32
  21. </view>
  22. <view class="area2">
  23. 黄明潘
  24. </view>
  25. <view class="area3">
  26. 推广商户
  27. </view>
  28. </view>
  29. </view>
  30. </view>
  31. </template>
  32. <script>
  33. export default {
  34. data() {
  35. return {
  36. }
  37. },
  38. methods: {
  39. }
  40. }
  41. </script>
  42. <style lang="scss" scoped>
  43. .search{
  44. padding: 40rpx 30rpx 50rpx;
  45. }
  46. .content{
  47. .area1 {
  48. width: 50%;
  49. }
  50. .area2 {
  51. width: 30%;
  52. }
  53. .area3 {
  54. width: 20%;
  55. }
  56. .item{
  57. margin-top: 20rpx;
  58. background-color: #FFFFFF;
  59. display: flex;
  60. padding-top: 20rpx;
  61. padding-bottom: 20rpx;
  62. }
  63. }
  64. </style>