diff --git a/common/css/plugins.css b/common/css/plugins.css index 037b9012..25d3d632 100644 --- a/common/css/plugins.css +++ b/common/css/plugins.css @@ -270,4 +270,31 @@ right: -1px; padding: 5rpx 20rpx; box-shadow: -1px 1px 3px rgb(0 0 0 / 10%); +} + +/** + * 多商户 - 数据列表 + */ +.plugins-shop-data-list .item { + +} +.plugins-shop-data-list .item .logo { + width: 120rpx; + height: 120rpx !important; +} +.plugins-shop-data-list .item .right-content { + width: calc(100% - 190rpx); + margin-right: 50rpx; +} +.plugins-shop-data-list .item .auth-icon { + background-color: #f4c985; + border: 1px solid #e7ba77; + color: #856651; + padding: 2rpx 12rpx; +} +.plugins-shop-data-list .item .desc { + color: #888; + font-size: 24rpx; + min-height: 72rpx; + line-height: 36rpx; } \ No newline at end of file diff --git a/components/realstore-list/realstore-list.vue b/components/realstore-list/realstore-list.vue index 6a76e408..e603830f 100644 --- a/components/realstore-list/realstore-list.vue +++ b/components/realstore-list/realstore-list.vue @@ -2,7 +2,7 @@ - + @@ -43,8 +43,7 @@ + \ No newline at end of file diff --git a/pages/cart/cart.css b/pages/cart/cart.css index 8b575525..9674f21e 100644 --- a/pages/cart/cart.css +++ b/pages/cart/cart.css @@ -27,12 +27,12 @@ * 错误提示 */ .goods-item .error-msg { - left: 104rpx; + left: 96rpx; top: 78rpx; - width: 142rpx; + width: 160rpx; } .goods-item .error-msg text { - padding: 2rpx 20rpx; + padding: 2rpx 10rpx; box-shadow: 0 2px 10px rgb(181 181 181 / 95%); } diff --git a/pages/cart/cart.vue b/pages/cart/cart.vue index 550d0853..e6541ec1 100644 --- a/pages/cart/cart.vue +++ b/pages/cart/cart.vue @@ -18,7 +18,7 @@ - + {{item.error_msg}} @@ -96,7 +96,7 @@ - + diff --git a/pages/goods-detail/goods-detail.vue b/pages/goods-detail/goods-detail.vue index b22b1566..056eaa49 100644 --- a/pages/goods-detail/goods-detail.vue +++ b/pages/goods-detail/goods-detail.vue @@ -211,15 +211,15 @@ - - - - - - {{plugins_shop_data.auth_type_name}} + + + + + + {{plugins_shop_data.auth_type_name}} {{plugins_shop_data.name}} - {{plugins_shop_data.describe}} + {{plugins_shop_data.describe}} @@ -1053,9 +1053,14 @@ break; // 门店 case 'plugins-realstore' : - this.setData({ - popup_realstore_status: true - }); + var temp_data_list = this.plugins_realstore_data; + if(temp_data_list.length == 1) { + app.globalData.url_open(temp_data_list[0]['url']); + } else { + this.setData({ + popup_realstore_status: true + }); + } break; // 默认 default: diff --git a/pages/index/index.vue b/pages/index/index.vue index 3762022e..0db009be 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -83,7 +83,7 @@ - + {{item.title}} @@ -108,13 +108,31 @@ - - + + + + + + + + {{plugins_realstore_data.base.home_data_list_title || '最新门店'}} + 更多 + + + + + + + + {{plugins_shop_data.base.home_data_list_title || '最新商家'}} + 更多 + + - + @@ -261,7 +279,9 @@ import componentCopyright from "../../components/copyright/copyright"; import componentOnlineService from "../../components/online-service/online-service"; import componentActivityList from "../../components/activity-list/activity-list"; - import componentBlogList from "../../components/blog-list/blog-list"; + import componentBlogList from "../../components/blog-list/blog-list"; + import componentRealstoreList from "../../components/realstore-list/realstore-list"; + import componentShopList from "../../components/shop-list/shop-list"; var common_static_url = app.globalData.get_static_url('common'); var static_url = app.globalData.get_static_url('home'); @@ -317,7 +337,11 @@ // 哀悼灰度插件 plugins_mourning_data: 0, // 标签插件 - plugins_blog_data: null + plugins_blog_data: null, + // 门店插件 + plugins_realstore_data: null, + // 多商户插件 + plugins_shop_data: null }; }, @@ -334,7 +358,9 @@ componentCopyright, componentOnlineService, componentActivityList, - componentBlogList + componentBlogList, + componentRealstoreList, + componentShopList }, props: {}, @@ -411,7 +437,9 @@ plugins_homemiddleadv_data: (data.plugins_homemiddleadv_data || null) == null || data.plugins_homemiddleadv_data.length <= 0 ? null : data.plugins_homemiddleadv_data, plugins_popupscreen_data: data.plugins_popupscreen_data || null, plugins_mourning_data: data.plugins_mourning_data || 0, - plugins_blog_data: data.plugins_blog_data || null + plugins_blog_data: data.plugins_blog_data || null, + plugins_realstore_data: data.plugins_realstore_data || null, + plugins_shop_data: data.plugins_shop_data || null }); // 弹屏广告插件处理 diff --git a/pages/plugins/realstore/index/index.vue b/pages/plugins/realstore/index/index.vue index 9f308c6f..2903ea08 100644 --- a/pages/plugins/realstore/index/index.vue +++ b/pages/plugins/realstore/index/index.vue @@ -160,20 +160,13 @@ uni.stopPullDownRefresh(); if (res.data.code == 0) { var data = res.data.data; - var data_list = data.data_list || []; - var favor_user = data.favor_user || []; - if(favor_user.length > 0) { - for(var i in data_list) { - data_list[i]['is_favor'] = (favor_user.indexOf(data_list[i]['id']) == -1) ? 0 : 1; - } - } this.setData({ data_base: data.base || null, - favor_user: favor_user, + favor_user: data.favor_user || [], category: data.category || [], slider_list: data.slider_list || [], icon_list: data.icon_list || [], - data_list: data_list, + data_list: data.data_list || [], is_first: 0, data_list_loding_status: data_list.length > 0 ? 3 : 0, data_bottom_line_status: true, diff --git a/pages/plugins/realstore/search/search.vue b/pages/plugins/realstore/search/search.vue index d691fbe6..9bb06409 100644 --- a/pages/plugins/realstore/search/search.vue +++ b/pages/plugins/realstore/search/search.vue @@ -206,14 +206,10 @@ if (data.data.length > 0) { if (this.data_page <= 1) { var temp_data_list = data.data; - for(var i in temp_data_list) { - temp_data_list[i]['is_favor'] = (this.favor_user.indexOf(temp_data_list[i]['id']) == -1) ? 0 : 1; - } } else { var temp_data_list = this.data_list || []; var temp_data = data.data; for (var i in temp_data) { - temp_data[i]['is_favor'] = (this.favor_user.indexOf(temp_data[i]['id']) == -1) ? 0 : 1; temp_data_list.push(temp_data[i]); } } diff --git a/pages/plugins/shop/design/design.vue b/pages/plugins/shop/design/design.vue index e78c00e7..65fa8bb7 100644 --- a/pages/plugins/shop/design/design.vue +++ b/pages/plugins/shop/design/design.vue @@ -16,7 +16,7 @@ - {{shop.auth_type_name}} + {{shop.auth_type_name}} {{shop.name}} diff --git a/pages/plugins/shop/detail/detail.vue b/pages/plugins/shop/detail/detail.vue index 793dc793..d3abd581 100644 --- a/pages/plugins/shop/detail/detail.vue +++ b/pages/plugins/shop/detail/detail.vue @@ -14,7 +14,7 @@ - {{shop.auth_type_name}} + {{shop.auth_type_name}} {{shop.name}} diff --git a/uni_modules/uni-swipe-action/changelog.md b/uni_modules/uni-swipe-action/changelog.md index b3bc0bec..0ab2085d 100644 --- a/uni_modules/uni-swipe-action/changelog.md +++ b/uni_modules/uni-swipe-action/changelog.md @@ -1,24 +1,33 @@ +## 1.3.3（2022-03-31） +- 修复 按钮字体大小不能设置的bug +## 1.3.2（2022-03-16） +- 修复 h5和app端下报el错误的bug +## 1.3.1（2022-03-07） +- 修复 HBuilderX 1.4.X 版本中，h5和app端下报错的bug +## 1.3.0（2021-11-19） +- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource) +- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-swipe-action](https://uniapp.dcloud.io/component/uniui/uni-swipe-action) ## 1.2.4（2021-08-20） - 优化 close-all 方法 ## 1.2.3（2021-08-20） - 新增 close-all 方法，关闭所有已打开的组件 -## 1.2.2（2021-08-17） -- 新增 resize() 方法，在非微信小程序、h5、app-vue端出现不能滑动的问题的时候，重置组件 -- 修复 app 端偶尔出现类似 Page[x][-x,xx;-x,xx,x,x-x] 的问题 -- 优化 微信小程序、h5、app-vue 滑动逻辑，避免出现动态新增组件后不能滑动的问题 -## 1.2.1（2021-07-30） -- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834) -- 修复 跨页面修改组件数据 ，导致不能滑动的问题 -## 1.1.10（2021-06-17） -- 修复 按钮点击执行两次的bug -## 1.1.9（2021-05-12） -- 新增 项目示例地址 -## 1.1.8（2021-03-26） -- 修复 微信小程序 nv_navigator is not defined 报错的bug -## 1.1.7（2021-02-05） -- 调整为uni_modules目录规范 -- 新增 左侧滑动 -- 新增 插槽使用方式 -- 新增 threshold 属性，可以控制滑动缺省值 -- 优化 长列表滚动性能 -- 修复 滚动页面时触发组件滑动的Bug +## 1.2.2（2021-08-17） +- 新增 resize() 方法，在非微信小程序、h5、app-vue端出现不能滑动的问题的时候，重置组件 +- 修复 app 端偶尔出现类似 Page[x][-x,xx;-x,xx,x,x-x] 的问题 +- 优化 微信小程序、h5、app-vue 滑动逻辑，避免出现动态新增组件后不能滑动的问题 +## 1.2.1（2021-07-30） +- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834) +- 修复 跨页面修改组件数据 ，导致不能滑动的问题 +## 1.1.10（2021-06-17） +- 修复 按钮点击执行两次的bug +## 1.1.9（2021-05-12） +- 新增 项目示例地址 +## 1.1.8（2021-03-26） +- 修复 微信小程序 nv_navigator is not defined 报错的bug +## 1.1.7（2021-02-05） +- 调整为uni_modules目录规范 +- 新增 左侧滑动 +- 新增 插槽使用方式 +- 新增 threshold 属性，可以控制滑动缺省值 +- 优化 长列表滚动性能 +- 修复 滚动页面时触发组件滑动的Bug diff --git a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/bindingx.js b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/bindingx.js index 7fcf9ea3..fb97bb3c 100644 --- a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/bindingx.js +++ b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/bindingx.js @@ -1,9 +1,11 @@ +let bindIngXMixins = {} + // #ifdef APP-NVUE const BindingX = uni.requireNativePlugin('bindingx'); const dom = uni.requireNativePlugin('dom'); const animation = uni.requireNativePlugin('animation'); -export default { +bindIngXMixins = { data() { return {} }, @@ -11,7 +13,7 @@ export default { watch: { show(newVal) { if (this.autoClose) return - if (this.stop) return + if (this.stop) return this.stop = true if (newVal) { this.open(newVal) @@ -70,10 +72,10 @@ export default { // 每次只触发一次，避免多次监听造成闪烁 if (this.stop) return this.stop = true - if (this.autoClose) { - this.swipeaction.closeOther(this) - } - + if (this.autoClose) { + this.swipeaction.closeOther(this) + } + const leftWidth = this.button.left.width const rightWidth = this.button.right.width let expression = this.range(this.x, -rightWidth, leftWidth) @@ -291,10 +293,8 @@ export default { }) } } -} +} // #endif -// #ifndef APP-NVUE -export default {} -// #endif \ No newline at end of file +export default bindIngXMixins diff --git a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpother.js b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpother.js index eef22330..581e56f8 100644 --- a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpother.js +++ b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpother.js @@ -1,7 +1,8 @@ +let otherMixins = {} + // #ifndef APP-PLUS|| MP-WEIXIN || H5 - const MIN_DISTANCE = 10; -export default { +otherMixins = { data() { // TODO 随机生生元素ID，解决百度小程序获取同一个元素位置信息的bug const elClass = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}` @@ -50,7 +51,7 @@ export default { this.left = 0 this.x = 0 }, - + closeSwipe(e) { if (!this.autoClose) return this.swipeaction.closeOther(this) @@ -253,6 +254,4 @@ export default { // #endif -// #ifdef APP-PLUS|| MP-WEIXIN || H5 -export default { } -// #endif \ No newline at end of file +export default otherMixins diff --git a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpwxs.js b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpwxs.js index 1e36fd54..17736d8d 100644 --- a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpwxs.js +++ b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpwxs.js @@ -1,13 +1,16 @@ +let mpMixins = {} // #ifdef APP-VUE|| MP-WEIXIN || H5 -import { isPC } from "./isPC" -export default { +import { + isPC +} from "./isPC" +mpMixins = { data() { return { - is_show:'none' + is_show: 'none' } }, watch: { - show(newVal){ + show(newVal) { this.is_show = this.show } }, @@ -17,7 +20,7 @@ export default { this.swipeaction.children.push(this) } }, - mounted(){ + mounted() { this.is_show = this.show }, methods: { @@ -34,9 +37,9 @@ export default { } }, - appTouchStart(e) { - // #ifdef H5 - if(isPC()) return + appTouchStart(e) { + // #ifdef H5 + if (isPC()) return // #endif const { clientX @@ -44,9 +47,9 @@ export default { this.clientX = clientX this.timestamp = new Date().getTime() }, - appTouchEnd(e, index, item, position) { - // #ifdef H5 - if(isPC()) return + appTouchEnd(e, index, item, position) { + // #ifdef H5 + if (isPC()) return // #endif const { clientX @@ -60,22 +63,20 @@ export default { index, position }) - } - }, - onClickForPC(index, item, position) { - // #ifdef H5 - if(!isPC()) return + } + }, + onClickForPC(index, item, position) { + // #ifdef H5 + if (!isPC()) return this.$emit('click', { content: item, index, position }) // #endif - } + } } } -// #endif -// #ifndef APP-VUE|| MP-WEIXIN || H5 -export default {} -// #endif \ No newline at end of file +// #endif +export default mpMixins diff --git a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/render.js b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/render.js index ac50d759..ed42f1b2 100644 --- a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/render.js +++ b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/render.js @@ -1,265 +1,270 @@ -const MIN_DISTANCE = 10; -export default { - showWatch(newVal, oldVal, ownerInstance, instance,self) { - let state = self.state - this.getDom(instance, ownerInstance,self) - if (newVal && newVal !== 'none') { - this.openState(newVal, instance, ownerInstance,self) - return - } - - if (state.left) { - this.openState('none', instance, ownerInstance,self) - } - this.resetTouchStatus(instance,self) - }, - - /** - * 开始触摸操作 - * @param {Object} e - * @param {Object} ins - */ - touchstart(e, ownerInstance, self) { - let instance = e.instance; - let disabled = instance.getDataset().disabled - let state = self.state; - this.getDom(instance, ownerInstance, self) - // fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复 - disabled = this.getDisabledType(disabled) - if (disabled) return - // 开始触摸时移除动画类 - instance.requestAnimationFrame(function() { - instance.removeClass('ani'); - ownerInstance.callMethod('closeSwipe'); - }) - - // 记录上次的位置 - state.x = state.left || 0 - // 计算滑动开始位置 - this.stopTouchStart(e, ownerInstance, self) - }, - - /** - * 开始滑动操作 - * @param {Object} e - * @param {Object} ownerInstance - */ - touchmove(e, ownerInstance, self) { - let instance = e.instance; - let disabled = instance.getDataset().disabled - let state = self.state - // fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复 - disabled = this.getDisabledType(disabled) - if (disabled) return - // 是否可以滑动页面 - this.stopTouchMove(e, self); - if (state.direction !== 'horizontal') { - return; - } - if (e.preventDefault) { - // 阻止页面滚动 - e.preventDefault() - } - let x = state.x + state.deltaX - this.move(x, instance, ownerInstance, self) - }, - - /** - * 结束触摸操作 - * @param {Object} e - * @param {Object} ownerInstance - */ - touchend(e, ownerInstance, self) { - let instance = e.instance; - let disabled = instance.getDataset().disabled - let state = self.state - // fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复 - disabled = this.getDisabledType(disabled) - - if (disabled) return - // 滑动过程中触摸结束,通过阙值判断是开启还是关闭 - // fixed by mehaotian 定时器解决点击按钮，touchend 触发比 click 事件时机早的问题 ，主要是 ios13 - this.moveDirection(state.left, instance, ownerInstance, self) - - }, - - /** - * 设置移动距离 - * @param {Object} value - * @param {Object} instance - * @param {Object} ownerInstance - */ - move(value, instance, ownerInstance, self) { - value = value || 0 - let state = self.state - let leftWidth = state.leftWidth - let rightWidth = state.rightWidth - // 获取可滑动范围 - state.left = this.range(value, -rightWidth, leftWidth); - instance.requestAnimationFrame(function() { - instance.setStyle({ - transform: 'translateX(' + state.left + 'px)', - '-webkit-transform': 'translateX(' + state.left + 'px)' - }) - }) - - }, - - /** - * 获取元素信息 - * @param {Object} instance - * @param {Object} ownerInstance - */ - getDom(instance, ownerInstance, self) { - let state = self.state - var leftDom = ownerInstance.$el.querySelector('.button-group--left') - var rightDom = ownerInstance.$el.querySelector('.button-group--right') - - state.leftWidth = leftDom.offsetWidth || 0 - state.rightWidth = rightDom.offsetWidth || 0 - state.threshold = instance.getDataset().threshold - }, - - getDisabledType(value) { - return (typeof(value) === 'string' ? JSON.parse(value) : value) || false; - }, - - /** - * 获取范围 - * @param {Object} num - * @param {Object} min - * @param {Object} max - */ - range(num, min, max) { - return Math.min(Math.max(num, min), max); - }, - - - /** - * 移动方向判断 - * @param {Object} left - * @param {Object} value - * @param {Object} ownerInstance - * @param {Object} ins - */ - moveDirection(left, ins, ownerInstance, self) { - var state = self.state - var threshold = state.threshold - var position = state.position - var isopen = state.isopen || 'none' - var leftWidth = state.leftWidth - var rightWidth = state.rightWidth - if (state.deltaX === 0) { - this.openState('none', ins, ownerInstance, self) - return - } - if ((isopen === 'none' && rightWidth > 0 && -left > threshold) || (isopen !== 'none' && rightWidth > 0 && - rightWidth + - left < threshold)) { - // right - this.openState('right', ins, ownerInstance, self) - } else if ((isopen === 'none' && leftWidth > 0 && left > threshold) || (isopen !== 'none' && leftWidth > 0 && - leftWidth - left < threshold)) { - // left - this.openState('left', ins, ownerInstance, self) - } else { - // default - this.openState('none', ins, ownerInstance, self) - } - }, - - - /** - * 开启状态 - * @param {Boolean} type - * @param {Object} ins - * @param {Object} ownerInstance - */ - openState(type, ins, ownerInstance, self) { - let state = self.state - let leftWidth = state.leftWidth - let rightWidth = state.rightWidth - let left = '' - state.isopen = state.isopen ? state.isopen : 'none' - switch (type) { - case "left": - left = leftWidth - break - case "right": - left = -rightWidth - break - default: - left = 0 - } - - // && !state.throttle - - if (state.isopen !== type) { - state.throttle = true - ownerInstance.callMethod('change', { - open: type - }) - - } - - state.isopen = type - // 添加动画类 - ins.requestAnimationFrame(()=> { - ins.addClass('ani'); - this.move(left, ins, ownerInstance, self) - }) - }, - - - getDirection(x, y) { - if (x > y && x > MIN_DISTANCE) { - return 'horizontal'; - } - if (y > x && y > MIN_DISTANCE) { - return 'vertical'; - } - return ''; - }, - - /** - * 重置滑动状态 - * @param {Object} event - */ - resetTouchStatus(instance, self) { - let state = self.state; - state.direction = ''; - state.deltaX = 0; - state.deltaY = 0; - state.offsetX = 0; - state.offsetY = 0; - }, - - /** - * 设置滑动开始位置 - * @param {Object} event - */ - stopTouchStart(event, ownerInstance, self) { - let instance = event.instance; - let state = self.state - this.resetTouchStatus(instance, self); - var touch = event.touches[0]; - state.startX = touch.clientX; - state.startY = touch.clientY; - }, - - /** - * 滑动中，是否禁止打开 - * @param {Object} event - */ - stopTouchMove(event, self) { - let instance = event.instance; - let state = self.state; - let touch = event.touches[0]; - - state.deltaX = touch.clientX - state.startX; - state.deltaY = touch.clientY - state.startY; - state.offsetY = Math.abs(state.deltaY); - state.offsetX = Math.abs(state.deltaX); - state.direction = state.direction || this.getDirection(state.offsetX, state.offsetY); - } -} +const MIN_DISTANCE = 10; +export default { + showWatch(newVal, oldVal, ownerInstance, instance,self) { + var state = self.state + var $el = ownerInstance.$el || ownerInstance.$vm && ownerInstance.$vm.$el + if(!$el) return + this.getDom(instance, ownerInstance,self) + if (newVal && newVal !== 'none') { + this.openState(newVal, instance, ownerInstance,self) + return + } + + if (state.left) { + this.openState('none', instance, ownerInstance,self) + } + this.resetTouchStatus(instance,self) + }, + + /** + * 开始触摸操作 + * @param {Object} e + * @param {Object} ins + */ + touchstart(e, ownerInstance, self) { + let instance = e.instance; + let disabled = instance.getDataset().disabled + let state = self.state; + this.getDom(instance, ownerInstance, self) + // fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复 + disabled = this.getDisabledType(disabled) + if (disabled) return + // 开始触摸时移除动画类 + instance.requestAnimationFrame(function() { + instance.removeClass('ani'); + ownerInstance.callMethod('closeSwipe'); + }) + + // 记录上次的位置 + state.x = state.left || 0 + // 计算滑动开始位置 + this.stopTouchStart(e, ownerInstance, self) + }, + + /** + * 开始滑动操作 + * @param {Object} e + * @param {Object} ownerInstance + */ + touchmove(e, ownerInstance, self) { + let instance = e.instance; + // 删除之后已经那不到实例了 + if(!instance) return; + let disabled = instance.getDataset().disabled + let state = self.state + // fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复 + disabled = this.getDisabledType(disabled) + if (disabled) return + // 是否可以滑动页面 + this.stopTouchMove(e, self); + if (state.direction !== 'horizontal') { + return; + } + if (e.preventDefault) { + // 阻止页面滚动 + e.preventDefault() + } + let x = state.x + state.deltaX + this.move(x, instance, ownerInstance, self) + }, + + /** + * 结束触摸操作 + * @param {Object} e + * @param {Object} ownerInstance + */ + touchend(e, ownerInstance, self) { + let instance = e.instance; + let disabled = instance.getDataset().disabled + let state = self.state + // fix by mehaotian, TODO 兼容 app-vue 获取dataset为字符串 , h5 获取 为 undefined 的问题,待框架修复 + disabled = this.getDisabledType(disabled) + + if (disabled) return + // 滑动过程中触摸结束,通过阙值判断是开启还是关闭 + // fixed by mehaotian 定时器解决点击按钮，touchend 触发比 click 事件时机早的问题 ，主要是 ios13 + this.moveDirection(state.left, instance, ownerInstance, self) + + }, + + /** + * 设置移动距离 + * @param {Object} value + * @param {Object} instance + * @param {Object} ownerInstance + */ + move(value, instance, ownerInstance, self) { + value = value || 0 + let state = self.state + let leftWidth = state.leftWidth + let rightWidth = state.rightWidth + // 获取可滑动范围 + state.left = this.range(value, -rightWidth, leftWidth); + instance.requestAnimationFrame(function() { + instance.setStyle({ + transform: 'translateX(' + state.left + 'px)', + '-webkit-transform': 'translateX(' + state.left + 'px)' + }) + }) + + }, + + /** + * 获取元素信息 + * @param {Object} instance + * @param {Object} ownerInstance + */ + getDom(instance, ownerInstance, self) { + var state = self.state + var $el = ownerInstance.$el || ownerInstance.$vm && ownerInstance.$vm.$el + var leftDom = $el.querySelector('.button-group--left') + var rightDom = $el.querySelector('.button-group--right') + + state.leftWidth = leftDom.offsetWidth || 0 + state.rightWidth = rightDom.offsetWidth || 0 + state.threshold = instance.getDataset().threshold + }, + + getDisabledType(value) { + return (typeof(value) === 'string' ? JSON.parse(value) : value) || false; + }, + + /** + * 获取范围 + * @param {Object} num + * @param {Object} min + * @param {Object} max + */ + range(num, min, max) { + return Math.min(Math.max(num, min), max); + }, + + + /** + * 移动方向判断 + * @param {Object} left + * @param {Object} value + * @param {Object} ownerInstance + * @param {Object} ins + */ + moveDirection(left, ins, ownerInstance, self) { + var state = self.state + var threshold = state.threshold + var position = state.position + var isopen = state.isopen || 'none' + var leftWidth = state.leftWidth + var rightWidth = state.rightWidth + if (state.deltaX === 0) { + this.openState('none', ins, ownerInstance, self) + return + } + if ((isopen === 'none' && rightWidth > 0 && -left > threshold) || (isopen !== 'none' && rightWidth > 0 && + rightWidth + + left < threshold)) { + // right + this.openState('right', ins, ownerInstance, self) + } else if ((isopen === 'none' && leftWidth > 0 && left > threshold) || (isopen !== 'none' && leftWidth > 0 && + leftWidth - left < threshold)) { + // left + this.openState('left', ins, ownerInstance, self) + } else { + // default + this.openState('none', ins, ownerInstance, self) + } + }, + + + /** + * 开启状态 + * @param {Boolean} type + * @param {Object} ins + * @param {Object} ownerInstance + */ + openState(type, ins, ownerInstance, self) { + let state = self.state + let leftWidth = state.leftWidth + let rightWidth = state.rightWidth + let left = '' + state.isopen = state.isopen ? state.isopen : 'none' + switch (type) { + case "left": + left = leftWidth + break + case "right": + left = -rightWidth + break + default: + left = 0 + } + + // && !state.throttle + + if (state.isopen !== type) { + state.throttle = true + ownerInstance.callMethod('change', { + open: type + }) + + } + + state.isopen = type + // 添加动画类 + ins.requestAnimationFrame(()=> { + ins.addClass('ani'); + this.move(left, ins, ownerInstance, self) + }) + }, + + + getDirection(x, y) { + if (x > y && x > MIN_DISTANCE) { + return 'horizontal'; + } + if (y > x && y > MIN_DISTANCE) { + return 'vertical'; + } + return ''; + }, + + /** + * 重置滑动状态 + * @param {Object} event + */ + resetTouchStatus(instance, self) { + let state = self.state; + state.direction = ''; + state.deltaX = 0; + state.deltaY = 0; + state.offsetX = 0; + state.offsetY = 0; + }, + + /** + * 设置滑动开始位置 + * @param {Object} event + */ + stopTouchStart(event, ownerInstance, self) { + let instance = event.instance; + let state = self.state + this.resetTouchStatus(instance, self); + var touch = event.touches[0]; + state.startX = touch.clientX; + state.startY = touch.clientY; + }, + + /** + * 滑动中，是否禁止打开 + * @param {Object} event + */ + stopTouchMove(event, self) { + let instance = event.instance; + let state = self.state; + let touch = event.touches[0]; + + state.deltaX = touch.clientX - state.startX; + state.deltaY = touch.clientY - state.startY; + state.offsetY = Math.abs(state.deltaY); + state.offsetX = Math.abs(state.deltaX); + state.direction = state.direction || this.getDirection(state.offsetX, state.offsetY); + } +} diff --git a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/uni-swipe-action-item.vue b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/uni-swipe-action-item.vue index 310c5e76..c3d77820 100644 --- a/uni_modules/uni-swipe-action/components/uni-swipe-action-item/uni-swipe-action-item.vue +++ b/uni_modules/uni-swipe-action/components/uni-swipe-action-item/uni-swipe-action-item.vue @@ -14,12 +14,11 @@ {{ item.text }} + :style="{color: item.style && item.style.color ? item.style.color : '#FFFFFF',fontSize: item.style && item.style.fontSize ? item.style.fontSize : '16px'}">{{ item.text }} @@ -29,12 +28,11 @@ {{ item.text }} + :style="{color: item.style && item.style.color ? item.style.color : '#FFFFFF',fontSize: item.style && item.style.fontSize ? item.style.fontSize : '16px'}">{{ item.text }} @@ -47,22 +45,20 @@ {{ item.text }} + :style="{color: item.style && item.style.color ? item.style.color : '#FFFFFF', fontSize: item.style && item.style.fontSize ? item.style.fontSize : '16px'}">{{ item.text }} {{ item.text }} + :style="{color: item.style && item.style.color ? item.style.color : '#FFFFFF',fontSize: item.style && item.style.fontSize ? item.style.fontSize : '16px'}">{{ item.text }} @@ -73,7 +69,7 @@ - + @@ -102,7 +98,7 @@ - + @@ -206,7 +202,7 @@ this.uninstall() }, // #endif - + methods: { uninstall() { if (this.swipeaction) { @@ -233,7 +229,7 @@ } } -