index.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. <template>
  2. <div class="container">
  3. <div class="header">
  4. <div class="user-avatar">
  5. <open-data type="userAvatarUrl"></open-data>
  6. </div>
  7. <div class="user-nickname">
  8. <open-data type="userNickName"></open-data>
  9. </div>
  10. </div>
  11. <div class="menu-list">
  12. <van-cell-group>
  13. <van-cell size="large" is-link title="我的优惠券" url="/pages/couponList/main?tab=0">
  14. <van-icon slot="icon" class="title-icon" name="coupon" />
  15. <div>({{canUsedCount}}张可使用)</div>
  16. </van-cell>
  17. <van-cell size="large" is-link title="我的订单" url="/pages/order/main">
  18. <van-icon slot="icon" class="title-icon" name="balance-list" />
  19. </van-cell>
  20. <!-- <van-cell size="large" is-link title="洗车机" @click="getCode">
  21. <van-icon slot="icon" class="title-icon" name="graphic" />
  22. </van-cell> -->
  23. <van-cell size="large" is-link title="联系客服" @click="callPhone">
  24. <van-icon slot="icon" class="title-icon" name="service" />
  25. </van-cell>
  26. </van-cell-group>
  27. </div>
  28. <van-button plain hairline block round class="logout-btn" @click="logoutHandle">
  29. 退出登录
  30. </van-button>
  31. </div>
  32. </template>
  33. <script>
  34. import { getCouponCount } from '@/api/coupon';
  35. import { checkLogin, zyycLogout } from '@/api/login';
  36. export default {
  37. data() {
  38. return {
  39. canUsedCount: 0,
  40. isLogin: false
  41. };
  42. },
  43. methods: {
  44. callPhone() {
  45. wx.makePhoneCall({
  46. phoneNumber: '4001616312'
  47. });
  48. },
  49. getCoupon() {
  50. getCouponCount({}).then(res => {
  51. if (res.status === '200') {
  52. this.canUsedCount = res.data;
  53. } else {
  54. wx.showToast({
  55. title: res.message,
  56. icon: 'none',
  57. duration: 2500
  58. });
  59. }
  60. wx.hideLoading();
  61. });
  62. },
  63. logoutHandle() {
  64. wx.showModal({
  65. title: '提示',
  66. content: '您确定要退出登录吗?',
  67. success(res) {
  68. if (res.confirm) {
  69. zyycLogout({}).then(res => {
  70. mpvue.removeStorageSync('token');
  71. wx.switchTab({ url: '/pages/index/main' });
  72. });
  73. }
  74. }
  75. });
  76. },
  77. openMini(){
  78. wx.navigateToMiniProgram({
  79. appId: 'wxed9c04d05ab849f9',
  80. path: '',
  81. extraData: {
  82. foo: 'bar'
  83. },
  84. envVersion: 'release',
  85. success(res) {
  86. // 打开成功
  87. }
  88. })
  89. },
  90. // 洗车 扫码
  91. getCode () {
  92. wx.scanCode({
  93. success (res) {
  94. console.log(res)
  95. }
  96. })
  97. }
  98. },
  99. onTabItemTap(item) {
  100. console.log(item)
  101. wx.showLoading({
  102. mask: true,
  103. title: '加载中'
  104. });
  105. checkLogin().then(res => {
  106. if (res.status === '200') {
  107. this.getCoupon();
  108. } else {
  109. wx.redirectTo({
  110. url: '/pages/login/main?lanuch=true&path=' + encodeURIComponent('/pages/member/main')
  111. });
  112. }
  113. this.isLogin = true
  114. wx.hideLoading();
  115. });
  116. },
  117. onShow() {
  118. }
  119. };
  120. </script>
  121. <style lang="stylus" scoped>
  122. .container {
  123. padding: 15rpx 40rpx;
  124. }
  125. .header {
  126. display: flex;
  127. align-items: center;
  128. padding: 0 20rpx;
  129. }
  130. .user-avatar {
  131. width: 100rpx;
  132. height: 100rpx;
  133. border-radius: 50%;
  134. overflow: hidden;
  135. margin-right: 30rpx;
  136. }
  137. .menu-list {
  138. margin-top: 50rpx;
  139. .title-icon {
  140. display: flex;
  141. align-items: center;
  142. font-size: 1.4em;
  143. color: #ed3f14;
  144. margin-right: 25rpx;
  145. }
  146. }
  147. .logout-btn {
  148. position: relative;
  149. top: 25vh;
  150. }
  151. </style>