微信登录

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "my-project",
+  "name": "3dshow-miniprogram",
   "version": "0.1.0",
   "private": true,
   "scripts": {

src/manifest.json

@@ -2,7 +2,7 @@
 	"name": "",
 	"appid": "",
 	"description": "",
-	"versionName": "1.0.0",
+	"versionName": "1.0.3",
 	"versionCode": "100",
 	"transformPx": false,
 	"app-plus": { /* 5+App特有相关 */
@@ -54,7 +54,7 @@
 
 	},
 	"mp-weixin": { /* 微信小程序特有相关 */
-		"appid": "",
+		"appid": "wx6fa83d508d673b7f",
 		"setting": {
 			"urlCheck": false
 		},

src/pages.json

@@ -1,16 +1,29 @@
 {
-	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
-		{
-			"path": "pages/index/index",
-			"style": {
-				"navigationBarTitleText": "uni-app"
-			}
-		}
-	],
-	"globalStyle": {
-		"navigationBarTextStyle": "black",
-		"navigationBarTitleText": "uni-app",
-		"navigationBarBackgroundColor": "#F8F8F8",
-		"backgroundColor": "#F8F8F8"
-	}
+  "pages": [
+    //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
+    {
+      "path": "pages/index/index",
+      "style": {
+        "navigationBarTitleText": "数之鞋"
+      }
+    },
+    {
+      "path": "pages/auth/index",
+      "style": {
+        "navigationBarTitleText": "账户登录"
+      }
+    },
+    {
+      "path": "pages/auth/phoneLogin",
+      "style": {
+        "navigationBarTitleText": "账户登录"
+      }
+    }
+  ],
+  "globalStyle": {
+    "navigationBarTextStyle": "black",
+    "navigationBarTitleText": "数之鞋",
+    "navigationBarBackgroundColor": "#F8F8F8",
+    "backgroundColor": "#F8F8F8"
+  }
 }

src/pages/auth/index.vue

@@ -0,0 +1,92 @@
+<template>
+  <view
+    class="content"
+    style="background-image: url(/static/gr_bg.png); background-size: 100% 100%"
+  >
+    <image class="logo" src="/static/logo.png"></image>
+    <view>
+      <button
+        type="default"
+        class="btn btn_phone"
+        @click="phoneLogin"
+        style="color: #fff; background-color: #5a7bef"
+      >
+        手机号登录
+      </button>
+      <button
+        open-type="getPhoneNumber"
+        @getphonenumber="getPhoneNumber"
+        class="btn btn_wechat"
+        type="primary"
+      >
+        微信登录
+      </button>
+    </view>
+  </view>
+</template>
+
+<script>
+import { login } from "../../services/https/user";
+
+export default {
+  data() {
+    return {
+      jsCode: "",
+      redirect: "",
+    };
+  },
+  onLoad(options) {
+    this.redirect = options.redirect;
+    wx.login({
+      success: (res) => {
+        this.jsCode = res.code;
+      },
+    });
+  },
+  methods: {
+    phoneLogin() {
+      uni.navigateTo({
+        url: `/pages/auth/phoneLogin?redirect=${this.redirect}`,
+      });
+    },
+    async getPhoneNumber(e) {
+      const res = await login({ jsCode: this.jsCode, code: e.detail.code });
+      if (res.errorNo !== 200) return;
+      const token = res.result.token;
+      uni.reLaunch({
+        url: `/pages/index/index?token=${token}&redirect=${this.redirect}`,
+      });
+    },
+  },
+};
+</script>
+
+<style>
+.content {
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: cover;
+}
+.logo {
+  width: 240rpx;
+  height: 266rpx;
+}
+.btn {
+  width: 600rpx;
+  border-radius: 48rpx;
+  overflow: hidden;
+}
+.btn_phone {
+  margin-top: 100rpx;
+  background-color: #5a7bef;
+}
+.btn_wechat {
+  margin-top: 60rpx;
+  margin-bottom: 100rpx;
+}
+</style>

src/pages/auth/phoneLogin.vue

@@ -0,0 +1,21 @@
+<template>
+  <view class="content">
+    <web-view :src="url"></web-view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      url: "http://192.168.110.231:8080/#/login/phone",
+    };
+  },
+  onLoad: function (options) {
+    const url = `http://192.168.110.231:8080/#/login/phone?redirect=${options.redirect}`;
+    this.url = url;
+  },
+  onShow: function () {},
+  methods: {},
+};
+</script>

src/pages/index/index.vue

@@ -1,49 +1,29 @@
 <template>
-	<view class="content">
-		<image class="logo" src="/static/logo.png"></image>
-		<view>
-			<text class="title">{{title}}</text>
-		</view>
-	</view>
+  <view class="content">
+    <web-view :src="url"></web-view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				title: 'Hello'
-			}
-		},
-		onLoad() {
-
-		},
-		methods: {
-
-		}
-	}
+export default {
+  data() {
+    return {
+      url: "http://192.168.110.231:8080",
+      token: "",
+    };
+  },
+  onLoad: function (options) {
+    let renderUrl = this.url;
+    if (options.token) {
+      renderUrl = `http://192.168.110.231:8080/#/login?token=${options.token}&redirect=${options.redirect}`;
+    } else if (options.redirect) {
+      renderUrl = `http://192.168.110.231:8080/#${options.redirect}`;
+    } else if (options.url) {
+      renderUrl = options.url;
+    }
+    this.url = renderUrl;
+  },
+  onShow: function () {},
+  methods: {},
+};
 </script>
-
-<style>
-	.content {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.logo {
-		height: 200rpx;
-		width: 200rpx;
-		margin: 200rpx auto 50rpx auto;
-	}
-
-	.text-area {
-		display: flex;
-		justify-content: center;
-	}
-
-	.title {
-		font-size: 36rpx;
-		color: #8f8f94;
-	}
-</style>

src/services/https/user.js

@@ -0,0 +1,8 @@
+import request from "../request";
+
+export function login(data) {
+  return request("/wechat/mini/login", {
+    method: "POST",
+    data,
+  });
+}

src/services/request.js

@@ -0,0 +1,56 @@
+// const baseURL = "http://192.168.110.180:8888/3dshow";
+const baseURL = "https://www.3dqueen.cloud/3dshow/v2/user";
+
+export default function (url, options = {}) {
+  return new Promise((resolve) => {
+    if (options.method && options.method !== "GET")
+      uni.showLoading({ title: "加载中" });
+
+    uni.request({
+      ...options,
+      url: (options.baseURL ? options.baseURL : baseURL) + url,
+      header: {
+        Authorization: "Bearer " + uni.getStorageSync("access-token"),
+      },
+      success(res) {
+        uni.hideLoading();
+        console.log(res);
+        if (res.statusCode === 200) {
+          let data = res.data;
+          // 兼容后端返回数据异常
+          if (!res.data.code && res.data.body) {
+            data = res.data.body;
+          }
+          if (data.code === 4006) {
+            console.log("invalid auth");
+            // #ifdef MP-WEIXIN
+            uni.reLaunch({
+              url: "guide?token=null",
+            });
+            // #endif
+
+            // #ifdef H5
+            wx.miniProgram.reLaunch({
+              url: pageFrom + "?token=null",
+            });
+            // #endif
+          }
+          resolve(data);
+        } else {
+          resolve({
+            code: res.statusCode,
+            msg: res.errMsg,
+          });
+        }
+      },
+      fail(err) {
+        uni.hideLoading();
+        console.log("error", err);
+        resolve({
+          code: 500,
+          msg: err.errMsg,
+        });
+      },
+    });
+  });
+}