修改页面显示问题

v1.0.0
于肖磊 2024-08-15 18:04:42 +08:00
parent 982ccdb55d
commit 9eeacb66ef
5 changed files with 26 additions and 17 deletions

View File

@ -5,7 +5,7 @@
<image-empty v-model="item1.carousel_img[0]" :style="contentImgRadius"></image-empty>
</template>
<template v-else>
<product-list-show :outerflex="form.outerflex" :flex="form.flex" :num="form.num" :actived="props.actived" :value="item1.split_list" :content-img-radius="contentImgRadius"></product-list-show>
<product-list-show :outerflex="form.outerflex" :flex="form.flex" :num="form.num" :actived="props.actived" :is-show="form.data_content.is_show" :value="item1.split_list" :content-img-radius="contentImgRadius"></product-list-show>
</template>
</el-carousel-item>
</el-carousel>

View File

@ -4,27 +4,27 @@
<template v-if="props.flex === 'row'">
<div v-for="(item2, index2) in split_list" :key="index2" class="flex-row gap-10 half-width h">
<image-empty v-model="item2.new_src[0]" :style="contentImgRadius"></image-empty>
<div class="flex-col w h tl gap-10">
<div class="text-line-2 size-14">华为荣耀畅享平大幅度发过板华为荣耀畅享平大幅度发过</div>
<div class="identifying"><span class="num">¥</span><span>{{'51' }}</span></div>
<div v-if="!isEmpty(isShow)" class="flex-col w h tl gap-10">
<div v-if="isShow.includes('0')" class="text-line-2 size-14">耀耀</div>
<div v-if="isShow.includes('1')" class="identifying"><span class="num">¥</span><span>{{'51' }}</span></div>
</div>
</div>
</template>
<template v-else-if="actived != 7 || props.num !== 1">
<div v-for="(item2, index2) in split_list" :key="index2" :class="['flex-col gap-10 h', { 'half-width': props.num !== 1}]">
<div v-for="(item2, index2) in split_list" :key="index2" :class="['flex-col gap-10 h', { 'half-width': props.num !== 1, 'w': props.num == 1 }]">
<div class="w h re">
<image-empty v-model="item2.new_src[0]" :style="contentImgRadius"></image-empty>
<div class="price-suspension">¥{{ '51' }}</div>
<div v-if="isShow.includes('1')" class="price-suspension">¥{{ '51' }}</div>
</div>
<div class="text-line-1 size-14 tl w" style="overflow: inherit;">华为荣耀畅享平大幅度发过板华为荣耀畅享平大幅度发过</div>
<div v-if="isShow.includes('0')" class="text-line-1 size-14 tl w" style="overflow: inherit;">耀耀</div>
</div>
</template>
<template v-else>
<div v-for="(item2, index2) in split_list" :key="index2" class="flex-col h">
<div v-for="(item2, index2) in split_list" :key="index2" class="flex-col w h">
<image-empty v-model="item2.new_src[0]" :style="contentImgRadius"></image-empty>
<div class="flex-col w tl gap-10 pa-10">
<div class="text-line-2 size-14">华为荣耀畅享平大幅度发过板华为荣耀畅享平大幅度发过</div>
<div class="identifying"><span class="num">¥</span><span>{{'51' }}</span></div>
<div v-if="!isEmpty(isShow)" class="flex-col w tl gap-10 pa-10">
<div v-if="isShow.includes('0')" class="text-line-2 size-14">耀耀</div>
<div v-if="isShow.includes('1')" class="identifying"><span class="num">¥</span><span>{{'51' }}</span></div>
</div>
</div>
</template>
@ -33,20 +33,21 @@
<template v-else>
<div class="flex-col gap-20 align-c w h">
<template v-if="props.flex === 'row'">
<div v-for="(item2, index2) in split_list" :key="index2" class="flex-row gap-10 align-c">
<div v-for="(item2, index2) in split_list" :key="index2" class="flex-row gap-10 align-c w">
<image-empty v-model="item2.new_src[0]" :style="contentImgRadius"></image-empty>
<div class="flex-col jc-sb w h tl gap-10">
<div class="text-line-2 size-14">华为荣耀畅享平大幅度发过板华为荣耀畅享平大幅度发过</div>
<div class="identifying"><span class="num"></span><span>{{'51' }}</span></div>
<div v-if="!isEmpty(isShow)" class="flex-col jc-sb w h tl gap-10">
<div v-if="isShow.includes('0')" class="text-line-2 size-14">耀耀</div>
<div v-if="isShow.includes('1')" class="identifying"><span class="num"></span><span>{{'51' }}</span></div>
</div>
</div>
</template>
</div>
</template>
</template>
<script setup lang="ts">
import { isEmpty } from 'lodash';
interface Props {
value: Array<any>;
outerflex: string;
@ -54,6 +55,7 @@ interface Props {
contentImgRadius: string;
num: number;
actived: number;
isShow: Array<string>;
}
const props = withDefaults(defineProps<Props>(), {

View File

@ -50,6 +50,11 @@
</template>
</drag>
<el-button class="mtb-20 w" @click="product_list_add">+</el-button>
<el-form-item label="展示信息">
<el-checkbox-group v-model="form.is_show">
<el-checkbox v-for="item in list_show_list" :key="item.value" :value="item.value">{{ item.name }}</el-checkbox>
</el-checkbox-group>
</el-form-item>
</card-container>
</template>
<script setup lang="ts">
@ -66,6 +71,8 @@ const props = defineProps({
}
});
const list_show_list = [{ name: '商品名称', value: '0' }, { name: '商品售价', value: '1' }]
const form = ref(props.value);
const img_add = () => {

View File

@ -88,6 +88,7 @@ const data_content = {
heading_title: '主标题',
subtitle: '副标题',
product_list:[],
is_show: ['0', '1'],
img_list:[
{
carousel_img: [],

View File

@ -71,7 +71,6 @@
</template>
<script setup lang="ts">
import { get_math } from '@/utils';
import { ElButton } from 'element-plus';
const props = defineProps({
value: {
type: Object,