From 3f01b1957398a8dce4a21ad9530f69df89f45051 Mon Sep 17 00:00:00 2001
From: whycq <you@example.com>
Date: 星期三, 21 九月 2022 21:53:13 +0800
Subject: [PATCH] #
---
components/y-popup/y-popup.vue | 37 ++++++++++++++++++++++++++++++++-----
1 files changed, 32 insertions(+), 5 deletions(-)
diff --git a/components/y-popup/y-popup.vue b/components/y-popup/y-popup.vue
index a792720..d818381 100644
--- a/components/y-popup/y-popup.vue
+++ b/components/y-popup/y-popup.vue
@@ -1,14 +1,32 @@
<template>
- <view>
- <view class="y-popup-mask">
- <view class="center"></view>
+ <view v-if="showPopup" class="y-popup-mask" @tap="onTop">
+ <view class="center">
+ <scroll-view scroll-y="true" class="" style="max-height: 80vh;">
+ <slot/>
+ </scroll-view>
</view>
</view>
</template>
<script>
export default {
- name: 'y-popup'
+ name: 'y-popup',
+ data() {
+ return {
+ showPopup:false,
+ }
+ },
+ methods: {
+ open(direction) {
+ this.showPopup = true
+ },
+ close() {
+ this.showPopup = false
+ },
+ onTop() {
+ this.showPopup = false
+ }
+ }
}
</script>
@@ -18,15 +36,24 @@
align-items: center;
justify-content: center;
position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
width: 100%;
height: 100vh;
background-color: rgba(0, 0, 0, 0.4);
+ z-index: 999;
}
.center {
display: flex;
+ flex-direction: column;
position: relative;
- min-width: 400rpx;
+ min-width: 550rpx;
min-height: 300rpx;
+ /* max-height: 100%; */
background-color: #FFF;
+ border-radius: 20rpx;
+ z-index: 998;
}
</style>
\ No newline at end of file
--
Gitblit v1.9.1