perf: dropdown closes after click

Signed-off-by: Ryan Wang <i@ryanc.cc>
pull/603/head
Ryan Wang 2022-08-23 14:41:34 +08:00
parent dc823ac20b
commit 3722a7fb36
7 changed files with 38 additions and 1 deletions

View File

@ -156,16 +156,19 @@ const folders = [
<div class="w-72 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">本地</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">阿里云 OSS</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">Amazon S3</span>
@ -197,6 +200,7 @@ const folders = [
<li
v-for="(user, index) in users"
:key="index"
v-close-popper
class="cursor-pointer py-4 hover:bg-gray-50"
>
<div class="flex items-center space-x-4">
@ -246,11 +250,13 @@ const folders = [
<div class="w-72 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">未被引用</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">文章</span>
@ -280,21 +286,25 @@ const folders = [
<div class="w-72 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">较近上传</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">较晚上传</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">文件大小降序</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">文件大小升序</span>

View File

@ -66,6 +66,7 @@ const onVisibleChange = (visible: boolean) => {
<li
v-for="(strategy, index) in strategies"
:key="index"
v-close-popper
class="flex cursor-pointer flex-col rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">

View File

@ -187,6 +187,7 @@ useExtensionPointsState("PAGES", pagesPublicState);
<li
v-for="(user, index) in users"
:key="index"
v-close-popper
class="cursor-pointer py-4 hover:bg-gray-50"
>
<div class="flex items-center space-x-4">

View File

@ -110,11 +110,13 @@ onMounted(handleFetchPlugins);
<div class="w-52 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">已启用</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">未启用</span>
@ -199,11 +201,13 @@ onMounted(handleFetchPlugins);
<div class="w-72 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">较近安装</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">较晚安装</span>

View File

@ -120,7 +120,12 @@ const { isStarted, changeStatus, uninstall } = usePluginLifeCycle(plugin);
<template #popper>
<div class="w-48 p-2">
<VSpace class="w-full" direction="column">
<VButton block type="danger" @click="uninstall">
<VButton
v-close-popper
block
type="danger"
@click="uninstall"
>
卸载
</VButton>
</VSpace>

View File

@ -95,11 +95,13 @@ onMounted(() => {
<div class="w-52 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">正常</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">已禁用</span>
@ -121,11 +123,13 @@ onMounted(() => {
<div class="w-52 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">系统保留</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">自定义</span>
@ -147,11 +151,13 @@ onMounted(() => {
<div class="w-72 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">更高权限</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">更低权限</span>

View File

@ -168,11 +168,13 @@ onMounted(() => {
<div class="w-52 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">正常</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">已禁用</span>
@ -194,21 +196,25 @@ onMounted(() => {
<div class="w-52 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">Super Administrator</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">Administrator</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">Editor</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">Guest</span>
@ -230,11 +236,13 @@ onMounted(() => {
<div class="w-72 p-4">
<ul class="space-y-1">
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">较近登录</span>
</li>
<li
v-close-popper
class="flex cursor-pointer items-center rounded px-3 py-2 text-sm text-gray-600 hover:bg-gray-100 hover:text-gray-900"
>
<span class="truncate">较晚登录</span>
@ -327,6 +335,7 @@ onMounted(() => {
<div class="w-48 p-2">
<VSpace class="w-full" direction="column">
<VButton
v-close-popper
block
type="secondary"
@click="handleOpenCreateModal(user)"
@ -334,6 +343,7 @@ onMounted(() => {
修改资料
</VButton>
<VButton
v-close-popper
block
@click="handleOpenPasswordChangeModal(user)"
>