123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110 |
- <import-sjs
- from="./index.sjs"
- name="util" />
- <view class="ant-swipe">
- <view
- class="ant-swipe-action"
- style="width: {{ util.getWidth(rightWidth, leftWidth, inertiaWidth) }};">
- <movable-area
- a:if="{{ ready }}"
- class="ant-swipe-action-movable"
- style="margin-left: {{ util.getMarginLeft(rightWidth, leftWidth, inertiaWidth) }}">
- <movable-view
- class="ant-swipe-action-movable-content"
- style="width:{{ util.getWidth2(rightWidth, leftWidth, inertiaWidth) }}; margin-left: {{ util.getMarginLeft2(rightWidth, leftWidth, inertiaWidth) }};"
- x="{{ swipeX }}"
- data-type="content"
- animation="{{ animation }}"
- damping="{{ damping }}"
- direction="horizontal"
- out-of-bounds="{{ false }}"
- disabled="{{ disabled }}"
- onTap="onSwipeTap"
- onChange="onChange"
- onChangeEnd="onChangeEnd"
- catchTouchEnd="onTouchEnd"
- onTouchCancel="onTouchCancel"
- catchTouchStart="onTouchStart">
- <view
- class="ant-swipe-action-movable-content-view"
- style="{{ util.getSlotWidthStyle(rightWidth, leftWidth, _leftButtons, _rightButtons, inertiaWidth) }}"
- onTap="onClick">
- <view
- a:if="{{ swipedR || swipedL }}"
- class="ant-swipe-action-movable-content-view-modal" />
- <slot />
- </view>
- </movable-view>
- <movable-view
- class="ant-swipe-action-movable-content ant-swipe-action-movable-right{{ $id ? '-' + $id : '' }}"
- a:for="{{ _rightButtons }}"
- a:for-item="item"
- a:for-index="idx"
- damping="{{ damping }}"
- a:key="{{ idx }}"
- style="{{ util.getRightMovableContentStyle(tapTypeR, idx, rightWidth, leftWidth, inertiaWidth) }}"
- data-type="content"
- animation="{{ false }}"
- disabled="{{ true }}"
- direction="horizontal"
- x="{{ moveX * (util.getMoveX(_rightButtons, idx) / rightWidth) }}">
- <view
- class="ant-swipe-action-movable-content-right"
- style="background: {{ item.bgColor }};width: {{ (item.width + inertiaWidth + 1) / 2 }}px;">
- <view
- class="ant-swipe-action-movable-content-right-text"
- onTap="onItemTap"
- data-item="{{ util.axmlObj({ item, idx }) }}"
- aria-hidden="{{ !swipedR }}"
- style="{{ util.getMovableContentRightStyle(item, tapTypeR, idx, rightWidth, inTouch, inertiaWidth, myStyle) }}">
- <slot name="{{ util.getRightSlotName(tapTypeR, idx, item) }}">
- <!-- display: inline -->
- <text
- class="right-text {{ util.getLeft(tapTypeR, idx, _rightButtons, true) }}"
- >{{ util.getRightText(tapTypeR, idx, item) }}</text
- >
- </slot>
- </view>
- </view>
- </movable-view>
- <movable-view
- class="ant-swipe-action-movable-content ant-swipe-action-is-right-swipe ant-swipe-action-movable-left{{ $id ? '-' + $id : '' }}"
- a:for="{{ _leftButtons }}"
- a:for-item="itemL"
- a:for-index="idx"
- a:key="left-{{ idx }}"
- damping="{{ damping }}"
- style="{{ util.getLeftMovableContentStyle(tapTypeL, idx, leftWidth, inertiaWidth) }}"
- data-type="content"
- animation="{{ false }}"
- disabled="{{ true }}"
- direction="horizontal"
- x="{{ moveX * (util.getMoveX(_leftButtons, idx) / leftWidth) }}">
- <view
- class="ant-swipe-action-movable-content-left"
- style="background: {{ tapTypeL && tapTypeL === 'L-' + idx && _leftButtons.length === 3 && idx === 1 ? 'none' : itemL.bgColor }};width: {{ (leftWidth + inertiaWidth) / 2 }}px">
- <view
- class="ant-swipe-action-movable-content-left-text1 ant-swipe-action-left"
- onTap="onItemTap"
- data-item="{{ util.axmlObj({ itemL, idx }) }}"
- aria-hidden="{{ !swipedL }}"
- style="{{ util.getMovableContentLeftStyle(itemL, tapTypeL, idx, leftWidth, inTouch, inertiaWidth, myStyle) }}">
- <slot name="{{ util.getLeftSlotName(tapTypeL, idx, itemL) }}">
- <!-- display: inline -->
- <text
- class="right-text"
- style="width: 100%"
- ><!-- display: inline -->
- <text
- class="right-text {{ util.getLeft(tapTypeL, idx, _leftButtons, false) }}"
- >{{ util.getLeftText(tapTypeL, idx, itemL) }}</text
- ></text
- >
- </slot>
- </view>
- </view>
- </movable-view>
- </movable-area>
- </view>
- </view>
|