userInfo.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. <template>
  2. <view class="userInfo-container">
  3. <u-cell-group>
  4. <u-cell-item title="头像" :arrow="false" center>
  5. <view class="user-photo"><open-data type="userAvatarUrl"></open-data></view>
  6. </u-cell-item>
  7. <u-cell-item title="手机号码" :value="userDate.mobile" :arrow="false"></u-cell-item>
  8. <u-cell-item title="收货地址" :value="address?'修改收货地址':'设置收货地址'" index="0" @click="editAddress"></u-cell-item>
  9. <u-cell-item title="支付密码" :value="existPayPwd?'修改密码':'设置密码'" @click="setPayPwd"></u-cell-item>
  10. </u-cell-group>
  11. <!-- 退出 -->
  12. <view class="user-btn">
  13. <u-button type="success" :custom-style="quitButton" @click="quitSys" shape="circle">退出登录</u-button>
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. import {existPayPwd} from '@/api/order.js'
  19. import {findAddressBycustomerNo} from '@/api/receiveAddress.js'
  20. import {logout} from '@/api/login.js'
  21. export default {
  22. data() {
  23. return {
  24. quitButton: {
  25. borderRadius:'100rpx',
  26. fontSize:'30rpx',
  27. background: '#01c9b2'
  28. },
  29. userDate: {},
  30. existPayPwd: null,
  31. address: null,
  32. userInfo: {}
  33. }
  34. },
  35. onLoad() {
  36. // 开启分享
  37. uni.showShareMenu({
  38. withShareTicket: true,
  39. menus: ['shareAppMessage', 'shareTimeline']
  40. })
  41. },
  42. onShow() {
  43. this.userDate = this.$store.state.vuex_userData
  44. this.getPayPwd()
  45. this.getAddress()
  46. },
  47. methods:{
  48. // 获取用户位置
  49. getAddress() {
  50. findAddressBycustomerNo({}).then(res => {
  51. console.log(res)
  52. if (res.status == 200&&res.data.length) {
  53. this.address = res.data[0].receiveAreasName
  54. this.userInfo = res.data[0]
  55. } else {
  56. this.address = ''
  57. this.userInfo = {}
  58. }
  59. })
  60. },
  61. // 判断是否设置过支付密码
  62. getPayPwd(){
  63. existPayPwd().then(res=>{
  64. if(res.status == 200) {
  65. if(res.data) {
  66. this.existPayPwd = true
  67. } else {
  68. this.existPayPwd = false
  69. }
  70. }
  71. })
  72. },
  73. // 修改收货地址
  74. editAddress(index){
  75. this.$u.vuex("vuex_OrderAddress",this.userInfo)
  76. uni.navigateTo({
  77. url:"/pagesA/toOrder/editAddress"
  78. })
  79. },
  80. // 设置密码
  81. setPayPwd(){
  82. // 设置过支付密码,则修改密码
  83. if(this.existPayPwd){
  84. uni.navigateTo({ url: '/pages/userCenter/userInfo/changePayPwd' })
  85. }else{
  86. // 没设置过支付密码,提示设置密码
  87. uni.navigateTo({ url: '/pages/userCenter/userInfo/smsVerification' })
  88. }
  89. },
  90. // 退出登录
  91. quitSys(){
  92. let _this = this
  93. uni.showModal({
  94. title: '提示',
  95. content: '您确定要退出登录吗?',
  96. success(res) {
  97. if (res.confirm) {
  98. logout({}).then(res => {
  99. getApp().globalData.token = ''
  100. _this.$u.vuex('vuex_token','')
  101. _this.$u.vuex('vuex_userData','')
  102. _this.$u.vuex('vuex_cartList','')
  103. _this.$u.vuex('vuex_OrderAddress','')
  104. _this.$u.vuex('vuex_toOrderList','')
  105. // 关闭socket
  106. _this.$store.commit("$closeWebsocket")
  107. uni.reLaunch({
  108. url: '/pages/index/index'
  109. })
  110. })
  111. }
  112. }
  113. })
  114. }
  115. }
  116. }
  117. </script>
  118. <style lang="less">
  119. .userInfo-container{
  120. width: 100%;
  121. .logout-btn{
  122. width: 60%;
  123. margin-top: 200rpx;
  124. }
  125. .user-btn{
  126. padding: 85rpx 200rpx;
  127. }
  128. .user-photo{
  129. width: 100rpx;
  130. height: 100rpx;
  131. border-radius: 50%;
  132. overflow: hidden;
  133. margin-right: 5rpx;
  134. float: right;
  135. }
  136. }
  137. </style>