fix: 修复管理端前端 lint 与构建问题

- 收敛 easyflow-ui-admin 的 lint、格式和类型问题

- 修正 demo 页面与管理端前端构建失败点

- 验证 pnpm lint 与 pnpm build 均已通过

easyflow-ui-admin/app/index.html

@@ -15,10 +15,10 @@
     <link rel="icon" href="/favicon.svg" />
     <script>
       var _hmt = _hmt || [];
-      (function() {
-        var hm = document.createElement("script");
-        hm.src = "https://hm.baidu.com/hm.js?42639a1503843c26bc4d8b35185616d9";
-        var s = document.getElementsByTagName("script")[0];
+      (function () {
+        var hm = document.createElement('script');
+        hm.src = 'https://hm.baidu.com/hm.js?42639a1503843c26bc4d8b35185616d9';
+        var s = document.getElementsByTagName('script')[0];
         s.parentNode.insertBefore(hm, s);
       })();
     </script>

easyflow-ui-admin/app/package.json

@@ -29,10 +29,10 @@
     "@easyflow/types": "workspace:*",
     "@easyflow/utils": "workspace:*",
     "@element-plus/icons-vue": "^2.3.2",
-    "@wangeditor/editor": "^5.1.23",
-    "@wangeditor/editor-for-vue": "^5.1.12",
     "@tinyflow-ai/vue": "workspace:*",
     "@vueuse/core": "catalog:",
+    "@wangeditor/editor": "^5.1.23",
+    "@wangeditor/editor-for-vue": "^5.1.12",
     "dayjs": "catalog:",
     "dompurify": "^3.3.1",
     "element-plus": "catalog:",

easyflow-ui-admin/app/src/adapter/component/index.ts

@@ -10,7 +10,11 @@ import type { Recordable } from '@easyflow/types';
 
 import { defineAsyncComponent, defineComponent, h, ref } from 'vue';
 
-import { ApiComponent, globalShareState, IconPicker } from '@easyflow/common-ui';
+import {
+  ApiComponent,
+  globalShareState,
+  IconPicker,
+} from '@easyflow/common-ui';
 import { $t } from '@easyflow/locales';
 
 import { ElNotification } from 'element-plus';

easyflow-ui-admin/app/src/adapter/form.ts

@@ -1,11 +1,15 @@
 import type {
-  EasyFlowFormSchema as FormSchema,
   EasyFlowFormProps,
+  EasyFlowFormSchema as FormSchema,
 } from '@easyflow/common-ui';
 
 import type { ComponentType } from './component';
 
-import { setupEasyFlowForm, useEasyFlowForm as useForm, z } from '@easyflow/common-ui';
+import {
+  setupEasyFlowForm,
+  useEasyFlowForm as useForm,
+  z,
+} from '@easyflow/common-ui';
 import { $t } from '@easyflow/locales';
 
 async function initSetupEasyFlowForm() {

easyflow-ui-admin/app/src/adapter/vxe-table.ts

@@ -2,7 +2,10 @@ import type { VxeTableGridOptions } from '@easyflow/plugins/vxe-table';
 
 import { h } from 'vue';
 
-import { setupEasyFlowVxeTable, useEasyFlowVxeGrid } from '@easyflow/plugins/vxe-table';
+import {
+  setupEasyFlowVxeTable,
+  useEasyFlowVxeGrid,
+} from '@easyflow/plugins/vxe-table';
 
 import { ElButton, ElImage } from 'element-plus';
 

easyflow-ui-admin/app/src/api/ai/knowledge.ts

@@ -0,0 +1 @@
+export {};

easyflow-ui-admin/app/src/components/cardPage/CardPage.vue

@@ -144,143 +144,8 @@ const filteredActions = computed(() => {
 </template>
 
 <style scoped>
-.card-list-container {
-  width: 100%;
-  height: 100%;
-}
-
-.card-list {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
-  gap: 20px;
-  margin-bottom: 20px;
-}
-
-:deep(.el-card__body) {
-  padding: 20px 0 0 0;
-}
-.card-item {
-  transition: all 0.3s ease;
-  border-radius: 8px;
-  flex-shrink: 0;
-  height: 165px;
-  min-width: 0;
-}
-:deep(.delete-dropdown-item) {
-  color: #ff4d4f !important;
-}
-:deep(.delete-dropdown-item:hover) {
-  color: #ff7875 !important;
-}
-:deep(.delete-dropdown-item .el-icon) {
-  color: inherit !important;
-}
-.card-item:hover {
-  transform: translateY(-5px);
-  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
-}
-
-.card-content {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  background-color: var(--el-bg-color);
-  border-radius: 8px;
-}
-
-.card-header {
-  display: flex;
-  align-items: flex-start;
-  gap: 15px;
-  margin-bottom: 15px;
-  flex: 1;
-  padding: 0 20px 0 20px;
-}
-
-.card-info {
-  flex: 1;
-  min-width: 0;
-  max-width: 100%;
-}
-
-.card-title {
-  margin: 0 0 8px 0;
-  font-size: 16px;
-  font-weight: 600;
-  color: var(--el-text-color-primary);
-  line-height: 1.4;
-}
-
-.card-desc {
-  margin: 0;
-  width: 100%;
-  font-size: 14px;
-  color: #606266;
-  line-height: 1.5;
-  height: 42px;
-  min-height: 42px;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.card-actions {
-  display: flex;
-  align-items: center;
-  height: 48px;
-  background:
-    linear-gradient(
-      180deg,
-      var(--el-color-primary-light-9),
-      var(--el-bg-color)
-    ),
-    var(--el-bg-color);
-}
-
-.action-btn {
-  flex: 1;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  min-width: 0;
-  color: #acb7c6;
-  position: relative;
-  &:hover {
-    color: var(--el-color-primary);
-  }
-}
-
-.more-btn {
-  width: 100%;
-  justify-content: center;
-}
-
-.divider {
-  position: absolute;
-  right: 0;
-  top: 50%;
-  transform: translateY(-50%);
-  width: 1px;
-  height: 20px;
-  background-color: #e0e0e0;
-}
-
-/* 确保按钮内容不换行 */
-.action-btn .el-button {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  width: 100%;
-  justify-content: center;
-}
-.empty-state {
-  padding: 40px 0;
-  text-align: center;
-}
-
 /* 响应式设计 */
+
 /* 超大屏幕 */
 @media (min-width: 1920px) {
   .card-list {
@@ -305,8 +170,8 @@ const filteredActions = computed(() => {
   }
 
   .card-header {
-    padding: 0 16px 0 16px;
     gap: 12px;
+    padding: 0 16px;
   }
 
   .card-title {
@@ -314,9 +179,9 @@ const filteredActions = computed(() => {
   }
 
   .card-desc {
-    font-size: 13px;
     height: 36px;
     min-height: 36px;
+    font-size: 13px;
   }
 }
 
@@ -326,21 +191,22 @@ const filteredActions = computed(() => {
     grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
     gap: 16px;
   }
+
   .card-header {
-    padding: 0 12px 0 12px;
     gap: 10px;
+    padding: 0 12px;
   }
 
   .card-title {
-    font-size: 14px;
     margin-bottom: 6px;
+    font-size: 14px;
   }
 
   .card-desc {
-    font-size: 12px;
     height: 32px;
     min-height: 32px;
     -webkit-line-clamp: 2;
+    font-size: 12px;
   }
 
   .card-actions {
@@ -351,4 +217,147 @@ const filteredActions = computed(() => {
     font-size: 11px;
   }
 }
+
+.card-list-container {
+  width: 100%;
+  height: 100%;
+}
+
+.card-list {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+  gap: 20px;
+  margin-bottom: 20px;
+}
+
+:deep(.el-card__body) {
+  padding: 20px 0 0;
+}
+
+.card-item {
+  flex-shrink: 0;
+  min-width: 0;
+  height: 165px;
+  border-radius: 8px;
+  transition: all 0.3s ease;
+}
+
+:deep(.delete-dropdown-item) {
+  color: #ff4d4f !important;
+}
+
+:deep(.delete-dropdown-item:hover) {
+  color: #ff7875 !important;
+}
+
+:deep(.delete-dropdown-item .el-icon) {
+  color: inherit !important;
+}
+
+.card-item:hover {
+  box-shadow: 0 4px 20px rgb(0 0 0 / 10%);
+  transform: translateY(-5px);
+}
+
+.card-content {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  background-color: var(--el-bg-color);
+  border-radius: 8px;
+}
+
+.card-header {
+  display: flex;
+  flex: 1;
+  gap: 15px;
+  align-items: flex-start;
+  padding: 0 20px;
+  margin-bottom: 15px;
+}
+
+.card-info {
+  flex: 1;
+  min-width: 0;
+  max-width: 100%;
+}
+
+.card-title {
+  margin: 0 0 8px;
+  font-size: 16px;
+  font-weight: 600;
+  line-height: 1.4;
+  color: var(--el-text-color-primary);
+}
+
+.card-desc {
+  display: -webkit-box;
+  width: 100%;
+  height: 42px;
+  min-height: 42px;
+  margin: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -webkit-line-clamp: 2;
+  font-size: 14px;
+  line-height: 1.5;
+  color: #606266;
+  -webkit-box-orient: vertical;
+}
+
+.card-actions {
+  display: flex;
+  align-items: center;
+  height: 48px;
+  background:
+    linear-gradient(
+      180deg,
+      var(--el-color-primary-light-9),
+      var(--el-bg-color)
+    ),
+    var(--el-bg-color);
+}
+
+.action-btn {
+  position: relative;
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: center;
+  min-width: 0;
+  color: #acb7c6;
+
+  &:hover {
+    color: var(--el-color-primary);
+  }
+}
+
+.more-btn {
+  justify-content: center;
+  width: 100%;
+}
+
+.divider {
+  position: absolute;
+  top: 50%;
+  right: 0;
+  width: 1px;
+  height: 20px;
+  background-color: #e0e0e0;
+  transform: translateY(-50%);
+}
+
+/* 确保按钮内容不换行 */
+.action-btn .el-button {
+  justify-content: center;
+  width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.empty-state {
+  padding: 40px 0;
+  text-align: center;
+}
 </style>

easyflow-ui-admin/app/src/components/categoryPanel/CategoryCrudPanel.vue

@@ -283,28 +283,28 @@ const handleDeleteClick = (event: any, item: any) => {
 
 <style scoped>
 .crud-category-item:hover {
-  background-color: var(--el-color-primary-light-9);
   cursor: pointer;
+  background-color: var(--el-color-primary-light-9);
 }
 
 .crud-category-item.selected {
-  background-color: var(--el-color-primary-light-9);
   color: var(--el-color-primary);
+  background-color: var(--el-color-primary-light-9);
 }
 
 .no-data {
-  text-align: center;
   padding: 40px 0;
+  text-align: center;
 }
 
 .crud-category-item {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 8px 12px;
   height: 40px;
-  border-radius: 8px;
+  padding: 8px 12px;
   font-size: 14px;
+  border-radius: 8px;
 }
 
 .crud-category-item :deep(.el-icon) {
@@ -316,8 +316,8 @@ const handleDeleteClick = (event: any, item: any) => {
   align-items: center;
   justify-content: center;
   padding: 4px;
-  border-radius: 4px;
   cursor: pointer;
+  border-radius: 4px;
   transition: background-color 0.3s;
 }
 

easyflow-ui-admin/app/src/components/categoryPanel/CategoryPanel.vue

@@ -10,7 +10,6 @@ const props = defineProps({
   categories: {
     type: Array,
     default: () => [],
-    required: true,
   },
   valueKey: {
     type: String,
@@ -125,6 +124,14 @@ const panelWidth = computed(() => {
   }
 });
 
+const categoryIconStyle = computed(() => ({
+  '--category-icon-color': props.iconColor,
+  '--category-icon-size':
+    typeof props.iconSize === 'number'
+      ? `${props.iconSize}px`
+      : `${props.iconSize}`,
+}));
+
 // 切换面板收缩状态
 const togglePanel = () => {
   isCollapsed.value = !isCollapsed.value;
@@ -177,18 +184,24 @@ onMounted(() => {
           @click="handleCategoryClick(category)"
         >
           <!-- 图标 -->
-          <div v-if="category[iconKey]" class="category-icon">
+          <div
+            v-if="category[iconKey]"
+            class="category-icon"
+            :style="categoryIconStyle"
+          >
             <!-- 1. 组件类型图标（Element Plus / 自定义 SVG 组件） -->
             <ElIcon v-if="isComponent(category[iconKey])">
               <component :is="category[iconKey]" />
             </ElIcon>
             <!-- 2. SVG 字符串：支持 v-html 或 img 两种渲染方式 -->
             <template v-else-if="isSvgString(category[iconKey])">
+              <!-- eslint-disable vue/no-v-html -->
               <div
                 v-if="!useImgForSvg"
                 v-html="category[iconKey]"
                 class="custom-svg"
               ></div>
+              <!-- eslint-enable vue/no-v-html -->
               <img
                 v-else
                 :src="svgToDataUrl(category[iconKey])"
@@ -221,14 +234,14 @@ onMounted(() => {
 <style scoped>
 .category-panel {
   position: relative; /* 相对定位，用于按钮绝对定位 */
-  overflow: hidden;
-  height: 100%;
-  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* 平滑宽度过渡 */
   box-sizing: border-box;
-  background: #ffffff;
-  border-radius: 8px;
-  border: 1px solid #f0f0f0;
+  height: 100%;
   padding: 20px;
+  overflow: hidden;
+  background: #fff;
+  border: 1px solid #f0f0f0;
+  border-radius: 8px;
+  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* 平滑宽度过渡 */
 }
 
 /* 右上角收缩/展开按钮 */
@@ -242,18 +255,19 @@ onMounted(() => {
   justify-content: center;
   width: 32px;
   height: 32px;
-  border-radius: 50%;
+  cursor: pointer;
   background-color: var(--el-color-white);
   border: 1px solid #e5e7eb;
-  cursor: pointer;
-  transition: all 0.2s;
+  border-radius: 50%;
+
   /* 按钮不随面板收缩移动 */
   transform: translateX(0);
+  transition: all 0.2s;
 }
 
 .toggle-panel-btn:hover {
   background-color: #f3f4f6;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  box-shadow: 0 2px 8px rgb(0 0 0 / 10%);
 }
 
 .toggle-panel-btn .el-icon {
@@ -264,15 +278,12 @@ onMounted(() => {
 
 /* 分类列表容器 */
 .category-list {
-  overflow: hidden;
-  height: 100%;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   gap: 1px;
-}
-
-.category-item {
+  height: 100%;
+  overflow: hidden;
 }
 
 .category-item:last-child {
@@ -281,15 +292,15 @@ onMounted(() => {
 
 .category-item-content {
   display: flex;
+  gap: 12px;
   align-items: center;
+  padding: 6px 0 6px 14px;
   font-size: 14px;
   font-weight: 500;
   color: #333;
   cursor: pointer;
-  transition: background-color 0.2s;
-  gap: 12px;
-  padding: 6px 0 6px 14px;
   border-radius: 4px;
+  transition: background-color 0.2s;
 }
 
 .category-item-content:hover {
@@ -297,49 +308,36 @@ onMounted(() => {
 }
 
 .category-icon {
-  width: v-bind(iconSize);
-  height: v-bind(iconSize);
-  color: v-bind(iconColor);
   display: inline-flex;
   align-items: center;
   justify-content: center;
+  width: var(--category-icon-size);
+  height: var(--category-icon-size);
   vertical-align: middle;
+  color: var(--category-icon-color);
 }
 
 .category-icon .el-icon {
-  width: 100%;
-  height: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
-}
-
-.category-item-content {
-  display: flex;
-  align-items: center;
-  font-size: 14px;
-  font-weight: 500;
-  color: #333;
-  cursor: pointer;
-  transition: background-color 0.2s;
-  gap: 12px;
+  width: 100%;
+  height: 100%;
 }
 
 .category-name {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-family: PingFangSC, 'PingFang SC';
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 20px;
+  text-align: left;
+  white-space: nowrap;
   transition:
     opacity 0.2s,
     transform 0.2s;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  font-family:
-    PingFangSC,
-    PingFang SC;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 20px;
-  text-align: left;
-  font-style: normal;
 }
 
 /* 收缩状态样式 */
@@ -360,11 +358,11 @@ onMounted(() => {
 /* 新增：选中态样式 */
 .category-item-content.selected {
   font-weight: 600;
-  background: rgba(0, 102, 255, 0.06);
-  color: #0066ff;
+  color: #06f;
+  background: rgb(0 102 255 / 6%);
 }
 
 .category-item-content.selected:hover {
-  background: rgba(0, 102, 255, 0.06);
+  background: rgb(0 102 255 / 6%);
 }
 </style>

easyflow-ui-admin/app/src/components/chat-history/ChatHistoryDetailDrawer.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { ChatThinkingBlock } from '@easyflow/common-ui';
 import ElXMarkdown from 'vue-element-plus-x/es/XMarkdown/index.js';
 
+import { ChatThinkingBlock } from '@easyflow/common-ui';
 import { IconifyIcon } from '@easyflow/icons';
 
 import { CircleCheck, Close } from '@element-plus/icons-vue';
@@ -22,7 +22,7 @@ interface ChatHistoryDetailDrawerProps {
   session?: any;
   messages?: any[];
   hasMore?: boolean;
-  onLoadMore?: (() => void | Promise<void>) | undefined;
+  onLoadMore?: (() => Promise<void> | void) | undefined;
 }
 
 const props = withDefaults(defineProps<ChatHistoryDetailDrawerProps>(), {
@@ -128,12 +128,7 @@ async function handleLoadMore() {
 
     <div class="chat-history-detail__stream">
       <div class="chat-history-detail__stream-toolbar">
-        <ElButton
-          v-if="hasMore"
-          text
-          type="primary"
-          @click="handleLoadMore"
-        >
+        <ElButton v-if="hasMore" text type="primary" @click="handleLoadMore">
           加载更早消息
         </ElButton>
       </div>
@@ -233,48 +228,48 @@ async function handleLoadMore() {
 <style scoped>
 .chat-history-detail {
   display: flex;
+  flex-direction: column;
   height: 100%;
   min-height: 0;
-  flex-direction: column;
   background:
     radial-gradient(
       circle at top right,
-      hsl(var(--nav-ambient) / 0.1),
+      hsl(var(--nav-ambient) / 10%),
       transparent 26%
     ),
     linear-gradient(
       180deg,
-      hsl(var(--glass-border) / 0.18) 0%,
-      hsl(var(--glass-tint) / 0.34) 10%,
-      hsl(var(--surface-panel) / 0.88) 28%,
-      hsl(var(--surface-panel) / 0.96) 100%
+      hsl(var(--glass-border) / 18%) 0%,
+      hsl(var(--glass-tint) / 34%) 10%,
+      hsl(var(--surface-panel) / 88%) 28%,
+      hsl(var(--surface-panel) / 96%) 100%
     );
 }
 
 .chat-history-detail__summary {
   display: flex;
+  gap: 16px;
   align-items: flex-start;
   justify-content: space-between;
-  gap: 16px;
   padding: 20px 24px 12px;
-  border-bottom: 1px solid hsl(var(--divider-faint) / 0.16);
+  border-bottom: 1px solid hsl(var(--divider-faint) / 16%);
 }
 
 .chat-history-detail__summary-main {
-  min-width: 0;
   flex: 1;
+  min-width: 0;
 }
 
 .chat-history-detail__title-row {
   display: flex;
   flex-wrap: wrap;
-  align-items: center;
   gap: 12px;
+  align-items: center;
 }
 
 .chat-history-detail__title {
-  margin: 0;
   min-width: 0;
+  margin: 0;
   font-size: 18px;
   font-weight: 600;
   color: hsl(var(--text-strong));
@@ -285,19 +280,19 @@ async function handleLoadMore() {
   align-items: center;
   min-height: 26px;
   padding: 0 10px;
-  border: 1px solid hsl(var(--glass-border) / 0.38);
-  border-radius: 999px;
-  background: hsl(var(--glass-tint) / 0.54);
   font-size: 12px;
   font-weight: 600;
   color: hsl(var(--nav-item-active-foreground));
+  background: hsl(var(--glass-tint) / 54%);
+  border: 1px solid hsl(var(--glass-border) / 38%);
+  border-radius: 999px;
 }
 
 .chat-history-detail__meta-row {
   display: flex;
   flex-wrap: wrap;
-  align-items: center;
   gap: 10px;
+  align-items: center;
   margin-top: 10px;
 }
 
@@ -316,28 +311,28 @@ async function handleLoadMore() {
 
 .chat-history-detail__meta-inline {
   display: inline-flex;
-  min-width: 0;
-  align-items: center;
   gap: 6px;
+  align-items: center;
+  min-width: 0;
 }
 
 .chat-history-detail__meta-divider {
   display: inline-flex;
-  height: 12px;
   width: 1px;
-  background: hsl(var(--divider-faint) / 0.42);
+  height: 12px;
+  background: hsl(var(--divider-faint) / 42%);
 }
 
 .chat-history-detail__close {
   display: inline-flex;
-  height: 36px;
-  width: 36px;
   align-items: center;
   justify-content: center;
-  border: 1px solid hsl(var(--divider-faint) / 0.24);
-  border-radius: 999px;
-  background: hsl(var(--glass-tint) / 0.46);
+  width: 36px;
+  height: 36px;
   color: hsl(var(--text-muted));
+  background: hsl(var(--glass-tint) / 46%);
+  border: 1px solid hsl(var(--divider-faint) / 24%);
+  border-radius: 999px;
   transition:
     transform 0.18s ease,
     background-color 0.18s ease,
@@ -346,15 +341,15 @@ async function handleLoadMore() {
 
 .chat-history-detail__close:hover {
   color: hsl(var(--text-strong));
-  background: hsl(var(--surface-contrast-soft) / 0.92);
+  background: hsl(var(--surface-contrast-soft) / 92%);
   transform: translateY(-1px);
 }
 
 .chat-history-detail__stream {
   display: flex;
-  min-height: 0;
   flex: 1;
   flex-direction: column;
+  min-height: 0;
   padding: 14px 24px 20px;
 }
 
@@ -365,8 +360,8 @@ async function handleLoadMore() {
 }
 
 .chat-history-detail__scrollbar {
-  min-height: 0;
   flex: 1;
+  min-height: 0;
 }
 
 .chat-history-detail__message-list {
@@ -391,9 +386,9 @@ async function handleLoadMore() {
 
 .chat-history-detail__message-meta {
   display: inline-flex;
-  max-width: 88%;
-  align-items: center;
   gap: 10px;
+  align-items: center;
+  max-width: 88%;
   font-size: 11px;
   color: hsl(var(--text-muted));
 }
@@ -409,30 +404,30 @@ async function handleLoadMore() {
 
 .chat-history-detail__message-bubble {
   width: min(88%, 760px);
-  border: 1px solid hsl(var(--divider-faint) / 0.34);
-  border-radius: 22px;
   padding: 14px 16px;
   font-size: 14px;
   line-height: 1.72;
+  border: 1px solid hsl(var(--divider-faint) / 34%);
+  border-radius: 22px;
   backdrop-filter: blur(10px);
 }
 
 .chat-history-detail__message-bubble.is-assistant {
-  background: hsl(var(--glass-tint) / 0.88);
+  background: hsl(var(--glass-tint) / 88%);
   box-shadow:
-    inset 0 1px 0 hsl(var(--glass-border) / 0.48),
-    0 12px 26px -24px hsl(var(--foreground) / 0.18);
+    inset 0 1px 0 hsl(var(--glass-border) / 48%),
+    0 12px 26px -24px hsl(var(--foreground) / 18%);
 }
 
 .chat-history-detail__message-bubble.is-user {
   background: linear-gradient(
     180deg,
-    hsl(var(--primary) / 0.14) 0%,
-    hsl(var(--surface-panel) / 0.96) 100%
+    hsl(var(--primary) / 14%) 0%,
+    hsl(var(--surface-panel) / 96%) 100%
   );
   box-shadow:
-    inset 0 1px 0 hsl(var(--glass-border) / 0.42),
-    0 16px 30px -26px hsl(var(--primary) / 0.24);
+    inset 0 1px 0 hsl(var(--glass-border) / 42%),
+    0 16px 30px -26px hsl(var(--primary) / 24%);
 }
 
 .chat-history-detail__message-chains {
@@ -448,23 +443,23 @@ async function handleLoadMore() {
 
 .chat-history-detail__tool-panel {
   overflow: hidden;
-  border: 1px solid hsl(var(--divider-faint) / 0.24);
+  background: hsl(var(--surface-panel) / 68%);
+  border: 1px solid hsl(var(--divider-faint) / 24%);
   border-radius: 14px;
-  background: hsl(var(--surface-panel) / 0.68);
-  box-shadow: inset 0 1px 0 hsl(var(--glass-border) / 0.18);
+  box-shadow: inset 0 1px 0 hsl(var(--glass-border) / 18%);
 }
 
 .chat-history-detail__tool-title {
   display: flex;
-  min-width: 0;
-  align-items: center;
   gap: 8px;
+  align-items: center;
+  min-width: 0;
   padding-left: 6px;
 }
 
 .chat-history-detail__tool-name {
-  min-width: 0;
   flex: 1;
+  min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -472,13 +467,13 @@ async function handleLoadMore() {
 
 .chat-history-detail__tool-status {
   display: inline-flex;
-  align-items: center;
   gap: 6px;
+  align-items: center;
   padding: 4px 8px;
-  border-radius: 999px;
-  background: hsl(var(--surface-contrast-soft) / 0.92);
   font-size: 12px;
   color: hsl(var(--text-muted));
+  background: hsl(var(--surface-contrast-soft) / 92%);
+  border-radius: 999px;
 }
 
 .chat-history-detail__markdown {
@@ -488,9 +483,9 @@ async function handleLoadMore() {
 }
 
 .chat-history-detail__markdown :deep(.markdown-body) {
-  background: transparent;
   font-size: inherit;
   line-height: inherit;
+  background: transparent;
 }
 
 .chat-history-detail__markdown :deep(.markdown-body > :first-child) {
@@ -508,8 +503,8 @@ async function handleLoadMore() {
 
 .chat-history-detail__markdown :deep(pre) {
   max-width: 100%;
-  overflow: auto;
   margin-top: 0;
+  overflow: auto;
 }
 
 .chat-history-detail__tool-panel :deep(.el-collapse-item__wrap) {
@@ -520,7 +515,7 @@ async function handleLoadMore() {
   min-height: 44px;
   padding-right: 14px;
   background: transparent;
-  border-bottom-color: hsl(var(--divider-faint) / 0.16);
+  border-bottom-color: hsl(var(--divider-faint) / 16%);
 }
 
 .chat-history-detail__message-bubble :deep(.el-collapse-item__content) {
@@ -550,8 +545,8 @@ async function handleLoadMore() {
 
   .chat-history-detail__message-bubble,
   .chat-history-detail__message-meta {
-    max-width: 100%;
     width: 100%;
+    max-width: 100%;
   }
 }
 </style>

easyflow-ui-admin/app/src/components/chat/chat.vue

@@ -5,18 +5,23 @@ import type {
 } from 'vue-element-plus-x/types/BubbleList';
 import type { TypewriterInstance } from 'vue-element-plus-x/types/Typewriter';
 
-import {
-  ChatThinkingBlock,
-  type ChatThinkingBlockStatus,
-} from '@easyflow/common-ui';
+import type { ChatThinkingBlockStatus } from '@easyflow/common-ui';
 import type { BotInfo, ChatMessage } from '@easyflow/types';
 
-import { nextTick, onBeforeUnmount, onMounted, ref, watch, watchEffect } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
+import {
+  nextTick,
+  onBeforeUnmount,
+  onMounted,
+  ref,
+  watch,
+  watchEffect,
+} from 'vue';
 import ElBubbleList from 'vue-element-plus-x/es/BubbleList/index.js';
 import ElSender from 'vue-element-plus-x/es/Sender/index.js';
 import ElXMarkdown from 'vue-element-plus-x/es/XMarkdown/index.js';
+import { useRoute, useRouter } from 'vue-router';
 
+import { ChatThinkingBlock } from '@easyflow/common-ui';
 import { IconifyIcon } from '@easyflow/icons';
 import { $t } from '@easyflow/locales';
 import { useBotStore } from '@easyflow/stores';
@@ -51,8 +56,8 @@ import SendingIcon from '../icons/SendingIcon.vue';
 
 type Think = {
   reasoning_content?: string;
-  thinkingStatus?: ChatThinkingBlockStatus;
   thinkingExpanded?: boolean;
+  thinkingStatus?: ChatThinkingBlockStatus;
 };
 
 type Tool = {
@@ -168,7 +173,8 @@ const updateBackToBottomButtonVisible = () => {
     showBackToBottomButton.value = false;
     return;
   }
-  const { scrollTop, scrollHeight, clientHeight } = bubbleListScrollElement.value;
+  const { scrollTop, scrollHeight, clientHeight } =
+    bubbleListScrollElement.value;
   showBackToBottomButton.value =
     scrollHeight - (scrollTop + clientHeight) > BACK_TO_BOTTOM_THRESHOLD;
 };
@@ -571,7 +577,6 @@ onBeforeUnmount(() => {
                   </ElCollapse>
                 </template>
               </template>
-
             </div>
           </template>
           <!-- 自定义头像 -->
@@ -725,7 +730,7 @@ onBeforeUnmount(() => {
   background: var(--el-bg-color-overlay);
   border: 1px solid var(--el-border-color-light);
   border-radius: 999px;
-  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.08);
+  box-shadow: 0 6px 10px rgb(0 0 0 / 8%);
   transition: all 0.2s ease;
 }
 
@@ -775,10 +780,10 @@ onBeforeUnmount(() => {
 }
 
 :deep(.chat-tool-panel.el-collapse) {
-  border: 1px solid hsl(var(--divider-faint) / 0.26);
+  background: hsl(var(--surface-panel) / 70%);
+  border: 1px solid hsl(var(--divider-faint) / 26%);
   border-radius: 14px;
-  background: hsl(var(--surface-panel) / 0.7);
-  box-shadow: inset 0 1px 0 hsl(var(--glass-border) / 0.2);
+  box-shadow: inset 0 1px 0 hsl(var(--glass-border) / 20%);
 }
 
 :deep(.chat-tool-panel .el-collapse-item) {
@@ -794,7 +799,7 @@ onBeforeUnmount(() => {
   min-height: 44px;
   padding-right: 14px;
   background: transparent;
-  border-bottom-color: hsl(var(--divider-faint) / 0.16);
+  border-bottom-color: hsl(var(--divider-faint) / 16%);
 }
 
 :deep(.chat-tool-panel .el-collapse-item__content) {

easyflow-ui-admin/app/src/components/collapse/CustomCoolapse.vue

@@ -122,162 +122,6 @@ const collapseAll = () => {
 </template>
 
 <style scoped>
-.accordion-container {
-  max-width: 100%;
-  margin: 0 auto;
-  padding: 20px;
-  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-}
-
-.title {
-  text-align: center;
-  color: var(--el-text-color-secondary);
-  margin-bottom: 8px;
-  font-size: 2rem;
-  font-weight: 600;
-}
-
-.subtitle {
-  text-align: center;
-  color: var(--el-text-color-secondary);
-  margin-bottom: 30px;
-  font-size: 1.1rem;
-}
-
-/* 控制面板样式 */
-.controls {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 30px;
-  padding: 20px;
-  background: var(--el-bg-color);
-  border-radius: 8px;
-  border: 1px solid #e9ecef;
-}
-
-.control-group {
-  display: flex;
-  align-items: center;
-  gap: 15px;
-}
-
-.checkbox-label {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  font-size: 14px;
-  color: var(--el-text-color-secondary);
-  cursor: pointer;
-}
-
-.checkbox {
-  width: 16px;
-  height: 16px;
-}
-
-.control-btn {
-  padding: 8px 16px;
-  border: 1px solid #3498db;
-  background: var(--el-bg-color);
-  color: var(--el-text-color-secondary);
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 14px;
-  transition: all 0.3s ease;
-}
-
-.control-btn:hover {
-  background: #3498db;
-  background: var(--el-color-primary-light-9);
-}
-
-/* 折叠面板列表 */
-.accordion-list {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-}
-
-.accordion-item {
-  border: 1px solid #e1e5e9;
-  border-radius: 8px;
-  overflow: hidden;
-  background: var(--el-bg-color);
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
-  transition: all 0.3s ease;
-}
-
-.accordion-item:hover {
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-}
-
-.accordion-item--active {
-  border-color: #3498db;
-}
-
-/* 面板头部 */
-.accordion-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 16px 20px;
-  background: var(--el-bg-color);
-  cursor: pointer;
-  transition: background-color 0.3s ease;
-  user-select: none;
-}
-
-.accordion-header:hover {
-  background: var(--el-color-primary-light-9);
-}
-
-.accordion-title {
-  margin: 0;
-  font-size: 1.1rem;
-  font-weight: 500;
-  color: var(--el-text-color-secondary);
-  padding-left: 12px;
-}
-
-.accordion-icon {
-  transition: transform 0.3s ease;
-  color: #7f8c8d;
-  font-size: 12px;
-}
-
-.accordion-icon--rotated {
-  transform: rotate(180deg);
-  color: #3498db;
-}
-
-.accordion-content {
-  max-height: 0;
-  overflow: hidden;
-  transition: max-height 0.4s ease;
-  background: var(--el-bg-color);
-}
-
-.accordion-content--open {
-  max-height: 200px;
-}
-
-.accordion-content-inner {
-  padding: 20px;
-  border-top: 1px solid #e1e5e9;
-}
-
-.accordion-content-inner p {
-  margin: 0;
-  line-height: 1.6;
-  color: var(--el-text-color-secondary);
-  font-size: 14px;
-}
-.column-header-container {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
 /* 响应式设计 */
 @media (max-width: 768px) {
   .accordion-container {
@@ -306,4 +150,162 @@ const collapseAll = () => {
     font-size: 1rem;
   }
 }
+
+.accordion-container {
+  max-width: 100%;
+  padding: 20px;
+  margin: 0 auto;
+  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+}
+
+.title {
+  margin-bottom: 8px;
+  font-size: 2rem;
+  font-weight: 600;
+  color: var(--el-text-color-secondary);
+  text-align: center;
+}
+
+.subtitle {
+  margin-bottom: 30px;
+  font-size: 1.1rem;
+  color: var(--el-text-color-secondary);
+  text-align: center;
+}
+
+/* 控制面板样式 */
+.controls {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 20px;
+  margin-bottom: 30px;
+  background: var(--el-bg-color);
+  border: 1px solid #e9ecef;
+  border-radius: 8px;
+}
+
+.control-group {
+  display: flex;
+  gap: 15px;
+  align-items: center;
+}
+
+.checkbox-label {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  font-size: 14px;
+  color: var(--el-text-color-secondary);
+  cursor: pointer;
+}
+
+.checkbox {
+  width: 16px;
+  height: 16px;
+}
+
+.control-btn {
+  padding: 8px 16px;
+  font-size: 14px;
+  color: var(--el-text-color-secondary);
+  cursor: pointer;
+  background: var(--el-bg-color);
+  border: 1px solid #3498db;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+}
+
+.control-btn:hover {
+  background: #3498db;
+  background: var(--el-color-primary-light-9);
+}
+
+/* 折叠面板列表 */
+.accordion-list {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.accordion-item {
+  overflow: hidden;
+  background: var(--el-bg-color);
+  border: 1px solid #e1e5e9;
+  border-radius: 8px;
+  box-shadow: 0 2px 8px rgb(0 0 0 / 5%);
+  transition: all 0.3s ease;
+}
+
+.accordion-item:hover {
+  box-shadow: 0 4px 12px rgb(0 0 0 / 10%);
+}
+
+.accordion-item--active {
+  border-color: #3498db;
+}
+
+/* 面板头部 */
+.accordion-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 16px 20px;
+  cursor: pointer;
+  user-select: none;
+  background: var(--el-bg-color);
+  transition: background-color 0.3s ease;
+}
+
+.accordion-header:hover {
+  background: var(--el-color-primary-light-9);
+}
+
+.accordion-title {
+  padding-left: 12px;
+  margin: 0;
+  font-size: 1.1rem;
+  font-weight: 500;
+  color: var(--el-text-color-secondary);
+}
+
+.accordion-icon {
+  font-size: 12px;
+  color: #7f8c8d;
+  transition: transform 0.3s ease;
+}
+
+.accordion-icon--rotated {
+  color: #3498db;
+  transform: rotate(180deg);
+}
+
+.accordion-content {
+  max-height: 0;
+  overflow: hidden;
+  background: var(--el-bg-color);
+  transition: max-height 0.4s ease;
+}
+
+.accordion-content--open {
+  max-height: 200px;
+}
+
+.accordion-content-inner {
+  padding: 20px;
+  border-top: 1px solid #e1e5e9;
+}
+
+.accordion-content-inner p {
+  margin: 0;
+  font-size: 14px;
+  line-height: 1.6;
+  color: var(--el-text-color-secondary);
+}
+
+.column-header-container {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
 </style>

easyflow-ui-admin/app/src/components/headerSearch/HeaderSearch.vue

@@ -171,9 +171,9 @@ const handleDropdownClick = (button) => {
 <style scoped>
 .custom-header {
   display: flex;
+  gap: 16px;
   align-items: center;
   justify-content: space-between;
-  gap: 16px;
   width: 100%;
 }
 
@@ -192,8 +192,8 @@ const handleDropdownClick = (button) => {
   display: flex;
   flex: 1;
   flex-wrap: wrap;
-  align-items: center;
   gap: 12px;
+  align-items: center;
 }
 
 .search-middle {
@@ -208,20 +208,20 @@ const handleDropdownClick = (button) => {
 
 .search-input :deep(.el-input__wrapper) {
   min-height: 40px;
-  background: hsl(var(--surface-contrast-soft) / 0.92);
+  background: hsl(var(--surface-contrast-soft) / 92%);
   border-radius: 14px;
   box-shadow:
-    inset 0 1px 0 hsl(var(--glass-border) / 0.44),
-    0 10px 24px -24px hsl(var(--foreground) / 0.24);
+    inset 0 1px 0 hsl(var(--glass-border) / 44%),
+    0 10px 24px -24px hsl(var(--foreground) / 24%);
 }
 
 .search-input :deep(.el-input__wrapper:hover),
 .search-input :deep(.el-input__wrapper.is-focus) {
-  background: hsl(var(--surface-subtle) / 0.98);
+  background: hsl(var(--surface-subtle) / 98%);
   box-shadow:
-    inset 0 1px 0 hsl(var(--glass-border) / 0.56),
-    0 0 0 3px hsl(var(--primary) / 0.08),
-    0 12px 24px -24px hsl(var(--foreground) / 0.24);
+    inset 0 1px 0 hsl(var(--glass-border) / 56%),
+    0 0 0 3px hsl(var(--primary) / 8%),
+    0 12px 24px -24px hsl(var(--foreground) / 24%);
 }
 
 .search-prefix {
@@ -231,8 +231,8 @@ const handleDropdownClick = (button) => {
 .header-right {
   flex-shrink: 0;
   flex-wrap: wrap;
-  justify-content: flex-end;
   gap: 12px;
+  justify-content: flex-end;
 }
 
 .header-right :deep(.el-button),
@@ -241,24 +241,24 @@ const handleDropdownClick = (button) => {
   height: 32px;
   min-height: 32px;
   padding-inline: 18px;
-  border-radius: 10px;
   border-color: transparent;
+  border-radius: 10px;
   box-shadow: none;
 }
 
 .header-right :deep(.el-button:not(.el-button--primary)),
 .search-group :deep(.el-button:not(.el-button--primary)) {
   color: hsl(var(--text-strong));
-  background: hsl(var(--surface-contrast-soft) / 0.86);
+  background: hsl(var(--surface-contrast-soft) / 86%);
   border-color: transparent;
   box-shadow:
-    inset 0 1px 0 hsl(var(--glass-border) / 0.34),
-    0 10px 24px -24px hsl(var(--foreground) / 0.2);
+    inset 0 1px 0 hsl(var(--glass-border) / 34%),
+    0 10px 24px -24px hsl(var(--foreground) / 20%);
 }
 
 .header-right :deep(.el-button--primary),
 .search-group :deep(.el-button--primary) {
-  box-shadow: 0 16px 28px -22px hsl(var(--primary) / 0.48);
+  box-shadow: 0 16px 28px -22px hsl(var(--primary) / 48%);
 }
 
 .dropdown-label {
@@ -268,8 +268,8 @@ const handleDropdownClick = (button) => {
 @media (max-width: 768px) {
   .custom-header {
     flex-direction: column;
-    align-items: stretch;
     gap: 12px;
+    align-items: stretch;
   }
 
   .header-right {

easyflow-ui-admin/app/src/components/json/ShowJson.vue

@@ -6,9 +6,10 @@ import { preferences } from '@easyflow/preferences';
 import { ElEmpty } from 'element-plus';
 import { JsonViewer } from 'vue3-json-viewer';
 
-import 'vue3-json-viewer/dist/vue3-json-viewer.css';
 import { getEmptyStateImageUrl } from '#/utils/assets';
 
+import 'vue3-json-viewer/dist/vue3-json-viewer.css';
+
 defineProps({
   value: {
     required: true,

easyflow-ui-admin/app/src/components/page/CardList.vue

@@ -84,14 +84,25 @@ const resolvedPrimaryAction = computed(() => {
   return props.primaryAction;
 });
 
+function resolveActionPlacement(
+  action: ActionButton,
+  index: number,
+): ActionPlacement {
+  if (action.placement) {
+    return action.placement;
+  }
+  if (resolvedPrimaryAction.value) {
+    return 'menu';
+  }
+  return index < 3 ? 'inline' : 'menu';
+}
+
 const resolvedActions = computed<ResolvedActionButton[]>(() => {
   return props.actions
     .filter((action) => hasPermission(action.permission))
     .map((action, index) => ({
       ...action,
-      placement:
-        action.placement ||
-        (resolvedPrimaryAction.value ? 'menu' : index < 3 ? 'inline' : 'menu'),
+      placement: resolveActionPlacement(action, index),
       tone:
         action.tone ||
         (action.className?.includes('danger') ? 'danger' : 'default'),
@@ -111,8 +122,8 @@ const menuActions = computed(() => {
 const showFooter = computed(() => {
   return Boolean(
     resolvedPrimaryAction.value ||
-      inlineActions.value.length ||
-      menuActions.value.length,
+      inlineActions.value.length > 0 ||
+      menuActions.value.length > 0,
   );
 });
 
@@ -132,10 +143,8 @@ function handleActionClick(event: Event, action: ActionButton, item: any) {
       v-for="(item, index) in props.data"
       :key="item.id ?? index"
       shadow="never"
-      :class="[
-        'card-item',
-        { 'card-item--interactive': resolvedPrimaryAction },
-      ]"
+      class="card-item"
+      :class="[{ 'card-item--interactive': resolvedPrimaryAction }]"
       :role="resolvedPrimaryAction ? 'button' : undefined"
       :tabindex="resolvedPrimaryAction ? 0 : undefined"
       @click="handlePrimaryAction(item)"
@@ -201,7 +210,7 @@ function handleActionClick(event: Event, action: ActionButton, item: any) {
           </div>
 
           <div
-            v-if="inlineActions.length || menuActions.length"
+            v-if="inlineActions.length > 0 || menuActions.length > 0"
             class="card-actions"
             @click.stop
           >

easyflow-ui-admin/app/src/components/page/ListPageShell.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
-import type {CSSProperties} from 'vue';
-import {computed, useSlots} from 'vue';
+import type { CSSProperties } from 'vue';
+
+import { computed, useSlots } from 'vue';
 
 interface Props {
   contentPadding?: number | string;
@@ -67,8 +68,8 @@ const contentStyle = computed((): CSSProperties => {
   display: flex;
   flex: 1;
   flex-direction: column;
-  min-height: 0;
   gap: 16px;
+  min-height: 0;
 }
 
 .list-page-shell.is-dense {
@@ -78,9 +79,9 @@ const contentStyle = computed((): CSSProperties => {
 .list-page-shell__toolbar {
   position: relative;
   display: flex;
+  gap: 16px;
   align-items: flex-start;
   justify-content: space-between;
-  gap: 16px;
   padding: 8px 6px 2px;
   background: transparent;
   border: none;
@@ -92,8 +93,8 @@ const contentStyle = computed((): CSSProperties => {
   top: 12px;
   z-index: 5;
   padding: 10px 10px 6px;
-  background: hsl(var(--glass-tint) / 0.7);
-  border: 1px solid hsl(var(--glass-border) / 0.44);
+  background: hsl(var(--glass-tint) / 70%);
+  border: 1px solid hsl(var(--glass-border) / 44%);
   border-radius: 20px;
   box-shadow: var(--shadow-toolbar);
   backdrop-filter: blur(var(--glass-blur)) saturate(155%);
@@ -110,40 +111,41 @@ const contentStyle = computed((): CSSProperties => {
 
 .list-page-shell__content {
   --list-page-shell-content-padding: 0px;
+
+  position: relative;
   display: flex;
   flex: 1;
   flex-direction: column;
   min-height: 0;
-  position: relative;
-  overflow: hidden;
   padding: var(--list-page-shell-content-padding);
+  overflow: hidden;
   background: linear-gradient(
     180deg,
-    hsl(var(--glass-border) / 0.84) 0%,
-    hsl(var(--surface-panel) / 0.94) 28%,
-    hsl(var(--surface-panel) / 0.97) 100%
+    hsl(var(--glass-border) / 84%) 0%,
+    hsl(var(--surface-panel) / 94%) 28%,
+    hsl(var(--surface-panel) / 97%) 100%
   );
-  border: 1px solid hsl(var(--glass-border) / 0.58);
+  border: 1px solid hsl(var(--glass-border) / 58%);
   border-radius: 24px;
   box-shadow:
-    inset 0 1px 0 hsl(var(--glass-border) / 0.72),
-    0 24px 54px -42px hsl(var(--primary) / 0.22),
-    0 18px 42px -34px hsl(var(--foreground) / 0.1);
+    inset 0 1px 0 hsl(var(--glass-border) / 72%),
+    0 24px 54px -42px hsl(var(--primary) / 22%),
+    0 18px 42px -34px hsl(var(--foreground) / 10%);
   backdrop-filter: blur(calc(var(--glass-blur) * 0.7)) saturate(145%);
 }
 
 .list-page-shell.is-subtle .list-page-shell__content {
   background: linear-gradient(
     180deg,
-    hsl(var(--glass-tint) / 0.84) 0%,
-    hsl(var(--surface-contrast-soft) / 0.94) 100%
+    hsl(var(--glass-tint) / 84%) 0%,
+    hsl(var(--surface-contrast-soft) / 94%) 100%
   );
   box-shadow: none;
 }
 
 .list-page-shell.is-plain .list-page-shell__content {
-  background: hsl(var(--surface-panel) / 0.96);
-  border: 1px solid hsl(var(--divider-faint) / 0.58);
+  background: hsl(var(--surface-panel) / 96%);
+  border: 1px solid hsl(var(--divider-faint) / 58%);
   border-radius: 20px;
   box-shadow: none;
   backdrop-filter: none;
@@ -162,14 +164,10 @@ const contentStyle = computed((): CSSProperties => {
   background:
     radial-gradient(
       ellipse 84% 72% at 10% 0%,
-      hsl(var(--nav-ambient) / 0.18) 0%,
+      hsl(var(--nav-ambient) / 18%) 0%,
       transparent 68%
     ),
-    linear-gradient(
-      180deg,
-      hsl(var(--nav-flow-trace) / 0.08) 0%,
-      transparent 78%
-    );
+    linear-gradient(180deg, hsl(var(--nav-flow-trace) / 8%) 0%, transparent 78%);
 }
 
 .list-page-shell__content > * {
@@ -195,6 +193,7 @@ const contentStyle = computed((): CSSProperties => {
   --el-table-border-color: hsl(var(--table-row-border));
   --el-table-current-row-bg-color: hsl(var(--table-row-hover));
   --el-fill-color-blank: transparent;
+
   background: transparent;
 }
 
@@ -216,8 +215,8 @@ const contentStyle = computed((): CSSProperties => {
   font-size: 13px;
   font-weight: 600;
   color: hsl(var(--text-strong));
-  background: hsl(var(--table-header-bg) / 0.86);
-  border-bottom: 1px solid hsl(var(--divider-faint) / 0.38);
+  background: hsl(var(--table-header-bg) / 86%);
+  border-bottom: 1px solid hsl(var(--divider-faint) / 38%);
 }
 
 .list-page-shell__content :deep(.el-table th.el-table__cell:first-child) {
@@ -232,7 +231,7 @@ const contentStyle = computed((): CSSProperties => {
 .list-page-shell__content :deep(.el-table--border .el-table__cell) {
   padding: 14px 0;
   border-right: none;
-  border-bottom: 1px solid hsl(var(--divider-faint) / 0.46);
+  border-bottom: 1px solid hsl(var(--divider-faint) / 46%);
 }
 
 .list-page-shell__content :deep(.el-table__row:hover > td.el-table__cell) {

easyflow-ui-admin/app/src/components/page/PageData.vue

@@ -138,7 +138,7 @@ onMounted(() => {
   flex: 1;
   flex-direction: column;
   min-height: 0;
-  padding: 18px 20px 18px;
+  padding: 18px 20px;
 }
 
 .page-data-container__body {

easyflow-ui-admin/app/src/components/page/PageSide.vue

@@ -114,6 +114,7 @@ const isSvgString = (icon: any) => {
               v-if="item.icon"
               class="ml-[-3px] flex items-center justify-center"
             >
+              <!-- eslint-disable vue/no-v-html -->
               <div
                 v-if="isSvgString(item.icon)"
                 v-html="item.icon"
@@ -127,6 +128,7 @@ const isSvgString = (icon: any) => {
                 }"
                 class="svg-container"
               ></div>
+              <!-- eslint-enable vue/no-v-html -->
               <img
                 v-else-if="
                   typeof item.icon === 'string' && !isComponent(item.icon)

easyflow-ui-admin/app/src/components/page/__tests__/CardList.test.ts

@@ -1,6 +1,7 @@
-import {mount} from '@vue/test-utils';
+import { mount } from '@vue/test-utils';
+
+import { describe, expect, it, vi } from 'vitest';
 
-import {describe, expect, it, vi} from 'vitest';
 import CardList from '../CardList.vue';
 
 const { hasAccessByCodes } = vi.hoisted(() => ({
@@ -13,7 +14,7 @@ vi.mock('@easyflow/access', () => ({
   }),
 }));
 
-describe('CardList', () => {
+describe('cardList', () => {
   function mountCardList(props: Record<string, unknown>) {
     return mount(CardList, {
       props: {

easyflow-ui-admin/app/src/components/tree/Tree.vue

@@ -233,14 +233,14 @@ onMounted(() => {
         v-loading="loading"
         :element-loading-text="loadingText"
       >
-        <template #default="{ node, data }">
+        <template #default="{ node, data: itemData }">
           <span class="tree-node">
             <span class="node-label">{{ $t(node.label) }}</span>
             <span
-              v-if="showCount && data[defaultProps.children]"
+              v-if="showCount && itemData[defaultProps.children]"
               class="node-count"
             >
-              ({{ data[defaultProps.children].length }})
+              ({{ itemData[defaultProps.children].length }})
             </span>
           </span>
         </template>
@@ -278,17 +278,17 @@ onMounted(() => {
 
 .tree-node {
   display: flex;
-  align-items: center;
   gap: 8px;
+  align-items: center;
   min-width: 0;
 }
 
 .node-label {
   overflow: hidden;
-  color: var(--el-text-color-primary);
+  text-overflow: ellipsis;
   font-size: 14px;
   font-weight: 500;
-  text-overflow: ellipsis;
+  color: var(--el-text-color-primary);
   white-space: nowrap;
 }
 
@@ -299,22 +299,22 @@ onMounted(() => {
   min-width: 22px;
   height: 20px;
   padding: 0 6px;
-  color: var(--el-text-color-secondary);
   font-size: 12px;
   line-height: 1;
+  color: var(--el-text-color-secondary);
   background: var(--el-fill-color);
   border-radius: 999px;
 }
 
 :deep(.el-tree) {
-  background: transparent;
   color: inherit;
+  background: transparent;
 }
 
 :deep(.el-tree-node__content) {
   height: 38px;
-  margin-bottom: 4px;
   padding: 0 10px;
+  margin-bottom: 4px;
   border-radius: 10px;
   transition:
     background-color 0.18s ease,

easyflow-ui-admin/app/src/components/upload/DragFileUpload.vue

@@ -9,7 +9,10 @@ import { useAccessStore } from '@easyflow/stores';
 import { UploadFilled } from '@element-plus/icons-vue';
 import { ElIcon, ElMessage, ElUpload } from 'element-plus';
 
-import { normalizeUploadError, resolveUploadPath } from '#/utils/upload-response';
+import {
+  normalizeUploadError,
+  resolveUploadPath,
+} from '#/utils/upload-response';
 
 const props = defineProps({
   action: {

easyflow-ui-admin/app/src/components/upload/Upload.vue

@@ -8,8 +8,11 @@ import { useAccessStore } from '@easyflow/stores';
 
 import { ElButton, ElMessage, ElUpload } from 'element-plus';
 
-import { normalizeUploadError, resolveUploadPath } from '#/utils/upload-response';
 import { $t } from '#/locales';
+import {
+  normalizeUploadError,
+  resolveUploadPath,
+} from '#/utils/upload-response';
 
 const props = defineProps({
   action: {

easyflow-ui-admin/app/src/components/upload/UploadAvatar.vue

@@ -10,7 +10,10 @@ import { Plus } from '@element-plus/icons-vue';
 import { ElIcon, ElImage, ElMessage, ElUpload } from 'element-plus';
 
 import { $t } from '#/locales';
-import { normalizeUploadError, resolveUploadPath } from '#/utils/upload-response';
+import {
+  normalizeUploadError,
+  resolveUploadPath,
+} from '#/utils/upload-response';
 
 const props = defineProps({
   action: {
@@ -134,20 +137,20 @@ const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
 
 <style>
 .avatar-uploader .el-upload {
-  width: var(--avatar-size);
-  height: var(--avatar-size);
+  position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
-  position: relative;
+  width: var(--avatar-size);
+  height: var(--avatar-size);
   overflow: hidden;
   cursor: pointer;
-  border: 1px solid hsl(var(--input) / 0.92);
+  background: hsl(var(--modal-surface-strong) / 92%);
+  border: 1px solid hsl(var(--input) / 92%);
   border-radius: 50%;
-  background: hsl(var(--modal-surface-strong) / 0.92);
   box-shadow:
-    inset 0 1px 0 hsl(0 0% 100% / 0.72),
-    0 16px 28px -24px hsl(var(--foreground) / 0.24);
+    inset 0 1px 0 hsl(0deg 0% 100% / 72%),
+    0 16px 28px -24px hsl(var(--foreground) / 24%);
   transition:
     transform var(--el-transition-duration-fast),
     border-color var(--el-transition-duration-fast),
@@ -155,26 +158,26 @@ const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
 }
 
 .avatar-uploader .el-upload:hover {
-  border-color: hsl(var(--primary) / 0.52);
-  transform: translateY(-1px);
+  border-color: hsl(var(--primary) / 52%);
   box-shadow:
-    inset 0 1px 0 hsl(0 0% 100% / 0.76),
-    0 20px 36px -26px hsl(var(--modal-preview-glow) / 0.3);
+    inset 0 1px 0 hsl(0deg 0% 100% / 76%),
+    0 20px 36px -26px hsl(var(--modal-preview-glow) / 30%);
+  transform: translateY(-1px);
 }
 
 .avatar-uploader--soft-panel .el-upload {
   background:
     radial-gradient(
       circle at top,
-      hsl(var(--modal-preview-glow) / 0.14),
+      hsl(var(--modal-preview-glow) / 14%),
       transparent 60%
     ),
     linear-gradient(
       145deg,
-      hsl(var(--modal-preview-surface) / 0.98),
-      hsl(var(--modal-preview-surface-strong) / 0.9)
+      hsl(var(--modal-preview-surface) / 98%),
+      hsl(var(--modal-preview-surface-strong) / 90%)
     );
-  border-color: hsl(var(--modal-preview-border) / 0.9);
+  border-color: hsl(var(--modal-preview-border) / 90%);
 }
 
 .avatar-uploader--rounded .el-upload {

easyflow-ui-admin/app/src/locales/index.ts

@@ -2,7 +2,10 @@ import type { Language } from 'element-plus/es/locale';
 
 import type { App } from 'vue';
 
-import type { LocaleSetupOptions, SupportedLanguagesType } from '@easyflow/locales';
+import type {
+  LocaleSetupOptions,
+  SupportedLanguagesType,
+} from '@easyflow/locales';
 
 import { ref } from 'vue';
 

easyflow-ui-admin/app/src/locales/langs/en-US/aiResource.json

@@ -1,20 +1,20 @@
 {
-    "id": "Id",
-    "deptId": "DeptId",
-    "tenantId": "TenantId",
-    "resourceType": "ResourceType",
-    "resourceName": "ResourceName",
-    "suffix": "Suffix",
-    "resourceUrl": "ResourceUrl",
-    "origin": "Origin",
-    "status": "Status",
-    "created": "Created",
-    "createdBy": "CreatedBy",
-    "modified": "Modified",
-    "modifiedBy": "ModifiedBy",
-    "options": "Options",
-    "isDeleted": "IsDeleted",
-    "fileSize": "FileSize",
-    "categoryId": "Category",
-    "choose": "Choose"
+  "id": "Id",
+  "deptId": "DeptId",
+  "tenantId": "TenantId",
+  "resourceType": "ResourceType",
+  "resourceName": "ResourceName",
+  "suffix": "Suffix",
+  "resourceUrl": "ResourceUrl",
+  "origin": "Origin",
+  "status": "Status",
+  "created": "Created",
+  "createdBy": "CreatedBy",
+  "modified": "Modified",
+  "modifiedBy": "ModifiedBy",
+  "options": "Options",
+  "isDeleted": "IsDeleted",
+  "fileSize": "FileSize",
+  "categoryId": "Category",
+  "choose": "Choose"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/aiWorkflowCategory.json

@@ -1,10 +1,10 @@
 {
-    "id": "Id",
-    "categoryName": "CategoryName",
-    "sortNo": "SortNo",
-    "created": "Created",
-    "createdBy": "CreatedBy",
-    "modified": "Modified",
-    "modifiedBy": "ModifiedBy",
-    "status": "Status"
-}
+  "id": "Id",
+  "categoryName": "CategoryName",
+  "sortNo": "SortNo",
+  "created": "Created",
+  "createdBy": "CreatedBy",
+  "modified": "Modified",
+  "modifiedBy": "ModifiedBy",
+  "status": "Status"
+}

easyflow-ui-admin/app/src/locales/langs/en-US/aiWorkflowExecRecord.json

@@ -1,25 +1,25 @@
 {
-    "id": "Id",
-    "execKey": "ExecKey",
-    "workflowId": "WorkflowId",
-    "title": "Title",
-    "description": "Description",
-    "input": "Input",
-    "output": "Output",
-    "workflowJson": "WorkflowJson",
-    "startTime": "StartTime",
-    "endTime": "EndTime",
-    "tokens": "Tokens",
-    "status": "Status",
-    "createdKey": "CreatedKey",
-    "createdBy": "CreatedBy",
-    "errorInfo": "ErrorInfo",
-    "moduleName": "ExecuteRecords",
-    "execTime": "TimeConsuming",
-    "status1": "Running",
-    "status5": "Suspend",
-    "status10": "Error",
-    "status20": "Success",
-    "status21": "Failed",
-    "status22": "Cancel"
+  "id": "Id",
+  "execKey": "ExecKey",
+  "workflowId": "WorkflowId",
+  "title": "Title",
+  "description": "Description",
+  "input": "Input",
+  "output": "Output",
+  "workflowJson": "WorkflowJson",
+  "startTime": "StartTime",
+  "endTime": "EndTime",
+  "tokens": "Tokens",
+  "status": "Status",
+  "createdKey": "CreatedKey",
+  "createdBy": "CreatedBy",
+  "errorInfo": "ErrorInfo",
+  "moduleName": "ExecuteRecords",
+  "execTime": "TimeConsuming",
+  "status1": "Running",
+  "status5": "Suspend",
+  "status10": "Error",
+  "status20": "Success",
+  "status21": "Failed",
+  "status22": "Cancel"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/aiWorkflowRecordStep.json

@@ -1,22 +1,22 @@
 {
-    "id": "Id",
-    "recordId": "RecordId",
-    "execKey": "ExecKey",
-    "nodeId": "NodeId",
-    "nodeName": "NodeName",
-    "input": "Input",
-    "output": "Output",
-    "nodeData": "NodeData",
-    "startTime": "StartTime",
-    "endTime": "EndTime",
-    "tokens": "Tokens",
-    "status": "Status",
-    "errorInfo": "ErrorInfo",
-    "moduleName": "Steps",
-    "execTime": "TimeConsuming",
-    "status1": "Running",
-    "status6": "Suspend",
-    "status10": "Error",
-    "status20": "Success",
-    "status21": "Failed"
+  "id": "Id",
+  "recordId": "RecordId",
+  "execKey": "ExecKey",
+  "nodeId": "NodeId",
+  "nodeName": "NodeName",
+  "input": "Input",
+  "output": "Output",
+  "nodeData": "NodeData",
+  "startTime": "StartTime",
+  "endTime": "EndTime",
+  "tokens": "Tokens",
+  "status": "Status",
+  "errorInfo": "ErrorInfo",
+  "moduleName": "Steps",
+  "execTime": "TimeConsuming",
+  "status1": "Running",
+  "status6": "Suspend",
+  "status10": "Error",
+  "status20": "Success",
+  "status21": "Failed"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/datacenterTable.json

@@ -1,33 +1,33 @@
 {
-    "title": "DataCenter",
-    "id": "Id",
-    "deptId": "DeptId",
-    "tenantId": "TenantId",
-    "tableName": "TableName",
-    "tableDesc": "TableDesc",
-    "actualTable": "ActualTable",
-    "status": "Status",
-    "created": "Created",
-    "createdBy": "CreatedBy",
-    "modified": "Modified",
-    "modifiedBy": "ModifiedBy",
-    "options": "Options",
-    "fields": "Fields",
-    "fieldName": "FiledName",
-    "fieldDesc": "Description",
-    "fieldType": "Type",
-    "required": "Required",
-    "noFieldError": "At least one field is required",
-    "fieldInfoError": "Field info is not completed",
-    "nameRegx": "It can only contain lowercase letters, numbers, and underscores, and must start with a lowercase letter",
-    "structure": "TableStructure",
-    "data": "Data",
-    "uploadTitle": "Click to upload",
-    "uploadDesc": "Choose an excel file to upload, file size limit 10MB.",
-    "downloadTemplate": "Download  template",
-    "importComplete": "Import is completed",
-    "totalNum": "Total Count",
-    "successNum": "Success Count",
-    "failNum": "Fail Count",
-    "failList": "Fail List"
+  "title": "DataCenter",
+  "id": "Id",
+  "deptId": "DeptId",
+  "tenantId": "TenantId",
+  "tableName": "TableName",
+  "tableDesc": "TableDesc",
+  "actualTable": "ActualTable",
+  "status": "Status",
+  "created": "Created",
+  "createdBy": "CreatedBy",
+  "modified": "Modified",
+  "modifiedBy": "ModifiedBy",
+  "options": "Options",
+  "fields": "Fields",
+  "fieldName": "FiledName",
+  "fieldDesc": "Description",
+  "fieldType": "Type",
+  "required": "Required",
+  "noFieldError": "At least one field is required",
+  "fieldInfoError": "Field info is not completed",
+  "nameRegx": "It can only contain lowercase letters, numbers, and underscores, and must start with a lowercase letter",
+  "structure": "TableStructure",
+  "data": "Data",
+  "uploadTitle": "Click to upload",
+  "uploadDesc": "Choose an excel file to upload, file size limit 10MB.",
+  "downloadTemplate": "Download  template",
+  "importComplete": "Import is completed",
+  "totalNum": "Total Count",
+  "successNum": "Success Count",
+  "failNum": "Fail Count",
+  "failList": "Fail List"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/datacenterTableFields.json

@@ -1,13 +1,13 @@
 {
-    "id": "Id",
-    "tableId": "TableId",
-    "fieldName": "FieldName",
-    "fieldDesc": "FieldDesc",
-    "fieldType": "FieldType",
-    "required": "Required",
-    "created": "Created",
-    "createdBy": "CreatedBy",
-    "modified": "Modified",
-    "modifiedBy": "ModifiedBy",
-    "options": "Options"
+  "id": "Id",
+  "tableId": "TableId",
+  "fieldName": "FieldName",
+  "fieldDesc": "FieldDesc",
+  "fieldType": "FieldType",
+  "required": "Required",
+  "created": "Created",
+  "createdBy": "CreatedBy",
+  "modified": "Modified",
+  "modifiedBy": "ModifiedBy",
+  "options": "Options"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/sysApiKeyResourcePermission.json

@@ -1,6 +1,6 @@
 {
-    "id": "Id",
-    "requestInterface": "RequestInterface",
-    "title": "Title",
-    "addPermission": "AddRequestInterface"
+  "id": "Id",
+  "requestInterface": "RequestInterface",
+  "title": "Title",
+  "addPermission": "AddRequestInterface"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/sysDept.json

@@ -1,17 +1,17 @@
 {
-    "root": "Root",
-    "id": "Id",
-    "tenantId": "TenantId",
-    "parentId": "Parent",
-    "ancestors": "Ancestors",
-    "deptName": "DeptName",
-    "deptCode": "DeptCode",
-    "sortNo": "SortNo",
-    "status": "Status",
-    "created": "Created",
-    "createdBy": "CreatedBy",
-    "modified": "Modified",
-    "modifiedBy": "ModifiedBy",
-    "remark": "Remark",
-    "isDeleted": "IsDeleted"
+  "root": "Root",
+  "id": "Id",
+  "tenantId": "TenantId",
+  "parentId": "Parent",
+  "ancestors": "Ancestors",
+  "deptName": "DeptName",
+  "deptCode": "DeptCode",
+  "sortNo": "SortNo",
+  "status": "Status",
+  "created": "Created",
+  "createdBy": "CreatedBy",
+  "modified": "Modified",
+  "modifiedBy": "ModifiedBy",
+  "remark": "Remark",
+  "isDeleted": "IsDeleted"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/sysDict.json

@@ -1,12 +1,12 @@
 {
-    "id": "Id",
-    "name": "Name",
-    "code": "Code",
-    "description": "Description",
-    "dictType": "DictType",
-    "sortNo": "SortNo",
-    "status": "Status",
-    "options": "Options",
-    "created": "Created",
-    "modified": "Modified"
+  "id": "Id",
+  "name": "Name",
+  "code": "Code",
+  "description": "Description",
+  "dictType": "DictType",
+  "sortNo": "SortNo",
+  "status": "Status",
+  "options": "Options",
+  "created": "Created",
+  "modified": "Modified"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/sysJob.json

@@ -1,23 +1,23 @@
 {
-    "id": "Id",
-    "deptId": "DeptId",
-    "tenantId": "TenantId",
-    "jobName": "JobName",
-    "jobType": "JobType",
-    "jobParams": "JobParams",
-    "cronExpression": "CronExpression",
-    "allowConcurrent": "AllowConcurrent",
-    "misfirePolicy": "MisfirePolicy",
-    "options": "Options",
-    "status": "Status",
-    "created": "Created",
-    "createdBy": "CreatedBy",
-    "modified": "Modified",
-    "modifiedBy": "ModifiedBy",
-    "remark": "Remark",
-    "isDeleted": "IsDeleted",
-    "workflow": "Workflow",
-    "beanMethod": "BeanMethod",
-    "javaMethod": "JavaMethod",
-    "example": "example"
+  "id": "Id",
+  "deptId": "DeptId",
+  "tenantId": "TenantId",
+  "jobName": "JobName",
+  "jobType": "JobType",
+  "jobParams": "JobParams",
+  "cronExpression": "CronExpression",
+  "allowConcurrent": "AllowConcurrent",
+  "misfirePolicy": "MisfirePolicy",
+  "options": "Options",
+  "status": "Status",
+  "created": "Created",
+  "createdBy": "CreatedBy",
+  "modified": "Modified",
+  "modifiedBy": "ModifiedBy",
+  "remark": "Remark",
+  "isDeleted": "IsDeleted",
+  "workflow": "Workflow",
+  "beanMethod": "BeanMethod",
+  "javaMethod": "JavaMethod",
+  "example": "example"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/sysLog.json

@@ -1,14 +1,14 @@
 {
-    "id": "Id",
-    "accountId": "AccountId",
-    "actionName": "ActionName",
-    "actionType": "ActionType",
-    "actionClass": "ActionClass",
-    "actionMethod": "ActionMethod",
-    "actionUrl": "ActionUrl",
-    "actionIp": "ActionIp",
-    "actionParams": "ActionParams",
-    "actionBody": "ActionBody",
-    "status": "Status",
-    "created": "Created"
+  "id": "Id",
+  "accountId": "AccountId",
+  "actionName": "ActionName",
+  "actionType": "ActionType",
+  "actionClass": "ActionClass",
+  "actionMethod": "ActionMethod",
+  "actionUrl": "ActionUrl",
+  "actionIp": "ActionIp",
+  "actionParams": "ActionParams",
+  "actionBody": "ActionBody",
+  "status": "Status",
+  "created": "Created"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/sysMenu.json

@@ -1,20 +1,20 @@
 {
-"root":"Top",
-"id": "Id",
-"parentId": "Parent",
-"menuType": "MenuType",
-"menuTitle": "MenuTitle",
-"menuUrl": "MenuUrl",
-"component": "Component",
-"menuIcon": "MenuIcon",
-"isShow": "IsShow",
-"permissionTag": "PermissionTag",
-"sortNo": "SortNo",
-"status": "Status",
-"created": "Created",
-"createdBy": "CreatedBy",
-"modified": "Modified",
-"modifiedBy": "ModifiedBy",
-"remark": "Remark",
-"isDeleted": "IsDeleted"
+  "root": "Top",
+  "id": "Id",
+  "parentId": "Parent",
+  "menuType": "MenuType",
+  "menuTitle": "MenuTitle",
+  "menuUrl": "MenuUrl",
+  "component": "Component",
+  "menuIcon": "MenuIcon",
+  "isShow": "IsShow",
+  "permissionTag": "PermissionTag",
+  "sortNo": "SortNo",
+  "status": "Status",
+  "created": "Created",
+  "createdBy": "CreatedBy",
+  "modified": "Modified",
+  "modifiedBy": "ModifiedBy",
+  "remark": "Remark",
+  "isDeleted": "IsDeleted"
 }

easyflow-ui-admin/app/src/locales/langs/en-US/sysRole.json

@@ -1,22 +1,22 @@
 {
-    "id": "Id",
-    "tenantId": "TenantId",
-    "roleName": "RoleName",
-    "roleKey": "RoleKey",
-    "status": "Status",
-    "created": "Created",
-    "createdBy": "CreatedBy",
-    "modified": "Modified",
-    "modifiedBy": "ModifiedBy",
-    "remark": "Remark",
-    "isDeleted": "IsDeleted",
-    "menuPermission": "MenuPermission",
-    "dataPermission": "DataPermission",
-    "categoryPermission": "CategoryPermission",
-    "categoryPermissionHint": "Deny by default. Applies to resource visibility and selectors/binders only.",
-    "categoryScopeAll": "AllCategories",
-    "categoryScopeCustom": "CustomCategories",
-    "categoryScopePlaceholder": "Select categories",
-    "checkStrictlyTrue": "Linked",
-    "checkStrictlyFalse": "NotLinked"
+  "id": "Id",
+  "tenantId": "TenantId",
+  "roleName": "RoleName",
+  "roleKey": "RoleKey",
+  "status": "Status",
+  "created": "Created",
+  "createdBy": "CreatedBy",
+  "modified": "Modified",
+  "modifiedBy": "ModifiedBy",
+  "remark": "Remark",
+  "isDeleted": "IsDeleted",
+  "menuPermission": "MenuPermission",
+  "dataPermission": "DataPermission",
+  "categoryPermission": "CategoryPermission",
+  "categoryPermissionHint": "Deny by default. Applies to resource visibility and selectors/binders only.",
+  "categoryScopeAll": "AllCategories",
+  "categoryScopeCustom": "CustomCategories",
+  "categoryScopePlaceholder": "Select categories",
+  "checkStrictlyTrue": "Linked",
+  "checkStrictlyFalse": "NotLinked"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/aiResource.json

@@ -1,20 +1,20 @@
 {
-    "id": "主键",
-    "deptId": "部门ID",
-    "tenantId": "租户ID",
-    "resourceType": "素材类型",
-    "resourceName": "素材名称",
-    "suffix": "后缀",
-    "resourceUrl": "素材地址",
-    "origin": "素材来源",
-    "status": "数据状态",
-    "created": "创建时间",
-    "createdBy": "创建者",
-    "modified": "修改时间",
-    "modifiedBy": "修改者",
-    "options": "扩展项",
-    "isDeleted": "删除标识",
-    "fileSize": "文件大小",
-    "categoryId": "分类",
-    "choose": "选择素材"
+  "id": "主键",
+  "deptId": "部门ID",
+  "tenantId": "租户ID",
+  "resourceType": "素材类型",
+  "resourceName": "素材名称",
+  "suffix": "后缀",
+  "resourceUrl": "素材地址",
+  "origin": "素材来源",
+  "status": "数据状态",
+  "created": "创建时间",
+  "createdBy": "创建者",
+  "modified": "修改时间",
+  "modifiedBy": "修改者",
+  "options": "扩展项",
+  "isDeleted": "删除标识",
+  "fileSize": "文件大小",
+  "categoryId": "分类",
+  "choose": "选择素材"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/aiWorkflowCategory.json

@@ -1,10 +1,10 @@
 {
-    "id": "主键",
-    "categoryName": "分类名称",
-    "sortNo": "排序",
-    "created": "创建时间",
-    "createdBy": "创建者",
-    "modified": "修改时间",
-    "modifiedBy": "修改者",
-    "status": "数据状态"
-}
+  "id": "主键",
+  "categoryName": "分类名称",
+  "sortNo": "排序",
+  "created": "创建时间",
+  "createdBy": "创建者",
+  "modified": "修改时间",
+  "modifiedBy": "修改者",
+  "status": "数据状态"
+}

easyflow-ui-admin/app/src/locales/langs/zh-CN/aiWorkflowExecRecord.json

@@ -1,25 +1,25 @@
 {
-    "id": "主键",
-    "execKey": "执行标识",
-    "workflowId": "工作流ID",
-    "title": "标题",
-    "description": "描述",
-    "input": "输入",
-    "output": "输出",
-    "workflowJson": "工作流执行时的配置",
-    "startTime": "开始时间",
-    "endTime": "结束时间",
-    "tokens": "消耗总token",
-    "status": "状态",
-    "createdKey": "执行人标识[有可能是用户|外部|定时任务等情况]",
-    "createdBy": "执行人",
-    "errorInfo": "错误信息",
-    "moduleName": "执行记录",
-    "execTime": "耗时",
-    "status1": "运行中",
-    "status5": "挂起",
-    "status10": "错误",
-    "status20": "成功",
-    "status21": "失败",
-    "status22": "取消"
+  "id": "主键",
+  "execKey": "执行标识",
+  "workflowId": "工作流ID",
+  "title": "标题",
+  "description": "描述",
+  "input": "输入",
+  "output": "输出",
+  "workflowJson": "工作流执行时的配置",
+  "startTime": "开始时间",
+  "endTime": "结束时间",
+  "tokens": "消耗总token",
+  "status": "状态",
+  "createdKey": "执行人标识[有可能是用户|外部|定时任务等情况]",
+  "createdBy": "执行人",
+  "errorInfo": "错误信息",
+  "moduleName": "执行记录",
+  "execTime": "耗时",
+  "status1": "运行中",
+  "status5": "挂起",
+  "status10": "错误",
+  "status20": "成功",
+  "status21": "失败",
+  "status22": "取消"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/aiWorkflowRecordStep.json

@@ -1,22 +1,22 @@
 {
-    "id": "主键",
-    "recordId": "执行记录ID",
-    "execKey": "执行标识",
-    "nodeId": "节点ID",
-    "nodeName": "节点名称",
-    "input": "输入",
-    "output": "输出",
-    "nodeData": "节点信息",
-    "startTime": "开始时间",
-    "endTime": "结束时间",
-    "tokens": "消耗总token",
-    "status": "状态",
-    "errorInfo": "错误信息",
-    "moduleName": "步骤信息",
-    "execTime": "耗时",
-    "status1": "运行中",
-    "status6": "挂起",
-    "status10": "错误",
-    "status20": "成功",
-    "status21": "失败"
+  "id": "主键",
+  "recordId": "执行记录ID",
+  "execKey": "执行标识",
+  "nodeId": "节点ID",
+  "nodeName": "节点名称",
+  "input": "输入",
+  "output": "输出",
+  "nodeData": "节点信息",
+  "startTime": "开始时间",
+  "endTime": "结束时间",
+  "tokens": "消耗总token",
+  "status": "状态",
+  "errorInfo": "错误信息",
+  "moduleName": "步骤信息",
+  "execTime": "耗时",
+  "status1": "运行中",
+  "status6": "挂起",
+  "status10": "错误",
+  "status20": "成功",
+  "status21": "失败"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/datacenterTable.json

@@ -1,33 +1,33 @@
 {
-    "title": "数据中枢",
-    "id": "主键",
-    "deptId": "部门ID",
-    "tenantId": "租户ID",
-    "tableName": "数据表名",
-    "tableDesc": "数据表描述",
-    "actualTable": "物理表名",
-    "status": "数据状态",
-    "created": "创建时间",
-    "createdBy": "创建者",
-    "modified": "修改时间",
-    "modifiedBy": "修改者",
-    "options": "扩展项",
-    "fields": "字段",
-    "fieldName": "字段名",
-    "fieldDesc": "字段描述",
-    "fieldType": "字段类型",
-    "required": "是否必填",
-    "noFieldError": "至少包含一个字段",
-    "fieldInfoError": "字段信息不完善",
-    "nameRegx": "只能包含小写字母、数字和下划线，且必须以小写字母开头",
-    "structure": "表结构",
-    "data": "数据",
-    "uploadTitle": "点击或将文件拖拽到这里上传",
-    "uploadDesc": "上传一份Excel文档，文件大小限制10MB以内。",
-    "downloadTemplate": "下载模板",
-    "importComplete": "导入完成",
-    "totalNum": "总数",
-    "successNum": "成功数",
-    "failNum": "失败数",
-    "failList": "失败记录"
+  "title": "数据中枢",
+  "id": "主键",
+  "deptId": "部门ID",
+  "tenantId": "租户ID",
+  "tableName": "数据表名",
+  "tableDesc": "数据表描述",
+  "actualTable": "物理表名",
+  "status": "数据状态",
+  "created": "创建时间",
+  "createdBy": "创建者",
+  "modified": "修改时间",
+  "modifiedBy": "修改者",
+  "options": "扩展项",
+  "fields": "字段",
+  "fieldName": "字段名",
+  "fieldDesc": "字段描述",
+  "fieldType": "字段类型",
+  "required": "是否必填",
+  "noFieldError": "至少包含一个字段",
+  "fieldInfoError": "字段信息不完善",
+  "nameRegx": "只能包含小写字母、数字和下划线，且必须以小写字母开头",
+  "structure": "表结构",
+  "data": "数据",
+  "uploadTitle": "点击或将文件拖拽到这里上传",
+  "uploadDesc": "上传一份Excel文档，文件大小限制10MB以内。",
+  "downloadTemplate": "下载模板",
+  "importComplete": "导入完成",
+  "totalNum": "总数",
+  "successNum": "成功数",
+  "failNum": "失败数",
+  "failList": "失败记录"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/datacenterTableFields.json

@@ -1,13 +1,13 @@
 {
-    "id": "主键",
-    "tableId": "数据表ID",
-    "fieldName": "字段名称",
-    "fieldDesc": "字段描述",
-    "fieldType": "字段类型",
-    "required": "是否必填",
-    "created": "创建时间",
-    "createdBy": "创建者",
-    "modified": "修改时间",
-    "modifiedBy": "修改者",
-    "options": "扩展项"
+  "id": "主键",
+  "tableId": "数据表ID",
+  "fieldName": "字段名称",
+  "fieldDesc": "字段描述",
+  "fieldType": "字段类型",
+  "required": "是否必填",
+  "created": "创建时间",
+  "createdBy": "创建者",
+  "modified": "修改时间",
+  "modifiedBy": "修改者",
+  "options": "扩展项"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/sysDept.json

@@ -1,17 +1,17 @@
 {
-    "root": "根部门",
-    "id": "主键",
-    "tenantId": "租户ID",
-    "parentId": "父级",
-    "ancestors": "父级部门ID集合",
-    "deptName": "部门名称",
-    "deptCode": "部门编码",
-    "sortNo": "排序",
-    "status": "数据状态",
-    "created": "创建时间",
-    "createdBy": "创建者",
-    "modified": "修改时间",
-    "modifiedBy": "修改者",
-    "remark": "备注",
-    "isDeleted": "删除标识"
+  "root": "根部门",
+  "id": "主键",
+  "tenantId": "租户ID",
+  "parentId": "父级",
+  "ancestors": "父级部门ID集合",
+  "deptName": "部门名称",
+  "deptCode": "部门编码",
+  "sortNo": "排序",
+  "status": "数据状态",
+  "created": "创建时间",
+  "createdBy": "创建者",
+  "modified": "修改时间",
+  "modifiedBy": "修改者",
+  "remark": "备注",
+  "isDeleted": "删除标识"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/sysDict.json

@@ -1,12 +1,12 @@
 {
-    "id": "主键",
-    "name": "数据字典名称",
-    "code": "字典编码",
-    "description": "字典描述或备注",
-    "dictType": "字典类型 1 自定义字典、2 数据表字典、 3 枚举类字典、 4 系统字典（自定义 DictLoader）",
-    "sortNo": "排序编号",
-    "status": "是否启用",
-    "options": "扩展字典  存放 json",
-    "created": "创建时间",
-    "modified": "修改时间"
+  "id": "主键",
+  "name": "数据字典名称",
+  "code": "字典编码",
+  "description": "字典描述或备注",
+  "dictType": "字典类型 1 自定义字典、2 数据表字典、 3 枚举类字典、 4 系统字典（自定义 DictLoader）",
+  "sortNo": "排序编号",
+  "status": "是否启用",
+  "options": "扩展字典  存放 json",
+  "created": "创建时间",
+  "modified": "修改时间"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/sysJob.json

@@ -1,23 +1,23 @@
 {
-    "id": "主键",
-    "deptId": "部门ID",
-    "tenantId": "租户ID",
-    "jobName": "任务名称",
-    "jobType": "任务类型",
-    "jobParams": "任务参数",
-    "cronExpression": "cron表达式",
-    "allowConcurrent": "是否并发执行",
-    "misfirePolicy": "错过策略",
-    "options": "其他配置",
-    "status": "任务状态",
-    "created": "创建时间",
-    "createdBy": "创建者",
-    "modified": "修改时间",
-    "modifiedBy": "修改者",
-    "remark": "备注",
-    "isDeleted": "删除标识",
-    "workflow": "工作流",
-    "beanMethod": "bean方法",
-    "javaMethod": "java方法",
-    "example": "示例"
+  "id": "主键",
+  "deptId": "部门ID",
+  "tenantId": "租户ID",
+  "jobName": "任务名称",
+  "jobType": "任务类型",
+  "jobParams": "任务参数",
+  "cronExpression": "cron表达式",
+  "allowConcurrent": "是否并发执行",
+  "misfirePolicy": "错过策略",
+  "options": "其他配置",
+  "status": "任务状态",
+  "created": "创建时间",
+  "createdBy": "创建者",
+  "modified": "修改时间",
+  "modifiedBy": "修改者",
+  "remark": "备注",
+  "isDeleted": "删除标识",
+  "workflow": "工作流",
+  "beanMethod": "bean方法",
+  "javaMethod": "java方法",
+  "example": "示例"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/sysLog.json

@@ -1,14 +1,14 @@
 {
-    "id": "ID",
-    "accountId": "操作人",
-    "actionName": "操作名称",
-    "actionType": "操作的类型",
-    "actionClass": "操作涉及的类",
-    "actionMethod": "操作涉及的方法",
-    "actionUrl": "操作涉及的 URL 地址",
-    "actionIp": "操作涉及的用户 IP 地址",
-    "actionParams": "操作请求参数",
-    "actionBody": "操作请求body",
-    "status": "操作状态 1 成功 9 失败",
-    "created": "操作时间"
+  "id": "ID",
+  "accountId": "操作人",
+  "actionName": "操作名称",
+  "actionType": "操作的类型",
+  "actionClass": "操作涉及的类",
+  "actionMethod": "操作涉及的方法",
+  "actionUrl": "操作涉及的 URL 地址",
+  "actionIp": "操作涉及的用户 IP 地址",
+  "actionParams": "操作请求参数",
+  "actionBody": "操作请求body",
+  "status": "操作状态 1 成功 9 失败",
+  "created": "操作时间"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/sysMenu.json

@@ -1,20 +1,20 @@
 {
-"root":"顶级",
-"id": "主键",
-"parentId": "父菜单",
-"menuType": "菜单类型",
-"menuTitle": "菜单标题",
-"menuUrl": "菜单url",
-"component": "组件路径",
-"menuIcon": "图标",
-"isShow": "是否显示",
-"permissionTag": "权限标识",
-"sortNo": "排序",
-"status": "数据状态",
-"created": "创建时间",
-"createdBy": "创建者",
-"modified": "修改时间",
-"modifiedBy": "修改者",
-"remark": "备注",
-"isDeleted": "删除标识"
+  "root": "顶级",
+  "id": "主键",
+  "parentId": "父菜单",
+  "menuType": "菜单类型",
+  "menuTitle": "菜单标题",
+  "menuUrl": "菜单url",
+  "component": "组件路径",
+  "menuIcon": "图标",
+  "isShow": "是否显示",
+  "permissionTag": "权限标识",
+  "sortNo": "排序",
+  "status": "数据状态",
+  "created": "创建时间",
+  "createdBy": "创建者",
+  "modified": "修改时间",
+  "modifiedBy": "修改者",
+  "remark": "备注",
+  "isDeleted": "删除标识"
 }

easyflow-ui-admin/app/src/locales/langs/zh-CN/sysRole.json

@@ -1,22 +1,22 @@
 {
-    "id": "主键",
-    "tenantId": "租户ID",
-    "roleName": "角色名称",
-    "roleKey": "角色标识",
-    "status": "是否启用",
-    "created": "创建时间",
-    "createdBy": "创建者",
-    "modified": "修改时间",
-    "modifiedBy": "修改者",
-    "remark": "备注",
-    "isDeleted": "删除标识",
-    "menuPermission": "菜单权限",
-    "dataPermission": "数据权限",
-    "categoryPermission": "分类权限",
-    "categoryPermissionHint": "未配置即拒绝，仅控制资源可见性与选择器/绑定器。",
-    "categoryScopeAll": "全部分类",
-    "categoryScopeCustom": "自定义分类",
-    "categoryScopePlaceholder": "请选择分类",
-    "checkStrictlyTrue": "联动",
-    "checkStrictlyFalse": "不联动"
+  "id": "主键",
+  "tenantId": "租户ID",
+  "roleName": "角色名称",
+  "roleKey": "角色标识",
+  "status": "是否启用",
+  "created": "创建时间",
+  "createdBy": "创建者",
+  "modified": "修改时间",
+  "modifiedBy": "修改者",
+  "remark": "备注",
+  "isDeleted": "删除标识",
+  "menuPermission": "菜单权限",
+  "dataPermission": "数据权限",
+  "categoryPermission": "分类权限",
+  "categoryPermissionHint": "未配置即拒绝，仅控制资源可见性与选择器/绑定器。",
+  "categoryScopeAll": "全部分类",
+  "categoryScopeCustom": "自定义分类",
+  "categoryScopePlaceholder": "请选择分类",
+  "checkStrictlyTrue": "联动",
+  "checkStrictlyFalse": "不联动"
 }

easyflow-ui-admin/app/src/main.ts

@@ -1,4 +1,8 @@
-import { initPreferences, preferences, updatePreferences } from '@easyflow/preferences';
+import {
+  initPreferences,
+  preferences,
+  updatePreferences,
+} from '@easyflow/preferences';
 import { unmountGlobalLoading } from '@easyflow/utils';
 
 import {

easyflow-ui-admin/app/src/router/guard.ts

@@ -7,6 +7,12 @@ import { startProgress, stopProgress } from '@easyflow/utils';
 
 import { accessRoutes, coreRouteNames } from '#/router/routes';
 import { useAuthStore } from '#/store';
+import {
+  buildForcePasswordRoute,
+  isForcePasswordRoute,
+  notifyForcePasswordChange,
+  shouldForcePasswordChange,
+} from '#/utils/password-reset';
 
 import { generateAccess } from './access';
 import {
@@ -14,12 +20,6 @@ import {
   removeDevLoginQuery,
   shouldAttemptDevLogin,
 } from './dev-login';
-import {
-  buildForcePasswordRoute,
-  isForcePasswordRoute,
-  notifyForcePasswordChange,
-  shouldForcePasswordChange,
-} from '#/utils/password-reset';
 
 interface NetworkConnectionLike {
   effectiveType?: string;
@@ -189,7 +189,8 @@ function setupAccessGuard(router: Router) {
     // 基本路由，这些路由不需要进入权限拦截
     if (coreRouteNames.includes(to.name as string)) {
       if (to.path === LOGIN_PATH && accessStore.accessToken) {
-        const currentUser = userStore.userInfo || (await authStore.fetchUserInfo());
+        const currentUser =
+          userStore.userInfo || (await authStore.fetchUserInfo());
         if (shouldForcePasswordChange(currentUser)) {
           return buildForcePasswordRoute();
         }

easyflow-ui-admin/app/src/router/routes/core.ts

@@ -1,9 +1,9 @@
-import type {RouteRecordRaw} from 'vue-router';
+import type { RouteRecordRaw } from 'vue-router';
 
-import {LOGIN_PATH} from '@easyflow/constants';
-import {preferences} from '@easyflow/preferences';
+import { LOGIN_PATH } from '@easyflow/constants';
+import { preferences } from '@easyflow/preferences';
 
-import {$t} from '#/locales';
+import { $t } from '#/locales';
 
 const BasicLayout = () => import('#/layouts/basic.vue');
 const AuthPageLayout = () => import('#/layouts/auth.vue');

easyflow-ui-admin/app/src/router/routes/modules/demos.ts

@@ -50,3 +50,5 @@
 // ];
 //
 // export default routes;
+
+export {};

easyflow-ui-admin/app/src/store/auth.ts

@@ -95,7 +95,8 @@ export const useAuthStore = defineStore('auth', () => {
   ) {
     try {
       loginLoading.value = true;
-      const { forceChangePassword, token: accessToken } = await loginApi(params);
+      const { forceChangePassword, token: accessToken } =
+        await loginApi(params);
 
       if (accessToken) {
         return await finalizeLogin(accessToken, forceChangePassword, {

easyflow-ui-admin/app/src/types/tinyflow-ai-vue.d.ts

@@ -1,5 +1,9 @@
 declare module '@tinyflow-ai/vue' {
   import type { DefineComponent } from 'vue';
 
-  export const Tinyflow: DefineComponent<Record<string, any>, Record<string, any>, any>;
+  export const Tinyflow: DefineComponent<
+    Record<string, any>,
+    Record<string, any>,
+    any
+  >;
 }

easyflow-ui-admin/app/src/types/vue-element-plus-x.d.ts

@@ -1,6 +1,10 @@
 declare module 'vue-element-plus-x/es/*/index.js' {
   import type { DefineComponent } from 'vue';
 
-  const component: DefineComponent<Record<string, any>, Record<string, any>, any>;
+  const component: DefineComponent<
+    Record<string, any>,
+    Record<string, any>,
+    any
+  >;
   export default component;
 }

easyflow-ui-admin/app/src/types/wangeditor.d.ts

@@ -1,5 +1,5 @@
 declare module '@wangeditor/editor-for-vue' {
-  import type {DefineComponent} from 'vue';
+  import type { DefineComponent } from 'vue';
 
   export const Editor: DefineComponent<any, any, any>;
   export const Toolbar: DefineComponent<any, any, any>;

easyflow-ui-admin/app/src/utils/password-reset.ts

@@ -19,7 +19,10 @@ export function buildForcePasswordRoute() {
 }
 
 export function isForcePasswordRoute(
-  route: Pick<{ name?: string | symbol | null; query?: Record<string, any> }, 'name' | 'query'>,
+  route: Pick<
+    { name?: null | string | symbol; query?: Record<string, any> },
+    'name' | 'query'
+  >,
 ) {
   return route.name === 'Profile' && route.query?.tab === 'password';
 }

easyflow-ui-admin/app/src/views/_core/authentication/login.vue

@@ -1,11 +1,13 @@
 <script lang="ts" setup>
-import type {EasyFlowFormSchema} from '@easyflow/common-ui';
-import {AuthenticationLogin, z} from '@easyflow/common-ui';
+import type { EasyFlowFormSchema } from '@easyflow/common-ui';
 
-import {computed, onMounted} from 'vue';
-import {useAppConfig} from '@easyflow/hooks';
-import {$t} from '@easyflow/locales';
-import {useAuthStore} from '#/store';
+import { computed, onMounted } from 'vue';
+
+import { AuthenticationLogin, z } from '@easyflow/common-ui';
+import { useAppConfig } from '@easyflow/hooks';
+import { $t } from '@easyflow/locales';
+
+import { useAuthStore } from '#/store';
 
 defineOptions({ name: 'Login' });
 onMounted(() => {});
@@ -109,10 +111,10 @@ function onSubmit(values: any) {
 }
 
 .captcha-anchor {
-  inset: 0;
-  pointer-events: none;
   position: absolute;
+  inset: 0;
   z-index: 30;
+  pointer-events: none;
 }
 
 .captcha-anchor:empty {

easyflow-ui-admin/app/src/views/_core/profile/index.vue

@@ -18,7 +18,9 @@ const userStore = useUserStore();
 const tabsValue = ref<string>('basic');
 
 const forcePasswordChange = computed(() => {
-  return !!userStore.userInfo?.passwordResetRequired || route.query.force === '1';
+  return (
+    !!userStore.userInfo?.passwordResetRequired || route.query.force === '1'
+  );
 });
 
 const tabs = computed(() => {
@@ -43,7 +45,11 @@ const tabs = computed(() => {
 });
 
 watch(
-  () => [route.query.force, route.query.tab, userStore.userInfo?.passwordResetRequired],
+  () => [
+    route.query.force,
+    route.query.tab,
+    userStore.userInfo?.passwordResetRequired,
+  ],
   () => {
     if (forcePasswordChange.value) {
       tabsValue.value = 'password';

easyflow-ui-admin/app/src/views/_core/profile/password-setting.vue

@@ -22,7 +22,9 @@ const router = useRouter();
 const userStore = useUserStore();
 
 const isForcedPasswordChange = computed(() => {
-  return !!userStore.userInfo?.passwordResetRequired || route.query.force === '1';
+  return (
+    !!userStore.userInfo?.passwordResetRequired || route.query.force === '1'
+  );
 });
 
 const formSchema = computed((): EasyFlowFormSchema[] => {
@@ -49,7 +51,9 @@ const formSchema = computed((): EasyFlowFormSchema[] => {
         };
       },
       rules: z
-        .string({ required_error: $t('sysAccount.newPwd') + $t('common.isRequired') })
+        .string({
+          required_error: $t('sysAccount.newPwd') + $t('common.isRequired'),
+        })
         .min(1, { message: $t('sysAccount.newPwd') + $t('common.isRequired') })
         .refine((value) => isStrongPassword(value), {
           message: $t('sysAccount.passwordStrongTip'),

easyflow-ui-admin/app/src/views/ai/bots/modal.vue

@@ -210,11 +210,11 @@ defineExpose({
 }
 
 .bot-modal-section {
-  border-radius: 14px;
-  border: 1px solid hsl(var(--modal-divider));
-  background: hsl(var(--modal-content-surface-strong));
-  box-shadow: none;
   padding: 14px;
+  background: hsl(var(--modal-content-surface-strong));
+  border: 1px solid hsl(var(--modal-divider));
+  border-radius: 14px;
+  box-shadow: none;
 }
 
 .bot-modal-section--compact {
@@ -227,17 +227,17 @@ defineExpose({
 
 .bot-modal-section__title {
   margin: 0;
-  color: hsl(var(--text-strong));
   font-size: 14px;
   font-weight: 700;
   line-height: 1.4;
+  color: hsl(var(--text-strong));
 }
 
 .bot-modal-section__description {
   margin: 3px 0 0;
-  color: hsl(var(--text-muted));
   font-size: 11px;
   line-height: 1.45;
+  color: hsl(var(--text-muted));
 }
 
 .bot-modal-appearance-grid {
@@ -279,9 +279,9 @@ defineExpose({
 
 .bot-modal-field-tip {
   margin-top: 4px;
-  color: hsl(var(--text-muted));
   font-size: 11px;
   line-height: 1.5;
+  color: hsl(var(--text-muted));
 }
 
 .bot-modal-form :deep(.el-form-item) {
@@ -290,18 +290,18 @@ defineExpose({
 
 .bot-modal-form :deep(.el-form-item__label) {
   padding-bottom: 6px;
-  color: hsl(var(--text-strong));
   font-size: 12px;
   font-weight: 600;
   line-height: 1.4;
+  color: hsl(var(--text-strong));
 }
 
 .bot-modal-form :deep(.el-input__wrapper),
 .bot-modal-form :deep(.el-select__wrapper),
 .bot-modal-form :deep(.el-textarea__inner) {
-  border-radius: 12px;
   background: hsl(var(--input-background));
-  box-shadow: inset 0 0 0 1px hsl(var(--input) / 0.92);
+  border-radius: 12px;
+  box-shadow: inset 0 0 0 1px hsl(var(--input) / 92%);
   transition:
     box-shadow 0.2s ease,
     transform 0.2s ease,
@@ -316,15 +316,15 @@ defineExpose({
 .bot-modal-form :deep(.el-input__wrapper:hover),
 .bot-modal-form :deep(.el-select__wrapper:hover),
 .bot-modal-form :deep(.el-textarea__inner:hover) {
-  box-shadow: inset 0 0 0 1px hsl(var(--primary) / 0.18);
+  box-shadow: inset 0 0 0 1px hsl(var(--primary) / 18%);
 }
 
 .bot-modal-form :deep(.el-input__wrapper.is-focus),
 .bot-modal-form :deep(.el-select__wrapper.is-focused),
 .bot-modal-form :deep(.el-textarea__inner:focus) {
   box-shadow:
-    inset 0 0 0 1px hsl(var(--primary) / 0.72),
-    0 0 0 4px hsl(var(--primary) / 0.12);
+    inset 0 0 0 1px hsl(var(--primary) / 72%),
+    0 0 0 4px hsl(var(--primary) / 12%);
 }
 
 .bot-modal-form :deep(.el-textarea__inner) {
@@ -336,8 +336,8 @@ defineExpose({
 .bot-modal-form :deep(.el-form-item.is-error .el-select__wrapper),
 .bot-modal-form :deep(.el-form-item.is-error .el-textarea__inner) {
   box-shadow:
-    inset 0 0 0 1px hsl(var(--destructive) / 0.8),
-    0 0 0 4px hsl(var(--destructive) / 0.08);
+    inset 0 0 0 1px hsl(var(--destructive) / 80%),
+    0 0 0 4px hsl(var(--destructive) / 8%);
 }
 
 @media (max-width: 768px) {

easyflow-ui-admin/app/src/views/ai/bots/pages/Run.vue

@@ -2,8 +2,8 @@
 import type { BotInfo, Session } from '@easyflow/types';
 
 import { onMounted, ref, watchEffect } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
 import ElConversations from 'vue-element-plus-x/es/Conversations/index.js';
+import { useRoute, useRouter } from 'vue-router';
 
 import { IconifyIcon } from '@easyflow/icons';
 import { preferences } from '@easyflow/preferences';

easyflow-ui-admin/app/src/views/ai/bots/pages/setting/config.vue

@@ -1466,10 +1466,12 @@ const handleBasicInfoChange = async (
                 </label>
                 <div class="publish-external-code-preview">
                   <div class="publish-external-code-topbar">HTML</div>
+                  <!-- eslint-disable vue/no-v-html -->
                   <pre class="publish-external-code-block"><code
                     class="hljs language-xml"
                     v-html="iframeCodeHighlighted"
                   ></code></pre>
+                  <!-- eslint-enable vue/no-v-html -->
                 </div>
                 <div class="publish-external-actions">
                   <ElButton

easyflow-ui-admin/app/src/views/ai/bots/pages/setting/index.vue

@@ -1,13 +1,13 @@
 <script setup lang="ts">
-import type {BotInfo} from '@easyflow/types';
+import type { BotInfo } from '@easyflow/types';
 
-import {computed, onMounted, ref} from 'vue';
-import {useRoute, useRouter} from 'vue-router';
+import { computed, onMounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
 
-import {tryit} from 'radash';
+import { tryit } from 'radash';
 
-import {getBotDetails} from '#/api';
-import {hasPermission} from '#/api/common/hasPermission';
+import { getBotDetails } from '#/api';
+import { hasPermission } from '#/api/common/hasPermission';
 
 import Config from './config.vue';
 import Preview from './preview.vue';
@@ -77,14 +77,16 @@ const fetchBotDetail = async (id: string) => {
   height: calc(100vh - 90px);
   padding: 20px;
 }
+
 .row-container {
-  height: 100%;
   display: flex;
   gap: 20px;
-}
-.row-item {
   height: 100%;
+}
+
+.row-item {
   flex: 1;
   min-width: 0;
+  height: 100%;
 }
 </style>

easyflow-ui-admin/app/src/views/ai/chatHistory/index.vue

@@ -442,8 +442,8 @@ function closeDetail() {
 .chat-history-page__filters {
   display: flex;
   flex-wrap: wrap;
-  align-items: center;
   gap: 12px;
+  align-items: center;
 }
 
 .chat-history-page__filter-control {
@@ -471,26 +471,26 @@ function closeDetail() {
 
 .chat-history-page__content {
   display: flex;
-  min-height: 0;
   flex: 1;
   flex-direction: column;
+  min-height: 0;
 }
 
 .chat-history-page__table-shell {
-  min-height: 0;
   flex: 1;
+  min-height: 0;
   overflow: hidden;
-  border: 1px solid hsl(var(--glass-border) / 0.42);
-  border-radius: 24px;
   background: linear-gradient(
     180deg,
-    hsl(var(--glass-border) / 0.28) 0%,
-    hsl(var(--glass-tint) / 0.4) 14%,
-    hsl(var(--surface-panel) / 0.94) 100%
+    hsl(var(--glass-border) / 28%) 0%,
+    hsl(var(--glass-tint) / 40%) 14%,
+    hsl(var(--surface-panel) / 94%) 100%
   );
+  border: 1px solid hsl(var(--glass-border) / 42%);
+  border-radius: 24px;
   box-shadow:
-    inset 0 1px 0 hsl(var(--glass-border) / 0.54),
-    0 24px 42px -36px hsl(var(--foreground) / 0.16);
+    inset 0 1px 0 hsl(var(--glass-border) / 54%),
+    0 24px 42px -36px hsl(var(--foreground) / 16%);
 }
 
 .chat-history-page__table {
@@ -500,30 +500,30 @@ function closeDetail() {
 
 .chat-history-page__session-cell {
   display: flex;
-  min-width: 0;
   flex-direction: column;
   gap: 6px;
+  min-width: 0;
   padding: 2px 0;
 }
 
 .chat-history-page__session-title {
   overflow: hidden;
+  text-overflow: ellipsis;
   font-size: 14px;
   font-weight: 600;
   color: hsl(var(--text-strong));
-  text-overflow: ellipsis;
   white-space: nowrap;
 }
 
 .chat-history-page__session-preview {
   display: -webkit-box;
   overflow: hidden;
+  -webkit-line-clamp: 1;
   font-size: 12px;
   line-height: 1.5;
   color: hsl(var(--text-muted));
-  word-break: break-word;
+  overflow-wrap: anywhere;
   -webkit-box-orient: vertical;
-  -webkit-line-clamp: 1;
 }
 
 .chat-history-page__assistant-chip {
@@ -532,15 +532,15 @@ function closeDetail() {
   max-width: 100%;
   min-height: 28px;
   padding: 0 12px;
-  border: 1px solid hsl(var(--glass-border) / 0.48);
-  border-radius: 999px;
-  background: hsl(var(--glass-tint) / 0.76);
+  overflow: hidden;
+  text-overflow: ellipsis;
   font-size: 12px;
   font-weight: 600;
   color: hsl(var(--nav-item-active-foreground));
-  overflow: hidden;
-  text-overflow: ellipsis;
   white-space: nowrap;
+  background: hsl(var(--glass-tint) / 76%);
+  border: 1px solid hsl(var(--glass-border) / 48%);
+  border-radius: 999px;
 }
 
 .chat-history-page__user-cell,
@@ -551,15 +551,15 @@ function closeDetail() {
 
 .chat-history-page__count-pill {
   display: inline-flex;
-  min-width: 42px;
   align-items: center;
   justify-content: center;
+  min-width: 42px;
   padding: 4px 10px;
-  border-radius: 999px;
-  background: hsl(var(--surface-contrast-soft) / 0.88);
   font-size: 12px;
   font-weight: 600;
   color: hsl(var(--text-strong));
+  background: hsl(var(--surface-contrast-soft) / 88%);
+  border-radius: 999px;
 }
 
 .chat-history-page__detail-action {
@@ -568,10 +568,10 @@ function closeDetail() {
 
 .chat-history-page__empty {
   display: flex;
-  min-height: 360px;
   flex: 1;
   align-items: center;
   justify-content: center;
+  min-height: 360px;
 }
 
 .chat-history-page__pagination {
@@ -599,27 +599,27 @@ function closeDetail() {
 
 .chat-history-page__content :deep(.el-table th.el-table__cell) {
   height: 48px;
-  background: hsl(var(--surface-contrast-soft) / 0.54);
-  border-bottom-color: hsl(var(--divider-faint) / 0.28);
   font-size: 12px;
   font-weight: 600;
   color: hsl(var(--text-muted));
+  background: hsl(var(--surface-contrast-soft) / 54%);
+  border-bottom-color: hsl(var(--divider-faint) / 28%);
 }
 
 .chat-history-page__content :deep(.el-table td.el-table__cell) {
   padding: 14px 0;
   background: transparent;
-  border-bottom-color: hsl(var(--divider-faint) / 0.22);
+  border-bottom-color: hsl(var(--divider-faint) / 22%);
 }
 
 .chat-history-page__content
   :deep(.el-table__body tr:hover > td.el-table__cell) {
-  background: hsl(var(--primary) / 0.04);
+  background: hsl(var(--primary) / 4%);
 }
 
 .chat-history-page__content
   :deep(.el-table__body tr.current-row > td.el-table__cell) {
-  background: hsl(var(--primary) / 0.08);
+  background: hsl(var(--primary) / 8%);
 }
 
 @media (max-width: 1024px) {

easyflow-ui-admin/app/src/views/ai/documentCollection/Document.vue

@@ -268,76 +268,85 @@ const backDoc = () => {
 
 <style scoped>
 .document-container {
-  width: 100%;
   display: flex;
-  height: 100%;
-  padding: 24px 24px 30px 24px;
-}
-.doc-container {
-  height: 100%;
   width: 100%;
+  height: 100%;
+  padding: 24px 24px 30px;
+}
+
+.doc-container {
+  box-sizing: border-box;
   display: flex;
   flex-direction: column;
-  box-sizing: border-box;
-}
-.doc-table-content {
-  border-radius: 8px;
   width: 100%;
-  box-sizing: border-box;
-  padding: 20px 14px 0 14px;
-  background-color: var(--el-bg-color);
-  flex: 1;
+  height: 100%;
 }
+
+.doc-table-content {
+  box-sizing: border-box;
+  flex: 1;
+  width: 100%;
+  padding: 20px 14px 0;
+  background-color: var(--el-bg-color);
+  border-radius: 8px;
+}
+
 .doc-header {
   width: 100%;
-  margin: 0 auto;
   padding-bottom: 21px;
+  margin: 0 auto;
 }
+
 .doc-content {
   display: flex;
   flex-direction: column;
-  height: 100%;
-  width: 100%;
   gap: 12px;
+  width: 100%;
+  height: 100%;
 }
+
 .doc-top-menu {
-  flex: 1;
-  width: auto;
-  border-radius: 0;
-  background-color: transparent;
-  padding: 0;
   display: flex;
+  flex: 1;
   flex-wrap: wrap;
   gap: 6px;
-  min-height: 32px;
   align-items: center;
+  width: auto;
+  min-height: 32px;
+  padding: 0;
+  background-color: transparent;
+  border-radius: 0;
 }
+
 .doc-menu-item {
-  border: 1px solid transparent;
-  background: transparent;
   padding: 7px 14px;
-  border-radius: 8px;
   font-size: 14px;
-  color: var(--el-text-color-secondary);
   font-weight: 500;
+  color: var(--el-text-color-secondary);
   cursor: pointer;
+  background: transparent;
+  border: 1px solid transparent;
+  border-radius: 8px;
   transition:
     background-color 0.2s,
     color 0.2s,
     border-color 0.2s,
     box-shadow 0.2s;
 }
+
 .doc-menu-item:hover {
-  background-color: var(--el-fill-color-light);
   color: var(--el-text-color-primary);
+  background-color: var(--el-fill-color-light);
 }
+
 .doc-menu-item.active {
+  font-weight: 600;
   color: var(--el-color-primary);
   background-color: var(--el-color-primary-light-9);
   border-color: var(--el-color-primary-light-7);
   box-shadow: 0 2px 10px rgb(64 158 255 / 16%);
-  font-weight: 600;
 }
+
 .doc-menu-item:focus-visible {
   outline: 2px solid var(--el-color-primary-light-5);
   outline-offset: 1px;
@@ -353,52 +362,59 @@ const backDoc = () => {
 .doc-table {
   background-color: var(--el-bg-color);
 }
+
 .doc-imp-container {
+  box-sizing: border-box;
   flex: 1;
   width: 100%;
-  box-sizing: border-box;
 }
+
 .doc-header-container {
   display: flex;
   flex-direction: column;
   width: 100%;
 }
+
 .doc-knowledge-container {
   display: flex;
   flex-direction: row;
+  gap: 8px;
   align-items: center;
   margin-bottom: 20px;
-  gap: 8px;
 }
+
 .knowledge-info-container {
   display: flex;
   flex-direction: column;
   gap: 4px;
   min-width: 160px;
 }
+
 .title {
-  font-weight: 500;
   font-size: 16px;
+  font-style: normal;
+  font-weight: 500;
   line-height: 24px;
   text-align: left;
-  font-style: normal;
   text-transform: none;
 }
 
 .description {
-  font-weight: 400;
   font-size: 14px;
-  color: #75808d;
-  line-height: 22px;
-  text-align: left;
   font-style: normal;
+  font-weight: 400;
+  line-height: 22px;
+  color: #75808d;
+  text-align: left;
   text-transform: none;
 }
+
 .doc-search-container {
+  display: flex;
   width: 100%;
   height: 100%;
-  display: flex;
 }
+
 .menu-container {
   flex: 1;
 }

easyflow-ui-admin/app/src/views/ai/documentCollection/DocumentCollection.vue

@@ -601,9 +601,9 @@ function changeCategory(category: any) {
 
 <style scoped>
 h1 {
-  text-align: center;
   margin-bottom: 30px;
   color: #303133;
+  text-align: center;
 }
 
 .knowledge-scope-chip {
@@ -616,7 +616,7 @@ h1 {
   font-weight: 600;
   line-height: 1;
   color: hsl(var(--text-strong));
-  background: hsl(var(--surface-subtle) / 0.92);
+  background: hsl(var(--surface-subtle) / 92%);
   border: 1px solid hsl(var(--line-subtle));
   border-radius: 999px;
   transition:
@@ -632,15 +632,15 @@ button.knowledge-scope-chip {
 }
 
 button.knowledge-scope-chip:hover {
+  box-shadow: 0 10px 22px -18px hsl(var(--foreground) / 32%);
   transform: translateY(-1px);
-  box-shadow: 0 10px 22px -18px hsl(var(--foreground) / 0.32);
 }
 
 button.knowledge-scope-chip:focus-visible {
   outline: none;
   box-shadow:
-    0 0 0 4px hsl(var(--primary) / 0.12),
-    0 10px 22px -18px hsl(var(--foreground) / 0.32);
+    0 0 0 4px hsl(var(--primary) / 12%),
+    0 10px 22px -18px hsl(var(--foreground) / 32%);
 }
 
 button.knowledge-scope-chip:disabled {
@@ -663,20 +663,20 @@ button.knowledge-scope-chip:disabled {
 
 .knowledge-scope-chip--private {
   color: hsl(var(--primary));
-  background: hsl(var(--primary) / 0.09);
-  border-color: hsl(var(--primary) / 0.2);
+  background: hsl(var(--primary) / 9%);
+  border-color: hsl(var(--primary) / 20%);
 }
 
 .knowledge-scope-chip--dept {
   color: hsl(var(--warning));
-  background: hsl(var(--warning) / 0.12);
-  border-color: hsl(var(--warning) / 0.2);
+  background: hsl(var(--warning) / 12%);
+  border-color: hsl(var(--warning) / 20%);
 }
 
 .knowledge-scope-chip--public {
   color: hsl(var(--success));
-  background: hsl(var(--success) / 0.12);
-  border-color: hsl(var(--success) / 0.2);
+  background: hsl(var(--success) / 12%);
+  border-color: hsl(var(--success) / 20%);
 }
 
 .knowledge-scope-panel {
@@ -687,9 +687,9 @@ button.knowledge-scope-chip:disabled {
 
 .knowledge-scope-option {
   display: flex;
+  gap: 10px;
   align-items: center;
   justify-content: space-between;
-  gap: 10px;
   width: 100%;
   padding: 10px 8px;
   text-align: left;
@@ -703,12 +703,12 @@ button.knowledge-scope-chip:disabled {
 }
 
 .knowledge-scope-option:hover {
-  background: hsl(var(--foreground) / 0.04);
+  background: hsl(var(--foreground) / 4%);
 }
 
 .knowledge-scope-option:focus-visible {
   outline: none;
-  box-shadow: 0 0 0 4px hsl(var(--primary) / 0.12);
+  box-shadow: 0 0 0 4px hsl(var(--primary) / 12%);
 }
 
 .knowledge-scope-option:disabled {
@@ -729,8 +729,8 @@ button.knowledge-scope-chip:disabled {
   justify-content: center;
   width: 30px;
   height: 30px;
-  border-radius: 9px;
   background: transparent;
+  border-radius: 9px;
 }
 
 .knowledge-scope-option__icon {
@@ -764,29 +764,29 @@ button.knowledge-scope-chip:disabled {
 
 .knowledge-scope-option--private .knowledge-scope-option__icon-wrap {
   color: hsl(var(--primary));
-  background: hsl(var(--primary) / 0.1);
+  background: hsl(var(--primary) / 10%);
 }
 
 .knowledge-scope-option--dept .knowledge-scope-option__icon-wrap {
   color: hsl(var(--warning));
-  background: hsl(var(--warning) / 0.12);
+  background: hsl(var(--warning) / 12%);
 }
 
 .knowledge-scope-option--public .knowledge-scope-option__icon-wrap {
   color: hsl(var(--success));
-  background: hsl(var(--success) / 0.12);
+  background: hsl(var(--success) / 12%);
 }
 
 .knowledge-scope-option--private.knowledge-scope-option--active {
-  background: hsl(var(--primary) / 0.08);
+  background: hsl(var(--primary) / 8%);
 }
 
 .knowledge-scope-option--dept.knowledge-scope-option--active {
-  background: hsl(var(--warning) / 0.08);
+  background: hsl(var(--warning) / 8%);
 }
 
 .knowledge-scope-option--public.knowledge-scope-option--active {
-  background: hsl(var(--success) / 0.08);
+  background: hsl(var(--success) / 8%);
 }
 
 .knowledge-scope-option--private .knowledge-scope-option__check {
@@ -803,8 +803,8 @@ button.knowledge-scope-chip:disabled {
 
 :global(.knowledge-visibility-popover.el-popover.el-popper) {
   padding: 8px;
-  border-radius: 16px;
   border-color: hsl(var(--line-subtle));
-  box-shadow: 0 18px 34px -28px hsl(var(--foreground) / 0.2);
+  border-radius: 16px;
+  box-shadow: 0 18px 34px -28px hsl(var(--foreground) / 20%);
 }
 </style>

easyflow-ui-admin/app/src/views/ai/documentCollection/DocumentTable.vue

@@ -162,17 +162,19 @@ const handleDelete = (row: any) => {
   flex-direction: column;
   justify-content: space-between;
 }
+
 .file-name-container {
   display: flex;
   align-items: center;
 }
+
 .title {
-  font-weight: 500;
   font-size: 14px;
-  color: #1a1a1a;
-  line-height: 20px;
-  text-align: left;
   font-style: normal;
+  font-weight: 500;
+  line-height: 20px;
+  color: #1a1a1a;
+  text-align: left;
   text-transform: none;
 }
 </style>

easyflow-ui-admin/app/src/views/ai/documentCollection/FaqEditDialog.vue

@@ -252,8 +252,8 @@ onBeforeUnmount(() => {
 
 .faq-form :deep(.el-input__wrapper),
 .faq-form :deep(.el-select__wrapper) {
-  border-radius: 10px;
   min-height: 42px;
+  border-radius: 10px;
   transition: box-shadow 0.2s ease;
 }
 
@@ -264,17 +264,17 @@ onBeforeUnmount(() => {
 
 .field-tip {
   margin-top: 6px;
-  color: var(--el-text-color-secondary);
   font-size: 12px;
   line-height: 18px;
+  color: var(--el-text-color-secondary);
 }
 
 .editor-wrapper {
   width: 100%;
+  overflow: hidden;
+  background: var(--el-fill-color-blank);
   border: 1px solid var(--el-border-color-lighter);
   border-radius: 12px;
-  background: var(--el-fill-color-blank);
-  overflow: hidden;
   box-shadow: 0 8px 24px rgb(15 23 42 / 4%);
   transition:
     border-color 0.2s ease,
@@ -287,16 +287,16 @@ onBeforeUnmount(() => {
 }
 
 :deep(.w-e-toolbar) {
-  border-bottom: 1px solid var(--el-border-color-light);
-  background: var(--el-fill-color-blank);
   padding: 8px 10px;
+  background: var(--el-fill-color-blank);
+  border-bottom: 1px solid var(--el-border-color-light);
 }
 
 :deep(.w-e-text-container) {
   height: 340px;
   min-height: 340px;
-  background: var(--el-fill-color-blank);
   cursor: text;
+  background: var(--el-fill-color-blank);
 }
 
 :deep(.w-e-text-container .w-e-scroll) {
@@ -315,8 +315,8 @@ onBeforeUnmount(() => {
 
 .dialog-footer {
   display: flex;
-  justify-content: flex-end;
   gap: 12px;
+  justify-content: flex-end;
 }
 
 .footer-btn {
@@ -324,13 +324,13 @@ onBeforeUnmount(() => {
 }
 
 :deep(.faq-edit-dialog .el-dialog) {
-  border-radius: 14px;
   overflow: hidden;
+  border-radius: 14px;
 }
 
 :deep(.faq-edit-dialog .el-dialog__header) {
-  margin-right: 0;
   padding: 18px 22px;
+  margin-right: 0;
   border-bottom: 1px solid var(--el-border-color-lighter);
 }
 

easyflow-ui-admin/app/src/views/ai/documentCollection/FaqImportDialog.vue

@@ -298,31 +298,31 @@ const handleImport = async () => {
   display: flex;
   align-items: center;
   justify-content: space-between;
+  padding: 10px 12px;
+  background: var(--el-fill-color-blank);
   border: 1px solid var(--el-border-color-light);
   border-radius: 10px;
-  background: var(--el-fill-color-blank);
-  padding: 10px 12px;
 }
 
 .selected-file-main {
   display: flex;
-  align-items: center;
-  gap: 10px;
-  min-width: 0;
   flex: 1;
+  gap: 10px;
+  align-items: center;
+  min-width: 0;
 }
 
 .selected-file-icon {
-  color: var(--el-text-color-secondary);
   font-size: 18px;
+  color: var(--el-text-color-secondary);
 }
 
 .selected-file-name {
-  color: var(--el-text-color-primary);
-  font-size: 14px;
-  font-weight: 500;
   overflow: hidden;
   text-overflow: ellipsis;
+  font-size: 14px;
+  font-weight: 500;
+  color: var(--el-text-color-primary);
   white-space: nowrap;
 }
 
@@ -335,10 +335,10 @@ const handleImport = async () => {
 }
 
 .result-wrap {
-  border: 1px solid var(--el-border-color-light);
-  border-radius: 12px;
   padding: 14px;
   background: var(--el-fill-color-light);
+  border: 1px solid var(--el-border-color-light);
+  border-radius: 12px;
 }
 
 .result-head {
@@ -350,8 +350,8 @@ const handleImport = async () => {
 
 .result-title-wrap {
   display: flex;
-  align-items: center;
   gap: 8px;
+  align-items: center;
 }
 
 .result-state-icon {
@@ -371,24 +371,24 @@ const handleImport = async () => {
 }
 
 .stat-item {
+  padding: 10px 12px;
   background: var(--el-fill-color-blank);
   border: 1px solid var(--el-border-color-lighter);
   border-radius: 8px;
-  padding: 10px 12px;
 }
 
 .stat-label {
-  color: var(--el-text-color-secondary);
+  margin-bottom: 8px;
   font-size: 12px;
   line-height: 1;
-  margin-bottom: 8px;
+  color: var(--el-text-color-secondary);
 }
 
 .stat-value {
-  color: var(--el-text-color-primary);
   font-size: 22px;
   font-weight: 600;
   line-height: 1;
+  color: var(--el-text-color-primary);
 }
 
 .success-text {
@@ -414,14 +414,14 @@ const handleImport = async () => {
 
 :deep(.faq-upload-area .el-upload-dragger) {
   padding: 0;
-  border-radius: 10px;
   background-color: var(--el-fill-color-blank);
+  border-radius: 10px;
   transition: all 0.3s;
 }
 
 :deep(.faq-upload-area .el-upload-dragger:hover) {
-  border-color: var(--el-color-primary);
   background-color: var(--el-color-primary-light-9);
+  border-color: var(--el-color-primary);
 }
 
 @media (max-width: 768px) {

easyflow-ui-admin/app/src/views/ai/documentCollection/FaqTable.vue

@@ -1000,37 +1000,37 @@ onMounted(() => {
 }
 
 .faq-category-pane {
-  width: 236px;
-  min-width: 236px;
-  border: 1px solid var(--el-border-color-lighter);
-  border-radius: 12px;
-  background: var(--el-fill-color-blank);
   display: flex;
   flex-direction: column;
+  width: 236px;
+  min-width: 236px;
   overflow: hidden;
+  background: var(--el-fill-color-blank);
+  border: 1px solid var(--el-border-color-lighter);
+  border-radius: 12px;
 }
 
 .faq-category-header {
   display: flex;
-  justify-content: space-between;
   align-items: center;
+  justify-content: space-between;
   padding: 10px;
-  border-bottom: 1px solid var(--el-border-color-lighter);
   font-weight: 600;
+  border-bottom: 1px solid var(--el-border-color-lighter);
 }
 
 .faq-category-tree {
+  flex: 1;
   padding: 6px;
   overflow: auto;
-  flex: 1;
 }
 
 .faq-category-node {
+  display: flex;
+  gap: 6px;
+  align-items: center;
   width: 100%;
   min-width: 0;
-  display: flex;
-  align-items: center;
-  gap: 6px;
 }
 
 .faq-category-node.is-all-node .faq-category-node-label {
@@ -1053,12 +1053,12 @@ onMounted(() => {
 }
 
 .faq-content-pane {
+  flex: 1;
+  padding: 14px 16px 8px;
+  overflow: auto;
+  background: var(--el-fill-color-blank);
   border: 1px solid var(--el-border-color-lighter);
   border-radius: 12px;
-  padding: 14px 16px 8px;
-  background: var(--el-fill-color-blank);
-  flex: 1;
-  overflow: auto;
 }
 
 .faq-header {
@@ -1074,18 +1074,18 @@ onMounted(() => {
 
 .faq-toolbar {
   display: flex;
+  gap: 14px;
   align-items: center;
   justify-content: space-between;
-  gap: 14px;
   padding: 2px 0;
 }
 
 .faq-search-actions {
-  flex: 1;
-  min-width: 260px;
   display: flex;
-  align-items: center;
+  flex: 1;
   gap: 10px;
+  align-items: center;
+  min-width: 260px;
 }
 
 .faq-search-input {
@@ -1095,15 +1095,15 @@ onMounted(() => {
 .faq-primary-actions {
   display: flex;
   flex-wrap: wrap;
-  justify-content: flex-end;
   gap: 10px;
+  justify-content: flex-end;
 }
 
 :deep(.faq-toolbar .el-button) {
   height: 38px;
   padding: 0 16px;
-  border-radius: 10px;
   font-weight: 500;
+  border-radius: 10px;
   transition:
     border-color 0.2s ease,
     background-color 0.2s ease,
@@ -1112,15 +1112,15 @@ onMounted(() => {
 
 :deep(.faq-toolbar .el-button:not(.el-button--primary):hover) {
   color: hsl(var(--primary));
-  border-color: hsl(var(--primary) / 45%);
   background: hsl(var(--primary) / 7%);
+  border-color: hsl(var(--primary) / 45%);
 }
 
 :deep(.faq-search-input .el-input__wrapper) {
+  padding-right: 12px;
+  padding-left: 12px;
   border-radius: 10px;
   box-shadow: 0 0 0 1px var(--el-border-color) inset;
-  padding-left: 12px;
-  padding-right: 12px;
 }
 
 :deep(.faq-search-input .el-input__wrapper:hover) {
@@ -1142,8 +1142,8 @@ onMounted(() => {
 
 :deep(.faq-category-tree .el-tree-node__content) {
   height: 34px;
-  border-radius: 8px;
   padding-right: 4px;
+  border-radius: 8px;
 }
 
 :deep(.faq-category-tree .el-tree-node__content:hover) {
@@ -1157,8 +1157,8 @@ onMounted(() => {
 }
 
 :deep(.el-tree-node.is-current > .el-tree-node__content) {
-  background-color: hsl(var(--primary) / 15%);
   color: hsl(var(--primary));
+  background-color: hsl(var(--primary) / 15%);
 }
 
 :deep(
@@ -1168,8 +1168,8 @@ onMounted(() => {
 }
 
 :deep(.el-table) {
-  border-radius: 10px;
   overflow: hidden;
+  border-radius: 10px;
 }
 
 :deep(.el-table th.el-table__cell) {
@@ -1183,8 +1183,8 @@ onMounted(() => {
 
 @media (max-width: 1360px) {
   .faq-toolbar {
-    align-items: flex-start;
     flex-direction: column;
+    align-items: flex-start;
   }
 
   .faq-search-actions,

easyflow-ui-admin/app/src/views/ai/documentCollection/ImportKnowledgeDocFile.vue

@@ -221,11 +221,11 @@ async function confirmImport() {
 .imp-doc-kno-container {
   position: relative;
   display: flex;
-  height: 100%;
   flex-direction: column;
+  height: 100%;
   padding: 24px;
-  border-radius: 16px;
   background: var(--el-bg-color);
+  border-radius: 16px;
 }
 
 .imp-doc-kno-content {
@@ -239,9 +239,9 @@ async function confirmImport() {
 
 .step-card {
   padding: 20px 24px;
+  background: var(--el-fill-color-blank);
   border: 1px solid var(--el-border-color-light);
   border-radius: 16px;
-  background: var(--el-fill-color-blank);
 }
 
 .step-body {

easyflow-ui-admin/app/src/views/ai/documentCollection/SegmenterDoc.vue

@@ -323,8 +323,8 @@ function showLengthSettings(strategyCode?: string) {
 
 .strategy-card__header {
   display: flex;
-  justify-content: space-between;
   gap: 16px;
+  justify-content: space-between;
   padding-bottom: 16px;
   border-bottom: 1px solid var(--el-border-color-lighter);
 }
@@ -343,9 +343,9 @@ function showLengthSettings(strategyCode?: string) {
 
 .strategy-card__badges {
   display: flex;
+  flex-wrap: wrap;
   gap: 8px;
   align-items: flex-start;
-  flex-wrap: wrap;
 }
 
 .strategy-card__content {
@@ -369,10 +369,10 @@ function showLengthSettings(strategyCode?: string) {
 }
 
 .strategy-reason-list {
-  margin: 0;
   padding-left: 18px;
-  color: var(--el-text-color-regular);
+  margin: 0;
   line-height: 1.7;
+  color: var(--el-text-color-regular);
 }
 
 .strategy-reason-list__item {
@@ -387,7 +387,7 @@ function showLengthSettings(strategyCode?: string) {
 
 .strategy-form {
   padding: 16px;
-  border-radius: 12px;
   background: var(--el-fill-color-light);
+  border-radius: 12px;
 }
 </style>

easyflow-ui-admin/app/src/views/ai/documentCollection/SplitterDocPreview.vue

@@ -193,9 +193,9 @@ watch(
 
 .preview-panel {
   padding: 20px;
+  background: var(--el-bg-color);
   border: 1px solid var(--el-border-color-light);
   border-radius: 16px;
-  background: var(--el-bg-color);
 }
 
 .preview-summary {
@@ -212,16 +212,16 @@ watch(
 
 .chunk-card {
   padding: 16px;
+  background: var(--el-fill-color-blank);
   border: 1px solid var(--el-border-color-lighter);
   border-radius: 14px;
-  background: var(--el-fill-color-blank);
 }
 
 .chunk-card__header {
   display: flex;
+  gap: 12px;
   align-items: flex-start;
   justify-content: space-between;
-  gap: 12px;
 }
 
 .chunk-card__title {
@@ -244,11 +244,11 @@ watch(
 
 .chunk-card__content {
   margin: 16px 0 0;
-  white-space: pre-wrap;
-  word-break: break-word;
   font-family: inherit;
   line-height: 1.7;
   color: var(--el-text-color-regular);
+  overflow-wrap: anywhere;
+  white-space: pre-wrap;
 }
 
 .chunk-card__warnings {
@@ -262,10 +262,10 @@ watch(
   display: flex;
   flex-direction: column;
   gap: 12px;
-  margin-top: 16px;
   padding: 12px;
-  border-radius: 12px;
+  margin-top: 16px;
   background: var(--el-fill-color-light);
+  border-radius: 12px;
 }
 
 .qa-block__item {
@@ -276,11 +276,11 @@ watch(
 
 .qa-block__label {
   display: inline-flex;
-  width: 22px;
   justify-content: center;
-  border-radius: 999px;
-  background: var(--el-color-primary-light-9);
-  color: var(--el-color-primary);
+  width: 22px;
   font-weight: 600;
+  color: var(--el-color-primary);
+  background: var(--el-color-primary-light-9);
+  border-radius: 999px;
 }
 </style>

easyflow-ui-admin/app/src/views/ai/mcp/McpModal.vue

@@ -262,50 +262,56 @@ const activeName = ref('config');
   display: flex;
   flex-direction: column;
 }
+
 .content-title {
+  font-size: 12px;
+  font-style: normal;
   font-weight: 500;
-  font-size: 12px;
-  color: rgba(0, 0, 0, 0.85);
   line-height: 24px;
+  color: rgb(0 0 0 / 85%);
   text-align: left;
-  font-style: normal;
   text-transform: none;
 }
+
 .content-desc {
-  font-weight: 400;
   font-size: 12px;
-  color: rgba(0, 0, 0, 0.45);
-  line-height: 22px;
-  text-align: left;
   font-style: normal;
+  font-weight: 400;
+  line-height: 22px;
+  color: rgb(0 0 0 / 45%);
+  text-align: left;
   text-transform: none;
 }
+
 .params-name {
-  flex: 1;
-  background-color: #fafafa;
   display: flex;
+  flex: 1;
   align-items: center;
+  padding: 8px;
+  background-color: #fafafa;
   border: 1px solid #e6e9ee;
   border-radius: 8px;
-  padding: 8px;
 }
+
 .params-content-container {
   display: flex;
+  flex: 1;
   flex-direction: row;
   gap: 8px;
-  flex: 1;
-  border-radius: 8px;
   padding: 8px;
+  border-radius: 8px;
 }
+
 .params-desc-container {
   display: flex;
+  flex: 1;
   flex-direction: column;
   gap: 4px;
-  flex: 1;
-  border-radius: 8px;
-  border: 1px solid #e6e9ee;
   padding: 8px;
+  border: 1px solid #e6e9ee;
+  border-radius: 8px;
 }
+
 .params-list {
   display: flex;
   flex-direction: column;
@@ -313,18 +319,19 @@ const activeName = ref('config');
 
 .params-left-title-container {
   display: flex;
-  flex-direction: row;
-  background-color: #fafafa;
-  gap: 8px;
   flex: 1;
+  flex-direction: row;
+  gap: 8px;
+  align-items: center;
+  padding: 8px;
+  background-color: #fafafa;
   border: 1px solid #e6e9ee;
   border-radius: 8px;
-  padding: 8px;
-  align-items: center;
 }
+
 .required-mark {
-  color: #f56c6c;
   margin-left: 2px;
   font-size: 14px;
+  color: #f56c6c;
 }
 </style>

easyflow-ui-admin/app/src/views/ai/model/AddModelModal.vue

@@ -408,8 +408,8 @@ const save = async () => {
 }
 
 .model-modal__ability-panel {
-  overflow: hidden;
   padding: 2px;
+  overflow: hidden;
   border-radius: 18px;
 }
 
@@ -421,8 +421,8 @@ const save = async () => {
 }
 
 .model-modal__ability-separator {
-  width: 1px;
   align-self: stretch;
+  width: 1px;
   min-height: 28px;
   background: hsl(var(--divider-faint) / 62%);
   border-radius: 999px;
@@ -430,9 +430,9 @@ const save = async () => {
 
 .model-modal__ability-chip {
   display: inline-flex;
+  gap: 8px;
   align-items: center;
   justify-content: center;
-  gap: 8px;
   min-height: 40px;
   padding: 9px 18px;
   font-size: 13px;
@@ -454,21 +454,21 @@ const save = async () => {
 .model-modal__ability-chip:hover:not(:disabled),
 .model-modal__ability-chip:focus-visible:not(:disabled) {
   color: hsl(var(--text-strong));
-  transform: translateY(-1px);
   box-shadow: 0 10px 18px -14px hsl(var(--foreground) / 28%);
+  transform: translateY(-1px);
 }
 
 .model-modal__ability-chip.is-active {
   color: hsl(var(--text-strong));
-  border-color: hsl(var(--primary) / 18%);
   background: hsl(var(--primary) / 10%);
+  border-color: hsl(var(--primary) / 18%);
   box-shadow: inset 0 0 0 1px hsl(var(--primary) / 14%);
 }
 
 .model-modal__ability-chip.is-disabled {
   cursor: not-allowed;
-  opacity: 0.56;
   box-shadow: none;
+  opacity: 0.56;
   transform: none;
 }
 

easyflow-ui-admin/app/src/views/ai/model/AddModelProviderModal.vue

@@ -1,17 +1,28 @@
 <script setup lang="ts">
-import {computed, reactive, ref} from 'vue';
+import { computed, reactive, ref } from 'vue';
 
-import {EasyFlowFormModal} from '@easyflow/common-ui';
+import { EasyFlowFormModal } from '@easyflow/common-ui';
 
-import {ArrowDown, ArrowUp} from '@element-plus/icons-vue';
-import {ElForm, ElFormItem, ElIcon, ElInput, ElMessage, ElOption, ElSelect,} from 'element-plus';
+import { ArrowDown, ArrowUp } from '@element-plus/icons-vue';
+import {
+  ElForm,
+  ElFormItem,
+  ElIcon,
+  ElInput,
+  ElMessage,
+  ElOption,
+  ElSelect,
+} from 'element-plus';
 
-import {api} from '#/api/request';
+import { api } from '#/api/request';
 import UploadAvatar from '#/components/upload/UploadAvatar.vue';
-import {$t} from '#/locales';
-import {syncProgrammaticFieldValidation} from '#/utils/form-validation';
+import { $t } from '#/locales';
+import { syncProgrammaticFieldValidation } from '#/utils/form-validation';
 import ModelProviderBadge from '#/views/ai/model/ModelProviderBadge.vue';
-import {getProviderPresetByValue, providerPresets,} from '#/views/ai/model/modelUtils/defaultIcon';
+import {
+  getProviderPresetByValue,
+  providerPresets,
+} from '#/views/ai/model/modelUtils/defaultIcon';
 
 const emit = defineEmits(['reload']);
 

easyflow-ui-admin/app/src/views/ai/model/ModelVerifyConfig.vue

@@ -1,13 +1,19 @@
 <script setup lang="ts">
-import {computed, reactive, ref} from 'vue';
+import { computed, reactive, ref } from 'vue';
 
-import {EasyFlowFormModal} from '@easyflow/common-ui';
+import { EasyFlowFormModal } from '@easyflow/common-ui';
 
-import {CircleCheckFilled, WarningFilled} from '@element-plus/icons-vue';
-import {ElForm, ElFormItem, ElMessage, ElOption, ElSelect,} from 'element-plus';
+import { CircleCheckFilled, WarningFilled } from '@element-plus/icons-vue';
+import {
+  ElForm,
+  ElFormItem,
+  ElMessage,
+  ElOption,
+  ElSelect,
+} from 'element-plus';
 
-import {api} from '#/api/request';
-import {$t} from '#/locales';
+import { api } from '#/api/request';
+import { $t } from '#/locales';
 
 type VerifyStatus = 'error' | 'idle' | 'success';
 

easyflow-ui-admin/app/src/views/ai/model/ModelViewItemOperation.vue

@@ -263,16 +263,13 @@ const getSelectedAbilityTagsForLlm = (llm: llmType): ModelAbilityItem[] => {
 }
 
 .llm-item__description {
+  display: -webkit-box;
   margin: 0;
+  overflow: hidden;
+  -webkit-line-clamp: 2;
   font-size: 13px;
   line-height: 1.5;
   color: hsl(var(--text-muted));
-}
-
-.llm-item__description {
-  display: -webkit-box;
-  overflow: hidden;
-  -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
 }
 

easyflow-ui-admin/app/src/views/ai/model/UnifiedGatewayWorkspace.vue

@@ -503,7 +503,7 @@ const handleToggleVisibleChecked = (checked: boolean | number | string) => {
   checkedModelIds.value = [...next];
 };
 
-const handlePublishToggle = async (nextValue: string | number | boolean) => {
+const handlePublishToggle = async (nextValue: boolean | number | string) => {
   if (!draft.id || !selectedModel.value || isPublishing.value) {
     return;
   }
@@ -978,9 +978,9 @@ defineExpose({
 
 .gateway-workspace__batch {
   display: flex;
+  gap: 12px;
   align-items: center;
   justify-content: space-between;
-  gap: 12px;
   padding: 10px 12px;
   background: hsl(var(--surface-contrast-soft) / 48%);
   border: 1px solid hsl(var(--divider-faint) / 40%);
@@ -1019,8 +1019,8 @@ defineExpose({
 }
 
 .gateway-model-item.is-active {
-  border-color: hsl(var(--primary) / 42%);
   background: hsl(var(--primary) / 7%);
+  border-color: hsl(var(--primary) / 42%);
 }
 
 .gateway-model-item__content {
@@ -1148,9 +1148,9 @@ defineExpose({
 
 .gateway-form__actions {
   display: flex;
+  flex-shrink: 0;
   gap: 12px;
   justify-content: flex-end;
-  flex-shrink: 0;
 }
 
 .gateway-info-grid {
@@ -1189,8 +1189,8 @@ defineExpose({
 }
 
 .gateway-example-item pre {
-  margin: 0;
   padding: 14px;
+  margin: 0;
   overflow: auto;
   font-size: 12px;
   line-height: 1.7;
@@ -1240,18 +1240,18 @@ defineExpose({
   }
 
   .gateway-form__switch-row {
-    align-items: flex-start;
     flex-direction: column;
+    align-items: flex-start;
   }
 
   .gateway-form__invoke-row {
-    align-items: stretch;
     flex-direction: column;
+    align-items: stretch;
   }
 
   .gateway-publish-inline {
-    align-items: flex-start;
     flex-direction: column;
+    align-items: flex-start;
   }
 
   .gateway-hero__title {

easyflow-ui-admin/app/src/views/ai/model/modelUtils/__tests__/providerDraft.test.ts

@@ -1,4 +1,4 @@
-import {describe, expect, it} from 'vitest';
+import { describe, expect, it } from 'vitest';
 
 import {
   createProviderDraft,

easyflow-ui-admin/app/src/views/ai/model/modelUtils/providerDraft.ts

@@ -1,4 +1,4 @@
-import type {ProviderPreset} from './defaultIcon';
+import type { ProviderPreset } from './defaultIcon';
 
 export const PROVIDER_EDITABLE_FIELDS = [
   'apiKey',

easyflow-ui-admin/app/src/views/ai/plugin/AddPluginModal.vue

@@ -1,5 +1,11 @@
 <script setup lang="ts">
-import type {FormInstance} from 'element-plus';
+import type { FormInstance } from 'element-plus';
+
+import { onMounted, ref } from 'vue';
+
+import { EasyFlowFormModal } from '@easyflow/common-ui';
+
+import { Plus, Remove } from '@element-plus/icons-vue';
 import {
   ElForm,
   ElFormItem,
@@ -12,15 +18,9 @@ import {
   ElSelect,
 } from 'element-plus';
 
-import {onMounted, ref} from 'vue';
-
-import {EasyFlowFormModal} from '@easyflow/common-ui';
-
-import {Plus, Remove} from '@element-plus/icons-vue';
-
-import {api} from '#/api/request';
+import { api } from '#/api/request';
 import UploadAvatar from '#/components/upload/UploadAvatar.vue';
-import {$t} from '#/locales';
+import { $t } from '#/locales';
 
 const emit = defineEmits(['reload']);
 const embeddingLlmList = ref<any>([]);
@@ -44,9 +44,11 @@ onMounted(() => {
   api.get('/api/v1/plugin/modelList?supportEmbed=true').then((res) => {
     embeddingLlmList.value = res.data;
   });
-  api.get('/api/v1/plugin/modelList?supportRerankerLlmList=true').then((res) => {
-    rerankerLlmList.value = res.data;
-  });
+  api
+    .get('/api/v1/plugin/modelList?supportRerankerLlmList=true')
+    .then((res) => {
+      rerankerLlmList.value = res.data;
+    });
   api.get('/api/v1/pluginCategory/list').then((res) => {
     if (res.errorCode === 0) {
       categoryList.value = res.data;
@@ -145,7 +147,8 @@ function save() {
           })
           .then(async (res) => {
             if (res.errorCode === 0) {
-              const pluginId = res.data?.id || plainEntity.id || entity.value.id;
+              const pluginId =
+                res.data?.id || plainEntity.id || entity.value.id;
               if (!pluginId) {
                 throw new Error('插件保存成功，但未返回插件ID');
               }
@@ -330,15 +333,17 @@ function removeHeader(index: number) {
 .headers-container-reduce {
   align-items: center;
 }
+
 .addHeadersBtn {
   width: 100%;
-  border-style: dashed;
-  border-color: var(--el-color-primary);
-  border-radius: 8px;
   margin-top: 8px;
+  border-color: var(--el-color-primary);
+  border-style: dashed;
+  border-radius: 8px;
 }
+
 .head-con-content {
-  margin-bottom: 8px;
   align-items: center;
+  margin-bottom: 8px;
 }
 </style>

easyflow-ui-admin/app/src/views/ai/plugin/PluginRunTestModal.vue

@@ -82,7 +82,6 @@ function handleSubmitRun() {
     v-model:open="dialogVisible"
     width="80%"
     align-center
-    class="run-test-dialog"
     :title="$t('pluginItem.pluginToolEdit.trialRun')"
     :before-close="() => (dialogVisible = false)"
   >
@@ -157,32 +156,36 @@ function handleSubmitRun() {
   width: 100%;
   height: calc(100vh - 161px);
 }
-.run-test-dialog {
-}
+
 .run-test-params {
+  flex: 1;
   width: 100%;
   overflow: auto;
-  flex: 1;
 }
+
 .run-res-json {
-  width: 100%;
   flex: 1;
+  width: 100%;
   overflow: auto;
 }
+
 .run-test-result {
-  flex: 1;
   display: flex;
+  flex: 1;
   flex-direction: column;
 }
+
 .name-cell {
   position: relative;
   min-width: 100%;
 }
+
 .run-title-style {
+  margin-bottom: 8px;
   font-size: 16px;
   font-weight: bold;
-  margin-bottom: 8px;
 }
+
 .editable-name {
   display: flex;
   flex-direction: column;
@@ -201,15 +204,15 @@ function handleSubmitRun() {
 }
 
 .error-message {
-  color: #ff4d4f;
-  font-size: 12px;
   margin-top: 2px;
+  font-size: 12px;
   line-height: 1.2;
+  color: #ff4d4f;
 }
 
 :deep(.el-table td.el-table__cell.first-column div) {
   display: flex;
-  align-items: center;
   gap: 2px;
+  align-items: center;
 }
 </style>

easyflow-ui-admin/app/src/views/ai/plugin/PluginToolCollapse.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts"></script>
 
-<template></template>
+<template>
+  <div></div>
+</template>
 
 <style scoped></style>

easyflow-ui-admin/app/src/views/ai/workflow/WorkflowDesign.vue

@@ -4,7 +4,6 @@ import { useRoute } from 'vue-router';
 
 import { usePreferences } from '@easyflow/preferences';
 import { getOptions, sortNodes } from '@easyflow/utils';
-import { getIconByValue } from '#/views/ai/model/modelUtils/defaultIcon';
 
 import { ArrowLeft, CircleCheck, Close } from '@element-plus/icons-vue';
 import { Tinyflow } from '@tinyflow-ai/vue';
@@ -14,6 +13,7 @@ import { api } from '#/api/request';
 import CommonSelectDataModal from '#/components/commonSelectModal/CommonSelectDataModal.vue';
 import { $t } from '#/locales';
 import { router } from '#/router';
+import { getIconByValue } from '#/views/ai/model/modelUtils/defaultIcon';
 import ExecResult from '#/views/ai/workflow/components/ExecResult.vue';
 import SingleRun from '#/views/ai/workflow/components/SingleRun.vue';
 import WorkflowForm from '#/views/ai/workflow/components/WorkflowForm.vue';
@@ -143,7 +143,7 @@ const issueFocusActive = ref(false);
 const focusedIssueKey = ref('');
 let focusPulseTimer: ReturnType<typeof setTimeout> | undefined;
 
-type WorkflowCheckStage = 'SAVE' | 'PRE_EXECUTE';
+type WorkflowCheckStage = 'PRE_EXECUTE' | 'SAVE';
 const builtInNodeIconMap: Record<string, string> = {
   startNode:
     '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 15C10.3431 15 9 13.6569 9 12C9 10.3431 10.3431 9 12 9C13.6569 9 15 10.3431 15 12C15 13.6569 13.6569 15 12 15Z"></path></svg>',
@@ -395,6 +395,15 @@ function checkStageText(stage?: string) {
   }
   return '-';
 }
+
+function checkStageSummaryText(stage?: string) {
+  return `${$t('aiWorkflow.checkStageLabel')}：${checkStageText(stage)}`;
+}
+
+function checkIssueCountText(count?: number) {
+  return `${$t('aiWorkflow.issueCount')}：${count || 0}`;
+}
+
 function issueKey(issue: any, index: number) {
   return `${issue.code || '-'}-${issue.nodeId || '-'}-${issue.edgeId || '-'}-${index}`;
 }
@@ -616,16 +625,8 @@ function onAsyncExecute(info: any) {
           />
         </div>
         <div class="check-summary">
-          <span
-            >{{ $t('aiWorkflow.checkStageLabel') }}：{{
-              checkStageText(checkResult?.stage)
-            }}</span
-          >
-          <span
-            >{{ $t('aiWorkflow.issueCount') }}：{{
-              checkResult?.issueCount || 0
-            }}</span
-          >
+          <span v-text="checkStageSummaryText(checkResult?.stage)"></span>
+          <span v-text="checkIssueCountText(checkResult?.issueCount)"></span>
         </div>
         <div class="checklist-body">
           <button
@@ -645,14 +646,16 @@ function onAsyncExecute(info: any) {
               <span
                 class="check-level"
                 :class="issueLevelClass(item.issue.level)"
-                >{{ item.issue.level || '-' }}</span
-              >
+                v-text="item.issue.level || '-'"
+              ></span>
               <span class="check-node-display">
+                <!-- eslint-disable vue/no-v-html -->
                 <span
                   v-if="item.nodeDisplay.icon"
                   class="check-node-icon"
                   v-html="item.nodeDisplay.icon"
-                />
+                ></span>
+                <!-- eslint-enable vue/no-v-html -->
                 <span v-else class="check-node-icon-fallback">N</span>
                 <span class="check-node-title">{{
                   item.nodeDisplay.title
@@ -676,23 +679,24 @@ function onAsyncExecute(info: any) {
 }
 
 :deep(.tf-bottom-dock) {
-  left: 50% !important;
   bottom: 16px !important;
-  transform: translateX(-50%) !important;
+  left: 50% !important;
   z-index: 46 !important;
+  transform: translateX(-50%) !important;
 }
 
 .head-div {
   --workflow-bottom-dock-height: 56px;
   --workflow-checklist-offset: calc(var(--workflow-bottom-dock-height) + 24px);
+
   position: relative;
   background-color: var(--el-bg-color);
 }
 
 .workflow-head-actions {
   display: flex;
-  align-items: center;
   gap: 8px;
+  align-items: center;
 }
 
 .tiny-flow-container {
@@ -706,18 +710,18 @@ function onAsyncExecute(info: any) {
 
 .checklist-panel {
   position: absolute;
-  left: 20px;
   right: 20px;
   bottom: var(--workflow-checklist-offset);
+  left: 20px;
   z-index: 60;
-  max-height: min(320px, 42vh);
   display: flex;
   flex-direction: column;
+  max-height: min(320px, 42vh);
   padding: 12px;
+  background: var(--el-bg-color-overlay);
   border: 1px solid var(--el-border-color);
   border-radius: 12px;
-  background: var(--el-bg-color-overlay);
-  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
+  box-shadow: 0 10px 28px rgb(0 0 0 / 12%);
 }
 
 .checklist-header {
@@ -742,18 +746,18 @@ function onAsyncExecute(info: any) {
 }
 
 .checklist-body {
-  overflow: auto;
   display: flex;
   flex-direction: column;
   gap: 8px;
+  overflow: auto;
 }
 
 .check-item {
+  padding: 10px 12px;
   text-align: left;
+  background: var(--el-fill-color-lighter);
   border: 1px solid var(--el-border-color-lighter);
   border-radius: 10px;
-  background: var(--el-fill-color-lighter);
-  padding: 10px 12px;
   transition:
     border-color 0.2s ease,
     box-shadow 0.2s ease,
@@ -765,8 +769,8 @@ function onAsyncExecute(info: any) {
 }
 
 .check-item.is-clickable:hover {
-  border-color: var(--el-color-primary-light-5);
   background: var(--el-fill-color-light);
+  border-color: var(--el-color-primary-light-5);
 }
 
 .check-item.is-active {
@@ -781,11 +785,11 @@ function onAsyncExecute(info: any) {
 
 .check-item-meta {
   display: flex;
-  align-items: center;
   gap: 10px;
+  align-items: center;
+  margin-bottom: 6px;
   font-size: 12px;
   line-height: 1.2;
-  margin-bottom: 6px;
 }
 
 .check-level {
@@ -795,10 +799,10 @@ function onAsyncExecute(info: any) {
   min-width: 56px;
   height: 20px;
   padding: 0 8px;
-  border-radius: 999px;
   font-weight: 600;
   color: var(--el-text-color-primary);
   background: var(--el-fill-color-dark);
+  border-radius: 999px;
 }
 
 .check-level.is-error {
@@ -818,8 +822,8 @@ function onAsyncExecute(info: any) {
 
 .check-node-display {
   display: inline-flex;
-  align-items: center;
   gap: 8px;
+  align-items: center;
   min-width: 0;
 }
 
@@ -843,24 +847,24 @@ function onAsyncExecute(info: any) {
   justify-content: center;
   width: 18px;
   height: 18px;
-  border-radius: 50%;
   font-size: 10px;
   font-weight: 700;
   color: var(--el-color-primary);
   background: var(--el-color-primary-light-9);
+  border-radius: 50%;
 }
 
 .check-node-title {
   font-size: 14px;
-  color: var(--el-text-color-primary);
   font-weight: 500;
+  color: var(--el-text-color-primary);
 }
 
 .check-item-message {
   font-size: 13px;
   line-height: 1.45;
   color: var(--el-color-danger);
-  word-break: break-word;
+  overflow-wrap: anywhere;
 }
 
 .checklist-slide-enter-active,
@@ -876,14 +880,15 @@ function onAsyncExecute(info: any) {
 
 .workflow-issue-focus :deep(.svelte-flow__node.selected) {
   border-color: var(--el-color-danger) !important;
-  box-shadow: 0 0 0 3px rgba(245, 108, 108, 0.26);
+  box-shadow: 0 0 0 3px rgb(245 108 108 / 26%);
   animation: issue-node-pulse 1.2s ease-out 1;
 }
 
 @keyframes issue-node-pulse {
   0% {
-    box-shadow: 0 0 0 0 rgba(245, 108, 108, 0.42);
+    box-shadow: 0 0 0 0 rgb(245 108 108 / 42%);
   }
+
   100% {
     box-shadow: 0 0 0 10px transparent;
   }

easyflow-ui-admin/app/src/views/ai/workflow/WorkflowList.vue

@@ -1,23 +1,15 @@
 <script setup lang="ts">
-import type {FormInstance} from 'element-plus';
-import {
-  ElForm,
-  ElFormItem,
-  ElIcon,
-  ElInput,
-  ElInputNumber,
-  ElMessage,
-  ElMessageBox,
-  ElPopover,
-} from 'element-plus';
+import type { FormInstance } from 'element-plus';
 
-import type {ActionButton, CardPrimaryAction,} from '#/components/page/CardList.vue';
-import CardList from '#/components/page/CardList.vue';
+import type {
+  ActionButton,
+  CardPrimaryAction,
+} from '#/components/page/CardList.vue';
 
-import {computed, markRaw, onMounted, ref} from 'vue';
+import { computed, markRaw, onMounted, ref } from 'vue';
 
-import {useAccess} from '@easyflow/access';
-import {EasyFlowFormModal} from '@easyflow/common-ui';
+import { useAccess } from '@easyflow/access';
+import { EasyFlowFormModal } from '@easyflow/common-ui';
 
 import {
   Check,
@@ -33,18 +25,29 @@ import {
   Upload,
   VideoPlay,
 } from '@element-plus/icons-vue';
-import {tryit} from 'radash';
+import {
+  ElForm,
+  ElFormItem,
+  ElIcon,
+  ElInput,
+  ElInputNumber,
+  ElMessage,
+  ElMessageBox,
+  ElPopover,
+} from 'element-plus';
+import { tryit } from 'radash';
 
-import {api} from '#/api/request';
+import { api } from '#/api/request';
 import workflowIcon from '#/assets/ai/workflow/workflowIcon.png';
 // import workflowSvg from '#/assets/workflow.svg';
 import HeaderSearch from '#/components/headerSearch/HeaderSearch.vue';
 import DesignIcon from '#/components/icons/DesignIcon.vue';
+import CardList from '#/components/page/CardList.vue';
 import PageData from '#/components/page/PageData.vue';
 import PageSide from '#/components/page/PageSide.vue';
-import {$t} from '#/locales';
-import {router} from '#/router';
-import {useDictStore} from '#/store';
+import { $t } from '#/locales';
+import { router } from '#/router';
+import { useDictStore } from '#/store';
 
 import WorkflowModal from './WorkflowModal.vue';
 
@@ -61,7 +64,7 @@ interface FieldDefinition {
   placeholder?: string;
 }
 
-type VisibilityScope = 'PRIVATE' | 'DEPT' | 'PUBLIC';
+type VisibilityScope = 'DEPT' | 'PRIVATE' | 'PUBLIC';
 
 const primaryAction: CardPrimaryAction = {
   icon: DesignIcon,
@@ -72,11 +75,11 @@ const primaryAction: CardPrimaryAction = {
   },
 };
 
-const {hasAccessByCodes} = useAccess();
+const { hasAccessByCodes } = useAccess();
 const canManageWorkflow = computed(() =>
   hasAccessByCodes(['/api/v1/workflow/save']),
 );
-const updatingScopeId = ref<string | number | null>(null);
+const updatingScopeId = ref<null | number | string>(null);
 const visibilityScopePopoverRefs = ref<Record<string, any>>({});
 const visibilityScopeMeta = computed(() => ({
   PRIVATE: {
@@ -203,10 +206,12 @@ function initDict() {
   dictStore.fetchDictionary('dataStatus');
 }
 function resolveVisibilityScopeMeta(scope?: string) {
-  return visibilityScopeMeta.value[(scope || 'PRIVATE') as VisibilityScope] ||
-    visibilityScopeMeta.value.PRIVATE;
+  return (
+    visibilityScopeMeta.value[(scope || 'PRIVATE') as VisibilityScope] ||
+    visibilityScopeMeta.value.PRIVATE
+  );
 }
-function setVisibilityScopePopoverRef(id: string | number, el: any) {
+function setVisibilityScopePopoverRef(id: number | string, el: any) {
   const cacheKey = String(id);
   if (el) {
     visibilityScopePopoverRefs.value[cacheKey] = el;
@@ -214,7 +219,7 @@ function setVisibilityScopePopoverRef(id: string | number, el: any) {
   }
   delete visibilityScopePopoverRefs.value[cacheKey];
 }
-function closeVisibilityScopePopover(id: string | number) {
+function closeVisibilityScopePopover(id: number | string) {
   visibilityScopePopoverRefs.value[String(id)]?.hide?.();
 }
 async function updateVisibilityScope(
@@ -509,11 +514,16 @@ function handleHeaderButtonClick(data: any) {
                     >
                       <ElIcon class="workflow-scope-chip__icon">
                         <component
-                          :is="resolveVisibilityScopeMeta(item.visibilityScope).icon"
+                          :is="
+                            resolveVisibilityScopeMeta(item.visibilityScope)
+                              .icon
+                          "
                         />
                       </ElIcon>
                       <span class="workflow-scope-chip__label">
-                        {{ resolveVisibilityScopeMeta(item.visibilityScope).label }}
+                        {{
+                          resolveVisibilityScopeMeta(item.visibilityScope).label
+                        }}
                       </span>
                     </button>
                   </template>
@@ -564,7 +574,9 @@ function handleHeaderButtonClick(data: any) {
                 >
                   <ElIcon class="workflow-scope-chip__icon">
                     <component
-                      :is="resolveVisibilityScopeMeta(item.visibilityScope).icon"
+                      :is="
+                        resolveVisibilityScopeMeta(item.visibilityScope).icon
+                      "
                     />
                   </ElIcon>
                   <span class="workflow-scope-chip__label">
@@ -629,7 +641,7 @@ function handleHeaderButtonClick(data: any) {
   font-weight: 600;
   line-height: 1;
   color: hsl(var(--text-strong));
-  background: hsl(var(--surface-subtle) / 0.92);
+  background: hsl(var(--surface-subtle) / 92%);
   border: 1px solid hsl(var(--line-subtle));
   border-radius: 999px;
   transition:
@@ -645,15 +657,15 @@ button.workflow-scope-chip {
 }
 
 button.workflow-scope-chip:hover {
+  box-shadow: 0 10px 22px -18px hsl(var(--foreground) / 32%);
   transform: translateY(-1px);
-  box-shadow: 0 10px 22px -18px hsl(var(--foreground) / 0.32);
 }
 
 button.workflow-scope-chip:focus-visible {
   outline: none;
   box-shadow:
-    0 0 0 4px hsl(var(--primary) / 0.12),
-    0 10px 22px -18px hsl(var(--foreground) / 0.32);
+    0 0 0 4px hsl(var(--primary) / 12%),
+    0 10px 22px -18px hsl(var(--foreground) / 32%);
 }
 
 button.workflow-scope-chip:disabled {
@@ -676,20 +688,20 @@ button.workflow-scope-chip:disabled {
 
 .workflow-scope-chip--private {
   color: hsl(var(--primary));
-  background: hsl(var(--primary) / 0.09);
-  border-color: hsl(var(--primary) / 0.2);
+  background: hsl(var(--primary) / 9%);
+  border-color: hsl(var(--primary) / 20%);
 }
 
 .workflow-scope-chip--dept {
   color: hsl(var(--warning));
-  background: hsl(var(--warning) / 0.12);
-  border-color: hsl(var(--warning) / 0.2);
+  background: hsl(var(--warning) / 12%);
+  border-color: hsl(var(--warning) / 20%);
 }
 
 .workflow-scope-chip--public {
   color: hsl(var(--success));
-  background: hsl(var(--success) / 0.12);
-  border-color: hsl(var(--success) / 0.2);
+  background: hsl(var(--success) / 12%);
+  border-color: hsl(var(--success) / 20%);
 }
 
 .workflow-scope-panel {
@@ -700,9 +712,9 @@ button.workflow-scope-chip:disabled {
 
 .workflow-scope-option {
   display: flex;
+  gap: 10px;
   align-items: center;
   justify-content: space-between;
-  gap: 10px;
   width: 100%;
   padding: 10px 8px;
   text-align: left;
@@ -716,12 +728,12 @@ button.workflow-scope-chip:disabled {
 }
 
 .workflow-scope-option:hover {
-  background: hsl(var(--foreground) / 0.04);
+  background: hsl(var(--foreground) / 4%);
 }
 
 .workflow-scope-option:focus-visible {
   outline: none;
-  box-shadow: 0 0 0 4px hsl(var(--primary) / 0.12);
+  box-shadow: 0 0 0 4px hsl(var(--primary) / 12%);
 }
 
 .workflow-scope-option:disabled {
@@ -742,8 +754,8 @@ button.workflow-scope-chip:disabled {
   justify-content: center;
   width: 30px;
   height: 30px;
-  border-radius: 9px;
   background: transparent;
+  border-radius: 9px;
 }
 
 .workflow-scope-option__icon {
@@ -776,29 +788,29 @@ button.workflow-scope-chip:disabled {
 
 .workflow-scope-option--private .workflow-scope-option__icon-wrap {
   color: hsl(var(--primary));
-  background: hsl(var(--primary) / 0.1);
+  background: hsl(var(--primary) / 10%);
 }
 
 .workflow-scope-option--dept .workflow-scope-option__icon-wrap {
   color: hsl(var(--warning));
-  background: hsl(var(--warning) / 0.12);
+  background: hsl(var(--warning) / 12%);
 }
 
 .workflow-scope-option--public .workflow-scope-option__icon-wrap {
   color: hsl(var(--success));
-  background: hsl(var(--success) / 0.12);
+  background: hsl(var(--success) / 12%);
 }
 
 .workflow-scope-option--private.workflow-scope-option--active {
-  background: hsl(var(--primary) / 0.08);
+  background: hsl(var(--primary) / 8%);
 }
 
 .workflow-scope-option--dept.workflow-scope-option--active {
-  background: hsl(var(--warning) / 0.08);
+  background: hsl(var(--warning) / 8%);
 }
 
 .workflow-scope-option--public.workflow-scope-option--active {
-  background: hsl(var(--success) / 0.08);
+  background: hsl(var(--success) / 8%);
 }
 
 .workflow-scope-option--private .workflow-scope-option__check {
@@ -815,8 +827,8 @@ button.workflow-scope-chip:disabled {
 
 :global(.workflow-visibility-popover.el-popover.el-popper) {
   padding: 8px;
-  border-radius: 16px;
   border-color: hsl(var(--line-subtle));
-  box-shadow: 0 18px 34px -28px hsl(var(--foreground) / 0.2);
+  border-radius: 16px;
+  box-shadow: 0 18px 34px -28px hsl(var(--foreground) / 20%);
 }
 </style>

easyflow-ui-admin/app/src/views/ai/workflow/WorkflowModal.vue

@@ -84,7 +84,7 @@ function openDialog(row: any, importMode = false) {
   isAdd.value = !row?.id;
   entity.value = {
     ...createDefaultEntity(),
-    ...(row || {}),
+    ...row,
   };
   dialogVisible.value = true;
 }

easyflow-ui-admin/app/src/views/ai/workflow/components/ConfirmItem.vue

@@ -65,7 +65,7 @@ const handleDownload = (url: string) => {
         v-if="selectionDataType === 'text'"
         class="custom-radio-option"
         :class="{ selected: isSelected(item) }"
-        style="width: 100%; flex-shrink: 0"
+        style="flex-shrink: 0; width: 100%"
         @click="changeValue(item)"
       >
         {{ item }}
@@ -82,7 +82,7 @@ const handleDownload = (url: string) => {
         <img
           :src="item"
           alt=""
-          style="width: 80px; height: 80px; border-radius: 8px; display: block"
+          style="display: block; width: 80px; height: 80px; border-radius: 8px"
         />
       </div>
 
@@ -101,7 +101,7 @@ const handleDownload = (url: string) => {
         v-else-if="selectionDataType === 'audio'"
         class="custom-radio-option"
         :class="{ selected: isSelected(item) }"
-        style="width: 100%; flex-shrink: 0"
+        style="flex-shrink: 0; width: 100%"
         @click="changeValue(item)"
       >
         <audio
@@ -118,17 +118,17 @@ const handleDownload = (url: string) => {
         "
         class="custom-radio-option"
         :class="{ selected: isSelected(item) }"
-        style="width: 100%; flex-shrink: 0"
+        style="flex-shrink: 0; width: 100%"
         @click="changeValue(item)"
       >
         <div
           style="
             display: flex;
-            justify-content: space-between;
             align-items: center;
+            justify-content: space-between;
           "
         >
-          <div style="width: 92%; display: flex; align-items: center">
+          <div style="display: flex; align-items: center; width: 92%">
             <img
               style="width: 20px; height: 20px; margin-right: 8px"
               alt=""
@@ -151,19 +151,19 @@ const handleDownload = (url: string) => {
 <style scoped>
 .custom-radio-group {
   display: flex;
-  gap: 12px;
   flex-wrap: wrap;
+  gap: 12px;
 }
 
 .custom-radio-option {
-  background-color: var(--el-bg-color);
-  padding: 8px;
-  border-radius: 8px;
-  cursor: pointer;
   position: relative;
+  box-sizing: border-box; /* 确保 padding 不会撑大宽度 */
+  padding: 8px;
+  cursor: pointer;
+  background-color: var(--el-bg-color);
+  border-radius: 8px;
   box-shadow: 0 0 0 1px var(--el-border-color);
   transition: all 0.2s;
-  box-sizing: border-box; /* 确保 padding 不会撑大宽度 */
 }
 
 .custom-radio-option:hover {
@@ -171,41 +171,41 @@ const handleDownload = (url: string) => {
 }
 
 .custom-radio-option.selected {
-  box-shadow: 0 0 0 1px var(--el-color-primary-light-3);
   padding: 8px;
   background: var(--el-color-primary-light-9);
+  box-shadow: 0 0 0 1px var(--el-color-primary-light-3);
 }
 
 .custom-radio-option.selected::after {
-  content: '';
   position: absolute;
   right: 0;
   bottom: 0;
+  box-sizing: border-box;
   width: 16px;
   height: 16px;
+  content: '';
   background-color: var(--el-color-primary);
   border-radius: 6px 2px;
-  box-sizing: border-box;
 }
 
 .custom-radio-option.selected::before {
-  content: '';
   position: absolute;
   right: 3px;
   bottom: 7px;
+  z-index: 1;
   width: 9px;
   height: 4px;
-  border-left: 1px solid white;
+  content: '';
   border-bottom: 1px solid white;
+  border-left: 1px solid white;
   transform: rotate(-45deg);
-  z-index: 1;
 }
 
 .download-icon-btn {
-  font-size: 18px;
-  cursor: pointer;
-  margin-right: 10px;
   display: flex; /* 为了对齐图标 */
   align-items: center;
+  margin-right: 10px;
+  font-size: 18px;
+  cursor: pointer;
 }
 </style>

easyflow-ui-admin/app/src/views/ai/workflow/components/ConfirmItemMulti.vue

@@ -73,7 +73,7 @@ const handleDownload = (url: string) => {
         v-if="selectionDataType === 'text'"
         class="custom-radio-option"
         :class="{ selected: isSelected(item) }"
-        style="width: 100%; flex-shrink: 0"
+        style="flex-shrink: 0; width: 100%"
         @click="changeValue(item)"
       >
         {{ item }}
@@ -90,7 +90,7 @@ const handleDownload = (url: string) => {
         <img
           :src="item"
           alt=""
-          style="width: 80px; height: 80px; border-radius: 8px; display: block"
+          style="display: block; width: 80px; height: 80px; border-radius: 8px"
         />
       </div>
 
@@ -109,7 +109,7 @@ const handleDownload = (url: string) => {
         v-else-if="selectionDataType === 'audio'"
         class="custom-radio-option"
         :class="{ selected: isSelected(item) }"
-        style="width: 300px; flex-shrink: 0"
+        style="flex-shrink: 0; width: 300px"
         @click="changeValue(item)"
       >
         <audio controls :src="item" style="width: 100%; height: 40px"></audio>
@@ -122,17 +122,17 @@ const handleDownload = (url: string) => {
         "
         class="custom-radio-option"
         :class="{ selected: isSelected(item) }"
-        style="width: 100%; flex-shrink: 0"
+        style="flex-shrink: 0; width: 100%"
         @click="changeValue(item)"
       >
         <div
           style="
             display: flex;
-            justify-content: space-between;
             align-items: center;
+            justify-content: space-between;
           "
         >
-          <div style="width: 92%; display: flex; align-items: center">
+          <div style="display: flex; align-items: center; width: 92%">
             <img
               style="width: 20px; height: 20px; margin-right: 8px"
               alt=""
@@ -156,19 +156,19 @@ const handleDownload = (url: string) => {
 /* 这里复用之前的 CSS，样式完全一致 */
 .custom-radio-group {
   display: flex;
-  gap: 12px;
   flex-wrap: wrap;
+  gap: 12px;
 }
 
 .custom-radio-option {
-  background-color: var(--el-bg-color);
-  padding: 8px;
-  border-radius: 8px;
-  cursor: pointer;
   position: relative;
+  box-sizing: border-box;
+  padding: 8px;
+  cursor: pointer;
+  background-color: var(--el-bg-color);
+  border-radius: 8px;
   box-shadow: 0 0 0 1px var(--el-border-color);
   transition: all 0.2s;
-  box-sizing: border-box;
 }
 
 .custom-radio-option:hover {
@@ -176,41 +176,41 @@ const handleDownload = (url: string) => {
 }
 
 .custom-radio-option.selected {
-  box-shadow: 0 0 0 1px var(--el-color-primary-light-3);
   padding: 8px;
   background: var(--el-color-primary-light-9);
+  box-shadow: 0 0 0 1px var(--el-color-primary-light-3);
 }
 
 .custom-radio-option.selected::after {
-  content: '';
   position: absolute;
   right: 0;
   bottom: 0;
+  box-sizing: border-box;
   width: 16px;
   height: 16px;
+  content: '';
   background-color: var(--el-color-primary);
   border-radius: 6px 2px;
-  box-sizing: border-box;
 }
 
 .custom-radio-option.selected::before {
-  content: '';
   position: absolute;
   right: 3px;
   bottom: 7px;
+  z-index: 1;
   width: 9px;
   height: 5px;
-  border-left: 1px solid white;
+  content: '';
   border-bottom: 1px solid white;
+  border-left: 1px solid white;
   transform: rotate(-45deg);
-  z-index: 1;
 }
 
 .download-icon-btn {
-  font-size: 18px;
-  cursor: pointer;
-  margin-right: 10px;
   display: flex;
   align-items: center;
+  margin-right: 10px;
+  font-size: 18px;
+  cursor: pointer;
 }
 </style>

easyflow-ui-admin/app/src/views/ai/workflow/components/SingleRun.vue

@@ -71,9 +71,7 @@ function submit() {
         </ElButton>
       </ElFormItem>
     </ElForm>
-    <div class="mb-2.5 mt-2.5 font-semibold">
-      {{ $t('workflow.result') }}：
-    </div>
+    <div class="mb-2.5 mt-2.5 font-semibold">{{ $t('workflow.result') }}：</div>
     <ShowJson :value="result" />
   </div>
 </template>

easyflow-ui-admin/app/src/views/ai/workflow/customNode/datasetNodeRenderer.ts

@@ -3,9 +3,11 @@ import type {
   ManagedDatasetOption,
   ManagedDatasetSourceOption,
 } from './datasetOptions';
+
 import huaweiIcon from '#/assets/datacenter/huawei-icon.svg';
 import mysqlIcon from '#/assets/datacenter/mysql-icon.svg';
 import postgresqlIcon from '#/assets/datacenter/postgresql-icon.svg';
+
 import {
   groupManagedDatasetOptions,
   loadManagedDatasetOptions,
@@ -24,15 +26,15 @@ const SOURCE_LOGO_MAP: Record<string, string> = {
 };
 
 type NodeLike = {
-  id: string;
   data?: Record<string, any>;
+  id: string;
 };
 
 type UpdateNodeData = (
   nodeId: string,
   data:
-    | Record<string, any>
-    | ((node: Record<string, any>) => Record<string, any>),
+    | ((node: Record<string, any>) => Record<string, any>)
+    | Record<string, any>,
 ) => void;
 
 type FlowInstance = {
@@ -42,10 +44,10 @@ type FlowInstance = {
 type RenderContext = FlowInstance | undefined;
 
 type RendererState = {
-  pickerOpen: boolean;
   loadingOptions: boolean;
-  optionsLoaded: boolean;
   options: ManagedDatasetOption[];
+  optionsLoaded: boolean;
+  pickerOpen: boolean;
   sources: ManagedDatasetSourceOption[];
   tableSearchText: string;
   updateNodeData?: UpdateNodeData;
@@ -75,11 +77,13 @@ function getUpdateNodeData(parent: HTMLElement, flowInstance?: RenderContext) {
 }
 
 function getDatasetKey(datasetRef?: DatasetRefPayload | null) {
-  return datasetRef?.tableId == null ? '' : String(datasetRef.tableId);
+  const tableId = datasetRef?.tableId;
+  return tableId === null || tableId === undefined ? '' : String(tableId);
 }
 
 function getSourceKey(datasetRef?: DatasetRefPayload | null) {
-  return datasetRef?.sourceId == null ? '' : String(datasetRef.sourceId);
+  const sourceId = datasetRef?.sourceId;
+  return sourceId === null || sourceId === undefined ? '' : String(sourceId);
 }
 
 function createSourceOnlyDatasetRef(
@@ -95,7 +99,7 @@ function createSourceOnlyDatasetRef(
   };
 }
 
-function escapeHtml(value?: string | number | null) {
+function escapeHtml(value?: null | number | string) {
   return String(value ?? '')
     .replaceAll('&', '&amp;')
     .replaceAll('<', '&lt;')
@@ -410,7 +414,7 @@ function buildSourceList(
   activeKey: string,
   emptyText: string,
 ) {
-  if (!options.length) {
+  if (options.length === 0) {
     return `<div class="dataset-node-empty">${emptyText}</div>`;
   }
   return options
@@ -432,7 +436,7 @@ function buildTableList(
   activeKey: string,
   emptyText: string,
 ) {
-  if (!options.length) {
+  if (options.length === 0) {
     return `<div class="dataset-node-empty">${emptyText}</div>`;
   }
   return options
@@ -465,8 +469,10 @@ function bindInteractiveElements(parent: HTMLElement) {
   parent
     .querySelectorAll<HTMLElement>('button, input, select, textarea')
     .forEach((element) => {
-      element.onpointerdown = (event) => event.stopPropagation();
-      element.onmousedown = (event) => event.stopPropagation();
+      element.addEventListener('pointerdown', (event) =>
+        event.stopPropagation(),
+      );
+      element.addEventListener('mousedown', (event) => event.stopPropagation());
     });
 }
 
@@ -539,7 +545,7 @@ export function rerenderSearchNode(
         state.pickerOpen = false;
         const nextDatasetRef = createSourceOnlyDatasetRef(source);
         node.data = {
-          ...(node.data || {}),
+          ...node.data,
           datasetRef: nextDatasetRef,
           sourceName: source.sourceName,
           sourceType: source.sourceType,
@@ -606,7 +612,7 @@ export function rerenderSaveNode(
           return;
         }
         node.data = {
-          ...(node.data || {}),
+          ...node.data,
           datasetRef: option.datasetRef,
           sourceName: option.sourceName,
           sourceType: option.sourceType,

easyflow-ui-admin/app/src/views/ai/workflow/customNode/datasetOptions.ts

@@ -1,12 +1,12 @@
 import { api } from '#/api/request';
 
 export interface DatasetRefPayload {
-  sourceId: number | string | null;
-  catalogId?: number | string | null;
+  sourceId: null | number | string;
+  catalogId?: null | number | string;
   catalogName?: string;
-  tableId: number | string | null;
+  tableId: null | number | string;
   tableName: string;
-  versionId?: number | string | null;
+  versionId?: null | number | string;
 }
 
 export interface ManagedDatasetFieldOption {
@@ -57,21 +57,25 @@ function shouldSkipSourceError(error: any) {
 function dedupeManagedDatasetOptions(options: ManagedDatasetOption[]) {
   const uniqueOptions = new Map<string, ManagedDatasetOption>();
   for (const option of options || []) {
-    const key = option.datasetRef?.tableId != null
-      ? String(option.datasetRef.tableId)
-      : [
-          option.datasetRef?.sourceId ?? '',
-          option.datasetRef?.catalogId ?? '',
-          option.tableName ?? '',
-        ].join(':');
+    const tableId = option.datasetRef?.tableId;
+    const key =
+      tableId === null || tableId === undefined
+        ? [
+            option.datasetRef?.sourceId ?? '',
+            option.datasetRef?.catalogId ?? '',
+            option.tableName ?? '',
+          ].join(':')
+        : String(tableId);
     if (!uniqueOptions.has(key)) {
       uniqueOptions.set(key, option);
     }
   }
-  return Array.from(uniqueOptions.values());
+  return [...uniqueOptions.values()];
 }
 
-export async function loadManagedDatasetOptions(): Promise<ManagedDatasetOption[]> {
+export async function loadManagedDatasetOptions(): Promise<
+  ManagedDatasetOption[]
+> {
   const sourceRes = await api.get('/api/v1/datacenterSource/page', {
     params: {
       pageNumber: 1,
@@ -89,19 +93,23 @@ export async function loadManagedDatasetOptions(): Promise<ManagedDatasetOption[
       });
       const catalogs = catalogRes.data || [];
       for (const catalog of catalogs) {
-        const tableRes = await api.get('/api/v1/datacenterDataset/managedTables', {
-          params: {
-            sourceId: source.id,
-            catalogId: catalog.id,
+        const tableRes = await api.get(
+          '/api/v1/datacenterDataset/managedTables',
+          {
+            params: {
+              sourceId: source.id,
+              catalogId: catalog.id,
+            },
           },
-        });
+        );
         const tables = tableRes.data || [];
         for (const table of tables) {
           const label = `${source.sourceName} / ${catalog.catalogName} / ${table.tableName}`;
           options.push({
             label,
             value: table.id,
-            keywords: `${source.sourceName} ${catalog.catalogName} ${table.tableName}`.toLowerCase(),
+            keywords:
+              `${source.sourceName} ${catalog.catalogName} ${table.tableName}`.toLowerCase(),
             sourceName: source.sourceName,
             sourceType: source.sourceType,
             catalogName: catalog.catalogName,
@@ -132,7 +140,7 @@ export function groupManagedDatasetOptions(
   const grouped = new Map<number | string, ManagedDatasetSourceOption>();
   for (const option of dedupeManagedDatasetOptions(options || [])) {
     const sourceId = option.datasetRef?.sourceId;
-    if (sourceId == null) {
+    if (sourceId === null || sourceId === undefined) {
       continue;
     }
     if (!grouped.has(sourceId)) {
@@ -145,9 +153,12 @@ export function groupManagedDatasetOptions(
         tables: [],
       });
     }
-    grouped.get(sourceId)!.tables.push(option);
+    const group = grouped.get(sourceId);
+    if (group) {
+      group.tables.push(option);
+    }
   }
-  return Array.from(grouped.values()).map((item) => ({
+  return [...grouped.values()].map((item) => ({
     ...item,
     keywords: `${item.sourceName} ${item.tables
       .map((table) => `${table.catalogName} ${table.tableName}`)

easyflow-ui-admin/app/src/views/config/apikey/SysApiKey.vue

@@ -25,7 +25,7 @@ const dialogVisible = ref(false);
 
 <style scoped>
 .sys-apikey-container {
-  height: 100%;
   width: 100%;
+  height: 100%;
 }
 </style>

easyflow-ui-admin/app/src/views/config/apikey/SysApiKeyResourcePermissionList.vue

@@ -128,7 +128,11 @@ function remove(row: any) {
                 {{ row.title }}
               </template>
             </ElTableColumn>
-            <ElTableColumn :label="$t('common.handle')" width="90" align="right">
+            <ElTableColumn
+              :label="$t('common.handle')"
+              width="90"
+              align="right"
+            >
               <template #default="{ row }">
                 <div class="flex items-center gap-3">
                   <ElButton link type="primary" @click="showDialog(row)">

easyflow-ui-admin/app/src/views/config/settings/Settings.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import {onMounted, ref} from 'vue';
+import { onMounted, ref } from 'vue';
 
-import {$t} from '@easyflow/locales';
+import { $t } from '@easyflow/locales';
 
 import {
   ElAlert,
@@ -14,7 +14,7 @@ import {
   ElSelect,
 } from 'element-plus';
 
-import {api} from '#/api/request.js';
+import { api } from '#/api/request.js';
 import providerList from '#/views/ai/model/modelUtils/providerList.json';
 
 interface ProviderOptionExtra {

easyflow-ui-admin/app/src/views/datacenter/DatacenterWorkspace.vue

@@ -475,24 +475,24 @@ onBeforeUnmount(() => {
   flex-direction: column;
   width: 100%;
   min-height: 0;
-  margin-top: 0;
   padding-top: 12px;
-  background: transparent;
+  margin-top: 0;
   overflow: hidden;
+  background: transparent;
 }
 
 .workspace-toolbar {
   display: flex;
+  gap: 12px;
   align-items: center;
   justify-content: flex-start;
-  gap: 12px;
   padding: 0 0 12px;
 }
 
 .toolbar-left {
   display: flex;
-  align-items: center;
   gap: 8px;
+  align-items: center;
 }
 
 .toolbar-button {
@@ -501,8 +501,8 @@ onBeforeUnmount(() => {
 }
 
 .workspace-body {
-  width: 100%;
   flex: 1;
+  width: 100%;
   min-height: 0;
   overflow: hidden;
   background: transparent;
@@ -519,13 +519,13 @@ onBeforeUnmount(() => {
 }
 
 .workspace-body :deep([data-panel-resize-handle-enabled]::before) {
-  content: '';
   position: absolute;
   top: 20px;
   bottom: 20px;
   left: 50%;
   width: 1px;
-  background: hsl(var(--border) / 0.32);
+  content: '';
+  background: hsl(var(--border) / 32%);
   transform: translateX(-50%);
 }
 

easyflow-ui-admin/app/src/views/datacenter/components/ConnectionTree.vue

@@ -237,8 +237,8 @@ onBeforeUnmount(() => {
 
 .search-actions {
   display: flex;
-  align-items: center;
   gap: 6px;
+  align-items: center;
 }
 
 .search-row :deep(.el-input) {
@@ -250,9 +250,9 @@ onBeforeUnmount(() => {
 }
 
 .action-icon {
+  flex-shrink: 0;
   width: 14px;
   height: 14px;
-  flex-shrink: 0;
 }
 
 .create-action {
@@ -266,22 +266,22 @@ onBeforeUnmount(() => {
   min-width: 36px;
   height: 36px;
   padding-inline: 0;
-  border-color: hsl(var(--border) / 0.9);
-  background: hsl(var(--card));
   color: hsl(var(--text-strong));
+  background: hsl(var(--card));
+  border-color: hsl(var(--border) / 90%);
   box-shadow: none;
 }
 
 .refresh-action:hover {
-  background: hsl(var(--surface-subtle));
   color: hsl(var(--foreground));
+  background: hsl(var(--surface-subtle));
 }
 
 .tree-scroll {
   flex: 1;
   min-height: 0;
-  overflow: auto;
   padding-right: 4px;
+  overflow: auto;
 }
 
 .tree-list {
@@ -293,17 +293,17 @@ onBeforeUnmount(() => {
 
 .tree-node {
   display: flex;
-  align-items: center;
   gap: 12px;
+  align-items: center;
   min-height: 62px;
   padding: 12px 14px;
-  border: 1px solid hsl(var(--border) / 0.52);
-  border-radius: 14px;
-  background: hsl(var(--card) / 0.92);
-  box-shadow: 0 10px 22px -22px hsl(var(--foreground) / 0.22);
+  color: hsl(var(--foreground));
   cursor: pointer;
   user-select: none;
-  color: hsl(var(--foreground));
+  background: hsl(var(--card) / 92%);
+  border: 1px solid hsl(var(--border) / 52%);
+  border-radius: 14px;
+  box-shadow: 0 10px 22px -22px hsl(var(--foreground) / 22%);
   transition:
     transform 0.16s,
     background-color 0.16s,
@@ -313,19 +313,19 @@ onBeforeUnmount(() => {
 }
 
 .tree-node:hover {
-  transform: translateY(-1px);
-  border-color: hsl(var(--border) / 0.74);
   background: hsl(var(--card));
-  box-shadow: 0 16px 30px -24px hsl(var(--foreground) / 0.22);
+  border-color: hsl(var(--border) / 74%);
+  box-shadow: 0 16px 30px -24px hsl(var(--foreground) / 22%);
+  transform: translateY(-1px);
 }
 
 .tree-node.is-selected {
-  border-color: hsl(var(--primary) / 0.24);
-  background: hsl(var(--primary) / 0.08);
   color: hsl(var(--foreground));
+  background: hsl(var(--primary) / 8%);
+  border-color: hsl(var(--primary) / 24%);
   box-shadow:
-    inset 0 0 0 1px hsl(var(--primary) / 0.12),
-    0 18px 34px -28px hsl(var(--primary) / 0.24);
+    inset 0 0 0 1px hsl(var(--primary) / 12%),
+    0 18px 34px -28px hsl(var(--primary) / 24%);
 }
 
 .tree-node--source {
@@ -333,17 +333,17 @@ onBeforeUnmount(() => {
 }
 
 .tree-node--table {
-  margin-left: 20px;
   align-items: center;
+  margin-left: 20px;
 }
 
 .node-arrow {
   display: inline-flex;
+  flex-shrink: 0;
   align-items: center;
   justify-content: center;
   width: 16px;
   height: 16px;
-  flex-shrink: 0;
   transition: transform 0.15s;
 }
 
@@ -359,18 +359,18 @@ onBeforeUnmount(() => {
 
 .node-media {
   display: inline-flex;
+  flex-shrink: 0;
   align-items: center;
   justify-content: center;
   width: 34px;
   height: 34px;
-  flex-shrink: 0;
   margin-top: 1px;
+  background: hsl(var(--surface-subtle) / 92%);
   border-radius: 11px;
-  background: hsl(var(--surface-subtle) / 0.92);
 }
 
 .tree-node.is-selected .node-media {
-  background: hsl(var(--primary) / 0.12);
+  background: hsl(var(--primary) / 12%);
 }
 
 .node-media :deep(svg) {
@@ -379,9 +379,9 @@ onBeforeUnmount(() => {
 }
 
 .node-icon {
+  flex-shrink: 0;
   width: 17px;
   height: 17px;
-  flex-shrink: 0;
   color: hsl(var(--text-muted));
 }
 
@@ -391,46 +391,46 @@ onBeforeUnmount(() => {
 
 .node-content {
   display: flex;
-  flex-direction: column;
   flex: 1;
-  min-width: 0;
-  align-items: flex-start;
+  flex-direction: column;
   gap: 4px;
+  align-items: flex-start;
+  min-width: 0;
 }
 
 .node-label {
   display: -webkit-box;
   overflow: hidden;
   -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  white-space: normal;
   font-size: 14px;
   line-height: 1.3;
   letter-spacing: 0.01em;
+  white-space: normal;
+  -webkit-box-orient: vertical;
 }
 
 .node-meta {
   font-size: 12px;
-  line-height: 1.2;
   font-weight: 500;
+  line-height: 1.2;
   color: hsl(var(--text-muted));
 }
 
 .node-status-dot {
+  flex-shrink: 0;
   width: 8px;
   height: 8px;
-  flex-shrink: 0;
   margin-left: auto;
-  border-radius: 999px;
   background: hsl(var(--destructive));
-  box-shadow: 0 0 0 3px hsl(var(--destructive) / 0.12);
+  border-radius: 999px;
+  box-shadow: 0 0 0 3px hsl(var(--destructive) / 12%);
 }
 
 .tree-empty {
   padding: 32px 16px;
-  text-align: center;
   font-size: 13px;
   color: hsl(var(--text-muted));
+  text-align: center;
 }
 
 .connection-context-menu {
@@ -438,10 +438,10 @@ onBeforeUnmount(() => {
   z-index: 30;
   min-width: 136px;
   padding: 6px;
-  border: 1px solid hsl(var(--border) / 0.7);
-  border-radius: 12px;
   background: hsl(var(--popover));
-  box-shadow: 0 18px 34px -28px hsl(var(--foreground) / 0.26);
+  border: 1px solid hsl(var(--border) / 70%);
+  border-radius: 12px;
+  box-shadow: 0 18px 34px -28px hsl(var(--foreground) / 26%);
   backdrop-filter: blur(10px);
 }
 
@@ -451,17 +451,17 @@ onBeforeUnmount(() => {
   width: 100%;
   min-height: 34px;
   padding: 0 10px;
-  border: 0;
-  border-radius: 8px;
-  background: transparent;
-  color: hsl(var(--foreground));
   font-size: 13px;
+  color: hsl(var(--foreground));
   text-align: left;
   cursor: pointer;
+  background: transparent;
+  border: 0;
+  border-radius: 8px;
 }
 
 .context-menu-item:hover {
-  background: hsl(var(--accent) / 0.86);
+  background: hsl(var(--accent) / 86%);
 }
 
 .context-menu-item--danger {
@@ -469,6 +469,6 @@ onBeforeUnmount(() => {
 }
 
 .context-menu-item--danger:hover {
-  background: hsl(var(--destructive) / 0.1);
+  background: hsl(var(--destructive) / 10%);
 }
 </style>

easyflow-ui-admin/app/src/views/datacenter/components/ExcelActionDrawer.vue

@@ -14,8 +14,8 @@ import {
 
 defineProps<{
   actionLoading: boolean;
-  managedTables: any[];
   fieldOptions: { label: string; value: string }[];
+  managedTables: any[];
   pendingUploadFile: File | null;
 }>();
 
@@ -29,7 +29,9 @@ const emit = defineEmits<{
 }>();
 
 const visible = defineModel<boolean>('visible', { default: false });
-const activeAction = ref<'derive' | 'export' | 'import' | 'merge' | 'split'>('import');
+const activeAction = ref<'derive' | 'export' | 'import' | 'merge' | 'split'>(
+  'import',
+);
 
 const splitForm = defineModel<any>('splitForm', { required: true });
 const mergeForm = defineModel<any>('mergeForm', { required: true });
@@ -47,6 +49,10 @@ const drawerTitle = computed(() => {
   return titles[activeAction.value] || '数据操作';
 });
 
+const deriveRenamePlaceholder = '字段重命名 JSON，例如 {"old":"new"}';
+const deriveFilterPlaceholder =
+  '筛选条件 JSON，例如 [{"column":"status","operator":"EQ","value":"OPEN"}]';
+
 function open(action: 'derive' | 'export' | 'import' | 'merge' | 'split') {
   activeAction.value = action;
   visible.value = true;
@@ -58,11 +64,28 @@ function handleUploadChange(file: UploadUserFile) {
 
 function handleConfirm() {
   const action = activeAction.value;
-  if (action === 'import') emit('import');
-  else if (action === 'split') emit('split');
-  else if (action === 'merge') emit('merge');
-  else if (action === 'derive') emit('derive');
-  else if (action === 'export') emit('export');
+  switch (action) {
+    case 'derive': {
+      emit('derive');
+      break;
+    }
+    case 'export': {
+      emit('export');
+      break;
+    }
+    case 'import': {
+      emit('import');
+      break;
+    }
+    case 'merge': {
+      emit('merge');
+      break;
+    }
+    case 'split': {
+      emit('split');
+      break;
+    }
+  }
 }
 
 defineExpose({ open });
@@ -96,7 +119,10 @@ defineExpose({ open });
           <ElOption label="按字段值" value="BY_FIELD_VALUE" />
           <ElOption label="按工作表" value="BY_SHEET" />
         </ElSelect>
-        <ElInput v-model="splitForm.targetNamePrefix" placeholder="新表名前缀" />
+        <ElInput
+          v-model="splitForm.targetNamePrefix"
+          placeholder="新表名前缀"
+        />
         <ElInput
           v-if="splitForm.splitMode === 'BY_ROW_COUNT'"
           v-model="splitForm.rowBatchSize"
@@ -154,13 +180,13 @@ defineExpose({ open });
           v-model="deriveForm.renameMappingsText"
           type="textarea"
           :rows="4"
-          placeholder='字段重命名 JSON，例如 {"old":"new"}'
+          :placeholder="deriveRenamePlaceholder"
         />
         <ElInput
           v-model="deriveForm.filtersText"
           type="textarea"
           :rows="5"
-          placeholder='筛选条件 JSON，例如 [{"column":"status","operator":"EQ","value":"OPEN"}]'
+          :placeholder="deriveFilterPlaceholder"
         />
       </template>
 
@@ -177,12 +203,22 @@ defineExpose({ open });
     <template #footer>
       <div class="drawer-footer">
         <ElButton @click="visible = false">取消</ElButton>
-        <ElButton type="primary" :loading="actionLoading" @click="handleConfirm">
-          {{ activeAction === 'import' ? '开始导入' :
-             activeAction === 'split' ? '开始拆分' :
-             activeAction === 'merge' ? '开始合并' :
-             activeAction === 'derive' ? '开始生成' :
-             '生成并下载' }}
+        <ElButton
+          type="primary"
+          :loading="actionLoading"
+          @click="handleConfirm"
+        >
+          {{
+            activeAction === 'import'
+              ? '开始导入'
+              : activeAction === 'split'
+                ? '开始拆分'
+                : activeAction === 'merge'
+                  ? '开始合并'
+                  : activeAction === 'derive'
+                    ? '开始生成'
+                    : '生成并下载'
+          }}
         </ElButton>
       </div>
     </template>
@@ -198,13 +234,13 @@ defineExpose({ open });
 
 .upload-hint {
   padding: 24px;
-  color: hsl(var(--text-muted));
   font-size: 14px;
+  color: hsl(var(--text-muted));
 }
 
 .drawer-footer {
   display: flex;
-  align-items: center;
   gap: 8px;
+  align-items: center;
 }
 </style>