diff --git a/src/components/MaskLayer.vue b/src/components/MaskLayer.vue
new file mode 100644
index 0000000..2082d56
--- /dev/null
+++ b/src/components/MaskLayer.vue
@@ -0,0 +1,31 @@
+<template>
+  <div
+    style="
+      width: 100vw;
+      height: 100vh;
+      background-color: #00000080;
+      position: fixed;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      z-index: 999;
+    "
+    v-show="maskLayerShow"
+  >
+    <div style="position: absolute; top: 0; bottom: 0; left: 0; right: 0; overflow-y: auto">
+      <slot></slot>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  maskLayerShow: {
+    type: Boolean,
+    required: true,
+  },
+})
+</script>
+
+<style lang="scss" scoped></style>