!23 统一登录，授权

Merge pull request !23 from 三个三/auth

src/api/login.ts

@@ -2,6 +2,7 @@ import request from '@/utils/request';
 import { AxiosPromise } from 'axios';
 import { LoginData, LoginResult, VerifyCodeResult, TenantInfo } from './types';
 import { UserInfo } from '@/api/system/user/types';
+import { da } from 'element-plus/es/locale';
 
 /**
  * @param data {LoginData}
@@ -9,13 +10,9 @@ import { UserInfo } from '@/api/system/user/types';
  */
 export function login(data: LoginData): AxiosPromise<LoginResult> {
   const params = {
-    tenantId: data.tenantId,
+    ...data,
-    username: data.username.trim(),
+    clientId: data.clientId || 'e5cd7e4891bf95d1d19206ce24a7b32e',
-    password: data.password,
+    grantType: data.grantType || 'password'
-    code: data.code,
-    uuid: data.uuid,
-    clientId: 'e5cd7e4891bf95d1d19206ce24a7b32e',
-    grantType: 'password'
   };
   return request({
     url: '/auth/login',
@@ -66,16 +63,16 @@ export function getCodeImg(): AxiosPromise<VerifyCodeResult> {
  * 第三方登录
  * @param source 第三方登录类型
  * */
-export function socialLogin(source: string, code: any, state: any): AxiosPromise<any> {
+export function callback(data: LoginData): AxiosPromise<any> {
-  const data = {
+  const LoginData = {
-    code,
+    ...data,
-    state,
+    clientId: 'e5cd7e4891bf95d1d19206ce24a7b32e',
-    source
+    grantType: 'social'
   };
   return request({
-    url: '/auth/social-login',
+    url: '/auth/social/callback',
-    method: 'get',
+    method: 'post',
-    params: data
+    data: LoginData
   });
 }
 

src/api/types.ts

@@ -15,10 +15,13 @@ export type RegisterForm = {
  * 登录请求
  */
 export interface LoginData {
-  tenantId: string;
+  tenantId?: string;
-  username: string;
+  username?: string;
-  password: string;
+  password?: string;
   rememberMe?: boolean;
+  socialCode?: string,
+  socialState?: string,
+  source?: string,
   code?: string;
   uuid?: string;
   clientId: string;

src/layout/components/SocialLogin/index.vue

@@ -3,34 +3,80 @@
 </template>
 
 <script setup lang="ts">
-import {socialLogin} from '@/api/login';
+import { login, callback } from '@/api/login';
-import {setToken} from '@/utils/auth';
+import { setToken } from '@/utils/auth';
+import Cookies from 'js-cookie';
+import { getToken } from '@/utils/auth';
+import { LoginData } from '@/api/types';
 
 const route = useRoute();
-const router = useRouter();
+const loading = ref(true);
 
 
 /**
  * 接收Route传递的参数
  * @param {Object} route.query.
  */
-const code = route.query.code;
+const code = route.query.code as string;
-const state = route.query.state;
+const state = route.query.state as string;
 const source = route.query.source as string;
-const loading = ref(true);
+const tenantId = Cookies.get("tenantId") ? Cookies.get("tenantId") as string : '000000';
-await socialLogin(source, code, state)
+
-  .then(async (res) => {
+
+const processResponse = async (res: any) => {
   if (res.code !== 200) {
-      ElMessage.error(res.msg);
+    throw new Error(res.msg);
-      location.href = import.meta.env.VITE_APP_CONTEXT_PATH + 'index';
-      return;
   }
-    loading.value = false;
+  setToken(res.data.access_token);
-    setToken(res.msg);
+  ElMessage.success(res.msg);
-    ElMessage.success('登录成功');
   location.href = import.meta.env.VITE_APP_CONTEXT_PATH + 'index';
-  })
+};
-  .catch(() => {
+
+const handleError = (error: any) => {
+  ElMessage.error(error.message);
+  location.href = import.meta.env.VITE_APP_CONTEXT_PATH + 'index';
+};
+
+const callbackByCode = async (data: LoginData) => {
+  try {
+    const res = await callback(data);
+    await processResponse(res);
     loading.value = false;
+  } catch (error) {
+    handleError(error);
+  }
+};
+
+const loginByCode = async (data: LoginData) => {
+  try {
+    const res = await login(data);
+    await processResponse(res);
+    loading.value = false;
+  } catch (error) {
+    handleError(error);
+  }
+};
+
+const init = async () => {
+  const data: LoginData = {
+    socialCode: code,
+    socialState: state,
+    tenantId: tenantId,
+    source: source,
+    clientId: 'e5cd7e4891bf95d1d19206ce24a7b32e',
+    grantType: 'social'
+  };
+
+  if (!getToken()) {
+    await loginByCode(data);
+  } else {
+    await callbackByCode(data);
+  }
+};
+
+onMounted(() => {
+  nextTick(() => {
+    init();
   });
+});
 </script>

src/router/index.ts

@@ -181,4 +181,5 @@ const router = createRouter({
   }
 });
 
+
 export default router;

src/views/login.vue

@@ -4,7 +4,8 @@
       <h3 class="title">RuoYi-Vue-Plus多租户管理系统</h3>
       <el-form-item prop="tenantId" v-if="tenantEnabled">
         <el-select v-model="loginForm.tenantId" filterable placeholder="请选择/输入公司名称" style="width: 100%">
-          <el-option v-for="item in tenantList" :key="item.tenantId" :label="item.companyName" :value="item.tenantId"></el-option>
+          <el-option v-for="item in tenantList" :key="item.tenantId" :label="item.companyName"
+            :value="item.tenantId"></el-option>
           <template #prefix><svg-icon icon-class="company" class="el-input__icon input-icon" /></template>
         </el-select>
       </el-form-item>
@@ -14,12 +15,14 @@
         </el-input>
       </el-form-item>
       <el-form-item prop="password">
-        <el-input v-model="loginForm.password" type="password" size="large" auto-complete="off" placeholder="密码" @keyup.enter="handleLogin">
+        <el-input v-model="loginForm.password" type="password" size="large" auto-complete="off" placeholder="密码"
+          @keyup.enter="handleLogin">
           <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template>
         </el-input>
       </el-form-item>
       <el-form-item prop="code" v-if="captchaEnabled">
-        <el-input v-model="loginForm.code" size="large" auto-complete="off" placeholder="验证码" style="width: 63%" @keyup.enter="handleLogin">
+        <el-input v-model="loginForm.code" size="large" auto-complete="off" placeholder="验证码" style="width: 63%"
+          @keyup.enter="handleLogin">
           <template #prefix><svg-icon icon-class="validCode" class="el-input__icon input-icon" /></template>
         </el-input>
         <div class="login-code">
@@ -177,6 +180,12 @@ const initTenantList = async () => {
     }
   }
 }
+
+//检测租户选择框的变化
+watch(() => loginForm.value.tenantId, (val: string) => {
+  Cookies.set("tenantId", loginForm.value.tenantId, { expires: 30 })
+});
+
 /**
  * 第三方登录
  * @param type