login.vue 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215
  1. <template>
  2. <!-- 登录 -->
  3. <view style="
  4. padding: 0 44rpx;
  5. background-color: #fff;
  6. height: 100vh;
  7. overflow: hidden;
  8. ">
  9. <view class="" style="text-align: center; margin-top: 156rpx">
  10. <image src="../../static/images/logo.png" style="width: 350rpx; height: 350rpx" mode=""></image>
  11. </view>
  12. <button open-type="getPhoneNumber" class="login-btn" @getphonenumber="tologin">
  13. 微信授权登录
  14. </button>
  15. <view>
  16. <u--input placeholder="请输入内容" border="surround" v-model="mobile"></u--input>
  17. <u--input placeholder="请输入内容" border="surround" v-model="code"></u--input>
  18. </view>
  19. <button @click="submit">登录</button>
  20. <button @click="submita">注册</button>
  21. <view class="" style="margin-top: 42rpx; display: flex">
  22. <u-checkbox-group v-model="checkboxValue1" placement="column" @change="checkboxChange">
  23. <u-checkbox shape="circle" :customStyle="{ marginBottom: '8px' }" :name="1">
  24. </u-checkbox>
  25. </u-checkbox-group>
  26. <text class="fontYin">我已阅读并同意</text>
  27. <text class="fontYin" style="color: #f83224">《用户协议》</text>
  28. <text class="fontYin"></text>
  29. <text class="fontYin" style="color: #f83224">《隐私协议》</text>
  30. </view>
  31. </view>
  32. </template>
  33. <script>
  34. // import {conn} from '@/utils/WebIM.js'
  35. import {conn} from '../../utils/WebIM.js'
  36. import {
  37. login
  38. } from "../../network/api/homeApi.js";
  39. export default {
  40. data() {
  41. return {
  42. mobile: "",
  43. code: "",
  44. checkboxValue1: false,
  45. changea: [],
  46. };
  47. },
  48. methods: {
  49. //微信登录
  50. tologin(e) {
  51. if (this.changea.length > 0) {
  52. if (e.detail.code) {
  53. var phoneCode = e.detail.code;
  54. uni.login({
  55. success: (code) => {
  56. uni.$u.http
  57. .post("/api/wxmini/login", {
  58. code: code.code,
  59. })
  60. .then((res) => {
  61. console.log(res);
  62. if (res == 10011) {
  63. uni.$u.http
  64. .post("/api/wxmini/mobile", {
  65. code: phoneCode,
  66. })
  67. .then((res) => {
  68. uni.$u.http
  69. .post("/api/register", {
  70. wx_code: code
  71. .code, // 是 String 微信登录时候的code
  72. mobile: res.mobile, // 是 String 手机号码
  73. })
  74. .then((res) => {
  75. console.log(res);
  76. uni.setStorageSync('user_no',res.easemob_username)
  77. uni.setStorageSync('pwd',res.easemob_password)
  78. var options = {
  79. user: res.easemob_username,
  80. pwd: res.easemob_password,
  81. appKey: conn.appkey,
  82. success: function (res2) {
  83. },
  84. error: function(){
  85. }
  86. };
  87. conn.open(options);
  88. uni.setStorageSync("token", res.token);
  89. uni.setStorageSync("openid", res
  90. .openid);
  91. // setTimeout(() => {
  92. // uni.navigateTo({
  93. // url: "/pageA/changelange",
  94. // });
  95. // }, 300);
  96. })
  97. .catch(() => {});
  98. })
  99. .catch(() => {});
  100. } else {
  101. uni.setStorageSync("token", res.token);
  102. uni.setStorageSync("openid", res.openid);
  103. setTimeout(() => {
  104. uni.navigateTo({
  105. url: "/pageA/changelange",
  106. });
  107. }, 300);
  108. }
  109. })
  110. .catch(() => {});
  111. },
  112. });
  113. }
  114. } else {
  115. this.$u.toast("请勾选隐私协议");
  116. }
  117. },
  118. checkboxChange(n) {
  119. console.log("change", n);
  120. this.changea = n;
  121. },
  122. submit() {
  123. // login({ mobile: "13000000000", password: "123456" }).then((res) => {
  124. // console.log(res);
  125. // if (res.data.code == 10000) {
  126. // uni.setStorage({
  127. // key: "token",
  128. // data: res.data.data.token,
  129. // success: function () {
  130. // uni.switchTab({
  131. // url: "../index/index",
  132. // });
  133. // },
  134. // });
  135. // }
  136. // });
  137. uni.$u.http
  138. .post("/api/login", {
  139. mobile: this.mobile,
  140. password: '123456',
  141. })
  142. .then((res) => {
  143. uni.setStorageSync("token", res.token);
  144. uni.setStorageSync('user_no',res.easemob_username)
  145. uni.setStorageSync('pwd',res.easemob_password)
  146. var options = {
  147. user: res.easemob_username,
  148. pwd: res.easemob_password,
  149. appKey: conn.appkey,
  150. success: function (res2) {
  151. console.log(res2);
  152. },
  153. error: function(){
  154. }
  155. };
  156. conn.open(options);
  157. // uni.switchTab({
  158. // url: "/pages/index/index",
  159. // });
  160. })
  161. .catch((error) => {
  162. console.log(error);
  163. });
  164. },
  165. submita() {
  166. uni.$u.http
  167. .post("/api//mobile-register", {
  168. mobile: this.mobile,
  169. password: '123456',
  170. })
  171. .then((res) => {
  172. uni.$u.toast('注册成功')
  173. })
  174. .catch((error) => {
  175. console.log(error);
  176. });
  177. }
  178. },
  179. };
  180. </script>
  181. <style lang="scss" scoped>
  182. page {
  183. background-color: #ffffff !important;
  184. height: 100vh;
  185. }
  186. .login-btn {
  187. width: 662rpx;
  188. height: 96rpx;
  189. background: #f83224;
  190. box-shadow: 0rpx 16rpx 40rpx -12rpx rgba(255, 21, 21, 0.5);
  191. border-radius: 48rpx;
  192. font-family: PingFangSC, PingFang SC;
  193. font-weight: 500;
  194. font-size: 32rpx;
  195. color: #ffffff;
  196. line-height: 96rpx;
  197. text-align: center;
  198. font-style: normal;
  199. }
  200. .fontYin {
  201. font-family: PingFangSC, PingFang SC;
  202. font-weight: 400;
  203. font-size: 24rpx;
  204. color: #666666;
  205. line-height: 34rpx;
  206. text-align: left;
  207. font-style: normal;
  208. }
  209. </style>