|
@@ -99,98 +99,3 @@ export default {
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
</script>
|
|
</script>
|
|
|
-<style lang="scss" scoped>
|
|
|
|
|
-.popup-fade-enter-active {
|
|
|
|
|
- animation: 0.2s van-fade-in;
|
|
|
|
|
-}
|
|
|
|
|
-.popup-fade-leave-active {
|
|
|
|
|
- animation: 0.2s van-fade-out;
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-.popup-slide {
|
|
|
|
|
- &-top-enter,
|
|
|
|
|
- &-top-leave-active {
|
|
|
|
|
- transform: translate(0, -100%);
|
|
|
|
|
- }
|
|
|
|
|
- &-right-enter,
|
|
|
|
|
- &-right-leave-active {
|
|
|
|
|
- transform: translate(100%, 0);
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- &-bottom-enter,
|
|
|
|
|
- &-bottom-leave-active {
|
|
|
|
|
- transform: translate(0, 100%);
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- &-left-enter,
|
|
|
|
|
- &-left-leave-active {
|
|
|
|
|
- transform: translate(-100%, 0);
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-.popup-center {
|
|
|
|
|
- top: 50%;
|
|
|
|
|
- left: 50%;
|
|
|
|
|
- transform: translate(-50%, -50%);
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-.popup-bottom {
|
|
|
|
|
- bottom: 0;
|
|
|
|
|
- left: 0;
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- &.round {
|
|
|
|
|
- border-radius: 25px 25px 0 0;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-.popup-right {
|
|
|
|
|
- top: 0;
|
|
|
|
|
- right: 0;
|
|
|
|
|
- &.round {
|
|
|
|
|
- border-radius: 25px 0 0 25px;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-.popup-left {
|
|
|
|
|
- top: 0;
|
|
|
|
|
- left: 0;
|
|
|
|
|
- &.round {
|
|
|
|
|
- border-radius: 0 25px 25px 0;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-.popup-top {
|
|
|
|
|
- top: 0;
|
|
|
|
|
- left: 0;
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- &.round {
|
|
|
|
|
- border-radius: 0 0 25px 25px;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-.popup-box {
|
|
|
|
|
- position: fixed;
|
|
|
|
|
- max-height: 100%;
|
|
|
|
|
- overflow-y: auto;
|
|
|
|
|
- background-color: #fff;
|
|
|
|
|
- transition: transform 0.2s;
|
|
|
|
|
- -webkit-overflow-scrolling: touch;
|
|
|
|
|
- z-index: 2028;
|
|
|
|
|
-}
|
|
|
|
|
-@keyframes van-fade-in {
|
|
|
|
|
- from {
|
|
|
|
|
- opacity: 0;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- to {
|
|
|
|
|
- opacity: 1;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-@keyframes van-fade-out {
|
|
|
|
|
- from {
|
|
|
|
|
- opacity: 1;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- to {
|
|
|
|
|
- opacity: 0;
|
|
|
|
|
- }
|
|
|
|
|
-}
|
|
|
|
|
-</style>
|
|
|