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

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

master
gongfuxiang 2025-04-03 22:23:09 +08:00
parent 3a374816cd 6828520f4d
commit cfada2c696
4 changed files with 215 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
App.vue
View File

@ -7,10 +7,10 @@
data: {
// 基础配置
// 数据接口请求地址
request_url:'http://shopxo.com/',
request_url:'https://new.shopxo.vip/',
// 静态资源地址（如系统根目录不在public目录下面请在静态地址后面加public目录、如：https://d1.shopxo.vip/public/）
static_url:'http://shopxo.com/',
static_url:'https://new.shopxo.vip/',
// 系统类型（默认default、如额外独立小程序、可与程序分身插件实现不同主体小程序及支付独立）
system_type: 'default',

177
components/diy/modules/next-notice-bar.vue Normal file
View File

@ -0,0 +1,177 @@
<template>
<view :class="'next-notice-bar-component-' + propKey">
<view class="next-notice-bar" v-for="(list, index) in showList" :key="index">
<view :class="'next-notice-bar-content-' + propKey" :style="{ transform: (y ? 'translateY' : 'translateX') + '(' + xArr[index] + 'px)', display: y ? 'block' : 'inline-block', 'white-space': y ? 'normal' : 'nowrap'}">
<view class="next-notice-bar-list" :style="{ display: y ? 'block' : 'inline-block'}">
<view class="next-notice-bar-item" :style="{ display: y ? 'block' : 'inline-block' }" v-for="(new_item, index1) in list" :key="index1">
<slot :row="new_item"></slot>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props: {
propList: {
// 总数据，一维
type: Array,
default: () => []
},
row: {
// 行数
type: Number,
default: 1
},
speed: {
// 速度
type: Number,
default: 30
},
delay: {
// 延时
type: Number,
default: 0
},
y: {
// y轴
type: Boolean,
default: false
},
propKey: {
type: [String, Number],
default: '',
},
initPosition: {
// 开始位置，left/right
type: String,
default: 'left',
validator: (value) => {
const arr = ['left', 'right', 'top', 'bottom'];
const check = arr.includes(value);
if (!check) {
console.error(`initPosition props optional parameters : ${arr}. error value: ` + value);
}
return check;
}
}
},
data() {
return {
componentWidth: 0,
contentWidthArr: [],
xArr: [],
};
},
computed: {
showList() {
// 多维数组
if (this.y) {
this.xArr = [2000];
return [this.propList, this.propList];
} else {
this.xArr = Array.from({
length: this.row
}).map((_) => 2000);
const l = Array.from({
length: this.row
}).map((_, index) => {
const arr = [];
this.propList.forEach((item, i) => {
if (i % this.row === index) {
arr.push(item);
}
});
return arr;
});
return l;
}
}
},
watch: {
showList: {
deep: true,
immediate: true,
handler() {
this.$nextTick(() => {
let tt = setTimeout(() => {
clearTimeout(tt);
tt = null;
let query = uni.createSelectorQuery().in(this);
query.select('.next-notice-bar-component-' + this.propKey).boundingClientRect((data) => {
this.componentWidth = Math.floor(this.y ? data.height : data.width);
});
query
.selectAll('.next-notice-bar-content-' + this.propKey)
.boundingClientRect((data) => {
this.contentWidthArr = data.map((item) => Math.floor(this.y ? item.height : item.width));
this.xArr = this.contentWidthArr.map((_, index) => {
return ['left', 'top'].includes(this.initPosition) ? 0 : this.componentWidth;
});
})
.exec();
let t = setTimeout(
() => {
clearTimeout(t);
t = null;
this.scrollContent();
},
this.delay < 0 ? 0 : this.delay
);
}, 1);
});
}
}
},
methods: {
scrollContent() {
this.xArr.forEach((num, index) => {
let n = num;
if (n <= -(this.contentWidthArr[index] / 2)) {
n = 0;
} else {
n = num - 1;
}
this.xArr.splice(index, 1, n);
});
let t = setTimeout(() => {
clearTimeout(t);
t = null;
this.scrollContent();
}, this.speed);
}
}
};
</script>
<style scoped>
.next-notice-bar-component {
overflow: hidden;
width: 100%;
height: 100%;
}
.next-notice-bar {
width: 100%;
overflow: hidden;
}
.next-notice-bar-content,
.next-notice-bar-list,
.next-notice-bar-item {
white-space: nowrap;
display: inline-block;
}
.next-notice-bar-content {
min-width: 200%;
}
.next-notice-bar-list {
min-width: 50%;
}
</style>

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

