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

修改滚动条内容

master
于肖磊 2024-12-30 10:18:40 +08:00
parent 98b3d9e38c
commit 91dad75bf2
5 changed files with 27 additions and 10 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:'https://new.shopxo.vip/',
request_url:'http://shopxo.com/',
// 静态资源地址（如系统根目录不在public目录下面请在静态地址后面加public目录、如：https://d1.shopxo.vip/public/）
static_url:'https://new.shopxo.vip/',
static_url:'http://shopxo.com/',
// 系统类型（默认default、如额外独立小程序、可与程序分身插件实现不同主体小程序及支付独立）
system_type: 'default',

11
components/diy/custom.vue
View File

@ -190,9 +190,16 @@
// 数组处理
const new_list = list.length > 0 ? this.get_list(list, new_form, new_style) : [];
// 初始化数据
const { margin_left = 0, margin_right = 0, padding_left = 0, padding_right = 0 } = new_style.common_style;
const { common_style, data_content_style, data_style } = new_style;
// 外层左右间距
const outer_spacing = (common_style?.margin_left || 0) + (common_style?.margin_right || 0) + (common_style?.padding_left || 0) + (common_style?.padding_right || 0);
// 内容左右间距
const content_spacing = (data_content_style?.margin_left || 0) + (data_content_style?.margin_right || 0) + (data_content_style?.padding_left || 0) + (data_content_style?.padding_right || 0);
// 数据左右间距
const internal_spacing = (data_style?.margin_left || 0) + (data_style?.margin_right || 0) + (data_style?.padding_left || 0) + (data_style?.padding_right || 0);
// 自定义组件宽度
const width = sys_width - margin_left - margin_right - padding_left - padding_right - this.propOuterContainerPadding;
const width = sys_width - outer_spacing - content_spacing - internal_spacing - this.propOuterContainerPadding;
const new_data_style = !isEmpty(new_style.data_style) ? new_style.data_style : this.old_data_style;
const new_data_content_style = !isEmpty(new_style.data_content_style)? new_style.data_content_style : this.old_data_style;
// 判断是平移还是整屏滚动

4
components/diy/diy.vue
View File

@ -1,7 +1,7 @@
<template>
<view :style="page_style">
<view :style="page_img_style">
<scroll-view :scroll-y="true" class="ht" @scroll="on_scroll_event" @scrolltolower="on_scroll_lower_event" lower-threshold="60" scroll-with-animation>
<scroll-view :scroll-y="true" class="ht scroll-view" @scroll="on_scroll_event" @scrolltolower="on_scroll_lower_event" lower-threshold="60" scroll-with-animation>
<!-- 头部小程序兼容 -->
<view class="pr header">
<componentDiyHeader :propKey="header_data.id" :propValue="header_data.com_data" :propScrollTop="head_scroll_top" @onImmersionModelCallBack="immersion_model_call_back" @onLocationBack="choice_location_back"></componentDiyHeader>
@ -661,4 +661,4 @@
};
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped></style>

10
components/diy/modules/data-magic/custom/index.vue
View File

@ -137,7 +137,7 @@ export default {
if (!isEmpty(this.propValue)) {
const new_form = this.propValue.data_content;
const new_style = this.propValue.data_style;
const { data_color_list = [], data_direction = '180deg', data_radius = { radius: 0, radius_top_left: 0, radius_top_right: 0, radius_bottom_left: 0, radius_bottom_right: 0 }, data_background_img = [], data_background_img_style = '2', data_chunk_padding = { padding: 0, padding_top: 0, padding_bottom: 0, padding_left: 0, padding_right: 0 }, data_chunk_margin = { margin: 0, margin_top: 0, margin_bottom: 0, margin_left: 0, margin_right: 0 } } = new_style;
const { data_color_list = [], data_direction = '180deg', data_radius = { radius: 0, radius_top_left: 0, radius_top_right: 0, radius_bottom_left: 0, radius_bottom_right: 0 }, data_background_img = [], data_background_img_style = '2', data_chunk_padding = { padding: 0, padding_top: 0, padding_bottom: 0, padding_left: 0, padding_right: 0 }, data_chunk_margin = { margin: 0, margin_top: 0, margin_bottom: 0, margin_left: 0, margin_right: 0 }, data_content_style = {} } = new_style;
const style_data = {
color_list: data_color_list,
direction: data_direction,
@ -166,8 +166,12 @@ export default {
// 计算宽度
const { padding_left, padding_right, padding_top, padding_bottom } = data_chunk_padding;
const { margin_left, margin_right, margin_bottom, margin_top } = data_chunk_margin;
const width = new_form.width - padding_left - padding_right - margin_left - margin_right - (this.propDataSpacing / 2);
const new_scale = (width / new_form.width) * this.propMagicScale;
const old_width = new_form.width * this.propMagicScale;
// 内容左右间距
const content_spacing = (data_content_style?.margin_left || 0) + (data_content_style?.margin_right || 0) + (data_content_style?.padding_left || 0) + (data_content_style?.padding_right || 0);
const width = old_width - padding_left - padding_right - margin_left - margin_right - content_spacing - (this.propDataSpacing / 2);
// 计算缩放比例
const new_scale = width / old_width;
// 间距
const space_between = new_form.data_source_direction == 'horizontal' ? new_style.column_gap : new_style.row_gap;
// 判断是平移还是整屏滚动

8
pages/diy/diy.vue
View File

@ -187,4 +187,10 @@
},
};
</script>
<style></style>
<style scoped lang="scss">
::v-deep ::-webkit-scrollbar {
/* 滚动条整体样式 */
display: block !important;
width: 0rpx;
}
</style>