修改搜索逻辑处理
于肖磊
parent
d9c67aea05
commit
d4b4304d3c
|
|
@ -120,15 +120,13 @@
|
|||
methods: {
|
||||
isEmpty,
|
||||
init() {
|
||||
this.setData({
|
||||
form: this.propValue.content,
|
||||
new_style: this.propValue.style,
|
||||
});
|
||||
const new_form = this.propValue.content;
|
||||
const new_style = this.propValue.style;
|
||||
const { windowWidth } = uni.getSystemInfoSync();
|
||||
// 将90%的宽度分成16份
|
||||
const block = (windowWidth * 0.9) / 16;
|
||||
|
||||
const { common_style, actived_color } = this.new_style;
|
||||
const { common_style, actived_color } = new_style;
|
||||
// aspectFill 对应 cover aspectFit 对应 contain scaleToFill 对应 none
|
||||
const { img_fit } = this.form;
|
||||
let fit = 'scaleToFill';
|
||||
|
|
@ -139,20 +137,22 @@
|
|||
}
|
||||
this.$nextTick(() => {
|
||||
this.setData({
|
||||
seat_list: this.get_seat_list(),
|
||||
new_list: this.seat_list.concat(this.form.carousel_list),
|
||||
form: this.propValue.content,
|
||||
new_style: this.propValue.style,
|
||||
seat_list: this.get_seat_list(new_form),
|
||||
new_list: this.get_seat_list(new_form).concat(new_form.carousel_list),
|
||||
popup_width: block * 16 * 2 + 'rpx',
|
||||
popup_height: block * 9 * 2 + 'rpx',
|
||||
style_container: this.propIsCommon ? common_styles_computer(common_style) : '', // 用于样式显示
|
||||
style_img_container: this.propIsCommon ? common_img_computer(common_style) : '', // 用于样式显示
|
||||
img_style: radius_computer(this.new_style), // 图片的设置
|
||||
indicator_style: this.get_indicator_style(), // 指示器的样式
|
||||
img_style: radius_computer(new_style), // 图片的设置
|
||||
indicator_style: this.get_indicator_style(new_style), // 指示器的样式
|
||||
dot_style: `bottom: ${common_style.padding_bottom * 2 + 24}rpx;`, // 指示器位置
|
||||
img_fit: fit,
|
||||
video_style: this.get_video_style(), // 视频播放按钮显示逻辑
|
||||
video_style: this.get_video_style(new_style), // 视频播放按钮显示逻辑
|
||||
});
|
||||
});
|
||||
if (this.form.carousel_type == 'card') {
|
||||
if (new_form.carousel_type == 'card') {
|
||||
this.$nextTick(() => {
|
||||
this.setData({
|
||||
previousMargin: '82rpx',
|
||||
|
|
@ -160,11 +160,11 @@
|
|||
animationData: 0,
|
||||
});
|
||||
});
|
||||
} else if (this.form.carousel_type != 'inherit') {
|
||||
} else if (new_form.carousel_type != 'inherit') {
|
||||
this.$nextTick(() => {
|
||||
this.setData({
|
||||
nextMargin: '100rpx',
|
||||
slides_per_group: this.form.carousel_type == 'twoDragOne' ? 2 : 1,
|
||||
slides_per_group: new_form.carousel_type == 'twoDragOne' ? 2 : 1,
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
@ -177,8 +177,8 @@
|
|||
});
|
||||
});
|
||||
},
|
||||
get_indicator_style() {
|
||||
const { indicator_radius, indicator_style, indicator_size, color } = this.new_style;
|
||||
get_indicator_style(new_style) {
|
||||
const { indicator_radius, indicator_style, indicator_size, color } = new_style;
|
||||
let styles = '';
|
||||
if (!isEmpty(indicator_radius)) {
|
||||
styles += radius_computer(indicator_radius);
|
||||
|
|
@ -195,12 +195,12 @@
|
|||
}
|
||||
return styles;
|
||||
},
|
||||
get_seat_list() {
|
||||
if (this.form.carousel_list.length > 3) {
|
||||
get_seat_list(form) {
|
||||
if (form.carousel_list.length > 3) {
|
||||
return [];
|
||||
} else {
|
||||
let seat_list = [];
|
||||
const list = JSON.parse(JSON.stringify(this.form.carousel_list));
|
||||
const list = JSON.parse(JSON.stringify(form.carousel_list));
|
||||
switch (list.length) {
|
||||
case 1:
|
||||
seat_list = [...list, ...list, ...list];
|
||||
|
|
@ -234,8 +234,8 @@
|
|||
actived_index: actived_index,
|
||||
});
|
||||
},
|
||||
get_video_style() {
|
||||
const { video_bottom, video_radius, video_color_list, video_direction, video_title_color, video_padding } = this.new_style;
|
||||
get_video_style(new_style) {
|
||||
const { video_bottom, video_radius, video_color_list, video_direction, video_title_color, video_padding } = new_style;
|
||||
let style = `bottom: ${video_bottom}px;`;
|
||||
if (!isEmpty(video_radius)) {
|
||||
style += radius_computer(video_radius);
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<hotWordList v-if="is_click && form.content.hot_word_list.length > 0" :propValue="form.content.hot_word_list" :prophotWordsColor="form.style.hot_words_color" :propIsPageSettings="true" @search_hot_close="search_hot_close"></hotWordList>
|
||||
<hotWordList v-if="is_click" :propValue="form.content.hot_word_list" :prophotWordsColor="form.style.hot_words_color" :propIsPageSettings="true" @search_hot_close="search_hot_close"></hotWordList>
|
||||
</view>
|
||||
</view>
|
||||
<block v-if="!is_immersion_model">
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<view class="search-hot-location flex-col align-c jc-c">
|
||||
<view class="search-hot flex-row align-c gap-10 bg-white flex-wrap box-shadow-md">
|
||||
<view v-if="propValue.length > 0" class="search-hot flex-row align-c gap-10 bg-white flex-wrap box-shadow-md">
|
||||
<view v-for="(item, index) in propValue" :key="index" class="text-size-md" :style="{ color: !isEmpty(prophotWordsColor) ? prophotWordsColor : item.color }" :data-value="item.value" @tap.stop="url_event">{{ item.value }}</view>
|
||||
</view>
|
||||
<view class="flex-col align-c">
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<imageEmpty :propImageSrc="item1.img[0]" :propStyle="img_style" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="['image_with_text', 'text'].includes(nav_style)" class="size-12 ma-0" :style="text_style">{{ item1.title }}</view>
|
||||
<view v-if="['image_with_text', 'text'].includes(nav_style)" class="wh-auto size-12 ma-0 nowrap oh" :style="text_style">{{ item1.title }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
|
|
|
|||
|
|
@ -5,18 +5,20 @@
|
|||
<template v-if="!is_click">
|
||||
<view class="search wh-auto pr" :style="style">
|
||||
<view class="box oh flex-row align-c gap-10 bg-white" :style="box_style" @tap="search_tap">
|
||||
<template v-if="form.is_icon_show == '1'">
|
||||
<template v-if="form.icon_img.length > 0">
|
||||
<view class="img-box" @tap="search_icon_tap">
|
||||
<image :src="form.icon_img[0].url" class="img" mode="heightFix"></image>
|
||||
</view>
|
||||
<view class="search-icon" @tap="search_icon_tap">
|
||||
<template v-if="form.is_icon_show == '1'">
|
||||
<template v-if="form.icon_img.length > 0">
|
||||
<view class="img-box">
|
||||
<image :src="form.icon_img[0].url" class="img" mode="heightFix"></image>
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<view>
|
||||
<iconfont :name="!isEmpty(form.icon_class) ? 'icon-' + form.icon_class : 'icon-index-search'" size="28rpx" :color="new_style.icon_color"></iconfont>
|
||||
</view>
|
||||
</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<view @tap="search_icon_tap">
|
||||
<iconfont :name="!isEmpty(form.icon_class) ? 'icon-' + form.icon_class : 'icon-index-search'" size="28rpx" :color="new_style.icon_color"></iconfont>
|
||||
</view>
|
||||
</template>
|
||||
</template>
|
||||
</view>
|
||||
<text v-if="form.is_tips_show == '1'" :class="[propIsPageSettings ? 'text-size-xs text-line-1' : 'text-size-md text-line-1']" :style="'color:' + new_style.tips_color">{{ form.tips }}</text>
|
||||
</view>
|
||||
<view v-if="form.is_search_show == '1'" class="pa search-botton flex-row align-c jc-c z-i" :style="search_button" @tap.stop="url_event">
|
||||
|
|
@ -37,7 +39,7 @@
|
|||
<template v-else>
|
||||
<view class="search wh-auto pr">
|
||||
<view class="box oh flex-row align-c gap-10 bg-white" :style="box_style + search_box_style">
|
||||
<input :focus="is_click" type="text" name="title" :class="[propIsPageSettings ? 'text-size-xs text-line-1' : 'text-size-md text-line-1']" :placeholder="form.tips" @input="search_input" @confirm="url_event" />
|
||||
<input :focus="is_click" type="text" name="title" :class="[propIsPageSettings ? 'text-size-xs text-line-1 wh-auto' : 'text-size-md text-line-1 wh-auto']" :placeholder="form.tips" @input="search_input" @confirm="url_event" />
|
||||
</view>
|
||||
<view v-if="form.is_search_show == '1'" class="pa search-botton flex-row align-c jc-c z-i" :style="search_button" @tap.stop="url_event">
|
||||
<template v-if="form.search_type === 'text'">
|
||||
|
|
@ -56,7 +58,7 @@
|
|||
</template>
|
||||
</view>
|
||||
</view>
|
||||
<hotWordList v-if="is_click && !propIsPageSettings && form.hot_word_list.length > 0" :propValue="form.hot_word_list" :prophotWordsColor="new_style.hot_words_color" @search_hot_close="search_hot_close"></hotWordList>
|
||||
<hotWordList v-if="is_click && !propIsPageSettings" :propValue="form.hot_word_list" :prophotWordsColor="new_style.hot_words_color" @search_hot_close="search_hot_close"></hotWordList>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
|
@ -245,5 +247,16 @@
|
|||
max-width: 20rpx;
|
||||
}
|
||||
}
|
||||
.search-icon{
|
||||
position: relative;
|
||||
}
|
||||
.search-icon::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
bottom: -10px;
|
||||
left: -10px
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue