修改商品块的大小

v1.0.0
于肖磊 2024-08-22 17:58:36 +08:00
parent 6f255adeaa
commit c1fa0fbb71
5 changed files with 25 additions and 9 deletions

View File

@ -212,7 +212,8 @@ const two_columns = computed(() => content_outer_spacing.value + 'px');
//
const three_columns = computed(() => content_outer_spacing.value * 2 + 'px');
//
const multicolumn_columns = computed(() => new_style.value.content_outer_width + 'px');
const multicolumn_columns_width = computed(() => new_style.value.content_outer_width + 'px');
const multicolumn_columns_height = computed(() => new_style.value.content_outer_height + 'px');
//
const outer_class = computed(() => {
@ -379,8 +380,9 @@ const style_container = computed(() => {
width: calc((100% - v-bind(three_columns)) / 3);
}
.multicolumn-columns {
width: v-bind(multicolumn_columns);
min-width: v-bind(multicolumn_columns);
width: v-bind(multicolumn_columns_width);
min-width: v-bind(multicolumn_columns_width);
height: v-bind(multicolumn_columns_height);
}
.flex-img0 {
height: auto;

View File

@ -42,9 +42,14 @@
<el-form-item label="商品间距">
<slider v-model="form.content_outer_spacing" :max="100"></slider>
</el-form-item>
<el-form-item v-if="product_style == '5'" label="内容宽度">
<slider v-model="form.content_outer_width" :max="1000"></slider>
</el-form-item>
<template v-if="product_style == '5'">
<el-form-item label="内容宽度">
<slider v-model="form.content_outer_width" :max="1000"></slider>
</el-form-item>
<el-form-item label="内容高度">
<slider v-model="form.content_outer_height" :max="1000"></slider>
</el-form-item>
</template>
</card-container>
<card-container class="mb-8">
<div class="mb-12">购物车按钮</div>

View File

@ -37,9 +37,14 @@
<el-form-item label="商品间距">
<slider v-model="form.content_outer_spacing" :max="100"></slider>
</el-form-item>
<el-form-item v-if="product_style == '5'" label="内容宽度">
<slider v-model="form.content_outer_width" :max="1000"></slider>
</el-form-item>
<template v-if="product_style == '5'">
<el-form-item label="内容宽度">
<slider v-model="form.content_outer_width" :max="1000"></slider>
</el-form-item>
<el-form-item label="内容高度">
<slider v-model="form.content_outer_height" :max="1000"></slider>
</el-form-item>
</template>
</template>
<el-form-item label="商品名称">
<text-size-type v-model:typeface="form.shop_title_typeface" v-model:size="form.shop_title_size"></text-size-type>

View File

@ -23,6 +23,7 @@ interface DefaultProductList {
shop_radius: radiusStyle;
content_outer_spacing: number;
content_outer_width: number;
content_outer_height: number;
content_spacing: number;
shop_title_typeface: string;
shop_title_size: number;
@ -85,6 +86,7 @@ const defaultProductList: DefaultProductList = {
content_outer_spacing: 10, // 商品间距
content_spacing: 10,
content_outer_width: 104,
content_outer_height: 189,
shop_title_typeface: 'normal',
shop_title_size: 12,
shop_title_color: "#000",

View File

@ -39,6 +39,7 @@ interface DefaultProductList {
shop_radius: radiusStyle;
content_outer_spacing: number;
content_outer_width: number;
content_outer_height: number;
content_spacing: number;
shop_title_typeface: string;
shop_title_size: number;
@ -108,6 +109,7 @@ const defaultProductList: DefaultProductList = {
content_outer_spacing: 10,
content_spacing: 10,
content_outer_width: 104,
content_outer_height: 189,
shop_title_typeface: 'normal',
shop_title_size: 12,
shop_title_color: "#000",