weixin.vue 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226
  1. <template>
  2. <view class="container">
  3. <!-- #ifdef MP-WEIXIN-->
  4. <button open-type="getUserInfo" @getuserinfo='mylogin' class="flex-y-center box-pack-between item">
  5. <view class="flex-center">
  6. <image class="wxlogon" src="../../static/images/wx.png" mode=""></image>
  7. <text>微信</text>
  8. </view>
  9. <view class="flex-center wxright">
  10. {{openid?'已绑定':'未绑定'}} <text class="iconfont icon-prev"></text>
  11. </view>
  12. </button>
  13. <view class="Under" v-if="openid">
  14. <button class="login-btn flex-center" @click="isauth" form-type="submit">账号解绑</button>
  15. </view>
  16. <!-- #endif -->
  17. <!-- #ifdef H5 -->
  18. <button @click="gzhurl" class="flex-y-center box-pack-between item">
  19. <view class="flex-center">
  20. <image class="wxlogon" src="../../static/images/wx.png" mode=""></image>
  21. <text>微信</text>
  22. </view>
  23. <view class="flex-center wxright">
  24. {{openid?'已绑定':'未绑定'}} <text class="iconfont icon-prev"></text>
  25. </view>
  26. </button>
  27. <view class="Under" v-if="openid">
  28. <button class="login-btn flex-center" @click="isauth" form-type="submit">账号解绑</button>
  29. </view>
  30. <!-- #endif -->
  31. </view>
  32. </template>
  33. <script>
  34. export default {
  35. data() {
  36. return {
  37. openid: "",
  38. }
  39. },
  40. onLoad(e) {
  41. this.openid = e.openid == 'null' ? false : !e.openid ? false : true;
  42. // #ifdef H5
  43. if (!this.openid) {
  44. this.isweb();
  45. }
  46. // #endif
  47. },
  48. methods: {
  49. isweb() {
  50. function GetRequest() {
  51. var url = location.search; //获取url中"?"符后的字串
  52. var theRequest = new Object();
  53. if (url.indexOf("?") != -1) {
  54. //判断是否有参数
  55. var str = url.substr(1); //从第一个字符开始 因为第0个是?号 获取所有除问号的所有符串
  56. var strs = str.split("&");
  57. console.log(strs)
  58. for (var i = 0; i < strs.length; i++) {
  59. theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1]);
  60. }
  61. }
  62. console.log(theRequest)
  63. return theRequest;
  64. }
  65. if (GetRequest().code) {
  66. this.request({
  67. url: "user/gzhopenid",
  68. data: {
  69. code: GetRequest().code,
  70. state: GetRequest().state,
  71. },
  72. }).then(res => {
  73. console.log(res, "user/gzhurl");
  74. if (res.code == 200) {
  75. this.openid = true;
  76. }
  77. }).catch((res) => {
  78. console.log("message", res)
  79. });
  80. }
  81. },
  82. gzhurl(e) {
  83. this.request({
  84. url: "user/gzhurl",
  85. data: {
  86. token: uni.getStorageSync("token"),
  87. type: 2,
  88. },
  89. }).then(res => {
  90. console.log(res, "user/gzhurl");
  91. // return
  92. if (res.data.url) {
  93. uni.navigateBack({
  94. delta:2
  95. })
  96. location.href = res.data.url;
  97. }
  98. }).catch((res) => {
  99. console.log("message", res)
  100. });
  101. },
  102. isauth(e) {
  103. var type;
  104. // #ifdef H5
  105. type = 2;
  106. // #endif
  107. // #ifdef MP-WEIXIN
  108. type = 1;
  109. // #endif
  110. this.request({
  111. url: "user/del_openid",
  112. data: {
  113. token: uni.getStorageSync("token"),
  114. type,
  115. },
  116. }).then(res => {
  117. console.log(res, "res")
  118. uni.showToast({
  119. title: '解绑成功',
  120. icon: 'none',
  121. })
  122. setTimeout(() => {
  123. uni.navigateBack({
  124. delta: 1
  125. })
  126. }, 2e3)
  127. })
  128. },
  129. mylogin(e) {
  130. console.log(e)
  131. if (e.detail.errMsg == "getUserInfo:ok") {
  132. uni.login({
  133. success: (res) => {
  134. console.log(res)
  135. // return
  136. if (res.code) {
  137. //发起网络请求
  138. this.request({
  139. url: "user/xcx_openid",
  140. data: {
  141. code: res.code,
  142. token: uni.getStorageSync("token"),
  143. },
  144. }).then(res => {
  145. console.log(res, "res")
  146. this.openid = true
  147. uni.showToast({
  148. title: '绑定成功',
  149. icon: 'none',
  150. })
  151. }).catch((res)=>{
  152. uni.showToast({
  153. title:res.message,
  154. icon: 'none',
  155. })
  156. })
  157. } else {
  158. console.log('登录失败!' + res.errMsg)
  159. }
  160. }
  161. })
  162. } else {
  163. uni.showToast({
  164. title: '请允许授权',
  165. icon: 'none',
  166. })
  167. }
  168. },
  169. },
  170. }
  171. </script>
  172. <style>
  173. page {
  174. background: #F1F1F1;
  175. }
  176. .wxright {
  177. color: #999999;
  178. }
  179. .item {
  180. height: 98rpx;
  181. background: #FFFFFF;
  182. padding: 0 20rpx;
  183. border: none;
  184. border-radius: 0;
  185. }
  186. .wxlogon {
  187. width: 40rpx;
  188. height: 40rpx;
  189. margin-right: 10rpx;
  190. }
  191. .Under {
  192. position: fixed;
  193. width: 100%;
  194. bottom: 50rpx;
  195. }
  196. .login-btn {
  197. width: 630rpx;
  198. height: 90rpx;
  199. background: linear-gradient(132deg, rgb(64, 158, 255) 0%, rgb(64, 158, 255) 100%);
  200. box-shadow: 0px 2rpx 12rpx rgb(64, 158, 255);
  201. opacity: 1;
  202. border-radius: 45rpx;
  203. margin: 0 auto;
  204. color: #FFFFFF;
  205. font-size: 30rpx;
  206. font-family: Source Han Sans CN;
  207. font-weight: 500;
  208. opacity: 1;
  209. }
  210. </style>