chore: 按钮权限

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">
-      <span>{{ consoleName }}</span>
-      <el-icon class="el-icon--right">
-        <g-icon name="ArrowDown" />
-      </el-icon>
-    </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="{ parent: item, child }"
-          >
-            <span class="auth-name">{{ child.name }}</span>
-          </el-dropdown-item>
-        </div>
-      </el-dropdown-menu>
-    </template>
-  </el-dropdown>
+  <g-query-wrapper :data="consoleData" :loading="consoleLoading" :error="consoleError" :run="consoleRun">
+    <g-query-wrapper :data="operationData" :loading="operationLoading" :error="operationError" :run="operationRun">
+      <!-- 超管控制台和只有个人控制台时没有下拉框 -->
+      <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">
+          <span>{{ consoleName }}</span>
+          <el-icon class="el-icon--right">
+            <g-icon name="ArrowDown" />
+          </el-icon>
+        </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="{ parent: item, child }"
+              >
+                <span class="auth-name">{{ child.name }}</span>
+              </el-dropdown-item>
+            </div>
+          </el-dropdown-menu>
+        </template>
+      </el-dropdown>
+    </g-query-wrapper>
+  </g-query-wrapper>
 </template>
 <script lang="ts">
 export default {
@@ -45,6 +49,7 @@ import { computed } from 'vue'
 import { useUser } from '@shared/store/modules/user'
 import { useAuth } from '@shared/store/modules/auth'
 import { useRoute, useRouter } from 'vue-router'
+import { AuthOperationUser } from '@shared/models/auth-service/AuthOperationUser'
 const $router = useRouter()
 const $route = useRoute()
 const userStore = useUser()
@@ -64,19 +69,31 @@ const {
   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)),
-  },
+} = useRequest(() =>
+  AuthConsole.get({
+    userId: userStore.userInfo.id,
+  }).then(res => {
+    if (res.code === GATEWAY_CODE.success) {
+      authStore.$patch({ consoleList: res.data })
+    }
+    return res
+  }),
+)
+const {
+  data: operationData,
+  loading: operationLoading,
+  error: operationError,
+  run: operationRun,
+} = useRequest(() =>
+  AuthOperationUser.get({
+    userId: userStore.userInfo.id,
+    objectId: authStore.consoleInfo.consoleObjectId,
+  }).then(res => {
+    if (res.code === GATEWAY_CODE.success) {
+      authStore.$patch({ operationList: res.data })
+    }
+    return res
+  }),
 )
 // 切换控制台
 const handleToggleConsole = ({ parent, child }) => {

src/shared/layouts/default-layout.vue

@@ -83,7 +83,7 @@
               <g-icon name="Bell" class="w-[1em] h-[1em] text-xl cursor-pointer" />
             </el-badge>
             <el-dropdown>
-              <el-avatar size="medium" src="https://agile.huijiewei.com/files/202111/a102_xlenirqXfd.png"></el-avatar>
+              <el-avatar size="medium" :src="userInfo.image"></el-avatar>
               <template #dropdown>
                 <el-dropdown-menu>
                   <el-dropdown-item @click="handleLogout">退出</el-dropdown-item>
@@ -123,6 +123,7 @@ import { useLayout } from '@shared/store/modules/layout'
 import ConsoleMenu from './components/console-menu/index.vue'
 import { LocaleType } from '@shared/types/layout'
 import { useI18n } from 'vue-i18n'
+import { useUser } from '@shared/store/modules/user'
 const props = defineProps({
   enableRouteFilter: {
     type: Boolean,
@@ -131,10 +132,12 @@ const props = defineProps({
 })
 const { locale } = useI18n()
 const layoutStore = useLayout()
+const userStore = useUser()
 const PROJECT_NAME = process.env.APP_NAME
 const $route = useRoute()
 const $router = useRouter()
 const breadcrumbList = computed(() => layoutStore.breadcrumbList)
+const userInfo = computed(() => userStore.userInfo)
 const localeList: { key: LocaleType; value: string }[] = [
   {
     key: 'zh',

src/shared/main.ts

@@ -9,6 +9,8 @@ import '@assets/icons'
 import '@assets/font/font.css'
 import '@assets/css/tailwind.css'
 import { i18n } from '@shared/plugins/i18n'
+import { hasBtnPermission } from '@shared/utils/permission-utils'
 createMockServer()
 export const app = createApp(App)
+app.config.globalProperties.hasPerm = hasBtnPermission
 app.use(store).use(ElementPlus).use(i18n)

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

@@ -2,6 +2,7 @@ import { JsonProperty, Serializable } from 'typescript-json-serializer'
 import { api } from '@shared/http/axios'
 import { HttpResponse } from '@shared/http/HttpResponse'
 import { Model } from '@shared/models/Model'
+import { Operation } from '@shared/models/auth-service/Operation'
 
 @Serializable()
 export class AuthOperationUser extends Model<AuthOperationUser> {
@@ -10,8 +11,8 @@ export class AuthOperationUser extends Model<AuthOperationUser> {
    * @param payload
    */
   static async get(payload: AuthOperationUserGetReq) {
-    return await api.get<HttpResponse>('/services/auth-service/operation/user', {
-      data: payload,
+    return await api.get<HttpResponse<Operation[]>>('/services/auth-service/operation/user', {
+      params: payload,
     })
   }
 }

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

+import { Model } from '@shared/models/Model'
+import { JsonProperty, Serializable } from 'typescript-json-serializer'
+@Serializable()
+export class Operation extends Model<Operation> {
+  @JsonProperty() description: string
+  @JsonProperty() id: string
+  @JsonProperty() name: string
+  @JsonProperty() type: number
+}

src/shared/store/modules/auth.ts

@@ -11,6 +11,7 @@ export const useAuth = defineStore('auth', {
       consoleName: '我的控制台',
       consoleTypeId: '0',
     },
+    operationList: [],
   }),
   actions: {},
   persist: {

src/shared/types/auth.ts

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

src/shared/utils/permission-utils.ts

+import { useAuth } from '@shared/store/modules/auth'
+import { useUser } from '@shared/store/modules/user'
+
+export function hasBtnPermission(permission: string) {
+  const authStore = useAuth()
+  const userStore = useUser()
+  let str = ''
+  if (!permission) {
+    return false
+  } else {
+    const consoleTypeId = authStore.consoleInfo.consoleTypeId
+
+    switch (consoleTypeId) {
+      case '1':
+        str = 'auth.baas.' + permission
+        break
+      case '2': // 联盟
+        str = 'auth.federation.' + permission
+        break
+      case '3': // 企业
+        str = 'auth.organization.' + permission
+        break
+    }
+
+    const btnList = authStore.operationList.map(_ => _.id)
+
+    const userId = Number(userStore.userInfo.id)
+
+    if (userId === 10000000) {
+      return true
+    } else {
+      return btnList.indexOf(str) > -1
+    }
+  }
+}

src/shims-vue.d.ts

 /* eslint-disable */
+
 declare module '*.vue' {
   import type { DefineComponent } from 'vue'
   const component: DefineComponent<{}, {}, any>
@@ -9,3 +10,9 @@ declare module '*.svg' {
   const component: DefineComponent;
   export default component;
 }
+declare module '@vue/runtime-core' {
+  import {hasBtnPermission} from "@shared/utils/permission-utils";
+  interface ComponentCustomProperties {
+    hasPerm: typeof hasBtnPermission
+  }
+}