index.vue 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. <template>
  2. <mobile-frame>
  3. <view class="main">
  4. <view class="one">
  5. <view class="one_1">
  6. <text>¥</text><text>{{money}}</text>
  7. </view>
  8. <view class="one_2">
  9. 当前可用
  10. </view>
  11. </view>
  12. <view class="two">
  13. <view class="two_1" v-if="list&&list.length>0">
  14. 数据列表
  15. </view>
  16. <view class="two_2" v-else>
  17. 已加载完全部
  18. </view>
  19. </view>
  20. </view>
  21. </mobile-frame>
  22. </template>
  23. <script>
  24. export default {
  25. data() {
  26. return {
  27. money: 0,
  28. list: []
  29. };
  30. },
  31. onLoad: function(e) {
  32. },
  33. methods: {
  34. }
  35. }
  36. </script>
  37. <style lang="scss">
  38. .main {
  39. display: flex;
  40. flex-direction: column;
  41. width: 100vw;
  42. height: 100vh;
  43. .one {
  44. background-color: var(--fFB1Color);
  45. text-align: center;
  46. padding: 5vw 0;
  47. .one_1 {
  48. font-size: 25px;
  49. font-weight: bold;
  50. color: #fff;
  51. margin: 0 0 2vw 0;
  52. text:nth-child(1) {
  53. font-size: 15px;
  54. padding: 0 1vw 0 0;
  55. }
  56. }
  57. .one_2 {
  58. font-size: 16px;
  59. color: #fff;
  60. }
  61. }
  62. .two {
  63. .two_2 {
  64. text-align: center;
  65. color: #858585;
  66. font-size: 14px;
  67. margin: 5vw 0;
  68. }
  69. }
  70. }
  71. </style>