fix: In the permission settings, the knowledge base list does not distinguish between knowledge base types, and all are marked with the icon of the general knowledge base.

[shaohuzhang1]

fix: In the permission settings, the knowledge base list does not distinguish between knowledge base types, and all are marked with the icon of the general knowledge base. --bug=1054142 --user=王孝刚 【团队成员】权限设置中，知识库列表没有区分知识库类型，都用通用知识库的图标标识 https://www.tapd.cn/57709429/s/1681104

[f2c-ci-robot]

Adding the "do-not-merge/release-note-label-needed" label because no release-note block was detected, please follow our release note process to remove it.

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

[f2c-ci-robot]

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by:

The full list of commands accepted by this bot can be found here.

Needs approval from an approver in each of these files:

• OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[shaohuzhang1]

There are several issues and optimizations that can be addressed in the provided code:

1. Logical Error with Avatar Styling: The <AppAvatar> component has incorrect styling conditions.

   • style="background: none" should be inside the <AppAvatar> tag, not added to the class.
   • Ensure that isAppIcon(row?.icon) correctly returns true or false.

2. Redundant Code Blocks: Remove duplicate conditional blocks where an app icon (row.icon) exists but no application type (isApplication) matches.

3. Simplified SVG Source for Icons: Avoid adding inline styles like style="width: 58%" and style="width: 100%". Instead, use Vue's CSS classes effectively.

4. Potential Missing Import Statements: Ensure that import { isAppIcon } includes all necessary function implementations or imports (if available).

Here’s the updated code snippet incorporating these corrections:

 <template #default="{ row }">
   <div class="flex align-center">
     <AppAvatar
       v-if="isApplication && isAppIcon(row?.icon)"
       class="mr-12"
       shape="square"
       :size="24"
     >
       <img :src="row?.icon" alt="" />
     </AppAvatar>

     <AppAvatar
       v-else-if="row?.name && isApplication"
       :name="row?.name"
       pinyinColor
       shape="square"
       :size="24"
       class="mr-12"
     />

     <AppAvatar
       v-if="row?.icon === '1'"
       class="mr-8 avatar-purple"
       shape="square"
       :size="24"
     >
       <img src="@/assets/icon_web.svg" alt="" />
     </AppAvatar>
     <AppAvatar
       v-else-if="row?.icon === '2'"
       class="mr-8 avatar-purple"
       shape="square"
       :size="24"
     >
       <img src="@/assets/logo_lark.svg" alt="" />
     </AppAvatar>
     <AppAvatar v-else-if="isDataset" class="mr-8 avatar-blue" shape="square" :size="24">
       <img src="@/assets/icon_document.svg" alt="" />
     </AppAvatar>

     <auto-tooltip :content="row?.name">

And ensure you have the correct implementation of isAppIcon if needed:

// utils/application.ts
export const isAppIcon = (icon?: string): boolean => {
  // Example logic, adjust according to actual requirements
  return ["app-id1", "app-id2"].includes(icon);
};

By making these changes and ensuring proper usage of dependencies and functions, the component should work as intended without any visual discrepancies due to wrong styling attributes.