数据魔方逻辑处理

v1.1.0
于肖磊 2024-12-09 14:19:03 +08:00
parent 6418ff7513
commit d6fb007129
2 changed files with 12 additions and 11 deletions

View File

@ -1,8 +1,8 @@
<template> <template>
<template v-if="tabs_content.data_type != 'video'"> <template v-if="['goods', 'images', 'video'].includes(tabs_content.data_type) || (tabs_content.data_type == 'custom' && ['vertical-scroll', 'horizontal'].includes(tabs_content.data_source_direction))">
<card-container> <card-container>
<div class="mb-12">基础样式</div> <div class="mb-12">基础样式</div>
<template v-if="['goods', 'images', 'custom'].includes(tabs_content.data_type)"> <template v-if="tabs_content.data_type != 'video'">
<el-form-item label="自动轮播"> <el-form-item label="自动轮播">
<el-switch v-model="form.is_roll" active-value="1" inactive-value="0" /> <el-switch v-model="form.is_roll" active-value="1" inactive-value="0" />
</el-form-item> </el-form-item>
@ -30,6 +30,12 @@
</card-container> </card-container>
<div class="bg-f5 divider-line" /> <div class="bg-f5 divider-line" />
</template> </template>
<template v-if="['goods', 'images'].includes(tabs_content.data_type) || (tabs_content.data_type == 'custom' && ['vertical-scroll', 'horizontal'].includes(tabs_content.data_source_direction))">
<card-container>
<carousel-indicator :key="form.carouselKey" :value="form"></carousel-indicator>
</card-container>
<div class="bg-f5 divider-line" />
</template>
<template v-if="tabs_content.data_type === 'goods'"> <template v-if="tabs_content.data_type === 'goods'">
<card-container> <card-container>
<div class="mb-12">标题样式</div> <div class="mb-12">标题样式</div>
@ -156,12 +162,6 @@
</card-container> </card-container>
<div class="bg-f5 divider-line" /> <div class="bg-f5 divider-line" />
</template> </template>
<template v-if="['goods', 'images', 'custom'].includes(tabs_content.data_type)">
<card-container>
<carousel-indicator :key="form.carouselKey" :value="form"></carousel-indicator>
</card-container>
<div class="bg-f5 divider-line" />
</template>
<card-container class="mb-8"> <card-container class="mb-8">
<div class="mb-12">通用样式</div> <div class="mb-12">通用样式</div>
<el-form-item label="底部背景"> <el-form-item label="底部背景">

View File

@ -2,10 +2,10 @@
<div class="w h" :style="style_container"> <div class="w h" :style="style_container">
<div class="re w h oh"> <div class="re w h oh">
<template v-if="video && !video_img"> <template v-if="video && !video_img">
<video :src="video" class="w h" ></video> <video :src="video" class="w h" :style="video_style"></video>
</template> </template>
<template v-else> <template v-else>
<image-empty v-model="video_img" error-img-style="width:60px;height:60px;"></image-empty> <image-empty v-model="video_img" :style="video_style" error-img-style="width:60px;height:60px;"></image-empty>
</template> </template>
<img :src="video_src" class="middle box-shadow-sm round" width="50" height="50" /> <img :src="video_src" class="middle box-shadow-sm round" width="50" height="50" />
</div> </div>
@ -46,7 +46,8 @@ const video = computed(() => {
} }
}); });
// //
const style_container = computed(() => padding_computer(props.dataStyle.chunk_padding) + radius_computer(props.dataStyle.img_radius)); const style_container = computed(() => padding_computer(props.dataStyle.chunk_padding));
const video_style = computed(() => radius_computer(props.dataStyle.img_radius));
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
video { video {