web: fix el-popover bug

This commit is contained in:
fatedier 2023-04-16 16:36:55 +08:00
parent c819079cb8
commit 525339b3f1
15 changed files with 228 additions and 172 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -4,8 +4,8 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>frp client admin UI</title> <title>frp client admin UI</title>
<script type="module" crossorigin src="./index-7dd223da.js"></script> <script type="module" crossorigin src="./index-1c7ed8b0.js"></script>
<link rel="stylesheet" href="./index-aa3c7267.css"> <link rel="stylesheet" href="./index-1e2a7ce0.css">
</head> </head>
<body> <body>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -4,8 +4,8 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>frps dashboard</title> <title>frps dashboard</title>
<script type="module" crossorigin src="./index-b8250b3f.js"></script> <script type="module" crossorigin src="./index-93e38bbf.js"></script>
<link rel="stylesheet" href="./index-7b4711f8.css"> <link rel="stylesheet" href="./index-1e0c7400.css">
</head> </head>
<body> <body>

View File

@ -11,8 +11,8 @@
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore" "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
}, },
"dependencies": { "dependencies": {
"element-plus": "^2.2.28", "element-plus": "^2.3.3",
"vue": "^3.2.45", "vue": "^3.2.47",
"vue-router": "^4.1.6" "vue-router": "^4.1.6"
}, },
"devDependencies": { "devDependencies": {

View File

@ -1136,10 +1136,10 @@ electron-to-chromium@^1.4.284:
resolved "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.302.tgz" resolved "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.302.tgz"
integrity sha512-Uk7C+7aPBryUR1Fwvk9VmipBcN9fVsqBO57jV2ZjTm+IZ6BMNqu7EDVEg2HxCNufk6QcWlFsBkhQyQroB2VWKw== integrity sha512-Uk7C+7aPBryUR1Fwvk9VmipBcN9fVsqBO57jV2ZjTm+IZ6BMNqu7EDVEg2HxCNufk6QcWlFsBkhQyQroB2VWKw==
element-plus@^2.2.28: element-plus@^2.3.3:
version "2.2.32" version "2.3.3"
resolved "https://registry.npmjs.org/element-plus/-/element-plus-2.2.32.tgz" resolved "https://registry.yarnpkg.com/element-plus/-/element-plus-2.3.3.tgz#33173bbbe84ada40f4d796fe5043c44781198ea4"
integrity sha512-DTJMhYOy6MApbmh6z/95hPTK5WrBiNHGzV4IN+uEkup1WoimQ+Qyt8RxKdTe/X1LWEJ8YgWv/Cl8P4ocrt5z5g== integrity sha512-Zy61OXrG6b4FF3h29A9ZOUkaEQXjCuFwNa7DlpB3Vo+42Tw5zBbHe5a4BY7i56TVJG5xTbS9UQyA726J91pDqg==
dependencies: dependencies:
"@ctrl/tinycolor" "^3.4.1" "@ctrl/tinycolor" "^3.4.1"
"@element-plus/icons-vue" "^2.0.6" "@element-plus/icons-vue" "^2.0.6"
@ -3018,9 +3018,9 @@ vue-tsc@^1.0.12:
"@volar/vue-language-core" "1.1.4" "@volar/vue-language-core" "1.1.4"
"@volar/vue-typescript" "1.1.4" "@volar/vue-typescript" "1.1.4"
vue@^3.2.45: vue@^3.2.47:
version "3.2.47" version "3.2.47"
resolved "https://registry.npmjs.org/vue/-/vue-3.2.47.tgz" resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.47.tgz#3eb736cbc606fc87038dbba6a154707c8a34cff0"
integrity sha512-60188y/9Dc9WVrAZeUVSDxRQOZ+z+y5nO2ts9jWXSTkMvayiWxCWOWtBQoYjLeccfXkiiPZWAHcV+WTPhkqJHQ== integrity sha512-60188y/9Dc9WVrAZeUVSDxRQOZ+z+y5nO2ts9jWXSTkMvayiWxCWOWtBQoYjLeccfXkiiPZWAHcV+WTPhkqJHQ==
dependencies: dependencies:
"@vue/compiler-dom" "3.2.47" "@vue/compiler-dom" "3.2.47"

View File

@ -15,7 +15,7 @@
"echarts": "^5.4.1", "echarts": "^5.4.1",
"element-plus": "^2.3.3", "element-plus": "^2.3.3",
"humanize-plus": "^1.8.2", "humanize-plus": "^1.8.2",
"vue": "^3.2.45", "vue": "^3.2.47",
"vue-router": "^4.1.6" "vue-router": "^4.1.6"
}, },
"devDependencies": { "devDependencies": {

View File

@ -8,26 +8,25 @@
<el-table-column type="expand"> <el-table-column type="expand">
<template #default="props"> <template #default="props">
<el-popover <el-popover
ref="popoverTraffic"
:virtual-ref="buttonTraffic"
placement="right" placement="right"
width="600" width="600"
style="margin-left: 0px" style="margin-left: 0px"
trigger="click" trigger="click"
virtual-triggering
> >
<Traffic :proxy_name="props.row.name" /> <template #default>
</el-popover> <Traffic :proxy_name="props.row.name" />
</template>
<el-button <template #reference>
ref="buttonTraffic" <el-button
type="primary" type="primary"
size="large" size="large"
:name="props.row.name" :name="props.row.name"
style="margin-bottom: 10px" style="margin-bottom: 10px"
v-click-outside="onClickTrafficStats" >Traffic Statistics
>Traffic Statistics </el-button>
</el-button> </template>
</el-popover>
<ProxyViewExpand :row="props.row" :proxyType="proxyType" /> <ProxyViewExpand :row="props.row" :proxyType="proxyType" />
</template> </template>
@ -65,7 +64,6 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, unref } from 'vue'
import * as Humanize from 'humanize-plus' import * as Humanize from 'humanize-plus'
import type { TableColumnCtx } from 'element-plus' import type { TableColumnCtx } from 'element-plus'
import type { BaseProxy } from '../utils/proxy.js' import type { BaseProxy } from '../utils/proxy.js'
@ -83,11 +81,4 @@ const formatTrafficIn = (row: BaseProxy, _: TableColumnCtx<BaseProxy>) => {
const formatTrafficOut = (row: BaseProxy, _: TableColumnCtx<BaseProxy>) => { const formatTrafficOut = (row: BaseProxy, _: TableColumnCtx<BaseProxy>) => {
return Humanize.fileSize(row.traffic_out) return Humanize.fileSize(row.traffic_out)
} }
const buttonTraffic = ref()
const popoverTraffic = ref()
const onClickTrafficStats = () => {
unref(popoverTraffic).popoverTraffic?.delayHide?.()
}
</script> </script>

View File

@ -674,6 +674,16 @@
estree-walker "^2.0.2" estree-walker "^2.0.2"
source-map "^0.6.1" source-map "^0.6.1"
"@vue/compiler-core@3.2.47":
version "3.2.47"
resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.2.47.tgz#3e07c684d74897ac9aa5922c520741f3029267f8"
integrity sha512-p4D7FDnQb7+YJmO2iPEv0SQNeNzcbHdGByJDsT4lynf63AFkOTFN07HsiRSvjGo0QrxR/o3d0hUyNCUnBU2Tig==
dependencies:
"@babel/parser" "^7.16.4"
"@vue/shared" "3.2.47"
estree-walker "^2.0.2"
source-map "^0.6.1"
"@vue/compiler-dom@3.2.45", "@vue/compiler-dom@^3.2.45": "@vue/compiler-dom@3.2.45", "@vue/compiler-dom@^3.2.45":
version "3.2.45" version "3.2.45"
resolved "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.45.tgz" resolved "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.45.tgz"
@ -682,7 +692,31 @@
"@vue/compiler-core" "3.2.45" "@vue/compiler-core" "3.2.45"
"@vue/shared" "3.2.45" "@vue/shared" "3.2.45"
"@vue/compiler-sfc@3.2.45", "@vue/compiler-sfc@^3.2.45": "@vue/compiler-dom@3.2.47":
version "3.2.47"
resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.2.47.tgz#a0b06caf7ef7056939e563dcaa9cbde30794f305"
integrity sha512-dBBnEHEPoftUiS03a4ggEig74J2YBZ2UIeyfpcRM2tavgMWo4bsEfgCGsu+uJIL/vax9S+JztH8NmQerUo7shQ==
dependencies:
"@vue/compiler-core" "3.2.47"
"@vue/shared" "3.2.47"
"@vue/compiler-sfc@3.2.47":
version "3.2.47"
resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.2.47.tgz#1bdc36f6cdc1643f72e2c397eb1a398f5004ad3d"
integrity sha512-rog05W+2IFfxjMcFw10tM9+f7i/+FFpZJJ5XHX72NP9eC2uRD+42M3pYcQqDXVYoj74kHMSEdQ/WmCjt8JFksQ==
dependencies:
"@babel/parser" "^7.16.4"
"@vue/compiler-core" "3.2.47"
"@vue/compiler-dom" "3.2.47"
"@vue/compiler-ssr" "3.2.47"
"@vue/reactivity-transform" "3.2.47"
"@vue/shared" "3.2.47"
estree-walker "^2.0.2"
magic-string "^0.25.7"
postcss "^8.1.10"
source-map "^0.6.1"
"@vue/compiler-sfc@^3.2.45":
version "3.2.45" version "3.2.45"
resolved "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.45.tgz" resolved "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.45.tgz"
integrity sha512-1jXDuWah1ggsnSAOGsec8cFjT/K6TMZ0sPL3o3d84Ft2AYZi2jWJgRMjw4iaK0rBfA89L5gw427H4n1RZQBu6Q== integrity sha512-1jXDuWah1ggsnSAOGsec8cFjT/K6TMZ0sPL3o3d84Ft2AYZi2jWJgRMjw4iaK0rBfA89L5gw427H4n1RZQBu6Q==
@ -706,6 +740,14 @@
"@vue/compiler-dom" "3.2.45" "@vue/compiler-dom" "3.2.45"
"@vue/shared" "3.2.45" "@vue/shared" "3.2.45"
"@vue/compiler-ssr@3.2.47":
version "3.2.47"
resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.2.47.tgz#35872c01a273aac4d6070ab9d8da918ab13057ee"
integrity sha512-wVXC+gszhulcMD8wpxMsqSOpvDZ6xKXSVWkf50Guf/S+28hTAXPDYRTbLQ3EDkOP5Xz/+SY37YiwDquKbJOgZw==
dependencies:
"@vue/compiler-dom" "3.2.47"
"@vue/shared" "3.2.47"
"@vue/devtools-api@^6.4.5": "@vue/devtools-api@^6.4.5":
version "6.5.0" version "6.5.0"
resolved "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.0.tgz" resolved "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.0.tgz"
@ -739,43 +781,66 @@
estree-walker "^2.0.2" estree-walker "^2.0.2"
magic-string "^0.25.7" magic-string "^0.25.7"
"@vue/reactivity@3.2.45", "@vue/reactivity@^3.2.45": "@vue/reactivity-transform@3.2.47":
version "3.2.47"
resolved "https://registry.yarnpkg.com/@vue/reactivity-transform/-/reactivity-transform-3.2.47.tgz#e45df4d06370f8abf29081a16afd25cffba6d84e"
integrity sha512-m8lGXw8rdnPVVIdIFhf0LeQ/ixyHkH5plYuS83yop5n7ggVJU+z5v0zecwEnX7fa7HNLBhh2qngJJkxpwEEmYA==
dependencies:
"@babel/parser" "^7.16.4"
"@vue/compiler-core" "3.2.47"
"@vue/shared" "3.2.47"
estree-walker "^2.0.2"
magic-string "^0.25.7"
"@vue/reactivity@3.2.47":
version "3.2.47"
resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.2.47.tgz#1d6399074eadfc3ed35c727e2fd707d6881140b6"
integrity sha512-7khqQ/75oyyg+N/e+iwV6lpy1f5wq759NdlS1fpAhFXa8VeAIKGgk2E/C4VF59lx5b+Ezs5fpp/5WsRYXQiKxQ==
dependencies:
"@vue/shared" "3.2.47"
"@vue/reactivity@^3.2.45":
version "3.2.45" version "3.2.45"
resolved "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.45.tgz" resolved "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.45.tgz"
integrity sha512-PRvhCcQcyEVohW0P8iQ7HDcIOXRjZfAsOds3N99X/Dzewy8TVhTCT4uXpAHfoKjVTJRA0O0K+6QNkDIZAxNi3A== integrity sha512-PRvhCcQcyEVohW0P8iQ7HDcIOXRjZfAsOds3N99X/Dzewy8TVhTCT4uXpAHfoKjVTJRA0O0K+6QNkDIZAxNi3A==
dependencies: dependencies:
"@vue/shared" "3.2.45" "@vue/shared" "3.2.45"
"@vue/runtime-core@3.2.45": "@vue/runtime-core@3.2.47":
version "3.2.45" version "3.2.47"
resolved "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.45.tgz" resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.2.47.tgz#406ebade3d5551c00fc6409bbc1eeb10f32e121d"
integrity sha512-gzJiTA3f74cgARptqzYswmoQx0fIA+gGYBfokYVhF8YSXjWTUA2SngRzZRku2HbGbjzB6LBYSbKGIaK8IW+s0A== integrity sha512-RZxbLQIRB/K0ev0K9FXhNbBzT32H9iRtYbaXb0ZIz2usLms/D55dJR2t6cIEUn6vyhS3ALNvNthI+Q95C+NOpA==
dependencies: dependencies:
"@vue/reactivity" "3.2.45" "@vue/reactivity" "3.2.47"
"@vue/shared" "3.2.45" "@vue/shared" "3.2.47"
"@vue/runtime-dom@3.2.45": "@vue/runtime-dom@3.2.47":
version "3.2.45" version "3.2.47"
resolved "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.45.tgz" resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.2.47.tgz#93e760eeaeab84dedfb7c3eaf3ed58d776299382"
integrity sha512-cy88YpfP5Ue2bDBbj75Cb4bIEZUMM/mAkDMfqDTpUYVgTf/kuQ2VQ8LebuZ8k6EudgH8pYhsGWHlY0lcxlvTwA== integrity sha512-ArXrFTjS6TsDei4qwNvgrdmHtD930KgSKGhS5M+j8QxXrDJYLqYw4RRcDy1bz1m1wMmb6j+zGLifdVHtkXA7gA==
dependencies: dependencies:
"@vue/runtime-core" "3.2.45" "@vue/runtime-core" "3.2.47"
"@vue/shared" "3.2.45" "@vue/shared" "3.2.47"
csstype "^2.6.8" csstype "^2.6.8"
"@vue/server-renderer@3.2.45": "@vue/server-renderer@3.2.47":
version "3.2.45" version "3.2.47"
resolved "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.45.tgz" resolved "https://registry.yarnpkg.com/@vue/server-renderer/-/server-renderer-3.2.47.tgz#8aa1d1871fc4eb5a7851aa7f741f8f700e6de3c0"
integrity sha512-ebiMq7q24WBU1D6uhPK//2OTR1iRIyxjF5iVq/1a5I1SDMDyDu4Ts6fJaMnjrvD3MqnaiFkKQj+LKAgz5WIK3g== integrity sha512-dN9gc1i8EvmP9RCzvneONXsKfBRgqFeFZLurmHOveL7oH6HiFXJw5OGu294n1nHc/HMgTy6LulU/tv5/A7f/LA==
dependencies: dependencies:
"@vue/compiler-ssr" "3.2.45" "@vue/compiler-ssr" "3.2.47"
"@vue/shared" "3.2.45" "@vue/shared" "3.2.47"
"@vue/shared@3.2.45", "@vue/shared@^3.2.45": "@vue/shared@3.2.45", "@vue/shared@^3.2.45":
version "3.2.45" version "3.2.45"
resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.2.45.tgz" resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.2.45.tgz"
integrity sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg== integrity sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg==
"@vue/shared@3.2.47":
version "3.2.47"
resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.47.tgz#e597ef75086c6e896ff5478a6bfc0a7aa4bbd14c"
integrity sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ==
"@vue/tsconfig@^0.1.3": "@vue/tsconfig@^0.1.3":
version "0.1.3" version "0.1.3"
resolved "https://registry.npmjs.org/@vue/tsconfig/-/tsconfig-0.1.3.tgz" resolved "https://registry.npmjs.org/@vue/tsconfig/-/tsconfig-0.1.3.tgz"
@ -3047,16 +3112,16 @@ vue-tsc@^1.0.12:
"@volar/vue-language-core" "1.0.24" "@volar/vue-language-core" "1.0.24"
"@volar/vue-typescript" "1.0.24" "@volar/vue-typescript" "1.0.24"
vue@^3.2.45: vue@^3.2.47:
version "3.2.45" version "3.2.47"
resolved "https://registry.npmjs.org/vue/-/vue-3.2.45.tgz" resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.47.tgz#3eb736cbc606fc87038dbba6a154707c8a34cff0"
integrity sha512-9Nx/Mg2b2xWlXykmCwiTUCWHbWIj53bnkizBxKai1g61f2Xit700A1ljowpTIM11e3uipOeiPcSqnmBg6gyiaA== integrity sha512-60188y/9Dc9WVrAZeUVSDxRQOZ+z+y5nO2ts9jWXSTkMvayiWxCWOWtBQoYjLeccfXkiiPZWAHcV+WTPhkqJHQ==
dependencies: dependencies:
"@vue/compiler-dom" "3.2.45" "@vue/compiler-dom" "3.2.47"
"@vue/compiler-sfc" "3.2.45" "@vue/compiler-sfc" "3.2.47"
"@vue/runtime-dom" "3.2.45" "@vue/runtime-dom" "3.2.47"
"@vue/server-renderer" "3.2.45" "@vue/server-renderer" "3.2.47"
"@vue/shared" "3.2.45" "@vue/shared" "3.2.47"
webpack-sources@^3.2.3: webpack-sources@^3.2.3:
version "3.2.3" version "3.2.3"