chore: 登录代理

src/assets/styles/mixin.scss

+// 插入样式块
+
+// todo 光标选中
+
+// 清除浮动
+@mixin clearFix {
+  &:after {
+    content: "";
+    display: table;
+    clear: both;
+  }
+}
+
+// 滚动条样式
+@mixin scrollBar {
+  &::-webkit-scrollbar {
+    /*滚动条整体样式*/
+    width: 8px; /*高宽分别对应横竖滚动条的尺寸*/
+    height: 8px;
+  }
+  &::-webkit-scrollbar-thumb {
+    /*滚动条里面小方块*/
+    border-radius: 10px;
+    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+    background: #2555c6;
+  }
+  &::-webkit-scrollbar-track {
+    /*滚动条里面轨道*/
+    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+    border-radius: 10px;
+    background: #ededed;
+  }
+}
+
+// 表格 todo 先留着，后面写到reset-ui里
+@mixin table {
+  // border-radius: 8px 8px 0px 0px;
+
+  // /deep/ th {
+  //   height: 50px;
+  //   background: #f6f6f6;
+  //   font-family: PingFangSC-Medium, PingFang SC;
+  //   color: #636363;
+  // }
+
+  // /deep/ td {
+  //   height: 50px;
+  //   padding: 0;
+  // }
+}

src/assets/styles/variables.scss

+// 主色
+$g-color-theme: #1953cd;
+
+// 辅助色
+$g-color-success: #509c00;
+$g-color-wait: #e6a23b;
+$g-color-danger: #e02020;
+
+// 中性色
+$font-color-mian: #272727; //85
+$font-color-usually: #5a5a5a; //65
+$font-color-minor: #8c8c8c; //45
+$font-color-place-deep: #a6a6a6; //35
+$font-color-place-shallow: #c0c0c0; //25
+$border-color: #d9d9d9;
+$line-color: #e9e9e9;
+$background-color-shallow: #f7f7f7;
+$background-color-deep: #f5f7fa;
+$disabled-color: #f2f4f7;
+
+// 导航菜单 sidebar
+$sidebar-bg: #203054;
+$sidebar-menu-color: #ffffff;
+$sidebar-menu-color-active: #ffffff;
+$sidebar-menu-bg-active: #1953cd;
+$sidebar-width: 208px;
+$navbar-height: 60px;

src/pages/account/router/index.ts

@@ -24,6 +24,11 @@ const routes = [
     component: () => import('@shared/layouts/default-layout.vue'),
     children: [...CROPPED_ROUTES, ...LOOKUP_ROUTES],
   },
+  {
+    path: '/login-proxy',
+    name: 'login-proxy',
+    component: () => import('@account/views/fixed/login-proxy/index.vue'),
+  },
   ...FIXED_ROUTES,
   ...SYSTEM_ROUTES,
 ]

src/pages/account/views/fixed/login-proxy/index.vue

+<template>
+  <div></div>
+</template>
+<script lang="ts" setup>
+import { UserToken } from '@shared/models/user-service/UserToken'
+import { useAuth } from '@shared/store/modules/auth'
+import { useRequest } from 'vue-request'
+import { useUser } from '@shared/store/modules/user'
+import { GATEWAY_CODE } from '@shared/http/constants'
+import { useRouter } from 'vue-router'
+const $router = useRouter()
+const authStore = useAuth()
+const userStore = useUser()
+const {
+  data: userData,
+  loading: userLoading,
+  error: userError,
+  run: userRun,
+} = useRequest(() =>
+  UserToken.get({
+    token: authStore.loginInfo.token,
+  }).then(res => {
+    if (res.code === GATEWAY_CODE.success) {
+      userStore.$patch({ userInfo: res.data })
+      authStore.$patch({
+        consoleInfo: {
+          consoleObjectId: '0',
+          consoleName: '个人控制台',
+        },
+      })
+      $router.push({ name: 'home' })
+    }
+    return res
+  }),
+)
+</script>

src/shared/layouts/components/console-menu/index.vue

