#
whycq
2023-10-08 3d775bfea16b5ac26ff0baac10f43b3367b0bf95
uni_modules/uni-swipe-action/components/uni-swipe-action-item/mpalipay.js
New file
@@ -0,0 +1,193 @@
export default {
   data() {
      return {
         x: 0,
         transition: false,
         width: 0,
         viewWidth: 0,
         swipeShow: 0
      }
   },
   watch: {
      show(newVal) {
         if (this.autoClose) return
         if (newVal && newVal !== 'none' ) {
            this.transition = true
            this.open(newVal)
         } else {
            this.close()
         }
      }
   },
   created() {
      this.swipeaction = this.getSwipeAction()
      if (this.swipeaction.children !== undefined) {
         this.swipeaction.children.push(this)
      }
   },
   mounted() {
      this.isopen = false
      setTimeout(() => {
         this.getQuerySelect()
      }, 50)
   },
   methods: {
      appTouchStart(e) {
         const {
            clientX
         } = e.changedTouches[0]
         this.clientX = clientX
         this.timestamp = new Date().getTime()
      },
      appTouchEnd(e, index, item, position) {
         const {
            clientX
         } = e.changedTouches[0]
         // fixed by xxxx 模拟点击事件,解决 ios 13 点击区域错位的问题
         let diff = Math.abs(this.clientX - clientX)
         let time = (new Date().getTime()) - this.timestamp
         if (diff < 40 && time < 300) {
            this.$emit('click', {
               content: item,
               index,
               position
            })
         }
      },
      /**
       * 移动触发
       * @param {Object} e
       */
      onChange(e) {
         this.moveX = e.detail.x
         this.isclose = false
      },
      touchstart(e) {
         this.transition = false
         this.isclose = true
         this.autoClose && this.swipeaction.closeOther(this)
      },
      touchmove(e) {},
      touchend(e) {
         // 0的位置什么都不执行
         if (this.isclose && this.isopen === 'none') return
         if (this.isclose && this.isopen !== 'none') {
            this.transition = true
            this.close()
         } else {
            this.move(this.moveX + this.leftWidth)
         }
      },
      /**
       * 移动
       * @param {Object} moveX
       */
      move(moveX) {
         // 打开关闭的处理逻辑不太一样
         this.transition = true
         // 未打开状态
         if (!this.isopen || this.isopen === 'none') {
            if (moveX > this.threshold) {
               this.open('left')
            } else if (moveX < -this.threshold) {
               this.open('right')
            } else {
               this.close()
            }
         } else {
            if (moveX < 0 && moveX < this.rightWidth) {
               const rightX = this.rightWidth + moveX
               if (rightX < this.threshold) {
                  this.open('right')
               } else {
                  this.close()
               }
            } else if (moveX > 0 && moveX < this.leftWidth) {
               const leftX = this.leftWidth - moveX
               if (leftX < this.threshold) {
                  this.open('left')
               } else {
                  this.close()
               }
            }
         }
      },
      /**
       * 打开
       */
      open(type) {
         this.x = this.moveX
         this.animation(type)
      },
      /**
       * 关闭
       */
      close() {
         this.x = this.moveX
         // TODO 解决 x 值不更新的问题,所以会多触发一次 nextTick ,待优化
         this.$nextTick(() => {
            this.x = -this.leftWidth
            if(this.isopen!=='none'){
               this.$emit('change', 'none')
            }
            this.isopen = 'none'
         })
      },
      /**
       * 执行结束动画
       * @param {Object} type
       */
      animation(type) {
         this.$nextTick(() => {
            if (type === 'left') {
               this.x = 0
            } else {
               this.x = -this.rightWidth - this.leftWidth
            }
            if(this.isopen!==type){
               this.$emit('change', type)
            }
            this.isopen = type
         })
      },
      getSlide(x) {},
      getQuerySelect() {
         const query = uni.createSelectorQuery().in(this);
         query.selectAll('.movable-view--hock').boundingClientRect(data => {
            this.leftWidth = data[1].width
            this.rightWidth = data[2].width
            this.width = data[0].width
            this.viewWidth = this.width + this.rightWidth + this.leftWidth
            if (this.leftWidth === 0) {
               // TODO 疑似bug ,初始化的时候如果x 是0,会导致移动位置错误,所以让元素超出一点
               this.x = -0.1
            } else {
               this.x = -this.leftWidth
            }
            this.moveX = this.x
            this.$nextTick(() => {
               this.swipeShow = 1
            })
            if (!this.buttonWidth) {
               this.disabledView = true
            }
            if (this.autoClose) return
            if (this.show !== 'none') {
               this.transition = true
               this.open(this.shows)
            }
         }).exec();
      }
   }
}