页面设置和搜索true修改
parent
22510d82c1
commit
0c107a1c45
|
|
@ -3,7 +3,7 @@
|
|||
<div :style="style" class="flex-row align-c">
|
||||
<div class="search w re">
|
||||
<div class="box h oh flex align-c gap-10 bg-f" :style="box_style">
|
||||
<template v-if="form.is_icon_show">
|
||||
<template v-if="form.is_icon_show == '1'">
|
||||
<template v-if="form.icon_img.length > 0">
|
||||
<div class="img-box">
|
||||
<image-empty v-model="form.icon_img[0]" class="img" error-img-style="width: 4rem;height: 2.5rem;" />
|
||||
|
|
@ -13,17 +13,17 @@
|
|||
<el-icon :class="`iconfont ${ !isEmpty(form.icon_class) ? 'icon-' + form.icon_class : 'icon-search' } size-14`" :style="`color:${new_style.icon_color};`" />
|
||||
</template>
|
||||
</template>
|
||||
<span v-if="form.is_tips_show" :class="[isPageSettings ? 'size-12 text-line-1' : 'size-14 text-line-1']" :style="`color: ${ new_style.tips_color }`">{{ form.tips }}</span>
|
||||
<span v-if="form.is_tips_show == '1'" :class="[props.isPageSettings ? 'size-12 text-line-1' : 'size-14 text-line-1']" :style="`color: ${ new_style.tips_color }`">{{ form.tips }}</span>
|
||||
</div>
|
||||
<div v-if="form.is_search_show" class="abs search-botton h flex align-c jc-c" :style="search_button">
|
||||
<div v-if="form.is_search_show == '1'" class="abs search-botton h flex align-c jc-c" :style="search_button">
|
||||
<template v-if="form.search_type === 'text'">
|
||||
<div :class="['ptb-3 size-12', isPageSettings ? 'plr-12' : 'plr-16']">{{ form.search_tips }}</div>
|
||||
<div :class="['ptb-3 size-12', props.isPageSettings ? 'plr-12' : 'plr-16']">{{ form.search_tips }}</div>
|
||||
</template>
|
||||
<template v-else-if="!isEmpty(form.search_botton_img) && form.search_botton_img.length > 0">
|
||||
<image-empty v-model="form.search_botton_img[0]" class="img" :style="search_button_radius" error-img-style="width: 4rem;height: 2.8rem;" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<div :class="['ptb-3 size-12', isPageSettings ? 'plr-12' : 'plr-16']">
|
||||
<div :class="['ptb-3 size-12', props.isPageSettings ? 'plr-12' : 'plr-16']">
|
||||
<el-icon :class="`iconfont ${ !isEmpty(form.search_botton_icon) ? 'icon-' + form.search_botton_icon : '' } size-14`" />
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -72,7 +72,7 @@ const search_button_radius = computed(() => radius_computer(new_style.value.sear
|
|||
// 搜索框设置
|
||||
const box_style = computed(() => {
|
||||
let style = `border: 1px solid ${ new_style.value.search_border }; ${ radius_computer(new_style.value.search_border_radius) };`;
|
||||
if (form.value.is_center) {
|
||||
if (form.value.is_center == '1') {
|
||||
style += `justify-content: center;`;
|
||||
}
|
||||
return style;
|
||||
|
|
|
|||
|
|
@ -5,9 +5,9 @@
|
|||
<div class="mb-12">展示设置</div>
|
||||
<el-form-item label="图标样式" class="align-s">
|
||||
<el-row class="w">
|
||||
<el-col :span="24"><el-switch v-model="form.is_icon_show" width="40"></el-switch></el-col>
|
||||
<el-col :span="24"><el-switch v-model="form.is_icon_show" active-value="1" inactive-value="0"></el-switch></el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.is_icon_show" class="mt-10 w">
|
||||
<el-row v-if="form.is_icon_show == '1'" class="mt-10 w">
|
||||
<el-col :span="24">
|
||||
<upload v-model="form.icon_img" v-model:icon-value="form.icon_class" is-icon :limit="1" size="50"></upload>
|
||||
</el-col>
|
||||
|
|
@ -15,16 +15,16 @@
|
|||
</el-form-item>
|
||||
<el-form-item label="提示文字">
|
||||
<el-row class="w">
|
||||
<el-col :span="24"><el-switch v-model="form.is_tips_show"></el-switch></el-col>
|
||||
<el-col :span="24"><el-switch v-model="form.is_tips_show" active-value="1" inactive-value="0"></el-switch></el-col>
|
||||
</el-row>
|
||||
<el-row v-if="form.is_tips_show" class="mt-10 w">
|
||||
<el-row v-if="form.is_tips_show == '1'" class="mt-10 w">
|
||||
<el-col :span="24">
|
||||
<el-input v-model="form.tips" placeholder="请输入提示文字"></el-input>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.is_tips_show || form.is_icon_show" label="是否居中">
|
||||
<el-switch v-model="form.is_center"></el-switch>
|
||||
<el-form-item v-if="form.is_tips_show == '1' || form.is_icon_show == '1'" label="是否居中">
|
||||
<el-switch v-model="form.is_center" active-value="1" inactive-value="0"></el-switch>
|
||||
</el-form-item>
|
||||
<el-form-item label="搜索按钮" class="align-s">
|
||||
<el-row class="w">
|
||||
|
|
@ -32,15 +32,15 @@
|
|||
</el-row>
|
||||
<el-row v-if="form.is_search_show" class="mt-10 w">
|
||||
<el-col :span="24">
|
||||
<el-radio-group v-model="form.search_type">
|
||||
<el-radio-group v-model="form.search_type" class="mb-10">
|
||||
<el-radio value="img-icon">图片/图标</el-radio>
|
||||
<el-radio value="text">文字</el-radio>
|
||||
</el-radio-group>
|
||||
<template v-if="form.search_type === 'img-icon'">
|
||||
<upload v-model="form.search_botton_img" v-model:icon-value="form.search_botton_icon" is-icon :limit="1" size="50" class="mt-10"></upload>
|
||||
<upload v-model="form.search_botton_img" v-model:icon-value="form.search_botton_icon" is-icon :limit="1" size="50"></upload>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-input v-model="form.search_tips" placeholder="请输入文字内容" class="mt-10"></el-input>
|
||||
<el-input v-model="form.search_tips" placeholder="请输入文字内容"></el-input>
|
||||
</template>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
</template>
|
||||
</div>
|
||||
<div v-else-if="['4', '5'].includes(form.theme)" class="flex align-c h gap-10">
|
||||
<div class="flex-row gap-2"><icon name="position" size="12" color="0"></icon><span class="size-14 cr-3 text-line-1">{{ form.positioning_name }}</span><icon v-if="form.is_arrows_show" name="arrow-right" size="12" color="0"></icon></div>
|
||||
<div class="flex-row gap-2"><icon name="position" size="12" color="0"></icon><span class="size-14 cr-3 text-line-1">{{ form.positioning_name }}</span><icon v-if="form.is_arrows_show == '1'" name="arrow-right" size="12" color="0"></icon></div>
|
||||
<template v-if="['5'].includes(form.theme)">
|
||||
<div class="flex-1" style="padding-right:95px">
|
||||
<model-search :value="pageData.com_data" :is-page-settings="true"></model-search>
|
||||
|
|
@ -47,7 +47,7 @@ const page_settings = () => {
|
|||
};
|
||||
const form = computed(() => props.pageData.com_data.content);
|
||||
const new_style = computed(() => props.pageData.com_data.style);
|
||||
const position = computed(() => new_style.value.up_slide_display ? 'absolute' : 'relative');
|
||||
const position = computed(() => new_style.value.up_slide_display == '1' ? 'absolute' : 'relative');
|
||||
const roll_style = computed(() => {
|
||||
let style = ``;
|
||||
const { header_background_img, header_background_img_style, header_background_color_list, header_background_direction, header_background_type } = new_style.value;
|
||||
|
|
|
|||
|
|
@ -46,8 +46,8 @@
|
|||
</el-form-item>
|
||||
<el-form-item label="箭头按钮">
|
||||
<el-radio-group v-model="form.is_arrows_show">
|
||||
<el-radio :value="true">显示</el-radio>
|
||||
<el-radio :value="false">隐藏</el-radio>
|
||||
<el-radio value="1">显示</el-radio>
|
||||
<el-radio value="0">隐藏</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -28,14 +28,14 @@ const default_data = {
|
|||
header_background_title_typeface: '500',
|
||||
header_background_title_size: 16,
|
||||
function_buttons_type: 'black',
|
||||
immersive_style: false,
|
||||
up_slide_display: true,
|
||||
immersive_style: '0',
|
||||
up_slide_display: '1',
|
||||
icon_color: '#ccc',
|
||||
button_inner_color: '#fff',
|
||||
color_list: [{ color: '#FF973D', color_percentage: undefined }, { color: '#FF3131', color_percentage: undefined }],
|
||||
direction: '90deg',
|
||||
background_img_style: '',
|
||||
background_img: [],
|
||||
search_botton_color_list: [{ color: '#FF973D', color_percentage: undefined }, { color: '#FF3131', color_percentage: undefined }],
|
||||
search_botton_direction: '90deg',
|
||||
search_botton_background_img_style: '',
|
||||
search_botton_background_img: [],
|
||||
search_button_radius: {
|
||||
radius: 16,
|
||||
radius_top_left: 16,
|
||||
|
|
|
|||
|
|
@ -43,14 +43,14 @@
|
|||
</el-form-item>
|
||||
<el-form-item v-if="form.header_background_type == 'transparent'" label="沉浸样式">
|
||||
<el-radio-group v-model="form.immersive_style">
|
||||
<el-radio :value="true">开启</el-radio>
|
||||
<el-radio :value="false">关闭</el-radio>
|
||||
<el-radio value="1">开启</el-radio>
|
||||
<el-radio value="0">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="上滑展示">
|
||||
<el-radio-group v-model="form.up_slide_display">
|
||||
<el-radio :value="true">保留</el-radio>
|
||||
<el-radio :value="false">关闭</el-radio>
|
||||
<el-radio value="1">保留</el-radio>
|
||||
<el-radio value="0">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="['1', '2'].includes(search_content.theme)" label="标题名称">
|
||||
|
|
|
|||
|
|
@ -14,17 +14,17 @@ interface DefaultFooterNav {
|
|||
indicator_location: string;
|
||||
bottom_navigation_show: string;
|
||||
positioning_name: string;
|
||||
is_arrows_show: boolean;
|
||||
is_center: boolean;
|
||||
is_icon_show: boolean;
|
||||
is_arrows_show: string;
|
||||
is_center: string;
|
||||
is_icon_show: string;
|
||||
icon_src: string;
|
||||
icon_img: uploadList[];
|
||||
icon_class: string;
|
||||
search_botton_img: uploadList[];
|
||||
search_botton_icon: string;
|
||||
is_tips_show: boolean;
|
||||
is_tips_show: string;
|
||||
tips: string;
|
||||
is_search_show: boolean;
|
||||
is_search_show: string;
|
||||
search_type: string;
|
||||
search_tips: string;
|
||||
hot_word_list: hot_word_list[];
|
||||
|
|
@ -39,8 +39,8 @@ interface DefaultFooterNav {
|
|||
header_background_title_typeface: string,
|
||||
header_background_title_size: number,
|
||||
function_buttons_type: string,
|
||||
immersive_style: boolean,
|
||||
up_slide_display: boolean,
|
||||
immersive_style: string,
|
||||
up_slide_display: string,
|
||||
icon_color: string;
|
||||
button_inner_color: string;
|
||||
search_botton_color_list: color_list[];
|
||||
|
|
@ -63,17 +63,17 @@ const defaultFooterNav: DefaultFooterNav = {
|
|||
link: {},
|
||||
indicator_location: 'center',
|
||||
positioning_name: '默认定位名称',
|
||||
is_arrows_show: true,
|
||||
is_center: false,
|
||||
is_icon_show: true,
|
||||
is_arrows_show: '1',
|
||||
is_center: '0',
|
||||
is_icon_show: '1',
|
||||
icon_src: '',
|
||||
icon_img: [],
|
||||
icon_class: '',
|
||||
search_botton_img: [],
|
||||
search_botton_icon: '',
|
||||
is_tips_show: true,
|
||||
is_tips_show: '1',
|
||||
tips: '请输入搜索内容',
|
||||
is_search_show: false,
|
||||
is_search_show: '0',
|
||||
search_type: 'text',
|
||||
search_tips: '搜索',
|
||||
hot_word_list: [
|
||||
|
|
@ -95,8 +95,8 @@ const defaultFooterNav: DefaultFooterNav = {
|
|||
header_background_title_typeface: '500',
|
||||
header_background_title_size: 16,
|
||||
function_buttons_type: 'black',
|
||||
immersive_style: false,
|
||||
up_slide_display: true,
|
||||
immersive_style: '0',
|
||||
up_slide_display: '1',
|
||||
icon_color: '#ccc',
|
||||
button_inner_color: '#fff',
|
||||
search_botton_color_list: [{ color: '#FF973D', color_percentage: undefined }, { color: '#FF3131', color_percentage: undefined }],
|
||||
|
|
@ -112,7 +112,7 @@ const defaultFooterNav: DefaultFooterNav = {
|
|||
},
|
||||
tips_color: '#ccc',
|
||||
hot_words_color: '#000',
|
||||
search_border: '#fff',
|
||||
search_border: '#E4E4E4',
|
||||
search_border_radius: {
|
||||
radius: 16,
|
||||
radius_top_left: 16,
|
||||
|
|
|
|||
|
|
@ -7,16 +7,16 @@ interface hot_word_list {
|
|||
}
|
||||
interface defaultSearch {
|
||||
content: {
|
||||
is_center: boolean;
|
||||
is_icon_show: boolean;
|
||||
is_center: string;
|
||||
is_icon_show: string;
|
||||
icon_src: string;
|
||||
icon_img: uploadList[];
|
||||
icon_class: string;
|
||||
search_botton_img: uploadList[];
|
||||
search_botton_icon: string;
|
||||
is_tips_show: boolean;
|
||||
is_tips_show: string;
|
||||
tips: string;
|
||||
is_search_show: boolean;
|
||||
is_search_show: string;
|
||||
search_type: string;
|
||||
search_tips: string;
|
||||
hot_word_list: hot_word_list[];
|
||||
|
|
@ -38,16 +38,16 @@ interface defaultSearch {
|
|||
}
|
||||
const defaultSearch: defaultSearch = {
|
||||
content: {
|
||||
is_center: false,
|
||||
is_icon_show: true,
|
||||
is_center: '0',
|
||||
is_icon_show: '1',
|
||||
icon_src: '',
|
||||
icon_img: [],
|
||||
icon_class: '',
|
||||
search_botton_img: [],
|
||||
search_botton_icon: '',
|
||||
is_tips_show: true,
|
||||
is_tips_show: '1',
|
||||
tips: '请输入搜索内容',
|
||||
is_search_show: false,
|
||||
is_search_show: '0',
|
||||
search_type: 'text',
|
||||
search_tips: '搜索',
|
||||
hot_word_list: [
|
||||
|
|
|
|||
|
|
@ -223,13 +223,13 @@ watchEffect(() => {
|
|||
|
||||
const { immersive_style, up_slide_display } = new_style;
|
||||
// 不开启沉浸式 和 上滑显示
|
||||
if (immersive_style || !up_slide_display) {
|
||||
if (immersive_style == '1' || up_slide_display != '1') {
|
||||
top_padding.value = 0;
|
||||
} else {
|
||||
top_padding.value = 90;
|
||||
}
|
||||
// 开启沉浸式并且没有开通上滑显示
|
||||
if (immersive_style && !up_slide_display) {
|
||||
if (immersive_style == '1' && up_slide_display != '1') {
|
||||
top_margin.value = -90;
|
||||
} else {
|
||||
top_margin.value = 0;
|
||||
|
|
|
|||
Loading…
Reference in New Issue