sileya-ai
/
vr-shopxo-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'dev-sws' of gitee.com:zongzhige/shopxo-uniapp into dev

master
gongfuxiang 2024-10-16 10:09:45 +08:00
parent 483b702981 490b3ae036
commit 9fe78a8a55
10 changed files with 99 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components/diy/carousel.vue
View File

@ -128,11 +128,10 @@
const { common_style, actived_color } = new_style;
// aspectFill 对应 cover aspectFit 对应 contain scaleToFill 对应 none
const { img_fit } = this.form;
let fit = 'scaleToFill';
if (img_fit == 'cover') {
if (new_form.img_fit == 'cover') {
fit = 'aspectFill';
} else if (img_fit == 'contain') {
} else if (new_form.img_fit == 'contain') {
fit = 'aspectFit';
}
this.$nextTick(() => {

15
components/diy/coupon.vue
View File

@ -363,8 +363,8 @@
.item {
flex-basis: auto;
flex-shrink: 0;
width: 180rpx;
height: 180rpx;
width: 168rpx;
height: 168rpx;
border-radius: 20rpx;
margin-top: 20rpx;
@ -411,7 +411,7 @@
font-size: 18rpx;
border-radius: 46rpx;
position: relative;
top: -4rpx;
top: -10rpx;
}
}
}
@ -803,14 +803,13 @@
.coupon-theme-6 {
display: flex;
.item {
flex-basis: auto;
flex-shrink: 0;
border-radius: 24rpx;
padding: 12rpx;
width: 280rpx;
height: 200rpx;
width: 268rpx;
height: 188rpx;
position: relative;
box-sizing: border-box;
@ -876,12 +875,12 @@
}
.bottom {
margin-top: 12rpx;
margin-top: 8rpx;
text-align: center;
.coupon-btn {
position: relative;
font-size: 32rpx;
font-size: 28rpx;
line-height: 44rpx;
font-weight: 500;
text-align: center;

51
components/diy/diy.vue
View File

@ -4,7 +4,7 @@
<scroll-view :scroll-y="true" class="ht" @scroll="on_scroll_event">
<!-- 头部小程序兼容 -->
<view class="pr header">
<componentDiyHeader :propkey="header_data.id" :propValue="header_data.com_data" :propScrollTop="scroll_top" @immersion-model-call-back="immersion_model_call_back" @search_tap="search_tap"></componentDiyHeader>
<componentDiyHeader :propkey="header_data.id" :propValue="header_data.com_data" :propScrollTop="scroll_top" @immersion-model-call-back="immersion_model_call_back"></componentDiyHeader>
</view>
<view class="content flex-col" :style="'padding-top:' + (temp_is_header_top ? temp_header_top : '0')">
<view v-for="item in tabs_data" :key="item.key">
@ -16,7 +16,7 @@
<view v-for="(item, index) in diy_data" :key="index" :style="'margin-top:' + (['float-window'].includes(item.key) ? '0rpx' : -(item.com_data.style.common_style.floating_up * 2 || 0) + 'rpx;z-index:1;')">
<!-- 基础组件 -->
<template v-if="item.is_enable == '1'">
<componentDiySearch v-if="item.key == 'search'" :propkey="item.id" :propValue="item.com_data" @search_tap="search_tap"></componentDiySearch>
<componentDiySearch v-if="item.key == 'search'" :propkey="item.id" :propValue="item.com_data"></componentDiySearch>
<componentDiyCarousel v-else-if="item.key == 'carousel'" :propkey="item.id" :propValue="item.com_data" @video_play="video_play"></componentDiyCarousel>
<componentDiyNavGroup v-else-if="item.key == 'nav-group'" :propkey="item.id" :propValue="item.com_data"></componentDiyNavGroup>
<componentDiyUserInfo v-else-if="item.key == 'user-info'" :propkey="item.id" :propValue="item.com_data"></componentDiyUserInfo>
@ -73,22 +73,6 @@
</view>
</uni-popup>
</view>
<view class="search-popup">
<!-- 搜索 -->
<uni-popup ref="searchPopup" type="center" border-radius="50rpx" :mask-click="false">
<view class="flex-col align-c jc-c gap-10 ht-auto" :style="{'width': search_width }">
<view class="bg-white padding-xxxxl wh-auto flex-col gap-10" style="box-sizing: border-box;border-radius: 20rpx;">
<componentSearch :propFocus="is_focus" propClass="br" propSize="md" propPadding="18rpx 20rpx 0px" :propPlaceholder="search_form.tips" :propIsBtn="true" :propIsOnEvent="true" :propIsIconOnEvent="true" @onicon="onicon" @onsearch="onsearch"></componentSearch>
<view v-if="hot_word_list.length > 0">
<view class="search-hot flex-row align-c gap-10 bg-white flex-wrap box-shadow-md">
<view v-for="(item, index) in hot_word_list" :key="index" class="text-size-md" :style="{ color: !isEmpty(search_hot_words_color) ? search_hot_words_color : item.color }" :data-value="item.value" @tap.stop="serch_url_event">{{ item.value }}</view>
</view>
</view>
</view>
<iconfont name="icon-qiandao-tancguanbi" size="56rpx" color="#666" propContainerDisplay="flex" @tap="search_close"></iconfont>
</view>
</uni-popup>
</view>
</view>
<!-- 当前diy页面底部菜单（非公共底部菜单） -->
@ -260,11 +244,6 @@
video_src: '',
popup_width: '0rpx',
popup_height: '0rpx',
search_form: {},
hot_word_list: [],
search_hot_words_color: '',
search_width: sys_width * 0.9 + 'px',
is_focus: false,
};
},
watch: {
@ -549,32 +528,6 @@
});
this.$refs.searchPopup.open();
},
search_close() {
this.setData({
is_focus: false
});
this.$refs.searchPopup.close();
},
onsearch(val) {
this.serch_url_open(val);
},
onicon() {
if (!isEmpty(this.search_form.icon_link)) {
this.search_close();
app.globalData.url_open(this.search_form.icon_link.page);
}
},
serch_url_event(e) {
this.serch_url_open(e.currentTarget.dataset.value);
},
serch_url_open(url) {
if (!isEmpty(e.currentTarget.dataset.value)) {
this.search_close();
app.globalData.url_open('/pages/goods-search/goods-search?keywords=' + e.currentTarget.dataset.value);
} else {
app.globalData.showToast('请输入搜索关键字', 'error');
}
},
video_play(url, width, height) {
this.setData({
video_src: url,

12
components/diy/header.vue
View File

@ -12,7 +12,7 @@
<view class="model-head pr flex-row align-c" :style="header_style">
<view class="model-head-content flex-row align-c jc-sb gap-16 wh-auto pr padding-left-main">
<view v-if="!is_tabbar_pages" class="z-i dis-inline-block margin-top-xs" @tap="top_nav_left_back_event">
<iconfont name="icon-arrow-left" size="40rpx" propContainerDisplay="flex"></iconfont>
<iconfont name="icon-arrow-left" size="40rpx" propContainerDisplay="flex" :color="form.style.left_back_btn_color || '#333'"></iconfont>
</view>
<view v-if="['1', '2', '3'].includes(form.content.theme)" class="flex-1">
<view class="flex-row align-c jc-c ht-auto gap-16" :class="position_class" :style="text_style + 'justify-content:' + form.content.indicator_location || 'center'">
@ -24,7 +24,7 @@
<view v-if="['1', '2'].includes(form.content.theme)">{{ form.content.title }}</view>
<template v-if="['3', '5'].includes(form.content.theme)">
<view class="flex-1">
<componentDiySearch :propValue="form" :propIsPageSettings="true" @search_tap="search_tap"></componentDiySearch>
<componentDiySearch :propValue="form" :propIsPageSettings="true"></componentDiySearch>
</view>
</template>
</view>
@ -35,7 +35,7 @@
</view>
<template v-if="['5'].includes(form.content.theme)">
<view class="flex-1">
<componentDiySearch :propValue="form" :propIsPageSettings="true" @search_tap="search_tap"></componentDiySearch>
<componentDiySearch :propValue="form" :propIsPageSettings="true"></componentDiySearch>
</view>
</template>
</view>
@ -217,10 +217,6 @@
})
.exec();
},
// 搜索回调
search_tap(form, list, color) {
this.$emit('search_tap', form, list, color);
},
// 位置回调
user_back_choice_location(e) {
console.log('选择位置回调', e);
@ -241,7 +237,7 @@
.header-container {
width: 100%;
.header-around {
z-index: 3;
z-index: 4;
}
.header-content {
height: 66rpx;

15
components/diy/img-magic.vue
View File

@ -7,7 +7,7 @@
<template v-if="form.style_actived == 2">
<view class="flex-row align-c jc-c style-size">
<view v-for="(item, index) in form.img_magic_list" :key="index" class="three" :style="img_spacing" :data-value="item.img_link.page" @tap="url_event">
<image v-if="item.img.length > 0" :src="item.img[0].url" class="dis-block wh-auto ht-auto" mode="aspectFill" :style="content_img_radius"></image>
<image v-if="item.img.length > 0" :src="item.img[0].url" class="dis-block wh-auto ht-auto" :mode="img_fit" :style="content_img_radius"></image>
</view>
</view>
</template>
@ -15,7 +15,7 @@
<template v-else-if="form.style_actived == 8">
<view class="flex-row align-c jc-c style-size flex-wrap">
<view v-for="(item, index) in form.img_magic_list" :key="index" :class="[{ 'style9-top': [0, 1].includes(index), 'style9-bottom': ![0, 1].includes(index) }]" :style="img_spacing" :data-value="item.img_link.page" @tap="url_event">
<image v-if="item.img.length > 0" :src="item.img[0].url" class="dis-block wh-auto ht-auto" mode="aspectFill" :style="content_img_radius"></image>
<image v-if="item.img.length > 0" :src="item.img[0].url" class="dis-block wh-auto ht-auto" :mode="img_fit" :style="content_img_radius"></image>
</view>
</view>
</template>
@ -26,7 +26,7 @@
</template>
<template v-else>
<view v-for="(item, index) in form.img_magic_list" :key="index" class="cube-selected cr-main" :style="img_spacing + selected_style(item)" :data-value="item.img_link.page" @tap="url_event">
<image v-if="item.img.length > 0" :src="item.img[0].url" class="dis-block wh-auto ht-auto" mode="aspectFill" :style="content_img_radius"></image>
<image v-if="item.img.length > 0" :src="item.img[0].url" class="dis-block wh-auto ht-auto" :mode="img_fit" :style="content_img_radius"></image>
</view>
</template>
</view>
@ -62,6 +62,7 @@
cube_cell: '',
container_size: '',
div_width: 0,
img_fit: '',
};
},
watch: {
@ -90,6 +91,13 @@
const outer_sx = `-${new_style.image_spacing}rpx`;
// 图片间距设置
const spacing = `${new_style.image_spacing}rpx`;
// aspectFill 对应 cover aspectFit 对应 contain scaleToFill 对应 none
let fit = 'scaleToFill';
if (new_content.img_fit == 'cover') {
fit = 'aspectFill';
} else if (new_content.img_fit == 'contain') {
fit = 'aspectFit';
}
const density = 4;
this.setData({
form: this.propValue.content,
@ -99,6 +107,7 @@
content_img_radius: radius_computer(new_style),
style_container: common_styles_computer(new_style.common_style) + 'box-sizing: border-box;',
style_img_container: common_img_computer(new_style.common_style),
img_fit: fit,
});
this.$nextTick(() => {

7
components/diy/modules/custom/model-panel.vue
View File

@ -1,5 +1,5 @@
<template>
<view class="wh-auto ht-auto re oh" :style="com_style">
<view class="wh-auto ht-auto re oh" :style="com_style" :data-value="form.link && form.link.page" @tap="url_event">
<div class="wh-auto ht-auto" :style="com_img_style"></div>
</view>
</template>
@ -72,7 +72,10 @@
background_img_style: form?.background_img_style || '2'
}
return background_computer(data);
}
},
url_event(e) {
this.$emit('url_event', e);
},
},
};
</script>

