me.vue 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. <template>
  2. <!-- pages/me.wxml -->
  3. <view class="uni-container">
  4. <view class="uni-header-logo">
  5. <img class="uni-header-image" :src="initInfo.headImg == null || initInfo.headImg == '' ? 'http://116.142.80.12:9000/10_03.png' : initInfo.headImg" />
  6. <span>{{initInfo.name == null || initInfo.name == '' ? initInfo.wechatName : initInfo.name}}</span>
  7. <text>{{initInfo.scoreNum}}</text>
  8. </view>
  9. <view class="uni-panel" v-for="(item, index) in list" :key="item.id">
  10. <view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="goDetailPage(item.id)">
  11. <text class="uni-panel-text">{{item.name}}</text>
  12. <text class="uni-panel-icon uni-icon" :class="item.open ? 'uni-panel-icon-on' : ''">{{item.pages ? '&#xe581;' : '&#xe470;'}}</text>
  13. </view>
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. import {getScore, getUserInfo} from '@/api/me/me.js'
  19. // pages/me.js
  20. export default {
  21. data() {
  22. return {
  23. initInfo:{
  24. userId: null,
  25. scoreNum: 0,
  26. wechatName: "微信用户",
  27. name: null,
  28. headImg: null,
  29. },
  30. list: [
  31. {
  32. id: 'me/meOperate',//id是文件路径
  33. name: '我的积分流水',
  34. open: false,
  35. },
  36. {
  37. id: 'wenba/wenba',
  38. name: '我的问答',
  39. open: false,
  40. }
  41. ]
  42. };
  43. },
  44. /**
  45. * 生命周期函数--监听页面加载
  46. */ onLoad(options) {},
  47. /**
  48. * 生命周期函数--监听页面初次渲染完成
  49. */
  50. onReady() {
  51. this.userId = getApp().globalData.userId
  52. this.getUserInfoByUserId(this.userId)
  53. this.getScoreForMe(this.userId)
  54. },
  55. /**
  56. * 生命周期函数--监听页面显示
  57. */
  58. onShow() {},
  59. /**
  60. * 生命周期函数--监听页面隐藏
  61. */
  62. onHide() {},
  63. /**
  64. * 生命周期函数--监听页面卸载
  65. */
  66. onUnload() {},
  67. /**
  68. * 页面相关事件处理函数--监听用户下拉动作
  69. */
  70. onPullDownRefresh() {},
  71. /**
  72. * 页面上拉触底事件的处理函数
  73. */
  74. onReachBottom() {},
  75. /**
  76. * 用户点击右上角分享
  77. */
  78. onShareAppMessage() {},
  79. methods: {
  80. goDetailPage(e) {
  81. const url = '/pages/' + e
  82. uni.navigateTo({
  83. url: url
  84. })
  85. },
  86. //获取用户信息:用户名称:头像
  87. getUserInfoByUserId(userId){
  88. getUserInfo(userId).then(res =>{
  89. this.initInfo.wechatName = res.data.wechatName;
  90. this.initInfo.name = res.data.name;
  91. this.initInfo.wechatName = res.data.wechatName;
  92. })
  93. },
  94. //获取当前积分
  95. getScoreForMe(userId){
  96. getScore(this.userId).then(res =>{
  97. this.initInfo.scoreNum = res.data.scoreNum
  98. })
  99. }
  100. }
  101. };
  102. </script>
  103. <style>
  104. @import './me.css';
  105. </style>