组件新增是否置底逻辑

v1.1.0
于肖磊 2024-10-29 14:29:24 +08:00
parent 9989e99da9
commit acf2276def
4 changed files with 11 additions and 2 deletions

View File

@ -21,6 +21,9 @@
<el-form-item v-if="isFloatingUp" label="组件上浮">
<slider v-model="form.floating_up" :min="0" :max="100"></slider>
</el-form-item>
<el-form-item v-if="isFloatingUp" label="是否置底">
<el-switch v-model="form.is_bottom_up" active-value="1" inactive-value="0" />
</el-form-item>
<el-form-item label="内边距">
<padding :value="form" @update:value="padding_change"></padding>
</el-form-item>
@ -64,6 +67,7 @@ const props = defineProps({
color_list: [{ color: '', color_percentage: undefined }] as color_list[],
background_img_style: '0',
floating_up: 0,
is_bottom_up: '0',
padding: 0,
padding_top: 0,
padding_bottom: 0,

View File

@ -151,6 +151,7 @@ interface com_data {
style: {
offset_number_percentage: string,
common_style: {
is_bottom_up: string;
floating_up: number;
};
};
@ -178,9 +179,11 @@ const model_style = computed(() => {
bottom = container_height - 60 + height;
}
}
let z_index = '';
// z-index1
let z_index = 'z-index: 1';
// z-index
if (item.com_data.style.common_style?.floating_up != 0) {
z_index = `z-index: 1`;
z_index = `z-index: ${ item.com_data.style.common_style?.is_bottom_up == '1' ? '0' : '1'}`;
}
item.com_data.style.offset_number_percentage = (bottom / window.innerHeight).toFixed(4);
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};`;

View File

@ -3,6 +3,7 @@ const defaultCommon: componentsCommonCommonStyle = {
color_list: [{ color: '', color_percentage: undefined }],
background_img_style: '0',
floating_up: 0,
is_bottom_up: '0',
padding_top_safe_value: 0, // 安全距离值,在顶部时,需要加上安全距离,防止遮挡
padding: 0,
padding_top: 0,

View File

@ -88,6 +88,7 @@ declare global {
direction: string;
background_img_style: string;
floating_up: number;
is_bottom_up: string;
padding_top_safe_value: number;
padding: number;
padding_top: number;