add tenant to login request header

src/api/login.js

@@ -1,67 +1,68 @@
 import request from '@/utils/request'
 
 // 登录方法
-export function login(username, password, code, uuid) {
-  const data = {
-    username,
-    password,
-    code,
-    uuid
-  }
-  return request({
-    url: '/login',
-    headers: {
-      isToken: false
-    },
-    method: 'post',
-    data: data
-  })
+export function login(username, password, code, uuid, tenant) {
+    const data = {
+        username,
+        password,
+        code,
+        uuid
+    }
+    return request({
+        url: '/login',
+        headers: {
+            isToken: false,
+            tenant
+        },
+        method: 'post',
+        data: data
+    })
 }
 
 // 注册方法
 export function register(data) {
-  return request({
-    url: '/register',
-    headers: {
-      isToken: false
-    },
-    method: 'post',
-    data: data
-  })
+    return request({
+        url: '/register',
+        headers: {
+            isToken: false
+        },
+        method: 'post',
+        data: data
+    })
 }
 
 // 获取用户详细信息
 export function getInfo() {
-  return request({
-    url: '/getInfo',
-    method: 'get'
-  })
+    return request({
+        url: '/getInfo',
+        method: 'get'
+    })
 }
 
 // 退出方法
 export function logout() {
-  return request({
-    url: '/logout',
-    method: 'post'
-  })
+    return request({
+        url: '/logout',
+        method: 'post'
+    })
 }
 
 // 获取验证码
 export function getCodeImg() {
-  return request({
-    url: '/captchaImage',
-    headers: {
-      isToken: false
-    },
-    method: 'get',
-    timeout: 20000
-  })
+    return request({
+        url: '/captchaImage',
+        headers: {
+            isToken: false
+        },
+        method: 'get',
+        timeout: 20000
+    })
 }
 
 // 获取路由
 export const getRouters = () => {
-  return request({
-    url: '/getRouters',
-    method: 'get'
-  })
+    return request({
+        url: '/getRouters',
+        method: 'get'
+    })
 }

src/store/modules/user.js

@@ -1,70 +1,71 @@
-import { login, logout, getInfo } from '@/api/login'
-import { getToken, setToken, removeToken } from '@/utils/auth'
+import {getInfo, login, logout} from '@/api/login'
+import {getToken, removeToken, setToken} from '@/utils/auth'
 import defAva from '@/assets/images/profile.jpg'
 
 const useUserStore = defineStore(
-  'user',
-  {
-    state: () => ({
-      token: getToken(),
-      name: '',
-      avatar: '',
-      roles: [],
-      permissions: []
-    }),
-    actions: {
-      // 登录
-      login(userInfo) {
-        const username = userInfo.username.trim()
-        const password = userInfo.password
-        const code = userInfo.code
-        const uuid = userInfo.uuid
-        return new Promise((resolve, reject) => {
-          login(username, password, code, uuid).then(res => {
-            setToken(res.token)
-            this.token = res.token
-            resolve()
-          }).catch(error => {
-            reject(error)
-          })
-        })
-      },
-      // 获取用户信息
-      getInfo() {
-        return new Promise((resolve, reject) => {
-          getInfo().then(res => {
-            const user = res.user
-            const avatar = (user.avatar == "" || user.avatar == null) ? defAva : import.meta.env.VITE_APP_BASE_API + user.avatar;
+    'user',
+    {
+        state: () => ({
+            token: getToken(),
+            name: '',
+            avatar: '',
+            roles: [],
+            permissions: []
+        }),
+        actions: {
+            // 登录
+            login(userInfo) {
+                const username = userInfo.username.trim()
+                const password = userInfo.password
+                const tenant = userInfo.tenant
+                const code = userInfo.code
+                const uuid = userInfo.uuid
+                return new Promise((resolve, reject) => {
+                    login(username, password, code, uuid, tenant).then(res => {
+                        setToken(res.token)
+                        this.token = res.token
+                        resolve()
+                    }).catch(error => {
+                        reject(error)
+                    })
+                })
+            },
+            // 获取用户信息
+            getInfo() {
+                return new Promise((resolve, reject) => {
+                    getInfo().then(res => {
+                        const user = res.user
+                        const avatar = (user.avatar == "" || user.avatar == null) ? defAva : import.meta.env.VITE_APP_BASE_API + user.avatar;
 
-            if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
-              this.roles = res.roles
-              this.permissions = res.permissions
-            } else {
-              this.roles = ['ROLE_DEFAULT']
+                        if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
+                            this.roles = res.roles
+                            this.permissions = res.permissions
+                        } else {
+                            this.roles = ['ROLE_DEFAULT']
+                        }
+                        this.name = user.userName
+                        this.avatar = avatar;
+                        resolve(res)
+                    }).catch(error => {
+                        reject(error)
+                    })
+                })
+            },
+            // 退出系统
+            logOut() {
+                return new Promise((resolve, reject) => {
+                    logout(this.token).then(() => {
+                        this.token = ''
+                        this.roles = []
+                        this.permissions = []
+                        removeToken()
+                        resolve()
+                    }).catch(error => {
+                        reject(error)
+                    })
+                })
             }
-            this.name = user.userName
-            this.avatar = avatar;
-            resolve(res)
-          }).catch(error => {
-            reject(error)
-          })
-        })
-      },
-      // 退出系统
-      logOut() {
-        return new Promise((resolve, reject) => {
-          logout(this.token).then(() => {
-            this.token = ''
-            this.roles = []
-            this.permissions = []
-            removeToken()
-            resolve()
-          }).catch(error => {
-            reject(error)
-          })
-        })
-      }
-    }
-  })
+        }
+    })
 
 export default useUserStore

