diff --git a/src/components/common/div-content/index.vue b/src/components/common/div-content/index.vue
index 934d9c83..240b2628 100644
--- a/src/components/common/div-content/index.vue
+++ b/src/components/common/div-content/index.vue
@@ -3,7 +3,7 @@
-
+
@@ -118,13 +118,17 @@ const props = withDefaults(defineProps(), {
diyData: () => [],
showModelBorder: false,
isTabs: false,
- mainContentStyle: ''
+ mainContentStyle: '',
});
const diy_data = ref(props.diyData);
-watch(() => props.diyData, (val) => {
- diy_data.value = val;
-}, {immediate: true, deep: true});
+watch(
+ () => props.diyData,
+ (val) => {
+ diy_data.value = val;
+ },
+ { immediate: true, deep: true }
+);
// 模块的class
const model_class = computed(() => {
@@ -137,11 +141,11 @@ interface com_data {
style: {
common_style: {
floating_up: number;
- }
- }
+ };
+ };
}
const model_style = computed(() => {
- return (item: { id: string; key: string, com_data: com_data }) => {
+ return (item: { id: string; key: string; com_data: com_data }) => {
// 40是容器的上下间距， 60是顶部的高度
const container_height = window.innerHeight - 100;
let bottom = 0;
@@ -167,7 +171,7 @@ const model_style = computed(() => {
if (item.com_data.style.common_style?.floating_up != 0) {
z_index = `z-index: 1`;
}
- return item.key == 'float-window' ? `bottom: ${((bottom / window.innerHeight) * 100).toFixed(4) + '%'};` : `margin-top: -${ item.com_data.style.common_style?.floating_up || 0 }px;${ z_index };`;
+ return item.key == 'float-window' ? `bottom: ${((bottom / window.innerHeight) * 100).toFixed(4) + '%'};` : `margin-top: -${item.com_data.style.common_style?.floating_up || 0}px;${z_index};`;
};
});
@@ -278,11 +282,10 @@ const float_bottom_change = (val: { bottom: string; location: string }, id: stri
.plug-in-border::before {
content: '';
width: calc(100% + 0.4rem);
- height: calc(100% + 0.4rem);
+ height: 100%;
position: absolute;
- top: -0.2rem;
+ top: 0;
left: -0.2rem;
- // z-index: 1;
border: 0.2rem solid $cr-main;
}
.plug-in-animation {
@@ -387,4 +390,4 @@ const float_bottom_change = (val: { bottom: string; location: string }, id: stri
.tabs-view {
z-index: 2;
}
-
\ No newline at end of file
+
diff --git a/src/components/page-settings/index.vue b/src/components/page-settings/index.vue
index 4d39cd0f..5203d4e2 100644
--- a/src/components/page-settings/index.vue
+++ b/src/components/page-settings/index.vue
@@ -128,7 +128,7 @@ const position_class = computed(() => (form.value?.indicator_location == 'center
transform: translateX(-50%);
width: 39rem;
.roll {
- padding-bottom: 0.9rem;
+ padding-bottom: 1rem;
margin: 0 auto;
cursor: pointer;
z-index: 1;
@@ -154,11 +154,18 @@ const position_class = computed(() => (form.value?.indicator_location == 'center
}
}
.page-settings-border {
- // border: 0.2rem solid $cr-main;
position: relative;
- box-shadow: 0px 0 0px 0.2rem $cr-main !important;
z-index: 3;
box-sizing: border-box;
+ &::before {
+ content: '';
+ height: 100%;
+ width: calc(100% + 0.4rem);
+ position: absolute;
+ left: -0.2rem;
+ right: -0.2rem;
+ border: 0.2rem solid $cr-main;
+ }
}
.logo-outer-style {
height: 2.8rem;
diff --git a/src/views/layout/components/main/index.scss b/src/views/layout/components/main/index.scss
index 346d12d3..98cdcc34 100644
--- a/src/views/layout/components/main/index.scss
+++ b/src/views/layout/components/main/index.scss
@@ -89,7 +89,7 @@
.model-drag {
overflow-y: auto;
- padding-top: 0.2rem;
+ // padding-top: 0.2rem;
max-height: 84.4rem;
height: 100%;
&::-webkit-scrollbar {
@@ -194,7 +194,8 @@
transform: translateY(-50%);
left: 0;
z-index: 3;
- .layout-toggle-bar-top, .layout-toggle-bar-bottom {
+ .layout-toggle-bar-top,
+ .layout-toggle-bar-bottom {
position: absolute;
width: 0.2rem;
border-radius: 0.2rem;
@@ -208,7 +209,8 @@
}
}
.layout-toggle-bar-close:hover {
- .layout-toggle-bar-top, .layout-toggle-bar-bottom {
+ .layout-toggle-bar-top,
+ .layout-toggle-bar-bottom {
background: $cr-main;
transition: 1s ease;
}
@@ -221,7 +223,8 @@
}
.layout-toggle-bar-open:hover {
- .layout-toggle-bar-top, .layout-toggle-bar-bottom {
+ .layout-toggle-bar-top,
+ .layout-toggle-bar-bottom {
background: $cr-main;
transition: 1s ease;
}
@@ -255,4 +258,4 @@
.layout-toggle-bar {
display: none;
}
-}
\ No newline at end of file
+}
diff --git a/src/views/layout/components/main/index.vue b/src/views/layout/components/main/index.vue
index 1ae50ce3..51a91aa0 100644
--- a/src/views/layout/components/main/index.vue
+++ b/src/views/layout/components/main/index.vue
@@ -166,7 +166,7 @@ watchEffect(() => {
const { immersive_style, up_slide_display } = new_style;
// 不开启沉浸式 和 上滑显示
if (immersive_style == '1' || up_slide_display != '1') {
- top_padding.value = 2;
+ top_padding.value = 0;
} else {
top_padding.value = 90;
}
@@ -214,7 +214,7 @@ const show_model_border = ref(true);
// 点击添加tabs组件
const draggable_click = (item: componentsData) => {
const type_data = ['tabs', 'tabs-carousel'];
-
+
if (common_store.is_immersion_model) {
ElMessage.error('开启沉浸样式下不可以添加该组件');
return;
@@ -432,7 +432,7 @@ const scroll = () => {
const scoll_top = ref(0);
const on_scroll_event = (e: any) => {
scoll_top.value = e.target.scrollTop;
-}
+};
//#endregion
//#region 页面设置 导出 导入
// 在组件挂载时默认执行