promotion.vue 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247
  1. <template>
  2. <view class="box">
  3. <view class="contBox">
  4. <view class="top">
  5. <view class="topLeft">
  6. <view class="topLeftTitle">未提现返利</view>
  7. <view class="topLeftNum">11</view>
  8. </view>
  9. <view class="topRight" @click="goRouter('promotionExtract')">提现</view>
  10. </view>
  11. <view class="numBox">
  12. <view class="numLine">总收益:120.34</view>
  13. <view class="numLine">已到账:78.99</view>
  14. </view>
  15. <view class="jlLine">
  16. <view class="lineTop">
  17. <view class="lineMs">集客活动名称</view>
  18. <view class="lineNum">收益:<span class="spanNum">50.54</span></view>
  19. </view>
  20. <view class="lineBottom">
  21. <view class="time">2020-07-20 19:08</view>
  22. <view class="nickName"></view>
  23. </view>
  24. </view>
  25. </view>
  26. </view>
  27. </template>
  28. <script>
  29. export default {
  30. components: {
  31. },
  32. data() {
  33. return {
  34. detail:'',
  35. themeColor:'',
  36. userInfo:'',
  37. }
  38. },
  39. onLoad(opt) {
  40. this.themeColor = uni.getStorageSync("themeColor");
  41. this.userInfo = uni.getStorageSync("userInfo");
  42. //this.getData();
  43. //this.getExplain();
  44. },
  45. onShow() {
  46. },
  47. methods: {
  48. getData(){
  49. uni.showLoading({
  50. title: '加载中'
  51. })
  52. this.$http('openMCustomer/getIndexData', {
  53. }, 'GET').then(res => {
  54. uni.hideLoading();
  55. this.detail = res.data
  56. //console.log('list+=', this.queryShopList);
  57. })
  58. },
  59. getExplain(){
  60. this.$http('openMCustomer/getExplain', {
  61. }, 'GET').then(res => {
  62. //uni.hideLoading();
  63. //this.detail = res.data
  64. //console.log('list+=', this.queryShopList);
  65. })
  66. },
  67. goRouter(url){
  68. uni.navigateTo({
  69. url:url
  70. })
  71. }
  72. }
  73. }
  74. </script>
  75. <style scoped lang="less">
  76. .numBox{
  77. display: flex;color: #666666;
  78. padding-top: 20rpx;font-size: 26rpx;
  79. }
  80. .numLine{
  81. padding-right: 20rpx;
  82. }
  83. .box {
  84. width: 100vw;
  85. min-height: 100vh;
  86. background: #F4F5F7;
  87. }
  88. .contBox{
  89. padding: 20rpx 24rpx;
  90. }
  91. .top{
  92. background: #FFFFFF;
  93. border-radius: 10rpx;
  94. padding: 24rpx 20rpx;
  95. display: flex;
  96. justify-content: space-between;
  97. }
  98. .topLeftTitle{
  99. font-size: 30rpx;
  100. font-family: PingFangSC-Medium, PingFang SC;
  101. font-weight: 500;
  102. color: #333333;
  103. }
  104. .topLeftNum{
  105. font-size: 40rpx;
  106. font-family: PingFangSC-Semibold, PingFang SC;
  107. font-weight: 600;
  108. color: #EC0F0A;
  109. padding-top: 24rpx;
  110. }
  111. .topRight{
  112. width: 138rpx;
  113. height: 64rpx;
  114. background: #EC0F0A;
  115. border-radius: 10rpx;
  116. line-height: 64rpx;
  117. text-align: center;
  118. color: #FFFFFF;
  119. font-size: 28rpx;
  120. margin-top: 34rpx;
  121. }
  122. .xffl{
  123. background: #FFFFFF;
  124. margin-top: 20rpx;
  125. padding: 20rpx;
  126. border-radius: 10rpx;
  127. }
  128. .xfflTitle{
  129. font-size: 30rpx;
  130. font-family: PingFangSC-Medium, PingFang SC;
  131. font-weight: 500;
  132. color: #333333;
  133. }
  134. .xfflLine{
  135. display: flex;
  136. justify-content: space-between;
  137. font-size: 24rpx;
  138. font-family: PingFangSC-Regular, PingFang SC;
  139. font-weight: 400;
  140. color: #333333;
  141. line-height: 33rpx;
  142. padding: 15rpx 0;
  143. }
  144. .xfflyq{
  145. width: 10rpx;
  146. height: 10rpx;
  147. background: #EC0F0A;
  148. border-radius: 50%;
  149. margin-top: 12rpx;
  150. margin-right: 14rpx;
  151. }
  152. .xfflyq2{
  153. width: 10rpx;
  154. height: 10rpx;
  155. background: #3F90F7;
  156. border-radius: 50%;
  157. margin-top: 12rpx;
  158. margin-right: 14rpx;
  159. }
  160. .xfflyq3{
  161. width: 10rpx;
  162. height: 10rpx;
  163. background: #FF4F00;
  164. border-radius: 50%;
  165. margin-top: 12rpx;
  166. margin-right: 14rpx;
  167. }
  168. .xfflyq4{
  169. width: 10rpx;
  170. height: 10rpx;
  171. background: #6F2BE8;
  172. border-radius: 50%;
  173. margin-top: 12rpx;
  174. margin-right: 14rpx;
  175. }
  176. .xfflLineLeft{
  177. display: flex;
  178. width: 200rpx;
  179. }
  180. .xfflLineM{
  181. width: 200rpx;
  182. text-align: right;
  183. }
  184. .xfflLineR{
  185. width: 200rpx;
  186. text-align: right;
  187. }
  188. .lineLeftImg{
  189. width: 34rpx;
  190. height: 34rpx;
  191. }
  192. .lineLeftTxt{
  193. color: #333333;font-size: 28rpx;line-height: 34rpx;padding-left: 24rpx;
  194. }
  195. .lineRIghtNUm{
  196. color: #666666;font-size: 28rpx;line-height: 34rpx;padding-right: 16rpx;
  197. }
  198. .lineRightImg{
  199. width: 12rpx;
  200. height: 20rpx;
  201. margin-top: 7rpx;
  202. }
  203. .lineBox{
  204. background: #FFFFFF;width: 702rpx;margin-top: 20rpx;
  205. }
  206. .line{
  207. display: flex;
  208. justify-content: space-between;
  209. padding: 38rpx 32rpx;
  210. }
  211. .lineLeft{
  212. display: flex;
  213. }
  214. .lineRight{
  215. display: flex;
  216. }
  217. .smImg{
  218. width: 30rpx;height: 30rpx;
  219. }
  220. .smTxt{
  221. font-size: 28rpx;
  222. font-family: PingFangSC-Regular, PingFang SC;
  223. font-weight: 400;
  224. color: #999999;
  225. line-height: 30rpx;
  226. padding-left: 5rpx;
  227. }
  228. .smBox{
  229. display: flex;
  230. justify-content: center;
  231. padding-top: 30rpx;
  232. }
  233. </style>