liRQ
d9f87f72b5
-实现了`generateCaptcha`函数来创建随机验证码。 -添加了`drawCaptcha`函数，在画布上渲染带有视觉噪声的验证码。 feat:引入数据操作实用程序 -为数据处理创建了“normalizeText”、“filterRows”、“attachSheetName”、“flatenRows”和“buildDuplicates”函数。 -添加了用于记录管理的“createLoginLog”、“createRecord”、“mapMovieToRecord”和“createFolder”函数。 -实现了“buildTree”函数来构建分层数据结构。 feat:实现滚动锁定机制 -添加了“lockScroll”和“unlockScrolls”功能，以管理模式交互期间的后台滚动行为。 feat:创建存储实用程序函数 -引入了从本地存储中读取、写入和删除项目的功能。 chore:设置Vite配置 -配置了使用Vue进行开发的Vite，包括服务器设置和API代理。
57 lines
1.2 KiB
Vue
57 lines
1.2 KiB
Vue
<template>
|
||
<dialog ref="dialogRef" class="app-dialog" @close="unlockScroll(); $emit('close')">
|
||
<form class="dialog-form" method="dialog">
|
||
<header>
|
||
<h2>{{ title }}</h2>
|
||
<button type="button" aria-label="关闭" @click="closeDialog">×</button>
|
||
</header>
|
||
<div class="simple-dialog-body">
|
||
<slot />
|
||
</div>
|
||
<footer>
|
||
<slot name="footer">
|
||
<span></span>
|
||
<span></span>
|
||
<button type="button" class="secondary" @click="closeDialog">关闭</button>
|
||
</slot>
|
||
</footer>
|
||
</form>
|
||
</dialog>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, watch } from 'vue'
|
||
import { lockScroll, unlockScroll } from '../utils/scrollLock'
|
||
|
||
const props = defineProps({
|
||
open: Boolean,
|
||
title: {
|
||
type: String,
|
||
default: '',
|
||
},
|
||
})
|
||
|
||
defineEmits(['close'])
|
||
|
||
const dialogRef = ref(null)
|
||
|
||
function closeDialog() {
|
||
dialogRef.value?.close()
|
||
}
|
||
|
||
watch(
|
||
() => props.open,
|
||
(value) => {
|
||
if (!dialogRef.value) return
|
||
if (value && !dialogRef.value.open) {
|
||
dialogRef.value.showModal()
|
||
lockScroll()
|
||
}
|
||
if (!value && dialogRef.value.open) {
|
||
dialogRef.value.close()
|
||
unlockScroll()
|
||
}
|
||
},
|
||
)
|
||
</script>
|