|
@@ -10,7 +10,7 @@
|
|
|
<up-avatar :src="src" class="avatar"></up-avatar>
|
|
|
|
|
|
<!-- 下方按钮 -->
|
|
|
- <up-button type="error" shape="circle" class="button" @click="handleLogin">获取微信授权登录</up-button>
|
|
|
+ <up-button type="error" shape="circle" class="button" @click="handleLogin">获取微信授权登录</up-button>
|
|
|
</view>
|
|
|
<view class="xieyi text-center">
|
|
|
<text class="text-grey1">登录即代表同意</text>
|
|
@@ -22,262 +22,254 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
- import {
|
|
|
- ref,
|
|
|
- reactive,
|
|
|
- onMounted
|
|
|
- } from 'vue';
|
|
|
- import {
|
|
|
- useRouter,
|
|
|
- useRoute
|
|
|
- } from 'vue-router'; // 根据实际情况选择路由库
|
|
|
- import {
|
|
|
- getCodeImg,
|
|
|
- login
|
|
|
- } from '@/api/login';
|
|
|
-
|
|
|
- import store from "@/store"
|
|
|
-
|
|
|
- const imagePath = '/static/9efd1.png';
|
|
|
-
|
|
|
- // 获取全局配置
|
|
|
- // const globalConfig = getApp().globalData.config;
|
|
|
- const register = ref(false); // 用户注册开关
|
|
|
- const loginForm = reactive({
|
|
|
- username: "",
|
|
|
- password: "",
|
|
|
- code: "",
|
|
|
- uuid: ''
|
|
|
+import {
|
|
|
+ ref,
|
|
|
+ reactive,
|
|
|
+ onMounted
|
|
|
+} from 'vue';
|
|
|
+import {
|
|
|
+ useRouter,
|
|
|
+ useRoute
|
|
|
+} from 'vue-router'; // 根据实际情况选择路由库
|
|
|
+import {
|
|
|
+ getCodeImg,
|
|
|
+ login
|
|
|
+} from '@/api/login';
|
|
|
+
|
|
|
+import store from "@/store"
|
|
|
+
|
|
|
+const imagePath = '/static/9efd1.png';
|
|
|
+
|
|
|
+// 获取全局配置
|
|
|
+// const globalConfig = getApp().globalData.config;
|
|
|
+const register = ref(false); // 用户注册开关
|
|
|
+const loginForm = reactive({
|
|
|
+ username: "",
|
|
|
+ password: "",
|
|
|
+ code: "",
|
|
|
+ uuid: ''
|
|
|
+});
|
|
|
+
|
|
|
+const codeUrl = ref("");
|
|
|
+const captchaEnabled = ref(true);
|
|
|
+
|
|
|
+
|
|
|
+const router = useRouter();
|
|
|
+// 创建响应式数据
|
|
|
+const show = ref(false);
|
|
|
+
|
|
|
+// 定义方法
|
|
|
+function open() {
|
|
|
+ // 打开逻辑,比如设置 show 为 true
|
|
|
+ show.value = true;
|
|
|
+}
|
|
|
+
|
|
|
+function close() {
|
|
|
+ // 关闭逻辑,设置 show 为 false
|
|
|
+ show.value = false;
|
|
|
+}
|
|
|
+
|
|
|
+// 用户注册
|
|
|
+const handleUserRegister = () => {
|
|
|
+ router.push('/pages/register'); // 替换为实际的路由跳转逻辑
|
|
|
+};
|
|
|
+
|
|
|
+// 隐私协议
|
|
|
+const handlePrivacy = () => {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages_home/pages/login/index'
|
|
|
+ })
|
|
|
+};
|
|
|
+
|
|
|
+// 用户协议
|
|
|
+const handleUserAgrement = () => {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages_home/pages/login/user'
|
|
|
+ })
|
|
|
+};
|
|
|
+
|
|
|
+// 登录方法
|
|
|
+const handleLogin = async () => {
|
|
|
+ uni.showLoading({
|
|
|
+ title: "登录中,请耐心等待..."
|
|
|
+ }); // 使用uni-app的loading方法替代$modal.loading
|
|
|
+ // 获取服务商信息
|
|
|
+ uni.getProvider({
|
|
|
+ service: "oauth",
|
|
|
+ success: (res) => {
|
|
|
+ console.log(res);
|
|
|
+ }
|
|
|
});
|
|
|
|
|
|
- const codeUrl = ref("");
|
|
|
- const captchaEnabled = ref(true);
|
|
|
-
|
|
|
-
|
|
|
- const router = useRouter();
|
|
|
- // 创建响应式数据
|
|
|
- const show = ref(false);
|
|
|
-
|
|
|
- // 定义方法
|
|
|
- function open() {
|
|
|
- // 打开逻辑,比如设置 show 为 true
|
|
|
- show.value = true;
|
|
|
- }
|
|
|
-
|
|
|
- function close() {
|
|
|
- // 关闭逻辑,设置 show 为 false
|
|
|
- show.value = false;
|
|
|
- }
|
|
|
-
|
|
|
- // 用户注册
|
|
|
- const handleUserRegister = () => {
|
|
|
- router.push('/pages/register'); // 替换为实际的路由跳转逻辑
|
|
|
- };
|
|
|
-
|
|
|
- // 隐私协议
|
|
|
- const handlePrivacy = () => {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages_home/pages/login/index'
|
|
|
- })
|
|
|
- };
|
|
|
-
|
|
|
- // 用户协议
|
|
|
- const handleUserAgrement = () => {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages_home/pages/login/user'
|
|
|
- })
|
|
|
- };
|
|
|
-
|
|
|
- // 登录方法
|
|
|
- const handleLogin = async () => {
|
|
|
- uni.showLoading({
|
|
|
- title: "登录中,请耐心等待..."
|
|
|
- }); // 使用uni-app的loading方法替代$modal.loading
|
|
|
- // 获取服务商信息
|
|
|
- uni.getProvider({
|
|
|
- service: "oauth",
|
|
|
- success: (res) => {
|
|
|
- console.log(res);
|
|
|
+ // 获取code
|
|
|
+ uni.login({
|
|
|
+ provider: 'weixin',
|
|
|
+ success: (res) => {
|
|
|
+ if (res.code == 500) {
|
|
|
+ uni.showLoading({
|
|
|
+ title: "系统暂未开发,敬请期待"
|
|
|
+ });
|
|
|
+ } else if (res.code == 400) {
|
|
|
+ uni.showLoading({
|
|
|
+ title: "系统暂未开放"
|
|
|
+ });
|
|
|
}
|
|
|
- });
|
|
|
-
|
|
|
- // 获取code
|
|
|
- uni.login({
|
|
|
- provider: 'weixin',
|
|
|
- success: (res) => {
|
|
|
- if (res.code == 500) {
|
|
|
- uni.showLoading({
|
|
|
- title: "系统暂未开发,敬请期待"
|
|
|
- });
|
|
|
- } else if (res.code == 400) {
|
|
|
- uni.showLoading({
|
|
|
- title: "系统暂未开放"
|
|
|
- });
|
|
|
+ loginForm.code = res.code;
|
|
|
+ // 获取用户信息
|
|
|
+ uni.getUserInfo({
|
|
|
+ success: (res) => {
|
|
|
+ console.log("用户信息", res);
|
|
|
}
|
|
|
- loginForm.code = res.code;
|
|
|
- // 获取用户信息
|
|
|
- uni.getUserInfo({
|
|
|
- success: (res) => {
|
|
|
- console.log("用户信息", res);
|
|
|
- }
|
|
|
- });
|
|
|
+ });
|
|
|
|
|
|
- pwdLogin();
|
|
|
+ pwdLogin();
|
|
|
|
|
|
- uni.hideLoading()
|
|
|
- },
|
|
|
- });
|
|
|
- };
|
|
|
+ uni.hideLoading()
|
|
|
+ },
|
|
|
+ });
|
|
|
+};
|
|
|
|
|
|
- // 密码登录
|
|
|
- const pwdLogin = async () => {
|
|
|
- if (!store) {
|
|
|
- console.error("Store is not defined");
|
|
|
- return;
|
|
|
+// 密码登录
|
|
|
+const pwdLogin = async () => {
|
|
|
+ if (!store) {
|
|
|
+ console.error("Store is not defined");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ store.dispatch('Login', loginForm).then(() => {
|
|
|
+ // uni.hideLoading(); // 关闭加载提示
|
|
|
+ loginSuccess();
|
|
|
+ })
|
|
|
+};
|
|
|
+
|
|
|
+
|
|
|
+// 登录成功后,处理函数
|
|
|
+const loginSuccess = () => {
|
|
|
+ store.dispatch('GetInfo').then((res) => {
|
|
|
+
|
|
|
+ console.log(store.state.user.userOrWorker, '>>>>99');
|
|
|
+ if (store.state.user.userOrWorker == 0) {
|
|
|
+ uni.reLaunch({
|
|
|
+ url: '/pages/UserSelection'
|
|
|
+ });
|
|
|
+ return
|
|
|
}
|
|
|
- store.dispatch('Login', loginForm).then(() => {
|
|
|
- // uni.hideLoading(); // 关闭加载提示
|
|
|
- loginSuccess();
|
|
|
+ uni.setStorageSync('userType', store.state.user.userOrWorker);
|
|
|
+ uni.switchTab({
|
|
|
+ url: '/pages/index'
|
|
|
})
|
|
|
- };
|
|
|
-
|
|
|
-
|
|
|
- // 登录成功后,处理函数
|
|
|
- const loginSuccess = () => {
|
|
|
- store.dispatch('GetInfo').then((res) => {
|
|
|
-
|
|
|
- console.log(store.state.user.userOrWorker, '>>>>99');
|
|
|
-
|
|
|
- switch (store.state.user.userOrWorker) {
|
|
|
- case 0:
|
|
|
- uni.reLaunch({
|
|
|
- url: '/pages/UserSelection'
|
|
|
- });
|
|
|
- break;
|
|
|
|
|
|
- case 1: // 跳转到用户页面
|
|
|
- uni.setStorageSync('userType', 1);
|
|
|
- case 2: // 跳转到志愿者页
|
|
|
- console.log('跳转到页面')
|
|
|
- uni.setStorageSync('userType', 2);
|
|
|
- uni.switchTab({
|
|
|
- url: '/pages/index'
|
|
|
- })
|
|
|
- break;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- });
|
|
|
- };
|
|
|
-
|
|
|
- // 页面加载时获取验证码
|
|
|
- onMounted(() => {
|
|
|
- open();
|
|
|
});
|
|
|
+};
|
|
|
+
|
|
|
+// 页面加载时获取验证码
|
|
|
+onMounted(() => {
|
|
|
+ uni.setStorageSync('userType', 0);
|
|
|
+ open();
|
|
|
+});
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
- page {
|
|
|
- background-color: #ffffff;
|
|
|
- }
|
|
|
+page {
|
|
|
+ background-color: #ffffff;
|
|
|
+}
|
|
|
|
|
|
- .normal-login-container {
|
|
|
- width: 100%;
|
|
|
+.normal-login-container {
|
|
|
+ width: 100%;
|
|
|
|
|
|
- .logo-content {
|
|
|
- width: 100%;
|
|
|
- font-size: 21px;
|
|
|
- text-align: center;
|
|
|
- padding-top: 25%;
|
|
|
-
|
|
|
- image {
|
|
|
- border-radius: 4px;
|
|
|
- }
|
|
|
+ .logo-content {
|
|
|
+ width: 100%;
|
|
|
+ font-size: 21px;
|
|
|
+ text-align: center;
|
|
|
+ padding-top: 25%;
|
|
|
|
|
|
- .title {
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
+ image {
|
|
|
+ border-radius: 4px;
|
|
|
}
|
|
|
|
|
|
- .login-form-content {
|
|
|
- text-align: center;
|
|
|
- margin: 20px auto;
|
|
|
- margin-top: 15%;
|
|
|
- width: 80%;
|
|
|
-
|
|
|
- .input-item {
|
|
|
- margin: 20px auto;
|
|
|
- background-color: #f5f6f7;
|
|
|
- height: 45px;
|
|
|
- border-radius: 20px;
|
|
|
-
|
|
|
- .icon {
|
|
|
- font-size: 38rpx;
|
|
|
- margin-left: 10px;
|
|
|
- color: #999;
|
|
|
- }
|
|
|
+ .title {
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .input {
|
|
|
- width: 100%;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 20px;
|
|
|
- text-align: left;
|
|
|
- padding-left: 15px;
|
|
|
- }
|
|
|
+ .login-form-content {
|
|
|
+ text-align: center;
|
|
|
+ margin: 20px auto;
|
|
|
+ margin-top: 15%;
|
|
|
+ width: 80%;
|
|
|
|
|
|
- }
|
|
|
+ .input-item {
|
|
|
+ margin: 20px auto;
|
|
|
+ background-color: #f5f6f7;
|
|
|
+ height: 45px;
|
|
|
+ border-radius: 20px;
|
|
|
|
|
|
- .login-btn {
|
|
|
- margin-top: 40px;
|
|
|
- height: 45px;
|
|
|
+ .icon {
|
|
|
+ font-size: 38rpx;
|
|
|
+ margin-left: 10px;
|
|
|
+ color: #999;
|
|
|
}
|
|
|
|
|
|
- .reg {
|
|
|
- margin-top: 15px;
|
|
|
+ .input {
|
|
|
+ width: 100%;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 20px;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 15px;
|
|
|
}
|
|
|
|
|
|
- .xieyi {
|
|
|
- color: #333;
|
|
|
- margin-top: 20px;
|
|
|
- }
|
|
|
+ }
|
|
|
|
|
|
- .login-code {
|
|
|
- height: 38px;
|
|
|
- float: right;
|
|
|
+ .login-btn {
|
|
|
+ margin-top: 40px;
|
|
|
+ height: 45px;
|
|
|
+ }
|
|
|
|
|
|
- .login-code-img {
|
|
|
- height: 38px;
|
|
|
- position: absolute;
|
|
|
- margin-left: 10px;
|
|
|
- width: 200rpx;
|
|
|
- }
|
|
|
- }
|
|
|
+ .reg {
|
|
|
+ margin-top: 15px;
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- /* 弹性容器:垂直方向排列 */
|
|
|
- .popup-content {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- /* 上下布局 */
|
|
|
- align-items: center;
|
|
|
- /* 水平居中 */
|
|
|
- padding: 30rpx;
|
|
|
- /* 元素间距 */
|
|
|
- gap: 30rpx;
|
|
|
- }
|
|
|
+ .xieyi {
|
|
|
+ color: #333;
|
|
|
+ margin-top: 20px;
|
|
|
+ }
|
|
|
|
|
|
- /* 头像样式 */
|
|
|
- .avatar {
|
|
|
- width: 120rpx;
|
|
|
- height: 160rpx;
|
|
|
- }
|
|
|
+ .login-code {
|
|
|
+ height: 38px;
|
|
|
+ float: right;
|
|
|
|
|
|
- /* 按钮样式 */
|
|
|
- .button {
|
|
|
- // width: 170rpx !important;
|
|
|
- /* 覆盖默认宽度 */
|
|
|
- margin-left: 0 !important;
|
|
|
- /* 清除原代码中的 margin-left */
|
|
|
+ .login-code-img {
|
|
|
+ height: 38px;
|
|
|
+ position: absolute;
|
|
|
+ margin-left: 10px;
|
|
|
+ width: 200rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+/* 弹性容器:垂直方向排列 */
|
|
|
+.popup-content {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ /* 上下布局 */
|
|
|
+ align-items: center;
|
|
|
+ /* 水平居中 */
|
|
|
+ padding: 30rpx;
|
|
|
+ /* 元素间距 */
|
|
|
+ gap: 30rpx;
|
|
|
+}
|
|
|
+
|
|
|
+/* 头像样式 */
|
|
|
+.avatar {
|
|
|
+ width: 120rpx;
|
|
|
+ height: 160rpx;
|
|
|
+}
|
|
|
+
|
|
|
+/* 按钮样式 */
|
|
|
+.button {
|
|
|
+ // width: 170rpx !important;
|
|
|
+ /* 覆盖默认宽度 */
|
|
|
+ margin-left: 0 !important;
|
|
|
+ /* 清除原代码中的 margin-left */
|
|
|
+}
|
|
|
</style>
|