+<template>
+  <!-- 超管控制台和只有个人控制台时没有下拉框 -->
+  <div v-if="isSuperAdmin || onlyPersonal" class="toggle-menu">
+    {{ consoleName }}
+  </div>
+  <el-dropdown v-else class="toggle-menu" placement="bottom-start" trigger="click" @command="handleToggleConsole">
+    <span class="el-dropdown-link flex items-center gap-1">
+      <span>{{ consoleName }}</span>
+      <g-icon name="ArrowDown" />
+    </span>
+    <template #dropdown>
+      <el-dropdown-menu>
+        <div v-for="item in consoleList" v-show="item.child.length !== 0" :key="item.id">
+          <!-- 控制台系统类型 -->
+          <p class="auth-class">
+            <span>{{ item.name }}</span>
+          </p>
+          <!-- 控制台对象 -->
+          <el-dropdown-item
+            v-for="child in item.child"
+            :key="child.id"
+            class="text-overflow"
+            :class="{ 'is-active': consoleObjectId === child.id }"
+            :command="child.id"
+          >
+            <span class="auth-name">{{ child.name }}</span>
+          </el-dropdown-item>
+        </div>
+      </el-dropdown-menu>
+    </template>
+  </el-dropdown>
+</template>
+<script lang="ts">
+export default {
+  name: 'console-menu',
+}
+</script>
+<script lang="ts" setup>
+import { useRequest } from 'vue-request'
+import { AuthConsole } from '@shared/models/auth-service/AuthConsole'
+import { GATEWAY_CODE } from '@shared/http/constants'
+import { computed } from 'vue'
+import { useUser } from '@shared/store/modules/user'
+import { useAuth } from '@shared/store/modules/auth'
+const userStore = useUser()
+const authStore = useAuth()
+const consoleList = computed(() => authStore.consoleList)
+const consoleName = computed(() => authStore.consoleInfo.consoleName)
+const consoleObjectId = computed(() => authStore.consoleInfo.consoleObjectId)
+const isSuperAdmin = computed(() => userStore.userInfo.id === '1000000')
+const onlyPersonal = computed(
+  () =>
+    !authStore.consoleList.some(item => {
+      return item.id !== '0'
+    }),
+)
+const {
+  data: consoleData,
+  loading: consoleLoading,
+  error: consoleError,
+  run: consoleRun,
+} = useRequest(
+  () =>
+    AuthConsole.get({
+      userId: userStore.userInfo.id,
+    }).then(res => {
+      if (res.code === GATEWAY_CODE.success) {
+        authStore.$patch({ consoleList: res.data })
+      }
+      return res
+    }),
+  {
+    ready: computed(() => Boolean(userStore.userInfo.id)),
+  },
+)
+const handleToggleConsole = () => {}
+</script>
+<style lang="scss" scoped>
+@import '@/assets/styles/variables.scss';
+@import '@/assets/styles/mixin.scss';
+
+.toggle-menu {
+  font-size: 18px;
+  color: $font-color-usually;
+}
+
+.el-dropdown-menu {
+  @include scrollBar;
+  width: 200px;
+  max-height: 400px;
+  overflow-y: auto;
+
+  .auth-class {
+    height: 36px;
+    font-size: 16px;
+    line-height: 36px;
+    padding: 0 20px;
+  }
+
+  .auth-name {
+    padding-left: 15px;
+    font-size: 14px;
+
+    &::before {
+      content: '';
+      display: inline-block;
+      width: 10px;
+      height: 10px;
+      margin-right: 5px;
+      border-left: 1px solid #000;
+      border-bottom: 1px solid #000;
+    }
+  }
+
+  .el-dropdown-menu__item {
+    &.is-active {
+      background-color: #e8efffff;
+      color: $sidebar-bg !important;
+    }
+  }
+}
+</style>

src/shared/layouts/default-layout.vue

@@ -56,7 +56,10 @@
         "
       >
         <el-row type="flex" justify="space-between" align="middle" class="h-full">
-          <g-icon :name="isCollapse ? 'Expand' : 'Fold'" @click="fold" class="cursor-pointer" />
+          <div class="flex items-center gap-4">
+            <g-icon :name="isCollapse ? 'Expand' : 'Fold'" @click="fold" class="cursor-pointer" />
+            <console-menu />
+          </div>
           <div class="flex flex-row justify-start items-center">
             <router-link to="/search">
               <g-icon name="Search" @click="fold" class="mr-6 text-xl cursor-pointer" />
