diff --git a/src/components/common/subscript/subscript-index.vue b/src/components/common/subscript/subscript-index.vue index 2cdf26cb..eff62c6a 100644 --- a/src/components/common/subscript/subscript-index.vue +++ b/src/components/common/subscript/subscript-index.vue @@ -35,20 +35,21 @@ const new_style = computed(() => props.value?.style || {}); const corner_marker = computed(() => { const { subscript_style } = new_style.value; let location = common_styles_computer(subscript_style); - const seckill_subscript_location = subscript_style.seckill_subscript_location; + // 获取内部的显示数据 + const { seckill_subscript_location, top_or_bottom_spacing, left_or_right_spacing } = subscript_style; // 圆角根据图片的圆角来计算 对角线是同样的圆角 if (seckill_subscript_location == 'top-left') { - location += 'top: 0;left: 0;'; + location += `top: ${ top_or_bottom_spacing }px;left: ${ left_or_right_spacing }px;`; } else if (seckill_subscript_location == 'top-center') { location += 'top: 0;left: 50%;transform: translateX(-50%);'; } else if (seckill_subscript_location == 'top-right') { - location += 'top: 0;right: 0;'; + location += `top: ${ top_or_bottom_spacing }px;right:${ left_or_right_spacing }px;`; } else if (seckill_subscript_location == 'bottom-left') { - location += 'bottom: 0;left: 0'; + location += `bottom: ${ top_or_bottom_spacing }px;left: ${ left_or_right_spacing }px;`; } else if (seckill_subscript_location == 'bottom-center') { location += 'bottom: 0;left: 50%;transform: translateX(-50%);'; } else if (seckill_subscript_location == 'bottom-right') { - location += 'bottom: 0;right: 0;'; + location += `bottom: ${ top_or_bottom_spacing }px;right: ${ left_or_right_spacing }px;`; } return location; }); diff --git a/src/components/common/subscript/subscript-styles.vue b/src/components/common/subscript/subscript-styles.vue index 11bbe1fe..393a5ccb 100644 --- a/src/components/common/subscript/subscript-styles.vue +++ b/src/components/common/subscript/subscript-styles.vue @@ -1,13 +1,21 @@