src/views/login.vue

@@ -1,91 +1,112 @@
 <template>
-  <div class="login">
-    <el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
-      <h3 class="title">若依后台管理系统</h3>
-      <el-form-item prop="username">
-        <el-input
-          v-model="loginForm.username"
-          type="text"
-          size="large"
-          auto-complete="off"
-          placeholder="账号"
-        >
-          <template #prefix><svg-icon icon-class="user" class="el-input__icon input-icon" /></template>
-        </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"
-        >
-          <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"
-        >
-          <template #prefix><svg-icon icon-class="validCode" class="el-input__icon input-icon" /></template>
-        </el-input>
-        <div class="login-code">
-          <img :src="codeUrl" @click="getCode" class="login-code-img"/>
+    <div class="login">
+        <el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
+            <h3 class="title">若依后台管理系统</h3>
+            <el-form-item prop="tenant">
+                <el-input
+                        v-model="loginForm.tenant"
+                        auto-complete="off"
+                        placeholder="租户"
+                        size="large"
+                        type="text"
+                >
+                    <template #prefix>
+                        <svg-icon class="el-input__icon input-icon" icon-class="user"/>
+                    </template>
+                </el-input>
+            </el-form-item>
+            <el-form-item prop="username">
+                <el-input
+                        v-model="loginForm.username"
+                        auto-complete="off"
+                        placeholder="账号"
+                        size="large"
+                        type="text"
+                >
+                    <template #prefix>
+                        <svg-icon class="el-input__icon input-icon" icon-class="user"/>
+                    </template>
+                </el-input>
+            </el-form-item>
+            <el-form-item prop="password">
+                <el-input
+                        v-model="loginForm.password"
+                        auto-complete="off"
+                        placeholder="密码"
+                        size="large"
+                        type="password"
+                        @keyup.enter="handleLogin"
+                >
+                    <template #prefix>
+                        <svg-icon class="el-input__icon input-icon" icon-class="password"/>
+                    </template>
+                </el-input>
+            </el-form-item>
+            <el-form-item v-if="captchaEnabled" prop="code">
+                <el-input
+                        v-model="loginForm.code"
+                        auto-complete="off"
+                        placeholder="验证码"
+                        size="large"
+                        style="width: 63%"
+                        @keyup.enter="handleLogin"
+                >
+                    <template #prefix>
+                        <svg-icon class="el-input__icon input-icon" icon-class="validCode"/>
+                    </template>
+                </el-input>
+                <div class="login-code">
+                    <img :src="codeUrl" class="login-code-img" @click="getCode"/>
+                </div>
+            </el-form-item>
+            <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
+            <el-form-item style="width:100%;">
+                <el-button
+                        :loading="loading"
+                        size="large"
+                        style="width:100%;"
+                        type="primary"
+                        @click.prevent="handleLogin"
+                >
+                    <span v-if="!loading">登 录</span>
+                    <span v-else>登 录 中...</span>
+                </el-button>
+                <div v-if="register" style="float: right;">
+                    <router-link :to="'/register'" class="link-type">立即注册</router-link>
+                </div>
+            </el-form-item>
+        </el-form>
+        <!--  底部  -->
+        <div class="el-login-footer">
+            <span>Copyright © 2018-2023 ruoyi.vip All Rights Reserved.</span>
         </div>
