feat: Feature/pro docs (#70)

* chore: merge main

* feat: update docs

* feat: remove coze-assistant

* feat: add watermark plugin

* feat: update preferences

* feat: update docs

---------

Co-authored-by: vince <vince292007@gmail.com>

packages/@core/ui-kit/menu-ui/src/components/menu-item.vue

@@ -26,6 +26,10 @@ const subMenu = useSubMenuContext();
 const { parentMenu, parentPaths } = useMenu();
 
 const active = computed(() => props.path === rootMenu?.activePath);
+const menuIcon = computed(() =>
+  active.value ? props.activeIcon || props.icon : props.icon,
+);
+
 const isTopLevelMenuItem = computed(
   () => parentMenu.value?.type.name === 'Menu',
 );
@@ -94,7 +98,7 @@ onBeforeUnmount(() => {
     >
       <template #trigger>
         <div :class="[nsMenu.be('tooltip', 'trigger')]">
-          <VbenIcon :class="nsMenu.e('icon')" :icon="icon" fallback />
+          <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" fallback />
           <slot></slot>
           <span v-if="collapseShowTitle" :class="nsMenu.e('name')">
             <slot name="title"></slot>
@@ -109,7 +113,7 @@ onBeforeUnmount(() => {
         class="right-2"
         v-bind="props"
       />
-      <VbenIcon :class="nsMenu.e('icon')" :icon="icon" fallback />
+      <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" fallback />
       <slot></slot>
       <slot name="title"></slot>
     </div>

packages/@core/ui-kit/menu-ui/src/components/normal-menu/normal-menu.vue

@@ -12,7 +12,7 @@ defineOptions({
   name: 'NormalMenu',
 });
 
-withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<Props>(), {
   activePath: '',
   collapse: false,
   menus: () => [],
@@ -25,6 +25,12 @@ const emit = defineEmits<{
 }>();
 
 const { b, e, is } = useNamespace('normal-menu');
+
+function menuIcon(menu: MenuRecordRaw) {
+  return props.activePath === menu.path
+    ? menu.activeIcon || menu.icon
+    : menu.icon;
+}
 </script>
 
 <template>
@@ -44,7 +50,8 @@ const { b, e, is } = useNamespace('normal-menu');
         @click="() => emit('select', menu)"
         @mouseenter="() => emit('enter', menu)"
       >
-        <VbenIcon :class="e('icon')" :icon="menu.icon" fallback />
+        <VbenIcon :class="e('icon')" :icon="menuIcon(menu)" fallback />
+
         <span :class="e('name')" class="truncate"> {{ menu.name }}</span>
       </li>
     </template>

packages/@core/ui-kit/menu-ui/src/components/sub-menu.vue

@@ -172,6 +172,10 @@ function handleMouseleave(deepDispatch = false) {
   }
 }
 
+const menuIcon = computed(() =>
+  active.value ? props.activeIcon || props.icon : props.icon,
+);
+
 const item = reactive({
   active,
   parentPaths,
@@ -215,7 +219,7 @@ onBeforeUnmount(() => {
         <template #trigger>
           <SubMenuContent
             :class="is('active', active)"
-            :icon="icon"
+            :icon="menuIcon"
             :is-menu-more="isSubMenuMore"
             :is-top-level-menu-submenu="isTopLevelMenuSubmenu"
             :level="currentLevel"
@@ -246,7 +250,7 @@ onBeforeUnmount(() => {
     <template v-else>
       <SubMenuContent
         :class="is('active', active)"
-        :icon="icon"
+        :icon="menuIcon"
         :is-menu-more="isSubMenuMore"
         :is-top-level-menu-submenu="isTopLevelMenuSubmenu"
         :level="currentLevel"

packages/@core/ui-kit/menu-ui/src/interface/index.ts

@@ -50,6 +50,10 @@ interface MenuProps {
 }
 
 interface SubMenuProps extends MenuRecordBadgeRaw {
+  /**
+   * @zh_CN 激活图标
+   */
+  activeIcon?: string;
   /**
    * @zh_CN 是否禁用
    */
@@ -65,6 +69,10 @@ interface SubMenuProps extends MenuRecordBadgeRaw {
 }
 
 interface MenuItemProps extends MenuRecordBadgeRaw {
+  /**
+   * @zh_CN 图标
+   */
+  activeIcon?: string;
   /**
    * @zh_CN 是否禁用
    */

packages/@core/ui-kit/menu-ui/src/sub-menu.vue

@@ -31,12 +31,19 @@ const hasChildren = computed(() => {
     Reflect.has(menu, 'children') && !!menu.children && menu.children.length > 0
   );
 });
+
+// function menuIcon(menu: MenuRecordRaw) {
+//   return props.activePath === menu.path
+//     ? menu.activeIcon || menu.icon
+//     : menu.icon;
+// }
 </script>
 
 <template>
   <MenuItem
     v-if="!hasChildren"
     :key="menu.path"
+    :active-icon="menu.activeIcon"
     :badge="menu.badge"
     :badge-type="menu.badgeType"
     :badge-variants="menu.badgeVariants"
@@ -48,6 +55,7 @@ const hasChildren = computed(() => {
   <SubMenuComp
     v-else
     :key="`${menu.path}_sub`"
+    :active-icon="menu.activeIcon"
     :icon="menu.icon"
     :path="menu.path"
   >