搜索逻辑更新
于肖磊
parent
7f54df096f
commit
bcbcf16f38
|
|
@ -49,8 +49,8 @@ const animation_option = [
|
|||
];
|
||||
// 动画类型次数
|
||||
const animation_number_option = [
|
||||
{ name: '单次', value: 'default' },
|
||||
{ name: '无限', value: 'infinite' }
|
||||
{ name: '单次显示', value: 'default' },
|
||||
{ name: '无限循环', value: 'infinite' }
|
||||
]
|
||||
|
||||
// 操作结束
|
||||
|
|
|
|||
|
|
@ -37,18 +37,30 @@
|
|||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<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', 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', props.isPageSettings ? 'plr-12' : 'plr-16']">
|
||||
<el-icon :class="`iconfont ${ !isEmpty(form.search_botton_icon) ? 'icon-' + form.search_botton_icon : '' } size-14`" />
|
||||
</div>
|
||||
<div class="flex-row align-c abs search-botton oh" :style="`border-radius: 0px ${ new_style.search_button_radius?.radius_top_right || 0 }px ${ new_style.search_button_radius?.radius_bottom_right || 0 }px 0px;`">
|
||||
<template v-if="form.is_right_icon_show == '1' && (form.right_icon_img.length > 0 || !isEmpty(form.right_icon_class))">
|
||||
<template v-if="form.right_icon_img.length > 0">
|
||||
<div class="img-box mr-10">
|
||||
<image-empty v-model="form.right_icon_img[0]" class="img" fit="contain" error-img-style="width: 4rem;height: 2.5rem;" />
|
||||
</div>
|
||||
</template>
|
||||
<template v-else-if="!isEmpty(form.right_icon_class)">
|
||||
<el-icon :class="`iconfont ${ 'icon-' + form.right_icon_class } size-14 mr-10`" :style="`color:${new_style.right_icon_color};`" />
|
||||
</template>
|
||||
</template>
|
||||
<div v-if="form.is_search_show == '1'" class="h flex align-c jc-c" :style="search_button">
|
||||
<template v-if="form.search_type === 'text'">
|
||||
<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', props.isPageSettings ? 'plr-12' : 'plr-16']">
|
||||
<el-icon :class="`iconfont ${ !isEmpty(form.search_botton_icon) ? 'icon-' + form.search_botton_icon : '' } size-14`" />
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -33,6 +33,21 @@
|
|||
<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">
|
||||
<el-col :span="24"><el-switch v-model="form.is_right_icon_show" active-value="1" inactive-value="0"></el-switch></el-col>
|
||||
</el-row>
|
||||
<template v-if="form.is_right_icon_show == '1'">
|
||||
<el-row class="mt-10 w">
|
||||
<el-col :span="24">
|
||||
<upload v-model="form.right_icon_img" v-model:icon-value="form.right_icon_class" is-icon :limit="1" size="50"></upload>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="mt-10 w">
|
||||
<el-col :span="24"><url-value v-model="form.right_icon_link"></url-value></el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
</el-form-item>
|
||||
<el-form-item label="搜索按钮" class="align-s">
|
||||
<el-row class="w">
|
||||
<el-col :span="24"><el-switch v-model="form.is_search_show" active-value="1" inactive-value="0"></el-switch></el-col>
|
||||
|
|
|
|||
|
|
@ -10,6 +10,15 @@
|
|||
</card-container>
|
||||
<div class="bg-f5 divider-line" />
|
||||
</template>
|
||||
<template v-if="search_content.is_right_icon_show == '1'">
|
||||
<card-container>
|
||||
<div class="mb-12">左侧图标</div>
|
||||
<el-form-item label="图标">
|
||||
<color-picker v-model="form.right_icon_color" default-color="#CCCCCC"></color-picker>
|
||||
</el-form-item>
|
||||
</card-container>
|
||||
<div class="bg-f5 divider-line" />
|
||||
</template>
|
||||
<template v-if="search_content.is_search_show == '1'">
|
||||
<card-container>
|
||||
<div class="mb-12">搜索按钮</div>
|
||||
|
|
|
|||
|
|
@ -43,6 +43,10 @@ interface DefaultFooterNav {
|
|||
search_botton_icon: string;
|
||||
is_tips_show: string;
|
||||
tips: string;
|
||||
is_right_icon_show: string,
|
||||
right_icon_link: object,
|
||||
right_icon_img: uploadList[],
|
||||
right_icon_class: string,
|
||||
is_search_show: string;
|
||||
search_type: string;
|
||||
search_tips: string;
|
||||
|
|
@ -69,6 +73,7 @@ interface DefaultFooterNav {
|
|||
up_slide_background_img: uploadList[];
|
||||
left_back_btn_color: string;
|
||||
icon_color: string;
|
||||
right_icon_color: string,
|
||||
button_inner_color: string;
|
||||
search_botton_color_list: color_list[];
|
||||
search_botton_direction: string;
|
||||
|
|
@ -139,6 +144,11 @@ const defaultFooterNav: DefaultFooterNav = {
|
|||
icon_class: 'search',
|
||||
// 搜索提示信息
|
||||
tips: '请输入搜索内容',
|
||||
// 是否显示右侧icon
|
||||
is_right_icon_show: '1',
|
||||
right_icon_link: {},
|
||||
right_icon_img: [],
|
||||
right_icon_class: '',
|
||||
// 搜索按钮右侧搜索内容
|
||||
is_search_show: '0',
|
||||
search_botton_img: [],
|
||||
|
|
@ -179,6 +189,7 @@ const defaultFooterNav: DefaultFooterNav = {
|
|||
// 左侧返回按钮颜色
|
||||
left_back_btn_color: '#333',
|
||||
icon_color: '#ccc',
|
||||
right_icon_color: '#ccc',
|
||||
// 定位设置
|
||||
location_direction: '90deg',
|
||||
location_color_list: [{ color: '', color_percentage: undefined }],
|
||||
|
|
|
|||
|
|
@ -18,6 +18,10 @@ interface defaultSearch {
|
|||
search_botton_icon: string;
|
||||
is_tips_show: string;
|
||||
tips: string;
|
||||
is_right_icon_show: string,
|
||||
right_icon_link: object,
|
||||
right_icon_img: uploadList[],
|
||||
right_icon_class: string,
|
||||
is_search_show: string;
|
||||
search_type: string;
|
||||
search_tips: string;
|
||||
|
|
@ -26,6 +30,7 @@ interface defaultSearch {
|
|||
};
|
||||
style: {
|
||||
icon_color: string;
|
||||
right_icon_color: string;
|
||||
button_inner_color: string;
|
||||
search_botton_color_list: color_list[];
|
||||
search_botton_direction: string;
|
||||
|
|
@ -58,6 +63,11 @@ const defaultSearch: defaultSearch = {
|
|||
// 搜索提示信息
|
||||
is_tips_show: '1',
|
||||
tips: '请输入搜索内容',
|
||||
// 是否显示右侧icon
|
||||
is_right_icon_show: '1',
|
||||
right_icon_link: {},
|
||||
right_icon_img: [],
|
||||
right_icon_class: '',
|
||||
// 搜索按钮显示逻辑
|
||||
search_botton_img: [],
|
||||
search_botton_icon: '',
|
||||
|
|
@ -72,6 +82,7 @@ const defaultSearch: defaultSearch = {
|
|||
style: {
|
||||
// 搜索图标颜色
|
||||
icon_color: '#ccc',
|
||||
right_icon_color: '#ccc',
|
||||
// 搜索按钮显示样式
|
||||
button_inner_color: '#fff',
|
||||
search_botton_color_list: [{ color: '#FF973D', color_percentage: undefined }, { color: '#FF3131', color_percentage: undefined }],
|
||||
|
|
|
|||
Loading…
Reference in New Issue