sileya-ai
/
vr-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改自定义处理

v1.0.0
于肖磊 2024-10-15 16:34:52 +08:00
parent fd761bec7f
commit 49016bf21e
10 changed files with 48 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/common/custom-module/model-panel/model-panel-style.vue
View File

@ -3,6 +3,9 @@
<el-form :model="form" label-width="70">
<card-container>
<div class="mb-12">容器设置</div>
<el-form-item label="链接">
<url-value v-model="form.link"></url-value>
</el-form-item>
<el-form-item label="背景颜色">
<div class="flex-col gap-10 w">
<div class="size-12">背景色</div>

2
src/components/common/div-content/index.vue
View File

@ -287,7 +287,7 @@ const float_bottom_change = (val: { bottom: string; location: string }, id: stri
top: 0;
left: -0.2rem;
border: 0.2rem solid $cr-main;
z-index: 1;
z-index: 99999;
}
.plug-in-animation {
transition: all 0.3s ease-in-out;

1
src/components/model-custom/components/index-default.ts
View File

@ -128,6 +128,7 @@ export const panel_com_data = {
com_width: 100,
com_height: 100,
staging_height: 100,
link: {},
icon_rotate: 0,
background_img_style: '2',
background_img: [],

19
src/components/model-custom/components/index.vue
View File

@ -288,10 +288,9 @@ const previous_layer = (index: number) => {
const old_data = get_diy_index_data(index);
// 删除当前位置信息
diy_data.value.splice(index, 1);
// 将数据插入上一层数据中
diy_data.value.splice(index + 1, 0, old_data);
// 设置对应的位置为显示
set_show_tabs(index + 1);
// 将数据插入下一层数据中
diy_data.value.splice(index - 1, 0, old_data);
set_show_tabs(index - 1);
}
}
@ -301,9 +300,10 @@ const underlying_layer = (index: number) => {
const old_data = get_diy_index_data(index);
// 删除当前位置信息
diy_data.value.splice(index, 1);
// 将数据插入下一层数据中
diy_data.value.splice(index - 1, 0, old_data);
set_show_tabs(index - 1);
// 将数据插入上一层数据中
diy_data.value.splice(index + 1, 0, old_data);
// 设置对应的位置为显示
set_show_tabs(index + 1);
}
}
//组件置顶
@ -337,7 +337,7 @@ const get_diy_index_data = (index: number) => {
};
// 设置当前选中的是那个
const set_show_tabs = (index: number) => {
is_show_component_line.value = false;
// is_show_component_line.value = false;
diy_data.value.forEach((item, for_index) => {
// 先将全部的设置为false,再将当前选中的设置为true
item.show_tabs = '0';
@ -447,8 +447,11 @@ const drop = (event: any) => {
let location_y = event.offsetY;
// 使用新函数调整位置
const { x: adjustedX, y: adjustedY } = adjustPosition(location_x, location_y, com_width, com_height, 390, center_height.value);
// 计算存在多少个相同的key
const list = diy_data.value.filter(item => item.key == draggedItem.value.key);
const newItem = {
...draggedItem.value,
new_name: list.length > 0 ? draggedItem.value.name + list.length : draggedItem.value.name, // 默认添加别名
location: {
x: adjustedX,
y: adjustedY,

4
src/components/model-custom/components/right-side-operation/index.vue
View File

@ -8,10 +8,10 @@
<el-icon class="iconfont icon-copy" @click.stop="copy(index)" />
</el-tooltip>
<el-tooltip effect="dark" :show-after="200" :hide-after="200" content="前置一层" placement="right">
<el-icon :class="['iconfont icon-arrow-top', { 'disabled': index === dataLength - 1 }]" @click.stop="previous_layer(index, index === dataLength - 1)" />
<el-icon :class="['iconfont icon-arrow-top', { 'disabled': index === 0 }]" @click.stop="previous_layer(index, index === 0)" />
</el-tooltip>
<el-tooltip effect="dark" :show-after="200" :hide-after="200" content="后置一层" placement="right">
<el-icon :class="['iconfont icon-arrow-bottom', { 'disabled': index === 0 }]" @click.stop="underlying_layer(index, index === 0)" />
<el-icon :class="['iconfont icon-arrow-bottom', { 'disabled': index === dataLength - 1 }]" @click.stop="underlying_layer(index, index === dataLength - 1)" />
</el-tooltip>
<el-tooltip effect="dark" :show-after="200" :hide-after="200" content="组件置顶" placement="right">
<el-icon :class="['iconfont icon-top-up', { 'disabled': index === 0 }]" @click.stop="top_up(index, index === 0)" />

2
src/components/model-data-magic/components/product-list-show.vue
View File

@ -70,7 +70,7 @@
<template v-else>
<image-empty v-model="item.images" class="img" :style="contentImgRadius"></image-empty>
</template>
<div v-if="!isEmpty(isShow)" class="flex-col w h tl gap-20">
<div v-if="!isEmpty(isShow)" class="flex-col w h tl gap-10">
<div v-if="isShow.includes('title')" class="text-line-2 size-14 shop-title" :style="goodStyle.goods_title_style">{{ item.title }}</div>
<div v-if="isShow.includes('price')" class="identifying" :style="goodStyle.goods_price_style">
<span class="num">{{ item.show_price_symbol }}</span>{{ item.min_price }}

5
src/components/model-data-magic/index.vue
View File

@ -8,7 +8,7 @@
<div v-for="(item, index) in data_magic_list" :key="index" :style="`${ item.data_style.background_style } ${ content_radius }`" :class="['img-spacing-border', { 'style9-top': [0, 1].includes(index), 'style9-bottom': ![0, 1].includes(index) }]">
<div class="w h" :style="`${ item.data_style.background_img_style }`">
<template v-if="item.data_content.data_type == 'goods'">
<div class="w h flex-col gap-20" :style="`${ [0, 1].includes(index) ? padding_computer(item.data_style.chunk_padding) : '' }`">
<div :class="`w h flex-col ${ 'gap-' + item.title_text_gap }`" :style="`${ [0, 1].includes(index) ? padding_computer(item.data_style.chunk_padding) : '' }`">
<div v-if="(!isEmpty(item.data_content.heading_title) || !isEmpty(item.data_content.subtitle)) && [0, 1].includes(index)" class="flex-col gap-5 tl">
<p class="ma-0 w text-line-1" :style="trends_config(item.data_style, 'heading')">{{ item.data_content.heading_title || '' }}</p>
<p class="ma-0 w text-line-1" :style="trends_config(item.data_style, 'subtitle')">{{ item.data_content.subtitle || '' }}</p>
@ -39,7 +39,7 @@
<div v-for="(item, index) in data_magic_list" :key="index" class="cube-selected img-spacing-border" :style="`${ selected_style(item) } ${ item.data_style.background_style } ${ content_radius }`">
<div class="w h" :style="`${ item.data_style.background_img_style }`">
<template v-if="item.data_content.data_type == 'goods'">
<div :class="[spacing_processing(index) ? 'gap-20 w h flex-col' : 'gap-10 w h flex-col']" :style="`${ padding_computer(item.data_style.chunk_padding) }`">
<div :class="`w h flex-col ${ 'gap-' + item.title_text_gap }`" :style="`${ padding_computer(item.data_style.chunk_padding) }`">
<div v-if="!isEmpty(item.data_content.heading_title) || !isEmpty(item.data_content.subtitle)" class="flex-col gap-5 tl">
<p class="ma-0 w text-line-1" :style="trends_config(item.data_style, 'heading')">{{ item.data_content.heading_title || '' }}</p>
<p class="ma-0 w text-line-1" :style="trends_config(item.data_style, 'subtitle')">{{ item.data_content.subtitle || '' }}</p>
@ -118,6 +118,7 @@ interface data_magic {
};
num: number;
flex: string;
title_text_gap: number;
outerflex: string;
heading_title?: string;
subtitle?: string;

34
src/components/model-data-magic/model-data-magic-content.vue
View File

@ -117,15 +117,15 @@ const data_content = {
// 不同风格的数据
const style_show_list = [
[{ start: {x: 1, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'row', outerflex: 'row' }, { start: {x: 1, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'row', outerflex: 'row'}], // 风格1
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col' }, { start: {x: 3, y: 1}, end: {x: 4, y: 4}, num: 3, flex: 'row', outerflex: 'col' }], // 风格2
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 1, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'row', outerflex: 'row' }],// 风格3
[{ start: {x: 1, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'row', outerflex: 'row' }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col', outerflex: 'row' }],// 风格4
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col' }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col', outerflex: 'row' }],// 风格5
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 3, y: 1}, end: {x: 4, y: 4}, num: 3, flex: 'row', outerflex: 'col' }],// 风格6
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col', outerflex: 'row' }],// 风格7
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 3, y: 3}, end: {x: 3, y: 4}, num: 1, flex: 'col', outerflex: 'row' }, { start: {x: 4, y: 3}, end: {x: 4, y: 4}, num: 1, flex: 'col', outerflex: 'row' }, { start: {x: 4, y: 3}, end: {x: 4, y: 4}, num: 1, flex: 'col', outerflex: 'row' }],// 风格8
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col' }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row' }, { start: {x: 3, y: 3}, end: {x: 3, y: 4}, num: 1, flex: 'col', outerflex: 'row' }, { start: {x: 4, y: 3}, end: {x: 4, y: 4}, num: 1, flex: 'col', outerflex: 'row' }],// 风格9
[{ start: {x: 1, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'row', outerflex: 'row', title_text_gap: 20 }, { start: {x: 1, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'row', outerflex: 'row', title_text_gap: 20 }], // 风格1
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20 }, { start: {x: 3, y: 1}, end: {x: 4, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20 }], // 风格2
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 1, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'row', outerflex: 'row', title_text_gap: 20 }],// 风格3
[{ start: {x: 1, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'row', outerflex: 'row', title_text_gap: 20 }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }],// 风格4
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }],// 风格5
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 3, y: 1}, end: {x: 4, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20 }],// 风格6
[{ start: {x: 1, y: 1}, end: {x: 2, y: 2}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 1, y: 3}, end: {x: 2, y: 4}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 3, y: 3}, end: {x: 4, y: 4}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }],// 风格7
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 3, y: 3}, end: {x: 3, y: 4}, num: 1, flex: 'col', outerflex: 'row', title_text_gap: 20 }, { start: {x: 4, y: 3}, end: {x: 4, y: 4}, num: 1, flex: 'col', outerflex: 'row', title_text_gap: 20 }, { start: {x: 4, y: 3}, end: {x: 4, y: 4}, num: 1, flex: 'col', outerflex: 'row', title_text_gap: 20 }],// 风格8
[{ start: {x: 1, y: 1}, end: {x: 2, y: 4}, num: 3, flex: 'row', outerflex: 'col', title_text_gap: 20 }, { start: {x: 3, y: 1}, end: {x: 4, y: 2}, num: 2, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 3, y: 3}, end: {x: 3, y: 4}, num: 1, flex: 'col', outerflex: 'row', title_text_gap: 10 }, { start: {x: 4, y: 3}, end: {x: 4, y: 4}, num: 1, flex: 'col', outerflex: 'row', title_text_gap: 10 }],// 风格9
]
const tabs_name = ref('content');
const state = reactive({
@ -180,6 +180,7 @@ const magic_list = (index: number) => {
data_content: cloneDeep(data_content),
data_style: {
...cloneDeep(data_style),
goods_price_size: show_padding(index, map_index) ? 12 : 18,
chunk_padding: {
padding: show_padding(index, map_index) ? 10 : 0,
padding_top: show_padding(index, map_index) ? 10 : 20,
@ -197,8 +198,21 @@ const selected_click = (index: number) => {
selected_active.value = index;
tabs_name.value = 'content';
}
const padding_handle = [
{ index: 2, index_index: [0 , 1] },
{ index: 3, index_index: [1 , 2] },
{ index: 4, index_index: [1 , 2] },
{ index: 5, index_index: [0, 1] },
{ index: 6, index_index: [0, 1, 2, 3] },
{ index: 7, index_index: [0, 1] },
{ index: 8, index_index: [1] },
]
const show_padding = (index:number, map_index:number) => {
return index == 7 && ![0, 1].includes(map_index)
const list = padding_handle.filter(item => item.index == index && item.index_index.includes(map_index))
if (list.length > 0 || (index == 7 && ![0, 1].includes(map_index))) {
return true;
}
return false;
}
//#endregion
const data_title = (item: any) => {

2
src/components/page-settings/page-setting.vue
View File

@ -37,7 +37,7 @@ const default_data = {
header_background_img: [],
header_background_title_color: '#333',
header_background_title_typeface: '500',
header_background_title_size: 16,
header_background_title_size: 14,
function_buttons_type: 'black',
immersive_style: '0',
up_slide_display: '1',

2
src/config/const/header-nav.ts
View File

@ -97,7 +97,7 @@ const defaultFooterNav: DefaultFooterNav = {
header_background_img: [],
header_background_title_color: '#333',
header_background_title_typeface: '500',
header_background_title_size: 16,
header_background_title_size: 14,
function_buttons_type: '0',
immersive_style: '0',
up_slide_display: '1',