From d1448cb0ef10f358bb7bddb4e1ec268515e0b787 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 15 七月 2025 11:46:57 +0800
Subject: [PATCH] 项目初始化
---
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..979779e
--- /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 鏍囪瘑绗︼紝濡傛灉鏄痸-for锛屽彲鐢╥ndex绱㈠紩
+ * @property {Boolean} disabled 鏄惁绂佺敤锛堥粯璁� false 锛�
+ * @property {Boolean} autoClose 鏄惁鑷姩鍏抽棴鍏朵粬swipe鎸夐挳缁勶紙榛樿 true 锛�
+ * @property {Number} threshold 婊戝姩璺濈闃堝�硷紝鍙湁澶т簬姝ゅ�硷紝鎵嶈璁や负鏄鎵撳紑鑿滃崟锛堥粯璁� 30 锛�
+ * @property {Array} options 鍙充晶鎸夐挳鍐呭
+ * @property {String | Number} duration 鍔ㄧ敾杩囨浮鏃堕棿锛屽崟浣峬s锛堥粯璁� 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: {},
+ // 鐖剁粍浠秛-swipe-action鐨勫弬鏁�
+ parentData: {
+ autoClose: true,
+ },
+ // 褰撳墠鐘舵�侊紝open-鎵撳紑锛宑lose-鍏抽棴
+ 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: none;
+ /* #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.9.3