-      </el-form-item>
-      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
-      <el-form-item style="width:100%;">
-        <el-button
-          :loading="loading"
-          size="large"
-          type="primary"
-          style="width:100%;"
-          @click.prevent="handleLogin"
-        >
-          <span v-if="!loading">登 录</span>
-          <span v-else>登 录 中...</span>
-        </el-button>
-        <div style="float: right;" v-if="register">
-          <router-link class="link-type" :to="'/register'">立即注册</router-link>
-        </div>
-      </el-form-item>
-    </el-form>
-    <!--  底部  -->
-    <div class="el-login-footer">
-      <span>Copyright © 2018-2023 ruoyi.vip All Rights Reserved.</span>
     </div>
-  </div>
 </template>
 
 <script setup>
-import { getCodeImg } from "@/api/login";
+import {getCodeImg} from "@/api/login";
 import Cookies from "js-cookie";
-import { encrypt, decrypt } from "@/utils/jsencrypt";
+import {decrypt, encrypt} from "@/utils/jsencrypt";
 import useUserStore from '@/store/modules/user'
 
 const userStore = useUserStore()
 const router = useRouter();
-const { proxy } = getCurrentInstance();
+const {proxy} = getCurrentInstance();
 
 const loginForm = ref({
-  username: "admin",
-  password: "admin123",
-  rememberMe: false,
-  code: "",
-  uuid: ""
+    tenant: "",
+    username: "admin",
+    password: "admin123",
+    rememberMe: false,
+    code: "",
+    uuid: ""
 });
 
 const loginRules = {
-  username: [{ required: true, trigger: "blur", message: "请输入您的账号" }],
-  password: [{ required: true, trigger: "blur", message: "请输入您的密码" }],
-  code: [{ required: true, trigger: "change", message: "请输入验证码" }]
+    tenant: [{required: true, trigger: "blur", message: "请输入租户"}],
+    username: [{required: true, trigger: "blur", message: "请输入您的账号"}],
+    password: [{required: true, trigger: "blur", message: "请输入您的密码"}],
+    code: [{required: true, trigger: "change", message: "请输入验证码"}]
 };
 
 const codeUrl = ref("");
