activity-analysis.vue 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. <template>
  2. <view class="activity-analysis">
  3. <image src="../../../../static/icon-user-active@3x.png" class="analysis-img" mode=""></image>
  4. <view class="analysis-content">
  5. <view class="analysis-club">
  6. 韩国恩盛仪器美容院
  7. </view>
  8. <view class="analysis-tab">
  9. <view class="tab-item">
  10. 忠诚用户
  11. </view>
  12. <view class="tab-item">
  13. 忠诚用户
  14. </view>
  15. </view>
  16. <view class="analysis-info">
  17. <view>
  18. 张顺星
  19. </view>
  20. <view>
  21. 15889586666
  22. </view>
  23. </view>
  24. </view>
  25. </view>
  26. </template>
  27. <script>
  28. export default {
  29. props: {},
  30. data() {
  31. return {}
  32. },
  33. }
  34. </script>
  35. <style lang="scss">
  36. .activity-analysis {
  37. padding: 30rpx 0;
  38. display: flex;
  39. border-bottom: 1px solid #E5E5E5;
  40. .analysis-img {
  41. width: 140rpx;
  42. height: 140rpx;
  43. background: #FFF2E6;
  44. border-radius: 16rpx 16rpx 16rpx 16rpx;
  45. opacity: 1;
  46. }
  47. .analysis-content {
  48. margin-left: 16rpx;
  49. .analysis-club {
  50. color: #333333;
  51. font-size: 30rpx;
  52. margin-bottom: 16rpx;
  53. }
  54. .analysis-tab {
  55. display: flex;
  56. margin-bottom: 16rpx;
  57. .tab-item {
  58. margin-right: 16rpx;
  59. width: 136rpx;
  60. height: 40rpx;
  61. background: #FAEDE5;
  62. border-radius: 8rpx 8rpx 8rpx 8rpx;
  63. opacity: 1;
  64. text-align: center;
  65. line-height: 40rpx;
  66. font-size: 22rpx;
  67. color: #FF5B00;
  68. }
  69. }
  70. .analysis-info {
  71. display: flex;
  72. align-items: center;
  73. font-size: 26rpx;
  74. color: #333333;
  75. view:nth-child(2) {
  76. margin-left: 32rpx;
  77. }
  78. }
  79. }
  80. }
  81. </style>