appid和secret展示处理

src/views/console/overview.vue

@@ -105,13 +105,34 @@
               <span>AppId和AppSecret</span>
               <span>AppId和AppSecret</span>
             </div>
             </div>
           </template>
           </template>
-          <el-form-item label="AppId：">
-            <div>{{ appData.appId }}</div>
-          </el-form-item>
           <el-form-item label="AppSecret：">
           <el-form-item label="AppSecret：">
-            <div>{{ appData.appSecret }}
-            </div>
+            <el-tooltip
+                effect="dark"
+                :content="appData.appId || '-'"
+                placement="top"
+                v-if="appData.appId"
+            >
+            <span class="secret-text">
+              {{ formatString(appData.appId) }}
+            </span>
+            </el-tooltip>
+            <span v-else>-</span>
           </el-form-item>
           </el-form-item>
+          <el-form-item label="AppSecret：">
+            <el-tooltip
+                effect="dark"
+                :content="appData.appSecret || '-'"
+                placement="top"
+                v-if="appData.appSecret"
+            >
+            <span class="secret-text">
+              {{ formatString(appData.appSecret) }}
+            </span>
+            </el-tooltip>
+            <span v-else>-</span>
+        </el-form-item>
+
+
         </el-card>
         </el-card>
       </el-col>
       </el-col>
       <el-col :span="12">
       <el-col :span="12">
@@ -176,6 +197,15 @@ function handleViewReason() {
 
 
 getAuditInfo()
 getAuditInfo()
 getAppInfo()
 getAppInfo()
+
+// script setup 里加一个方法
+function formatString(str) {
+  if (!str) return '-'
+  if (str.length <= 10) return secret
+  // 只显示前 4 位 + ... + 后 4 位
+  return `${str.slice(0, 4)}****${str.slice(-4)}`
+}
+
 </script>
 </script>
 <style scoped lang="scss">
 <style scoped lang="scss">
 .remind {
 .remind {