Authorize.vue 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. <template>
  2. <view>
  3. <view class='Popup' v-if='isShowAuth'>
  4. <image :src='logoUrl'></image>
  5. <view class='title'>授权提醒</view>
  6. <view class='tip'>请授权头像等信息,以便为您提供更好的服务</view>
  7. <view class='bottom flex'>
  8. <view class='item' @click='close'>随便逛逛</view>
  9. <!-- #ifdef APP-PLUS -->
  10. <button class='item grant' @click="setUserInfo">去授权</button>
  11. <!-- #endif -->
  12. <!-- #ifdef MP -->
  13. <button class='item grant' type="primary" open-type="getUserInfo" lang="zh_CN" @getuserinfo="setUserInfo">去授权</button>
  14. <!-- #endif -->
  15. </view>
  16. </view>
  17. <view class='mask' v-if='isShowAuth' @click='close'></view>
  18. </view>
  19. </template>
  20. <script>
  21. const app = getApp();
  22. import Cache from '../utils/cache';
  23. import { getLogo } from '../api/public';
  24. import { LOGO_URL } from '../config/cache';
  25. import { mapGetters } from 'vuex';
  26. import Routine from '../libs/routine';
  27. export default {
  28. name:'Authorize',
  29. props:{
  30. isAuto:{
  31. type:Boolean,
  32. default:true
  33. },
  34. isGoIndex:{
  35. type:Boolean,
  36. default:true
  37. },
  38. isShowAuth:{
  39. type:Boolean,
  40. default:false
  41. }
  42. },
  43. data(){
  44. return {
  45. logoUrl:''
  46. }
  47. },
  48. computed:mapGetters(['isLogin','userInfo']),
  49. watch:{
  50. isLogin(n){
  51. n === true && this.$emit('onLoadFun',this.userInfo);
  52. }
  53. },
  54. created() {
  55. this.getLogoUrl();
  56. this.setAuthStatus();
  57. },
  58. methods:{
  59. setAuthStatus(){
  60. Routine.authorize().then(res=>{
  61. if(res.islogin === false)
  62. this.setUserInfo();
  63. else
  64. this.$emit('onLoadFun',this.userInfo);
  65. }).catch(res=>{
  66. if (this.isAuto)
  67. this.$emit('authColse',true);
  68. })
  69. },
  70. getUserInfo(code){
  71. Routine.getUserInfo().then(res=>{
  72. let userInfo = res.userInfo
  73. userInfo.code = code;
  74. userInfo.spread_spid = app.globalData.spid;//获取推广人ID
  75. userInfo.spread_code = app.globalData.code;//获取推广人分享二维码ID
  76. Routine.authUserInfo(userInfo).then(res=>{
  77. uni.hideLoading();
  78. this.$emit('authColse',false);
  79. this.$emit('onLoadFun',this.userInfo);
  80. }).catch(res=>{
  81. uni.hideLoading();
  82. uni.showToast({
  83. title:res.msg,
  84. icon:'none',
  85. duration:2000
  86. });
  87. })
  88. }).catch(res =>{
  89. uni.hideLoading();
  90. })
  91. },
  92. setUserInfo(){
  93. uni.showLoading({title:'正在登陆中'});
  94. Routine.getCode().then(code=>{
  95. this.getUserInfo(code);
  96. }).catch(res=>{
  97. uni.hideLoading();
  98. })
  99. },
  100. getLogoUrl(){
  101. let that = this;
  102. if (Cache.has(LOGO_URL)) {
  103. this.logoUrl = Cache.get(LOGO_URL);
  104. return;
  105. }
  106. getLogo().then(res=>{
  107. that.logoUrl = res.data.logo_url
  108. Cache.set(LOGO_URL,that.logoUrl);
  109. })
  110. },
  111. close(){
  112. let pages = getCurrentPages(), currPage = pages[pages.length - 1];
  113. if(this.isGoIndex){
  114. uni.switchTab({url:'/pages/index/index'});
  115. } else {
  116. this.$emit('authColse',false);
  117. }
  118. // if (currPage && currPage.isShowAuth != undefined){
  119. // currPage.isShowAuth = true;
  120. // }
  121. },
  122. }
  123. }
  124. </script>
  125. <style scoped lang='scss'>
  126. .Popup{width:500rpx;background-color:#fff;position:fixed;top:50%;left:50%;margin-left:-250rpx;transform:translateY(-50%);z-index:320;}
  127. .Popup image{width:150rpx;height:150rpx;margin:-67rpx auto 0 auto;display:block;border: 8rpx solid #fff;border-radius: 50%}
  128. .Popup .title{font-size:28rpx;color:#000;text-align:center;margin-top: 30rpx}
  129. .Popup .tip{font-size:22rpx;color:#555;padding:0 24rpx;margin-top:25rpx;}
  130. .Popup .bottom .item{width:50%;height:80rpx;background-color:#eeeeee;text-align:center;line-height:80rpx;font-size:24rpx;color:#666;margin-top:54rpx;}
  131. .Popup .bottom .item.on{width: 100%}
  132. .flex{display:flex;}
  133. .Popup .bottom .item.grant{font-size:28rpx;color:#fff;font-weight:bold;background-color:#e93323;border-radius:0;padding:0;}
  134. .mask{position:fixed;top:0;right:0;left:0;bottom:0;background-color:rgba(0,0,0,0.65);z-index:310;}
  135. </style>