@@ -97,53 +118,55 @@ const register = ref(false);
 const redirect = ref(undefined);
 
 function handleLogin() {
-  proxy.$refs.loginRef.validate(valid => {
-    if (valid) {
-      loading.value = true;
-      // 勾选了需要记住密码设置在 cookie 中设置记住用户名和密码
-      if (loginForm.value.rememberMe) {
-        Cookies.set("username", loginForm.value.username, { expires: 30 });
-        Cookies.set("password", encrypt(loginForm.value.password), { expires: 30 });
-        Cookies.set("rememberMe", loginForm.value.rememberMe, { expires: 30 });
-      } else {
-        // 否则移除
-        Cookies.remove("username");
-        Cookies.remove("password");
-        Cookies.remove("rememberMe");
-      }
-      // 调用action的登录方法
-      userStore.login(loginForm.value).then(() => {
-        router.push({ path: redirect.value || "/" });
-      }).catch(() => {
-        loading.value = false;
-        // 重新获取验证码
-        if (captchaEnabled.value) {
-          getCode();
+    proxy.$refs.loginRef.validate(valid => {
+        if (valid) {
+            loading.value = true;
+            // 勾选了需要记住密码设置在 cookie 中设置记住用户名和密码
+            if (loginForm.value.rememberMe) {
+                Cookies.set("tenant", loginForm.value.tenant, {expires: 30});
+                Cookies.set("username", loginForm.value.username, {expires: 30});
+                Cookies.set("password", encrypt(loginForm.value.password), {expires: 30});
+                Cookies.set("rememberMe", loginForm.value.rememberMe, {expires: 30});
+            } else {
+                // 否则移除
+                Cookies.remove("tenant");
+                Cookies.remove("username");
+                Cookies.remove("password");
+                Cookies.remove("rememberMe");
+            }
+            // 调用action的登录方法
+            userStore.login(loginForm.value).then(() => {
+                router.push({path: redirect.value || "/"});
+            }).catch(() => {
+                loading.value = false;
+                // 重新获取验证码
+                if (captchaEnabled.value) {
+                    getCode();
+                }
+            });
         }
-      });
-    }
-  });
+    });
 }
 
 function getCode() {
-  getCodeImg().then(res => {
-    captchaEnabled.value = res.captchaEnabled === undefined ? true : res.captchaEnabled;
-    if (captchaEnabled.value) {
-      codeUrl.value = "data:image/gif;base64," + res.img;
-      loginForm.value.uuid = res.uuid;
-    }
-  });
+    getCodeImg().then(res => {
+        captchaEnabled.value = res.captchaEnabled === undefined ? true : res.captchaEnabled;
+        if (captchaEnabled.value) {
+            codeUrl.value = "data:image/gif;base64," + res.img;
+            loginForm.value.uuid = res.uuid;
+        }
+    });
 }
 
 function getCookie() {
-  const username = Cookies.get("username");
-  const password = Cookies.get("password");
-  const rememberMe = Cookies.get("rememberMe");
-  loginForm.value = {
-    username: username === undefined ? loginForm.value.username : username,
-    password: password === undefined ? loginForm.value.password : decrypt(password),
-    rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
-  };
+    const username = Cookies.get("username");
+    const password = Cookies.get("password");
+    const rememberMe = Cookies.get("rememberMe");
+    loginForm.value = {
+        username: username === undefined ? loginForm.value.username : username,
+        password: password === undefined ? loginForm.value.password : decrypt(password),
+        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
+    };
 }
 
 getCode();
@@ -159,6 +182,7 @@ getCookie();
   background-image: url("../assets/images/login-background.jpg");
   background-size: cover;
 }
+
 .title {
   margin: 0px auto 30px auto;
   text-align: center;
@@ -170,32 +194,39 @@ getCookie();
   background: #ffffff;
   width: 400px;
   padding: 25px 25px 5px 25px;
+
   .el-input {
     height: 40px;
+
     input {
       height: 40px;
     }
   }
+
   .input-icon {
     height: 39px;
     width: 14px;
     margin-left: 0px;
   }
 }
+
 .login-tip {
   font-size: 13px;
   text-align: center;
   color: #bfbfbf;
 }
+
 .login-code {
   width: 33%;
   height: 40px;
   float: right;
+
   img {
     cursor: pointer;
     vertical-align: middle;
   }
 }
+
 .el-login-footer {
   height: 40px;
   line-height: 40px;
@@ -208,6 +239,7 @@ getCookie();
   font-size: 12px;
   letter-spacing: 1px;
 }
+
 .login-code-img {
   height: 40px;
   padding-left: 12px;