perf: 更干净整洁的项目配置右侧弹出面板 (#841)

src/components/ReSegmented/src/index.css

@@ -6,7 +6,6 @@
   color: rgba(0, 0, 0, 0.65);
   background-color: rgb(0 0 0 / 4%);
   border-radius: 2px;
-  transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
 }
 
 .pure-segmented-group {
@@ -43,7 +42,7 @@
   text-align: center;
   cursor: pointer;
   border-radius: 4px;
-  transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
 }
 
 .pure-segmented-item > div {

src/components/ReSegmented/src/index.tsx

@@ -121,7 +121,11 @@ export default defineComponent({
                   class="pure-segmented-item-icon"
                   style={{ marginRight: option.label ? "6px" : 0 }}
                 >
-                  {h(useRenderIcon(option.icon))}
+                  {h(
+                    useRenderIcon(option.icon, {
+                      ...option?.iconAttrs
+                    })
+                  )}
                 </span>
               ) : null}
               {option.label ? (

src/components/ReSegmented/src/type.ts

@@ -1,4 +1,5 @@
 import type { VNode, Component } from "vue";
+import type { iconType } from "@/components/ReIcon/src/types.ts";
 
 export interface OptionsType {
   /** 文字 */
@@ -8,6 +9,8 @@ export interface OptionsType {
    * @see {@link 用法参考 https://yiming_chang.gitee.io/pure-admin-doc/pages/icon/#%E9%80%9A%E7%94%A8%E5%9B%BE%E6%A0%87-userendericon-hooks }
    */
   icon?: string | Component;
+  /** 图标属性、样式配置 */
+  iconAttrs?: iconType;
   /** 值 */
   value?: string | number;
   /** 是否禁用 */