myinfo.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. <template>
  2. <view class="index" :addre="addre">
  3. <view class="index1">
  4. <view class="img">
  5. <image :src="img" mode="widthFix" lazy-load>
  6. </image>
  7. </view>
  8. <view class="name">{{name}}</view>
  9. </view>
  10. <view class="index2" @tap="changeInfo">
  11. <view class="u-f" >
  12. <view class="icon iconfont icon-gerenxinxi"></view>
  13. <view>个人信息</view>
  14. <view>
  15. {{addre}}|{{sub}}|{{sco}}
  16. </view>
  17. </view>
  18. <view class="icon iconfont icon-gengduo2"></view>
  19. </view>
  20. <view class="index3" @tap="myCollection">
  21. <view class="u-f">
  22. <view class="icon iconfont icon-wodeshoucang"></view>
  23. <view>我的收藏</view>
  24. </view>
  25. <view class="icon iconfont icon-gengduo2"></view>
  26. </view>
  27. </view>
  28. </template>
  29. <script>
  30. export default {
  31. data() {
  32. return {
  33. "img":"../../static/img/1.jpg",
  34. "name":"姓名",
  35. "addre":getApp().globalData.global_addre,
  36. "sub":getApp().globalData.global_sub,
  37. "sco":getApp().globalData.global_sco,
  38. }
  39. },
  40. onShow() {
  41. this.sub=getApp().globalData.global_sub;
  42. this.addre=getApp().globalData.global_addre;
  43. this.sco=getApp().globalData.global_sco;
  44. },
  45. methods: {
  46. changeInfo(){
  47. uni.navigateTo({
  48. url:"../changeInfo/changeInfo"
  49. })
  50. },
  51. myCollection(){
  52. uni.navigateTo({
  53. url:"../collection/collection"
  54. })
  55. }
  56. },
  57. }
  58. </script>
  59. <style scoped>
  60. .u-f{
  61. display:flex;
  62. justify-content: flex-start;
  63. align-items: center;
  64. }
  65. .index{
  66. padding: 40upx;
  67. }
  68. .index1{
  69. display: flex;
  70. /* padding: 40upx; */
  71. margin-top: 60upx;
  72. }
  73. .index1 .img>image{
  74. width: 220upx;
  75. height: 220upx;
  76. border-radius: 100%;
  77. border: 1px solid #000000;
  78. }
  79. .index1 .name{
  80. display: flex;
  81. align-items: center;
  82. margin-left: 50upx;
  83. font-size: 55upx;
  84. font-weight: bold;
  85. letter-spacing: 10upx;
  86. }
  87. .index2{
  88. display: flex;
  89. justify-content: space-between;
  90. margin-top: 60upx;
  91. }
  92. .index2>view>view:last-of-type{
  93. color:#999999;
  94. font-size: 30upx;
  95. }
  96. .index3{
  97. display: flex;
  98. justify-content: space-between;
  99. margin-top: 60upx;
  100. }
  101. .icon-gengduo2{
  102. color:#E7E7E7;
  103. }
  104. .u-f>view{
  105. margin-right: 40upx;
  106. }
  107. </style>