From e6a02c8b09a796e436a501e9b87d19e25c34c9d1 Mon Sep 17 00:00:00 2001
From: zjj <3272660260@qq.com>
Date: 星期日, 07 四月 2024 15:53:37 +0800
Subject: [PATCH] #
---
components/y-popup/y-popup.vue | 61 +++++++++++++++++++++++++++---
1 files changed, 54 insertions(+), 7 deletions(-)
diff --git a/components/y-popup/y-popup.vue b/components/y-popup/y-popup.vue
index d818381..0b03137 100644
--- a/components/y-popup/y-popup.vue
+++ b/components/y-popup/y-popup.vue
@@ -1,29 +1,75 @@
<template>
- <view v-if="showPopup" class="y-popup-mask" @tap="onTop">
- <view class="center">
- <scroll-view scroll-y="true" class="" style="max-height: 80vh;">
- <slot/>
+ <view v-if="!showPopup" class="y-popup-mask">
+ <uni-transition key="1" mode-class="fade" :styles="maskClass" :show="show" @click="onTap"/>
+ <uni-transition key="2" :styles="transClass" :show="showTrans" mode-class="fade" :duration="duration">
+ <view style="height: 70rpx;background-color: aliceblue;">{{titleText}}</view>
+ <scroll-view scroll-y class="scroll-Y">
+ <slot>
+ <input type="text">
+ </slot>
</scroll-view>
- </view>
+ <view>
+ <button size="mini" @click="close">鎸夐挳</button>
+ </view>
+ </uni-transition>
</view>
</template>
<script>
export default {
name: 'y-popup',
+ props: {
+ title: {
+ type: String,
+ default: ''
+ },
+ },
+ computed: {
+ titleText() {
+ return this.title || t("uni-popup.title")
+ }
+ },
data() {
return {
+ show:false,
showPopup:false,
+ showTrans: false,
+ duration: 500,
+ ani: [],
+ maskClass: {
+ position: 'fixed',
+ bottom: 0,
+ top: 0,
+ left: 0,
+ right: 0,
+ backgroundColor: 'rgba(0, 0, 0, 0.4)'
+ },
+ transClass: {
+ position: 'fixed',
+ // left: 0,
+ // right: 0,
+ minWidth:'300rpx',
+ minHeight: '400rpx',
+ display: 'flex',
+ flexDirection: 'column',
+ alignItems: 'center',
+ borderRadius: '20rpx',
+ justifyContent: 'center',
+ backgroundColor: 'rgba(0, 255, 0, 0.4)'
+ },
+
}
},
methods: {
open(direction) {
this.showPopup = true
+ this.show = true
+ this.showTrans = true
},
close() {
this.showPopup = false
},
- onTop() {
+ onTap() {
this.showPopup = false
}
}
@@ -42,8 +88,9 @@
bottom: 0;
width: 100%;
height: 100vh;
- background-color: rgba(0, 0, 0, 0.4);
+ /* background-color: rgba(0, 0, 0, 0.4); */
z-index: 999;
+ border-radius: 20rpx;
}
.center {
display: flex;
--
Gitblit v1.9.1