修改头部显示逻辑

v1.1.0
于肖磊 2024-10-31 16:06:19 +08:00
parent ce4840aaaf
commit 53a75c8c75
2 changed files with 24 additions and 24 deletions

View File

@ -14,19 +14,17 @@
<div v-if="['1', '2', '3'].includes(form.theme)" class="flex-1">
<div class="flex-1 flex-row align-c jc-c h gap-16" :class="position_class" :style="[{ 'justify-content': form?.indicator_location || 'center' }, text_style]">
<template v-if="['2', '3'].includes(form.theme) && form.logo.length > 0">
<template v-if="new_style.up_slide_logo && new_style.up_slide_logo.length > 0">
<!-- 有上滑logo的处理逻辑 -->
<div class="logo-outer-style re">
<img class="logo-style" :style="up_slide_old_logo_style + 'max-width:' + ((props.scollTop - 5) / 90 < 1 ? 100 + '%;' : 0)" :src="form.logo[0].url" />
<img :class="['logo-style left-0', {'abs': (props.scollTop - 5) / 90 < 1 }]" :style="'opacity:0;' + up_slide_opacity" :src="new_style.up_slide_logo[0].url" />
</div>
</template>
<template v-else>
<!-- 没有上滑logo -->
<div class="logo-outer-style re">
<div class="logo-outer-style re">
<template v-if="new_style.up_slide_logo && new_style.up_slide_logo.length > 0">
<!-- 有上滑logo的处理逻辑 -->
<img :src="form.logo[0].url" class="logo-style" :style="up_slide_old_logo_style + 'max-width:' + ((props.scollTop - 5) / 90 < 1 ? 100 + '%;' : 0)" />
<img :src="new_style.up_slide_logo[0].url" :class="['logo-style left-0', {'abs': (props.scollTop - 5) / 90 < 1 }]" :style="'opacity:0;' + up_slide_opacity" />
</template>
<template v-else>
<!-- 没有上滑logo -->
<img class="logo-style" :src="form.logo[0].url" />
</div>
</template>
</template>
</div>
</template>
<div v-if="['1', '2'].includes(form.theme)">{{ form.title }}</div>
<template v-if="['3', '5'].includes(form.theme) && !is_search_alone_row">

View File

@ -50,19 +50,21 @@
<el-form-item label="上滑展示">
<el-switch v-model="form.up_slide_display" active-value="1" inactive-value="0"></el-switch>
</el-form-item>
<el-form-item v-if="['2', '3'].includes(page_content.theme) && !isEmpty(page_content.logo)" label="上滑logo">
<upload v-model="form.up_slide_logo" :limit="1"></upload>
</el-form-item>
<el-form-item label="上滑背景">
<div class="w h flex-col gap-10">
<mult-color-picker :value="form?.up_slide_background_color_list || []" :type="form?.up_slide_background_direction || '180deg'" @update:value="up_slide_mult_color_picker_event"></mult-color-picker>
<div class="flex-row jc-sb align-c">
<div class="size-12">背景图</div>
<bg-btn-style v-model="form.up_slide_background_img_style"></bg-btn-style>
<template v-if="form.up_slide_display == '1'">
<el-form-item v-if="['2', '3'].includes(page_content.theme) && !isEmpty(page_content.logo)" label="上滑logo">
<upload v-model="form.up_slide_logo" :limit="1"></upload>
</el-form-item>
<el-form-item label="上滑背景">
<div class="w h flex-col gap-10">
<mult-color-picker :value="form?.up_slide_background_color_list || []" :type="form?.up_slide_background_direction || '180deg'" @update:value="up_slide_mult_color_picker_event"></mult-color-picker>
<div class="flex-row jc-sb align-c">
<div class="size-12">背景图</div>
<bg-btn-style v-model="form.up_slide_background_img_style"></bg-btn-style>
</div>
<upload v-model="form.up_slide_background_img" :limit="1"></upload>
</div>
<upload v-model="form.up_slide_background_img" :limit="1"></upload>
</div>
</el-form-item>
</el-form-item>
</template>
<el-form-item label="返回颜色">
<color-picker v-model="form.left_back_btn_color" class="mr-10" default-color="#333"></color-picker>
<el-tooltip effect="light" :show-after="200" :hide-after="200" content="打开新页面才会出现返回按钮" raw-content placement="top">