Initial commit of akmon project

uni_modules/lime-overlay/components/l-overlay/l-overlay.vue

@@ -0,0 +1,70 @@
+<template>
+	<view 
+		v-if="inited" 
+		class="l-overlay" 
+		:class="[lClass, classes]"
+		:style="[styles, lStyle]"
+		@click.stop="onClick" 
+		@touchmove.stop="noop" 
+		@transitionend="finished"
+		:aria-role="ariaRole || 'button'" 
+		:aria-label="ariaLabel || '关闭'">
+		<slot></slot>
+	</view>
+</template>
+
+<script lang="ts">
+	// @ts-nocheck
+	import { computed, defineComponent } from '@/uni_modules/lime-shared/vue';
+	import { useTransition, UseTransitionOptions, TransitionEmitStatus } from '@/uni_modules/lime-transition';
+	import overlayProps from './props';
+
+	export default defineComponent({
+		props: overlayProps,
+		emits: ['click', 'before-enter', 'enter', 'after-enter', 'before-leave', 'leave', 'after-leave'],
+		options: {
+			addGlobalClass: true,
+			virtualHost: true,
+			externalClasses: true,
+		},
+		externalClasses: ['l-class'],
+		setup(props, { emit }) {
+			
+			const {inited, display, classes, finished} = useTransition({
+				defaultName: 'fade',
+				appear: props.visible,
+				emits: (name:TransitionEmitStatus) => { emit(name) },
+				visible: (): boolean => props.visible,
+				duration: props.duration,
+			} as UseTransitionOptions)
+
+
+			const styles = computed(() => ({
+				'transition-duration': props.duration + 'ms',
+				'background': props.bgColor,
+				'z-index': props.zIndex,
+				'display': !display.value ? 'none' : '',
+			}))
+
+			const onClick = () => {
+				emit('click', !props.visible)
+			}
+			const noop = (e) => {
+				e?.preventDefault();
+				return
+			}
+
+			return {
+				inited,
+				styles,
+				classes,
+				noop,
+				onClick,
+				finished
+			}
+		}
+	})
+</script>
+<style lang="scss">
+	@import './index';
+</style>