Commit 9177697d00fbde5f5e38505425e1de78f6b34f4d

Authored by ww
1 parent 83d9df9d

fix(Icon): 图标为圆形边框时隐藏四周锚点

@@ -2,7 +2,7 @@ @@ -2,7 +2,7 @@
2 <section :class="prefixCls" 2 <section :class="prefixCls"
3 :style="{ borderColor: option.borderColor, borderWidth: `${option.borderWidth}px`, borderStyle: option.borderStyle, borderRadius: `${isRectBorder ? '' : '50%'}`, backgroundColor: option.backgroundColor, ...getDynamicEffectCls }"> 3 :style="{ borderColor: option.borderColor, borderWidth: `${option.borderWidth}px`, borderStyle: option.borderStyle, borderRadius: `${isRectBorder ? '' : '50%'}`, backgroundColor: option.backgroundColor, ...getDynamicEffectCls }">
4 <slot /> 4 <slot />
5 - <div v-if="isRectBorder" 5 + <div v-if="isRectBorder || !isHiddenBorder"
6 :style="{ '--point-size': `${option.pointSize}px`, '--point-color': option.pointColor, '--translate-distance': 'calc(var(--point-size) / 2)', '--translate-distance-invert': 'calc(var(--point-size) / 2 * -1)' }" 6 :style="{ '--point-size': `${option.pointSize}px`, '--point-color': option.pointColor, '--translate-distance': 'calc(var(--point-size) / 2)', '--translate-distance-invert': 'calc(var(--point-size) / 2 * -1)' }"
7 class="point-container"> 7 class="point-container">
8 <div class="point top-left"></div> 8 <div class="point top-left"></div>
@@ -15,7 +15,7 @@ @@ -15,7 +15,7 @@
15 15
16 <script lang="ts" setup> 16 <script lang="ts" setup>
17 import { useDesign } from '@/hooks/external/useDesign'; 17 import { useDesign } from '@/hooks/external/useDesign';
18 -import { IconBorderEnum, IconDynamicEffectEnum } from '@/packages/components/external/types'; 18 +import { IconBorderEnum, IconDynamicEffectEnum , IconBorderStyleEnum} from '@/packages/components/external/types';
19 import { computed, CSSProperties } from 'vue'; 19 import { computed, CSSProperties } from 'vue';
20 import { IconOptions } from './config'; 20 import { IconOptions } from './config';
21 21
@@ -33,6 +33,11 @@ const isRectBorder = computed(() => { @@ -33,6 +33,11 @@ const isRectBorder = computed(() => {
33 return borderType === IconBorderEnum.RECT 33 return borderType === IconBorderEnum.RECT
34 }) 34 })
35 35
  36 +const isHiddenBorder = computed(() => {
  37 + const { borderStyle, borderType } = props.option as IconOptions
  38 + return borderStyle === IconBorderStyleEnum.NONE || borderType === IconBorderEnum.ROUNDED
  39 +})
  40 +
36 const animation: Record<IconDynamicEffectEnum, { attr: keyof CSSProperties, value: string }> = { 41 const animation: Record<IconDynamicEffectEnum, { attr: keyof CSSProperties, value: string }> = {
37 [IconDynamicEffectEnum.JUMP]: { 42 [IconDynamicEffectEnum.JUMP]: {
38 attr: 'animation', 43 attr: 'animation',