修改数据魔方宽度默认值处理

v1.4.0
于肖磊 2025-05-28 10:43:04 +08:00
parent 7684564935
commit b41c0f04fc
2 changed files with 12 additions and 8 deletions

View File

@ -18,9 +18,9 @@
<template v-else>
<div class="cube-selected-text">
<template v-if="styleActived !== 10">
建议{{ Math.round((props.cubeWidth / densityNum) * (item.end.x - item.start.x + 1)) }}
建议{{ Math.round((props.countWidth / densityNum) * (item.end.x - item.start.x + 1)) }}
x
{{ Math.round((props.cubeHeight / densityNum) * (item.end.y - item.start.y + 1)) }}
{{ Math.round((props.countHeight / densityNum) * (item.end.y - item.start.y + 1)) }}
px
<template v-if="props.type == 'data'">
<div>{{ data_title(item) }}</div>
@ -60,8 +60,10 @@ interface Props {
flag: boolean;
list: CubeItem[];
type?: string;
cubeWidth: number;
cubeHeight: number;
countWidth?: number; //
countHeight?: number; //
cubeWidth: number; //
cubeHeight: number; //
styleActived?: number;
imgFit?: "" | "cover" | "fill" | "contain" | "none" | "scale-down";
magicCubeDensity?: number;
@ -72,6 +74,8 @@ const props = withDefaults(defineProps<Props>(), {
list: () => [],
flag: false,
type: 'img',
countWidth: 390,
countHeight: 390,
cubeWidth: 390,
cubeHeight: 390,
styleActived: 0,
@ -194,7 +198,7 @@ const onClickCubeItem = (event: any) => {
end: selectingItem.end,
data_content: {
...cloneDeep(props.defaultContent),
width: Math.round((props.cubeWidth / densityNum.value) * (selectingItem.end.x - selectingItem.start.x + 1))
width: Math.round((props.countWidth / densityNum.value) * (selectingItem.end.x - selectingItem.start.x + 1))
},
data_style: {
...cloneDeep(props.defaultStyle),

View File

@ -42,7 +42,7 @@
</div>
</template>
<template v-else>
<magic-cube :key="form.style_actived" :list="form.data_magic_list" :flag="form.style_actived == 9" :magic-cube-density="form.magic_cube_density" :cube-width="cubeWidth" type="data" :cube-height="cubeHeight" :default-content="data_content" :default-style="data_style" @selected_click="selected_click"></magic-cube>
<magic-cube :key="form.style_actived" :list="form.data_magic_list" :flag="form.style_actived == 9" :magic-cube-density="form.magic_cube_density" :cube-width="cubeWidth" :count-height="form.container_height" type="data" :cube-height="cubeHeight" :default-content="data_content" :default-style="data_style" @selected_click="selected_click"></magic-cube>
</template>
</el-form-item>
</card-container>
@ -384,8 +384,8 @@ const style_show_list = [
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20, width: 195 }, { start: {x: 3, y: 1}, end: {x: 4, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20, width: 195 }], // 2
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 1, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'row', outerflex: 'row', title_text_gap: 20, width: 390 }],// 3
[{ start: {x: 1, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'row', outerflex: 'row', title_text_gap: 20, width: 390 }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }],// 4
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20, width: 390 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }],// 5
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 1}, end: {x: 4, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20, width: 390 }],// 6
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20, width: 195 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }],// 5
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 1}, end: {x: 4, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20, width: 195 }],// 6
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }],// 7
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 3}, end: {x: 3, y: 4}, num: 1, flex: 'col', outerflex: 'col', title_text_gap: 20, width: 130 }, { start: {x: 4, y: 3}, end: {x: 4, y: 4}, num: 1, flex: 'col', outerflex: 'col', title_text_gap: 20, width: 130 }, { start: {x: 4, y: 3}, end: {x: 4, y: 4}, num: 1, flex: 'col', outerflex: 'col', title_text_gap: 20, width: 130 }],// 8
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20, width: 195 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col_price_float', outerflex: 'row', title_text_gap: 10, width: 195 }, { start: {x: 3, y: 3}, end: {x: 3, y: 4}, num: 1, flex: 'col_price_float', outerflex: 'col', title_text_gap: 10, width: 98 }, { start: {x: 4, y: 3}, end: {x: 4, y: 4}, num: 1, flex: 'col_price_float', outerflex: 'col', title_text_gap: 10, width: 98 }],// 9