index.vue 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <template>
  2. <view class="legal-tender-box">
  3. <view class="lable-title">保证金</view>
  4. <view class="capital-item">
  5. <view class="capital-status" @click.stop="capitalStatus = !capitalStatus">
  6. <view class="status-box">
  7. <image v-show="capitalStatus" class="capital-icon" src="@/static/images/notarize.png"
  8. mode="aspectFit"></image>
  9. </view>
  10. <text>隐藏为0的资产 </text>
  11. </view>
  12. <view class="capital-nums">
  13. 钱包:0.0914 USDT
  14. </view>
  15. </view>
  16. <uni-table class="table-box" emptyText="暂无更多数据">
  17. <!-- 表头行 -->
  18. <uni-tr>
  19. <uni-th align="left" style="flex: 1;">币种</uni-th>
  20. <uni-th align="left" style="flex: 1;">账户权益</uni-th>
  21. <uni-th align="right" style="flex: 1;">可用</uni-th>
  22. </uni-tr>
  23. <!-- 表格数据行 -->
  24. <uni-tr v-for="item in 5">
  25. <uni-td style="flex: 1;">USDT</uni-td>
  26. <uni-td style="flex: 1;">298587458</uni-td>
  27. <uni-td style="text-align: right; flex: 1;">29997.9123</uni-td>
  28. </uni-tr>
  29. </uni-table>
  30. </view>
  31. </template>
  32. <script>
  33. export default {
  34. name: 'BibiModules',
  35. data() {
  36. return {
  37. capitalStatus: true
  38. };
  39. }
  40. }
  41. </script>
  42. <style lang="scss" scoped>
  43. @import "~./../table.scss";
  44. .legal-tender-box {
  45. // padding: 0 $pages-padding ;
  46. width: 100%;
  47. .lable-title {
  48. border-bottom: none;
  49. }
  50. .capital-item {
  51. width: 100%;
  52. padding: 14rpx $pages-padding 25rpx;
  53. display: flex;
  54. justify-content: space-between;
  55. font-size: 24rpx;
  56. font-family: PingFang SC, PingFang SC-Regular;
  57. font-weight: 400;
  58. color: #808080;
  59. line-height: 33rpx;
  60. border-bottom: 1px solid #e6e6e6;
  61. .capital-status {
  62. flex-shrink: 0;
  63. display: flex;
  64. align-items: center;
  65. padding-right: 20rpx;
  66. .status-box {
  67. width: 33rpx;
  68. height: 33rpx;
  69. background: #e7e7e7;
  70. border-radius: 2rpx;
  71. margin-right: 8rpx;
  72. display: flex;
  73. justify-content: center;
  74. align-items: center;
  75. .capital-icon {
  76. width: 24rpx;
  77. height: 24rpx;
  78. }
  79. }
  80. }
  81. .capital-status,
  82. .capital-nums {
  83. // width: 1px;
  84. // flex: 1;
  85. // flex-shrink: 0;
  86. white-space: pre-wrap;
  87. }
  88. // <view class="capital-status">
  89. // <view class="status-box">
  90. // <image v-show="notarizeAgreement" class="capital-icon" src="@/static/images/notarize.png"
  91. // mode="aspectFit"></image>
  92. // </view>
  93. // <text>隐藏为0的资产</text>
  94. // </view>
  95. }
  96. }
  97. .table-box {
  98. padding: 0 $pages-padding ;
  99. }
  100. </style>