@@ -113,6 +116,7 @@ import { GATEWAY_CODE } from '../http/constants'
 import { MessageUtils } from '../utils/message-utils'
 import { useAuth } from '@shared/store/modules/auth'
 import { useLayout } from '@shared/store/modules/layout'
+import ConsoleMenu from './components/console-menu'
 const layoutStore = useLayout()
 const PROJECT_NAME = '管理系统'
 let { proxy } = getCurrentInstance()

src/shared/models/auth-service/AuthConsole.ts

@@ -12,7 +12,7 @@ export class AuthConsole extends Model<AuthConsole> {
    */
   static async get(payload: AuthConsoleGetReq) {
     return await api.get<HttpResponse<OperationObject[]>>('/services/auth-service/console', {
-      data: payload,
+      params: payload,
     })
   }
 }

src/shared/models/auth-service/AuthMenuInfo.ts

@@ -5,14 +5,14 @@ import { Model } from '@shared/models/Model'
 import { MenuResp } from '@shared/models/auth-service/MenuResp'
 
 @Serializable()
-export class AuthOperationRoleTree extends Model<AuthOperationRoleTree> {
+export class AuthMenuInfo extends Model<AuthMenuInfo> {
   /**
    * 获取菜单信息
    * @param payload
    */
   static async get(payload: AuthMenuInfoGetReq) {
     return await api.get<HttpResponse<MenuResp[]>>('/services/auth-service/menu/info', {
-      data: payload,
+      params: payload,
     })
   }
 }

src/shared/models/user-service/UserToken.ts

@@ -3,6 +3,7 @@ import { OrgUserInfo } from '@shared/models/user-service/OrgUserInfo'
 import { UserRoleInfo } from '@shared/models/user-service/UserRoleInfo'
 import { JsonProperty, Serializable } from 'typescript-json-serializer'
 import { api } from '@shared/http/axios'
+import { HttpResponse } from '@shared/http/HttpResponse'
 @Serializable()
 export class UserToken extends Model<UserToken> {
   //创建时间
@@ -31,7 +32,7 @@ export class UserToken extends Model<UserToken> {
   //标识
   @JsonProperty() tag: string
   static async get(payload: UserTokenGetReq) {
-    return await api.get('/services/user-service/user/token', {
+    return await api.get<HttpResponse<UserToken>>('/services/user-service/user/token', {
       params: payload,
     })
   }

src/shared/pages/fixed/login/index.vue

@@ -105,7 +105,7 @@ const handleSubmitForm = async () => {
             authStore.$patch({
               loginInfo: res.data,
             })
-            await $router.push('/')
+            await $router.push({ name: 'login-proxy' })
           } else {
             MessageUtils.warning(res?.message)
           }

src/shared/router/zookeeper.ts

@@ -2,9 +2,8 @@ import { Router } from 'vue-router'
 import { pendingRequest } from '@shared/http/utils'
 import { FIXED_ROUTES } from '@shared/router/constants'
 import { useAuth } from '@shared/store/modules/auth'
-// import { authStore } from '@shared/store/modules/auth'
 // 路由白名单
-const whiteList = FIXED_ROUTES.map(_ => _.name)
+const whiteList = [...FIXED_ROUTES.map(_ => _.name)]
 export const zookeeper = (router: Router): void => {
   // 添加异常处理
   const originalPush = router.push

src/shared/store/modules/auth.ts

@@ -5,12 +5,17 @@ import { AuthLogin } from '@shared/models/gateway/AuthLogin'
 export const useAuth = defineStore('auth', {
   state: (): AuthType => ({
     loginInfo: new AuthLogin({}),
+    consoleList: [],
+    consoleInfo: {
+      consoleObjectId: '0',
+      consoleName: '个人控制台',
+    },
   }),
   actions: {},
   persist: {
     key: 'auth',
     storage: window.sessionStorage,
-    paths: ['loginInfo'],
+    paths: ['loginInfo', 'consoleList'],
     overwrite: true,
   },
 })

src/shared/types/auth.ts

 import { AuthLogin } from '@shared/models/gateway/AuthLogin'
+import { OperationObject } from '@shared/models/auth-service/OperationObject'
 
 export type AuthType = {
   loginInfo: AuthLogin
+  consoleList: OperationObject[]
+  consoleInfo: ConsoleInfo
+}
+export type ConsoleInfo = {
+  consoleObjectId: string
+  consoleName: string
 }