10
components/diy/modules/tabs-view.vue
View File

@ -5,12 +5,12 @@
<view class="tabs flex-1 flex-width">
<scroll-view :scroll-x="true" :show-scrollbar="false" :scroll-with-animation="true" :scroll-into-view="'one-nav-item-' + active_index" class="wh-auto">
<view class="flex-row">
<view v-for="(item, index) in tabs_list" :key="index" :id="'one-nav-item-' + index" class="item nowrap flex-col jc-c gap-4" :class="tabs_theme + (index == active_index ? ' active' : '')" :style="'padding-left:' + (index == 0 ? '0' : tabs_spacing) + 'rpx;padding-right:' + (index - 1 == tabs_list ? '0' : tabs_spacing) + 'rpx;'" :data-index="index" @tap="handle_event">
<view class="pr nowrap flex-col jc-c gap-4">
<view v-for="(item, index) in tabs_list" :key="index" :id="'one-nav-item-' + index" class="item nowrap flex-col jc-c align-c gap-4" :class="tabs_theme + (index == active_index ? ' active' : '')" :style="'padding-left:' + (index == 0 ? '0' : tabs_spacing) + 'rpx;padding-right:' + (index - 1 == tabs_list ? '0' : tabs_spacing) + 'rpx;'" :data-index="index" @tap="handle_event">
<view class="nowrap flex-col jc-c align-c gap-4">
<image v-if="!isEmpty(item.img)" :src="item.img[0].url" class="img" mode="widthFix" />
<view class="title" :style="index == active_index ? tabs_theme_style.tabs_title_checked : tabs_theme_style.tabs_title">{{ item.title }}</view>
<view class="desc" :style="tabs_theme_index == '1' && index == active_index ? tabs_check : ''">{{ item.desc }}</view>
<iconfont name="icon-checked-1" class="icon" :style="tabs_theme_index == '3' ? icon_tabs_check : ''" propContainerDisplay="flex"></iconfont>
<iconfont v-if="tabs_theme_index == '3' && index == active_index" name="icon-checked-1" class="icon" :style="tabs_theme_index == '3' && index == active_index ? icon_tabs_check : ''"></iconfont>
<view class="bottom_line" :style="tabs_check"></view>
</view>
</view>
@ -248,8 +248,8 @@
}
.icon {
position: absolute;
left: 0;
right: 0;
// left: 0;
// right: 0;
bottom: 0;
text-align: center;
font-size: 40rpx;

4
components/diy/notice.vue
View File

@ -7,7 +7,7 @@
<view class="flex-row align-c gap-8" :style="container_background_img_style">
<template v-if="form_content.title_type == 'img-icon'">
<view v-if="form_content.icon_class">
<iconfont :name="form_content.icon_class" :size="form_style.icon_size * 2 + 'rpx'" :color="form_style.icon_color" propContainerDisplay="flex"></iconfont>
<iconfont :name="'icon-' + form_content.icon_class" :size="form_style.icon_size * 2 + 'rpx'" :color="form_style.icon_color" propContainerDisplay="flex"></iconfont>
</view>
<view v-else>
<image v-if="form_content.img_src.length > 0" :src="form_content.img_src[0].url" class="border-radius-sm dis-block" mode="aspectFill" :style="img_style"></image>
@ -33,7 +33,7 @@
<view class="flex-row wh-auto jc-sb align-c">
<template v-if="form_content.title_type == 'img-icon'">
<template v-if="form_content.icon_class">
<iconfont :name="form_content.icon_class" :size="form_style.icon_size * 2 + 'rpx'" :color="form_style.icon_color" propContainerDisplay="flex"></iconfont>
<iconfont :name="'icon-' + form_content.icon_class" :size="form_style.icon_size * 2 + 'rpx'" :color="form_style.icon_color" propContainerDisplay="flex"></iconfont>
</template>
<template v-else>
<image v-if="form_content.img_src.length > 0" :src="form_content.img_src[0].url" class="border-radius-sm dis-block" mode="aspectFill" :style="img_style"></image>

8
components/diy/rich-text.vue
View File

@ -1,6 +1,6 @@
<template>
<!-- 富文本 -->
<view class="rich-text" :style="style_container">
<view class="diy-rich-text" :style="style_container">
<view :style="style_img_container">
<mp-html :content="content" />
</view>
@ -45,15 +45,19 @@
style_container: common_styles_computer(new_style.common_style),
style_img_container: common_img_computer(new_style.common_style),
});
console.log(this.content);
},
},
};
</script>
<style>
.rich-text {
.diy-rich-text {
* {
max-width: 100%;
}
[id^=v] {
width: 100%;
}
}
</style>

78
components/diy/search.vue
View File

@ -2,7 +2,7 @@
<view :style="style_container">
<view :style="style_img_container">
<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">
<view class="box oh flex-row align-c gap-10" :style="box_style" @tap="search_tap">
<view class="search-icon" @tap.stop="search_icon_tap">
<template v-if="form.is_icon_show == '1'">
<template v-if="form.icon_img.length > 0">
@ -17,21 +17,31 @@
</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">
<template v-if="form.search_type === 'text'">
<view :class="['padding-vertical-xs text-size-xs', propIsPageSettings ? 'padding-horizontal' : 'padding-horizontal-lg']">{{ form.search_tips }}</view>
</template>
<template v-else-if="!isEmpty(form.search_botton_img) && form.search_botton_img.length > 0">
<image :src="form.search_botton_img[0].url" class="img" :style="search_button_radius" mode="heightFix"></image>
<template v-if="!isEmpty(form.hot_word_list) && form.is_hot_word_show == '1'">
<swiper circular="true" :autoplay="form.is_roll == '1'" :interval="form.interval_time * 1000" :vertical="true" :duration="500" class="swiper_style" @change="slideChange">
<swiper-item v-for="(item, index) in form.hot_word_list" :key="index" class="flex-row align-c" :style="{ color: !isEmpty(new_style.hot_words_color) ? new_style.hot_words_color : item.color }" :data-value="item.value" @tap.stop="serch_event">{{ item.value }}</swiper-item>
</swiper>
</template>
<template v-else>
<view :class="['padding-vertical-xs text-size-xs', propIsPageSettings ? 'padding-horizontal' : 'padding-horizontal-lg']">
<iconfont :name="!isEmpty(form.search_botton_icon) ? 'icon-' + form.search_botton_icon : ''" size="28rpx" propContainerDisplay="flex"></iconfont>
</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>
</template>
</view>
<view v-if="form.is_search_show == '1'" class="pa search-outer-botton flex-row align-c jc-c">
<view class="search-botton flex-row align-c jc-c z-i" :style="search_button" @tap.stop="serch_button_event">
<template v-if="form.search_type === 'text'">
<view :class="['padding-vertical-xs text-size-xs', propIsPageSettings ? 'padding-horizontal' : 'padding-horizontal-lg']">{{ form.search_tips }}</view>
</template>
<template v-else-if="!isEmpty(form.search_botton_img) && form.search_botton_img.length > 0">
<image :src="form.search_botton_img[0].url" class="img" :style="search_button_radius" mode="heightFix"></image>
</template>
<template v-else>
<view :class="['padding-vertical-xs text-size-xs', propIsPageSettings ? 'padding-horizontal' : 'padding-horizontal-lg']">
<iconfont :name="!isEmpty(form.search_botton_icon) ? 'icon-' + form.search_botton_icon : ''" size="28rpx" propContainerDisplay="flex"></iconfont>
</view>
</template>
</view>
</view>
</view>
</view>
</view>
@ -72,6 +82,7 @@ export default {
search_button_radius: '',
box_style: '',
search_button: '',
keywords: '',
};
},
watch: {
@ -111,14 +122,23 @@ export default {
return common_styles;
},
get_box_style(new_style, form) {
let style = `border: 1px solid ${new_style.search_border}; ${radius_computer(new_style.search_border_radius)};box-sizing: border-box;`;
let style = `background: ${ new_style?.search_bg_color || '#fff' };border: 1px solid ${new_style.search_border}; ${radius_computer(new_style.search_border_radius)};box-sizing: border-box;`;
if (form.is_center == '1') {
style += `justify-content: center;`;
}
return style;
},
search_tap() {
this.$emit('search_tap', this.form, this.form.hot_word_list, this.new_style.hot_words_color);
app.globalData.url_open('/pages/goods-search-start/goods-search-start?keywords=' + this.keywords);
},
serch_event() {
app.globalData.url_open('/pages/goods-search-start/goods-search-start?keywords=' + this.keywords);
},
serch_button_event() {
if (!isEmpty(this.keywords)) {
app.globalData.url_open('pages/goods-search/goods-search?keywords=' + this.keywords);
}
app.globalData.url_open('/pages/goods-search-start/goods-search-start?keywords=' + this.keywords);
},
get_search_button(new_style) {
const { search_botton_color_list, search_botton_direction, search_botton_background_img_style, search_botton_background_img, search_button_radius } = new_style;
@ -130,7 +150,7 @@ export default {
background_img: search_botton_background_img,
background_img_style: search_botton_background_img_style,
};
style += gradient_computer(data) + background_computer(data) + `color: ${this.new_style.button_inner_color};`;
style += gradient_computer(data) + background_computer(data) + `color: ${new_style.button_inner_color};`;
}
return style;
},
@ -141,6 +161,12 @@ export default {
}
app.globalData.url_open(this.form.icon_link.page);
},
slideChange(e) {
let actived_index = e.target.current;
this.setData({
keywords: this.form.hot_word_list[actived_index].value,
})
},
},
};
</script>
@ -151,6 +177,10 @@ export default {
height: 64rpx;
padding: 12rpx 30rpx;
}
.swiper_style {
height: 64rpx;
width: 100%;
}
.img-box {
height: 100%;
@ -160,19 +190,19 @@ export default {
display: block;
}
}
.search-botton {
height: 56rpx;
top: 4rpx;
.search-outer-botton {
height: 64rpx;
top: 0;
right: 4rpx;
.img {
.search-botton {
height: 56rpx;
min-width: 6rpx;
max-width: 20rpx;
.img {
height: 56rpx;
min-width: 6rpx;
max-width: 20rpx;
}
}
}
.search-icon {
position: relative;
}