index.vue 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. <template>
  2. <view class="">
  3. <card @updateShowMoneyStatus="(e) => showMoney = e">
  4. <template #cardnum>
  5. {{ bibiAccount.usdt_totle || '--'}}
  6. </template>
  7. <template #cardnums>
  8. {{ bibiAccount.CNY || '--'}}
  9. </template>
  10. <template #cardmuen>
  11. <block v-for="(item , index ) in cardMuen">
  12. <view class="card-muen-item_2" @click.stop="cardBtns(item)">
  13. <image class="item-icon" :src="item.icon" mode="aspectFit"></image>
  14. <text class="item-name">{{item.name}}</text>
  15. </view>
  16. </block>
  17. </template>
  18. </card>
  19. <view class="legal-tender-box">
  20. <view class="lable-title">保证金</view>
  21. <view class="capital-item">
  22. <view class="capital-status" @click.stop="hideNoNums = !hideNoNums">
  23. <view :class="['status-box' , !hideNoNums ? '' : 'show-status-box' ]">
  24. <text v-show="hideNoNums" class="iconfont">&#xe6c5;</text>
  25. <!-- <image v-show="hideNoNums" class="capital-icon" src="@/static/images/notarize.png"
  26. mode="aspectFit"></image> -->
  27. </view>
  28. <text>隐藏为0的资产 </text>
  29. </view>
  30. <view class="capital-nums">
  31. 钱包:{{ bibiAccount.usdt_totle || '--'}} USDT
  32. </view>
  33. </view>
  34. <uni-table class="table-box" emptyText="暂无更多数据">
  35. <!-- 表头行 -->
  36. <uni-tr>
  37. <uni-th align="left" style="flex: 1;">币种</uni-th>
  38. <uni-th align="left" style="flex: 1;">账户权益</uni-th>
  39. <uni-th align="right" style="flex: 1;">可用</uni-th>
  40. </uni-tr>
  41. <!-- 表格数据行 -->
  42. <template v-if="bibiAccount.balance">
  43. <uni-tr v-for="(item , index) in bibiAccount.balance" v-if="hideNoName(hideNoNums , index)">
  44. <uni-td style="flex: 1;">{{ item.currency_name }}</uni-td>
  45. <uni-td style="flex: 1;">{{ showMoney ? index % 2 ? 111 : 0.00 : '*****' }}</uni-td>
  46. <uni-td style="text-align: right; flex: 1;">{{ showMoney ? 111 : '*****' }}</uni-td>
  47. </uni-tr>
  48. </template>
  49. </uni-table>
  50. <capitalSwitch ref="capitalSwitchRef"/>
  51. </view>
  52. </view>
  53. </template>
  54. <script>
  55. import card from "../card.vue"
  56. import capitalSwitch from "./capital-switch.vue"
  57. import {
  58. checkBill
  59. } from "../card.js"
  60. import {
  61. mapGetters
  62. } from 'vuex'
  63. export default {
  64. name: 'BibiModules',
  65. components: {
  66. card,
  67. capitalSwitch
  68. },
  69. computed: {
  70. ...mapGetters([
  71. 'contractAccount',
  72. 'bibiAccount'
  73. ])
  74. },
  75. data() {
  76. return {
  77. showMoney: true,
  78. hideNoNums: false,
  79. cardMuen: [{
  80. icon: require('@/static/logo.png'),
  81. name: '充币',
  82. path:'/pages/content/select-currency'
  83. }, {
  84. icon: require('@/static/logo.png'),
  85. name: '提币'
  86. }, {
  87. icon: require('@/static/logo.png'),
  88. name: '闪兑'
  89. }, {
  90. icon: require('@/static/logo.png'),
  91. name: '划转',
  92. btn: "BibiSwitch"
  93. }, {
  94. icon: require('@/static/logo.png'),
  95. name: '记录',
  96. path: '/pages/property/bill?type=1'
  97. }],
  98. };
  99. },
  100. methods: {
  101. hideNoName(type, index) {
  102. // console.log('hideNoName = ', type, index)
  103. if (type) {
  104. return index % 2
  105. }
  106. return true
  107. },
  108. cardBtns(item) {
  109. const path = item?.path
  110. if (!path) {
  111. // 资金转换
  112. this.$nextTick(() => {
  113. this.$refs.capitalSwitchRef.open()
  114. })
  115. } else if (path) {
  116. // '用户账单',
  117. checkBill(path)
  118. }
  119. }
  120. }
  121. }
  122. </script>
  123. <style lang="scss" scoped>
  124. @import "~./../table.scss";
  125. .legal-tender-box {
  126. // padding: 0 $pages-padding ;
  127. width: 100%;
  128. .lable-title {
  129. border-bottom: none;
  130. }
  131. .capital-item {
  132. width: 100%;
  133. padding: 14rpx $pages-padding 25rpx;
  134. display: flex;
  135. justify-content: space-between;
  136. font-size: 24rpx;
  137. font-family: PingFang SC, PingFang SC-Regular;
  138. font-weight: 400;
  139. color: #808080;
  140. line-height: 33rpx;
  141. border-bottom: 1px solid #e6e6e6;
  142. .capital-status {
  143. flex-shrink: 0;
  144. display: flex;
  145. align-items: center;
  146. padding-right: 20rpx;
  147. .status-box {
  148. width: 28rpx;
  149. height: 28rpx;
  150. background: #e7e7e7;
  151. border-radius: 2rpx;
  152. margin-right: 12rpx;
  153. display: flex;
  154. justify-content: center;
  155. align-items: center;
  156. .iconfont {
  157. font-size: 24rpx;
  158. color: #fff;
  159. }
  160. .capital-icon {
  161. width: 24rpx;
  162. height: 24rpx;
  163. }
  164. }
  165. .show-status-box {
  166. background-color: $Theme-Color;
  167. }
  168. }
  169. .capital-status,
  170. .capital-nums {
  171. // width: 1px;
  172. // flex: 1;
  173. // flex-shrink: 0;
  174. white-space: pre-wrap;
  175. }
  176. // <view class="capital-status">
  177. // <view class="status-box">
  178. // <image v-show="notarizeAgreement" class="capital-icon" src="@/static/images/notarize.png"
  179. // mode="aspectFit"></image>
  180. // </view>
  181. // <text>隐藏为0的资产</text>
  182. // </view>
  183. }
  184. }
  185. .table-box {
  186. padding: 0 $pages-padding ;
  187. }
  188. </style>