@ -282,6 +282,7 @@
tabs_top_img: `height: ${tabs_top_img_height * 2 }rpx;width: ${tabs_top_img_height * 2 }rpx;box-sizing: border-box;` + radius_computer(tabs_top_img_radius),
};
const { tabs_size_checked, tabs_size, tabs_icon_size_checked = 0, tabs_icon_size = 0, tabs_img_height = 0, tabs_sign_spacing = 0 } = new_style || {};
const new_content_tabs_list = new_content?.tabs_list || [];
let default_height = 0;
if (new_content.tabs_theme == '2') {
default_height = 12; // 选中的时候,风格二的内间距
@ -291,17 +292,17 @@
default_height = 4 + tabs_top_img_height + tabs_sign_spacing;
}
// 筛选出所有的icon
const is_icon = new_content?.tabs_list?.findIndex((item) => item.tabs_type === '1' && !isEmpty(item.tabs_icon)) ?? -1;
const is_icon = new_content_tabs_list.findIndex((item) => item.tabs_type === '1' && !isEmpty(item.tabs_icon)) ?? -1;
// 如果有icon，则取选中的icon大小和未选中的icon大小取最大值，作为图标的高度
let icon_height = 0;
if (is_icon > -1) {
icon_height = Math.max(tabs_icon_size_checked + default_height, tabs_icon_size);
}
// 筛选出所有的图片, 没有选择图标的时候默认是图片
const is_img = new_content?.tabs_list?.findIndex((item) => item.tabs_type === '1' && isEmpty(item.tabs_icon)) ?? -1;
const is_img = new_content_tabs_list.findIndex((item) => item.tabs_type === '1' && isEmpty(item.tabs_icon)) ?? -1;
// 选项卡高度 五个值，作为判断依据，因为图片没有未选中的大小设置，所以高度判断的时候只取选中的高度, 其余的icon和标题都分别取选中和未选中的大小对比，取出最大的值，作为选项卡的高度，避免选项卡切换时会出现抖动问题
const height = Math.max(tabs_size_checked + default_height, tabs_size, icon_height, is_img > -1 ? (tabs_img_height + default_height) : '');
const findIndex = new_content.tabs_list.findIndex(item => item.is_sliding_fixed == '1');
const findIndex = new_content_tabs_list.findIndex(item => item.is_sliding_fixed == '1');
// 参数设置
this.setData({
form: new_content,
@ -407,7 +408,7 @@
const query = uni.createSelectorQuery().in(this);
query.selectAll(`.scroll-item-` + this.propKey)
.boundingClientRect((rect) => {
const tabs_index = this.form.tabs_list.findIndex(item => item.is_sliding_fixed == '1');
const tabs_index = this.form?.tabs_list?.findIndex(item => item.is_sliding_fixed == '1');
// 如果第一个悬浮了，就取第二个的left加上 第一个的宽度和left
let new_width = tabs_index == 0 && index != 0 ? rect[1].left - rect[0].width - rect[0].left : rect[0].left;
// 如果悬浮的不是第一个并且选中的是悬浮的内容

55
components/diy/salerecords.vue
View File

@ -1,8 +1,8 @@
<template>
<view class="oh" :style="style_container">
<view v-if="!isEmpty(list) || !isEmpty(swiper_new_list)" class="oh" :style="style_container">
<view :style="style_img_container + 'height:' + swiper_outer_height * 2 + 'rpx;'">
<template v-if="['translation', 'vertical'].includes(form.rotation_direction)">
<swiper circular="true" vertical="true" :autoplay="form.is_roll == '1'" :acceleration="true" :interval="form.rotation_direction == 'vertical' ? swiper_interval_time : interval_time" :duration="form.rotation_direction == 'vertical' ? interval_time : 1000" :easing-function="form.rotation_direction == 'vertical' ? 'linear' : 'default'" :style="'height:' + swiper_height * 2 + 'rpx;'" :display-multiple-items="slides_per_group">
<swiper circular="true" vertical="true" :autoplay="form.is_roll == '1'" :interval="form.rotation_direction == 'vertical' ? swiper_interval_time : interval_time" :duration="form.rotation_direction == 'vertical' ? interval_time : 1000" :easing-function="form.rotation_direction == 'vertical' ? 'default' : 'default'" :style="'height:' + swiper_height * 2 + 'rpx;'" :display-multiple-items="slides_per_group">
<swiper-item v-for="(item, index) in list" :key="index">
<view class="flex-row align-c" :style="'gap:' + new_style.content_spacing * 2 + 'rpx;margin-bottom:' + new_style.content_spacing * 2 + 'rpx;'">
<template v-if="!isEmpty(item) && is_show('head')">
@ -24,7 +24,8 @@
<view class="swiper-free-mode swiper-horizontal-free-mode" :style="'height:' + swiper_height * 2 + 'rpx;'">
<view v-for="(item, index) in swiper_new_list" :key="index" :style="'margin-bottom:' + (index < swiper_new_list.length - 1 ? new_style.data_spacing * 2 : 0) + 'rpx;'">
<template v-if="!isEmpty(item.split_list)">
<swiper circular="true" autoplay="true" :acceleration="true" :interval="swiper_interval_time" :duration="interval_time + (1000 * index)" easing-function="linear" :style="'height:' + new_swiper_height * 2 + 'rpx;'" :data-index="index" :data-value="item.split_list.length" @change="swiper_change">
<!-- #ifndef H5 || MP-BAIDU || APP -->
<swiper circular="true" autoplay="true" :interval="swiper_interval_time" :duration="interval_time + (1000 * index)" easing-function="linear" :style="'height:' + new_swiper_height * 2 + 'rpx;'" :data-index="index" :data-value="item.split_list.length" @change="swiper_change">
<swiper-item v-for="(new_item, new_index) in item.split_list" :key="new_index">
<view :style="swiper_horizontal_container + 'margin-left:' + (new_index == 0 && swiper_margin_left_list[index].is_left ? slides_offset_before : 0) + 'px;'">
<view class="flex-row align-c" :style="swiper_horizontal_img_container">
@ -39,6 +40,24 @@
</view>
</swiper-item>
</swiper>
<!-- #endif -->
<!-- #ifdef H5 || MP-BAIDU || APP -->
<next-notice-bar :key="propKey + '-' + index" :propKey="propKey + '-' + index" :y="false" initPosition="right" :row="1" :speed="(interval_time / 100) + (10 * index)" :propList="item.split_list">
<template #default="{ row }">
<view :style="swiper_horizontal_container">
<view class="flex-row align-c" :style="swiper_horizontal_img_container">
<view v-if="is_show('goods_image') || is_show('goods_title')" class="flex-row align-c" :style="'gap:' + new_style.content_spacing * 2 + 'rpx;'" :data-value="row.goods_url" @tap.stop="url_event">
<template v-if="is_show('goods_image')">
<imageEmpty :propImageSrc="row.images" :propStyle="goods_img_radius" propErrorStyle="width: 20rpx;height: 20rpx;"></imageEmpty>
</template>
<view v-if="is_show('goods_title')" class="flex-1 text-line-1" :style="goods_title_style + 'max-width: ' + max_title_width * 2 + 'rpx;white-space: initial;'">{{ row.title }}</view>
</view>
<text v-if="is_show('time')" class="nowrap" :style="time_style">{{ row.add_time }}</text>
</view>
</view>
</template>
</next-notice-bar>
<!-- #endif -->
</template>
</view>
</view>
@ -51,11 +70,13 @@
const app = getApp();
import { isEmpty, common_styles_computer, common_img_computer, padding_computer, radius_computer, background_computer, gradient_handle } from '@/common/js/common/common.js';
import imageEmpty from '@/components/diy/modules/image-empty.vue';
import nextNoticeBar from '@/components/diy/modules/next-notice-bar.vue';
var system = app.globalData.get_system_info(null, null, true);
var sys_width = app.globalData.window_width_handle(system.windowWidth);
export default {
components: {
imageEmpty
imageEmpty,
nextNoticeBar
},
props: {
propValue: {
@ -101,10 +122,7 @@
watch: {
propKey(val) {
this.init();
},
propValue(new_value, old_value) {
this.init();
},
}
},
created() {
this.init();
@ -115,21 +133,10 @@
const new_form = this.propValue.content || null;
const new_style = this.propValue.style || null;
if (new_form != null && new_style != null) {
const default_list = {
user: {
avatar: '',
user_name_view: '测试昵称测试昵称测试昵称测试昵称',
},
title: '测试商品标题测试',
images: '',
add_time: '02-04 23:01:01'
};
let new_list = [];
if (!isEmpty(new_form.data_auto_list)) {
// 筛选商品并且筛选商品数组不为空
new_list = new_form.data_auto_list;
} else {
new_list = Array(4).fill(default_list);
}
// 轮播图高度
let swiper_height = 0;
@ -163,9 +170,9 @@
swiper_height = new_swiper_height * new_num + (data_spacing * (new_num - 1));
}
swiper_outer_height = swiper_height + common_style.padding_top + common_style.padding_bottom;
let swiper_interval_time = (new_form.interval_time * 1000) / 2;
// #ifdef MP-ALIPAY
swiper_interval_time = 0;
let swiper_interval_time = 0;
// #ifdef H5 || MP-BAIDU || APP
swiper_interval_time = (new_form.interval_time * 1000) / 2;
// #endif
this.setData({
form: new_form,
@ -185,7 +192,7 @@
new_swiper_height: new_swiper_height,
interval_time: new_form.interval_time * 1000,
swiper_interval_time: swiper_interval_time,
slides_offset_before: sys_width - common_style.margin_left + common_style.margin_right - common_style.padding_left - common_style.padding_right - 20,
slides_offset_before: sys_width - common_style.margin_left + common_style.margin_right - common_style.padding_left - common_style.padding_right,
swiper_horizontal_container: this.get_swiper_horizontal_container(new_style),
swiper_horizontal_img_container: this.get_swiper_horizontal_img_container(new_style),
style_container: common_styles_computer(new_style.common_style), // 公共样式
@ -233,7 +240,7 @@
// 将偏移量设置为0
swiper_change(e) {
const dataset = e.target.dataset;
if (e.target.current >= dataset.value - 1) {
if (e.target.current > dataset.value - 2) {
const index = dataset.index;
const list = this.swiper_margin_left_list;
list[index].is_left = false;