{{ actived_index + 1 }} common_img_computer(new_style.value.c
const img_style = computed(() => radius_computer(new_style.value));
// 标题的样式
const text_style = computed(() => `font-size: ${new_style.value.title_size || 12}px; color: ${new_style.value.title_color || '#000'};`);
+//#region 指示器处理
+// 轮播图滚动位置
+const actived_index = ref(0);
+// 轮播图显示样式
+const actived_color = computed(() => new_style.value?.actived_color || '#2A94FF');
// 指示器的样式
const indicator_style = computed(() => {
let indicator_styles = '';
@@ -67,13 +72,43 @@ const indicator_style = computed(() => {
indicator_styles += `font-size: ${size}px;`;
} else if (new_style.value.indicator_style == 'elliptic') {
indicator_styles += `background: ${new_style.value?.color || '#DDDDDD'};`;
- indicator_styles += `width: ${size * 3}px; height: ${size}px;`;
+ if (['left', 'right'].includes(new_style.value.indicator_new_location)) {
+ indicator_styles += `width: ${ size }px; height: ${size * 3}px;`;
+ } else {
+ indicator_styles += `width: ${size * 3}px; height: ${size}px;`;
+ }
} else {
indicator_styles += `background: ${new_style.value?.color || '#DDDDDD'};`;
indicator_styles += `width: ${size}px; height: ${size}px;`;
}
return indicator_styles;
});
+// 根据指示器的位置来处理 对齐方式的处理
+const indicator_location_style = computed(() => {
+ const { indicator_new_location, indicator_location, indicator_bottom } = new_style.value;
+ let styles = '';
+ if (['left', 'right'].includes(indicator_new_location)) {
+ if (indicator_location == 'flex-start') {
+ styles += `top: 0px;`;
+ } else if (indicator_location == 'center') {
+ styles += `top: 50%; transform: translateY(-50%);`;
+ } else {
+ styles += `bottom: 0px;`;
+ }
+ } else {
+ if (indicator_location == 'flex-start') {
+ styles += `left: 0px;`;
+ } else if (indicator_location == 'center') {
+ styles += `left: 50%; transform: translateX(-50%);`;
+ } else {
+ styles += `right: 0px;`;
+ }
+ }
+ // 如果有位置的处理，就使用指示器的位置处理，否则的话就用下边距处理
+ styles += `${ !isEmpty(indicator_new_location) ? `${indicator_new_location}: ${ indicator_bottom }px;` : `bottom: ${ indicator_bottom }px;` }`;
+ return styles;
+});
+//#endregion
// 导航间距
const nav_space = computed(() => 'row-gap:' + (new_style.value?.space || '0') + 'px');
// 导航标题间距
@@ -88,10 +123,6 @@ const interval_time = ref(2000);
const is_roll = ref(false);
// 轮播图key值
const carouselKey = ref('0');
-// 轮播图滚动位置
-const actived_index = ref(0);
-// 轮播图显示样式
-const actived_color = computed(() => new_style.value?.actived_color || '#2A94FF');
// 记录当前显示的轮播图的数据
const interval_list = ref({
time: 2000,
@@ -191,17 +222,12 @@ const carousel_change = (index: number) => {
.flex-wrap .item {
width: v-bind(group_width);
}
-.dot {
- padding-right: 10px;
- padding-left: 10px;
- .dot-item {
- margin: 0 0.3rem;
- &.active {
- background: v-bind(actived_color) !important;
- }
- .num-active {
- color: v-bind(actived_color) !important;
- }
+.dot-item {
+ &.active {
+ background: v-bind(actived_color) !important;
+ }
+ .num-active {
+ color: v-bind(actived_color) !important;
}
}
@@ -210,4 +236,4 @@ const carousel_change = (index: number) => {
height: v-bind(newHeight);
}
}
-
+
\ No newline at end of file
diff --git a/src/components/model-nav-group/model-nav-group-styles.vue b/src/components/model-nav-group/model-nav-group-styles.vue
index 17cc63bd..437e6e7b 100644
--- a/src/components/model-nav-group/model-nav-group-styles.vue
+++ b/src/components/model-nav-group/model-nav-group-styles.vue
@@ -33,7 +33,7 @@
-
+
diff --git a/src/components/model-seckill/index.vue b/src/components/model-seckill/index.vue
index 5e4dae01..0924d788 100644
--- a/src/components/model-seckill/index.vue
+++ b/src/components/model-seckill/index.vue
@@ -212,10 +212,10 @@ const slide_active_color = computed(() => {
const seckill_head_style = computed(() => {
let style = ``;
- const { header_background_color_list, header_background_direction } = new_style.value;
+ const { header_background_color_list, header_background_direction, seckill_head_radius } = new_style.value;
// 渐变
const gradient = { color_list: header_background_color_list, direction: header_background_direction };
- style += gradient_computer(gradient);
+ style += gradient_computer(gradient) + radius_computer(seckill_head_radius);
return style;
});
diff --git a/src/components/model-seckill/model-seckill-styles.vue b/src/components/model-seckill/model-seckill-styles.vue
index b8560077..0819cdd5 100644
--- a/src/components/model-seckill/model-seckill-styles.vue
+++ b/src/components/model-seckill/model-seckill-styles.vue
@@ -30,6 +30,9 @@
+