From bd99a5211f3a5fcaa051e5da868d87bb870148f5 Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Fri, 01 Mar 2024 09:58:45 +0800
Subject: [PATCH] fix:手持设备

---
 uni_modules/uview-ui/components/u-swipe-action-item/u-swipe-action-item.vue |  190 +++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 190 insertions(+), 0 deletions(-)

diff --git a/uni_modules/uview-ui/components/u-swipe-action-item/u-swipe-action-item.vue b/uni_modules/uview-ui/components/u-swipe-action-item/u-swipe-action-item.vue
new file mode 100644
index 0000000..1fab304
--- /dev/null
+++ b/uni_modules/uview-ui/components/u-swipe-action-item/u-swipe-action-item.vue
@@ -0,0 +1,190 @@
+<template>
+	<view class="u-swipe-action-item" ref="u-swipe-action-item">
+		<view class="u-swipe-action-item__right">
+			<slot name="button">
+				<view v-for="(item,index) in options" :key="index" class="u-swipe-action-item__right__button"
+					:ref="`u-swipe-action-item__right__button-${index}`" :style="[{
+						alignItems: item.style && item.style.borderRadius ? 'center' : 'stretch'
+					}]" @tap="buttonClickHandler(item, index)">
+					<view class="u-swipe-action-item__right__button__wrapper" :style="[{
+							backgroundColor: item.style && item.style.backgroundColor ? item.style.backgroundColor : '#C7C6CD',
+							borderRadius: item.style && item.style.borderRadius ? item.style.borderRadius : '0',
+							padding: item.style && item.style.borderRadius ? '0' : '0 15px',
+						}, item.style]">
+						<u-icon v-if="item.icon" :name="item.icon"
+							:color="item.style && item.style.color ? item.style.color : '#ffffff'"
+							:size="item.iconSize ? $u.addUnit(item.iconSize) : item.style && item.style.fontSize ? $u.getPx(item.style.fontSize) * 1.2 : 17"
+							:customStyle="{
+								marginRight: item.text ? '2px' : 0
+							}"></u-icon>
+						<text v-if="item.text" class="u-swipe-action-item__right__button__wrapper__text u-line-1"
+							:style="[{
+								color: item.style && item.style.color ? item.style.color : '#ffffff',
+								fontSize: item.style && item.style.fontSize ? item.style.fontSize : '16px',
+								lineHeight: item.style && item.style.fontSize ? item.style.fontSize : '16px',
+							}]">{{ item.text }}</text>
+					</view>
+				</view>
+			</slot>
+		</view>
+		<!-- #ifdef APP-VUE || MP-WEIXIN || H5 || MP-QQ -->
+		<view class="u-swipe-action-item__content" @touchstart="wxs.touchstart" @touchmove="wxs.touchmove"
+			@touchend="wxs.touchend" :status="status" :change:status="wxs.statusChange" :size="size"
+			:change:size="wxs.sizeChange">
+			<!-- #endif -->
+			<!-- #ifdef APP-NVUE -->
+			<view class="u-swipe-action-item__content" ref="u-swipe-action-item__content" @panstart="onTouchstart"
+				@tap="clickHandler">
+				<!-- #endif -->
+				<slot />
+			</view>
+		</view>
+</template>
+<!-- #ifdef APP-VUE || MP-WEIXIN || H5 || MP-QQ -->
+<script src="./index.wxs" module="wxs" lang="wxs"></script>
+<!-- #endif -->
+<script>
+	import touch from '../../libs/mixin/touch.js'
+	import props from './props.js';
+	// #ifdef APP-NVUE
+	import nvue from './nvue.js';
+	// #endif
+	// #ifdef APP-VUE || MP-WEIXIN || H5 || MP-QQ
+	import wxs from './wxs.js';
+	// #endif
+	/**
+	 * SwipeActionItem ������������������������
+	 * @description ���������������������������������������������������������������������������������������������
+	 * @tutorial https://www.uviewui.com/components/swipeAction.html
+	 * @property {Boolean}			show			��������������������������������� false ���
+	 * @property {String | Number}	index			���������������������v-for���������index������
+	 * @property {Boolean}			disabled		��������������������� false ���
+	 * @property {Boolean}			autoClose		������������������������swipe������������������ true ���
+	 * @property {Number}			threshold		��������������������������������������������������������������������������������� 30 ���
+	 * @property {Array}			options			������������������
+	 * @property {String | Number}	duration		���������������������������ms��������� 350 ���
+	 * @event {Function(index)}	open	���������������������
+	 * @event {Function(index)}	close	���������������������
+	 * @example	<u-swipe-action><u-swipe-action-item :options="options1" ></u-swipe-action-item></u-swipe-action>
+	 */
+	export default {
+		name: 'u-swipe-action-item',
+		mixins: [uni.$u.mpMixin, uni.$u.mixin, props, touch],
+		// #ifdef APP-NVUE
+		mixins: [uni.$u.mpMixin, uni.$u.mixin, props, nvue, touch],
+		// #endif
+		// #ifdef APP-VUE || MP-WEIXIN || H5 || MP-QQ
+		mixins: [uni.$u.mpMixin, uni.$u.mixin, props, touch, wxs],
+		// #endif
+		data() {
+			return {
+				// ���������������������
+				size: {},
+				// ���������u-swipe-action���������
+				parentData: {
+					autoClose: true,
+				},
+				// ���������������open-���������close-������
+				status: 'close',
+			}
+		},
+		watch: {
+			// ������wxs���������������������������������������������������������������������������������������
+			wxsInit(newValue, oldValue) {
+				this.queryRect()
+			}
+		},
+		computed: {
+			wxsInit() {
+				return [this.disabled, this.autoClose, this.threshold, this.options, this.duration]
+			}
+		},
+		mounted() {
+			this.init()
+		},
+		methods: {
+			init() {
+				// ������������������������
+				this.updateParentData()
+				// #ifndef APP-NVUE
+				uni.$u.sleep().then(() => {
+					this.queryRect()
+				})
+				// #endif
+			},
+			updateParentData() {
+				// ������������mixin���
+				this.getParentData('u-swipe-action')
+			},
+			// #ifndef APP-NVUE
+			// ������������
+			queryRect() {
+				this.$uGetRect('.u-swipe-action-item__right__button', true).then(buttons => {
+					this.size = {
+						buttons,
+						show: this.show,
+						disabled: this.disabled,
+						threshold: this.threshold,
+						duration: this.duration
+					}
+				})
+			},
+			// #endif
+			// ���������������
+			buttonClickHandler(item, index) {
+				this.$emit('click', {
+					index,
+					name: this.name
+				})
+			}
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	@import "../../libs/css/components.scss";
+
+	.u-swipe-action-item {
+		position: relative;
+		overflow: hidden;
+		/* #ifndef APP-NVUE || MP-WEIXIN */
+		touch-action: pan-y;
+		/* #endif */
+
+		&__content {
+			background-color: #FFFFFF;
+			z-index: 10;
+		}
+
+		&__right {
+			position: absolute;
+			top: 0;
+			bottom: 0;
+			right: 0;
+			@include flex;
+
+			&__button {
+				@include flex;
+				justify-content: center;
+				overflow: hidden;
+				align-items: center;
+
+				&__wrapper {
+					@include flex;
+					align-items: center;
+					justify-content: center;
+					padding: 0 15px;
+
+					&__text {
+						@include flex;
+						align-items: center;
+						color: #FFFFFF;
+						font-size: 15px;
+						text-align: center;
+						justify-content: center;
+					}
+				}
+			}
+		}
+	}
+</style>

--
Gitblit v1.8.0