web: fix el-popover bug (#3413)

* web: update

* web: fix el-popover bug

web/frps/src/components/ProxyView.vue

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