wallet.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275
  1. <template>
  2. <view class="index">
  3. <scroll-view scroll-y="true" @scrolltolower="lower" style="height: 100%;">
  4. <nav-header>我的账户</nav-header>
  5. <view class="" style="width: 686rpx;margin: auto;" @click="table1">
  6. <image src="/static/my/1.png" mode="widthFix" style="width: 686rpx;" v-if="third_id==''"></image>
  7. <image src="/static/my/2.png" mode="widthFix" style="width: 686rpx;" v-else></image>
  8. </view>
  9. <!-- 我的余额 -->
  10. <!-- <view class="mymoney">
  11. <view class="">
  12. 我的余额
  13. </view>
  14. <view class="systemColor">
  15. {{money}} <text>元</text>
  16. </view>
  17. <view class="btn_box">
  18. <view class="" @click="table()">
  19. <view class="">
  20. 充值
  21. </view>
  22. </view>
  23. <view class="" @click="href('/pages/my/wallet/whit')">
  24. <view class="">
  25. 提现
  26. </view>
  27. </view>
  28. </view>
  29. </view> -->
  30. <!-- 我的余额 结束-->
  31. <!-- 明细列表 -->
  32. <!-- <view class="content">
  33. <view class="title">
  34. <view class="">账单明细</view>
  35. </view>
  36. <view class="item" v-for="(item,index) in list" :key="index">
  37. <view class="">
  38. <view class="">
  39. {{item.name}}
  40. </view>
  41. <view class="">
  42. {{item.create_at}}
  43. </view>
  44. </view>
  45. <view class="orange" v-if="item.amount>0">
  46. {{item.amount}}
  47. </view>
  48. <view class="fff" v-else>
  49. {{item.amount}}
  50. </view>
  51. </view>
  52. </view> -->
  53. <!-- 明细列表 结束-->
  54. </scroll-view>
  55. </view>
  56. </template>
  57. <script>
  58. import navHeader from "@/components/my/nav_header.vue"
  59. export default {
  60. components: {
  61. navHeader
  62. },
  63. data() {
  64. return {
  65. money: "",
  66. page: 0,
  67. list: [],
  68. mx: false,
  69. is_cert: '',
  70. third_id:''
  71. }
  72. },
  73. onReachBottom() {
  74. this.get_mx()
  75. },
  76. onShow() {
  77. this.api.get_user_info()
  78. this.money = uni.getStorageSync("user_info").balance
  79. this.is_cert = uni.getStorageSync("user_info").is_cert
  80. this.third_id = uni.getStorageSync("user_info").third_id
  81. this.get_mx()
  82. },
  83. methods: {
  84. table1() {
  85. this.api.open().then(res => {
  86. if(res.code==1) {
  87. window.location = res.data
  88. // uni.setStorage({
  89. // key:"pay_info",
  90. // data:res.data,
  91. // success:()=>{
  92. // // console.log("Sds")
  93. // this.$api.link(1,"121");
  94. // }
  95. // })
  96. }
  97. })
  98. },
  99. table() {
  100. if (this.is_cert == 1) {
  101. this.$api.to('/pages/my/wallet/recharge')
  102. } else {
  103. this.$api.pop('请先实名之后充值')
  104. }
  105. },
  106. lower() {
  107. this.get_mx()
  108. },
  109. init() {
  110. this.page = 0
  111. },
  112. get_mx() {
  113. this.api.mx(30, ++this.page).then(res => {
  114. res.data.data.forEach(ele => {
  115. this.list.push(ele)
  116. })
  117. })
  118. }
  119. }
  120. }
  121. </script>
  122. <style scoped>
  123. .index {
  124. box-sizing: border-box;
  125. padding-top: 100rpx;
  126. }
  127. .mymoney {
  128. width: 710rpx;
  129. height: 340rpx;
  130. background: #fff;
  131. margin: 24rpx auto;
  132. border-radius: 16rpx;
  133. box-sizing: border-box;
  134. background: linear-gradient(180deg, #69FF60 0%, #0C9D5B 100%);
  135. border-radius: 40rpx;
  136. position: relative;
  137. }
  138. .mymoney>view:first-child {
  139. padding-top: 60rpx;
  140. font-size: 28rpx;
  141. font-weight: 400;
  142. text-align: center;
  143. color: #000;
  144. }
  145. .mymoney>view:nth-child(2) {
  146. margin-top: 30rpx;
  147. text-align: center;
  148. font-size: 44rpx;
  149. font-weight: 400;
  150. color: #000;
  151. }
  152. .mymoney>view:nth-child(2) text {
  153. font-size: 24rpx;
  154. }
  155. .mymoney>view:nth-child(3) {
  156. color: #000;
  157. font-size: 24rpx;
  158. text-align: center;
  159. margin-top: 20rpx;
  160. }
  161. .btn_box {
  162. position: absolute;
  163. left: 0;
  164. bottom: 0;
  165. font-size: 24rpx;
  166. display: flex;
  167. justify-content: space-between;
  168. align-items: center;
  169. box-sizing: border-box;
  170. width: 100%;
  171. height: 100rpx;
  172. background: linear-gradient(180deg, #69FF60 0%, #0C9D5B 100%);
  173. border-radius: 0px 0px 16px 16px;
  174. }
  175. .btn_box>view {
  176. flex: 1;
  177. text-align: center;
  178. font-size: 28rpx;
  179. color: #000;
  180. }
  181. .btn_box image:first-child {
  182. width: 54rpx;
  183. height: 54rpx;
  184. vertical-align: middle;
  185. margin-right: 10rpx;
  186. }
  187. .btn_box image:last-child {
  188. width: 34rpx;
  189. height: 34rpx;
  190. vertical-align: middle;
  191. margin-left: 10rpx;
  192. }
  193. .btn_box>view:nth-child(1) {
  194. position: relative;
  195. }
  196. .btn_box>view:nth-child(1)::after {
  197. content: '';
  198. position: absolute;
  199. top: 50%;
  200. right: 0;
  201. width: 3rpx;
  202. height: 40rpx;
  203. background: #000;
  204. display: inline-block;
  205. transform: translateY(-50%);
  206. }
  207. .content {
  208. width: 710rpx;
  209. box-sizing: border-box;
  210. padding: 0 32rpx;
  211. margin: 0 auto;
  212. margin-top: 20rpx;
  213. color: #fff;
  214. }
  215. .content .title {
  216. font-size: 30rpx;
  217. font-weight: 400;
  218. color: #fff;
  219. padding: 30rpx 0;
  220. border-bottom: 1rpx solid #cacaca;
  221. display: flex;
  222. align-items: center;
  223. }
  224. .content .item {
  225. display: flex;
  226. justify-content: space-between;
  227. box-sizing: border-box;
  228. padding-top: 20rpx;
  229. padding-bottom: 20rpx;
  230. }
  231. .item:last-of-type {
  232. border: none;
  233. }
  234. .item>view:first-child>view:last-child {
  235. margin-top: 10rpx;
  236. color: #999;
  237. font-size: 24rpx;
  238. }
  239. .item>view:first-child>view:first-child {
  240. font-size: 28rpx;
  241. }
  242. .item>view:last-child {
  243. align-self: center;
  244. font-size: 32rpx;
  245. color: #fff;
  246. font-weight: bold;
  247. }
  248. </style>