refactor(ui): 重构UI组件样式和对话框功能

- 将 AddDataDialog 组件的布局改为 flex 布局并移除自定义 CSS 类
- 更新 TokenDetailView 的整体布局结构，使用 Tailwind CSS 类替换原生样式
- 优化 TokenManageView 的表单和表格界面，调整响应式设计
- 移除 Element Plus ElContainer 组件的引用
- 合并多个编辑对话框为统一的数据编辑对话框
- 优化进度条和标签的显示样式
- 调整按钮和表单项的间距和对齐方式

web/src/components/AddDataDialog.vue

@@ -70,7 +70,7 @@ const handleUpload = async () => {
       <el-tag type="primary" effect="plain">{{ props.token }}</el-tag>
     </template>
 
-    <div class="add-data-dialog">
+    <div class="flex flex-col gap-4">
       <el-input
           v-model="inputData"
           type="textarea"
@@ -80,13 +80,14 @@ const handleUpload = async () => {
           class="textarea-input"
       />
 
-      <div class="footer">
-        <div class="progress">
+      <div class="flex justify-between items-center gap-4">
+        <div class="flex-1 flex items-center gap-3">
           <el-progress
               :percentage="totalCount > 0 ? Math.round((uploadedCount / totalCount) * 100) : 0"
               :show-text="false"
+              class="flex-1"
           />
-          <span class="progress-text">已上传 {{ uploadedCount }}/{{ totalCount }} 行</span>
+          <span class="text-sm text-[var(--el-text-color-secondary)] whitespace-nowrap">已上传 {{ uploadedCount }}/{{ totalCount }} 行</span>
         </div>
 
         <el-button
@@ -105,39 +106,9 @@ const handleUpload = async () => {
 </template>
 
 <style scoped>
-.add-data-dialog {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-
 .textarea-input :deep(.el-textarea__inner) {
   overflow-x: auto;
   white-space: pre;
   word-break: keep-all;
 }
-
-.footer {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  gap: 16px;
-}
-
-.progress {
-  flex: 1;
-  display: flex;
-  align-items: center;
-  gap: 12px;
-}
-
-.progress-text {
-  font-size: 14px;
-  color: var(--el-text-color-secondary);
-  white-space: nowrap;
-}
-
-.footer .el-progress {
-  flex: 1;
-}
-</style>
+</style>