Kaynağa Gözat

feat: 优化1——登录背景图,筛选选项展示优化,初始化流程查看优化

wuwenyi 3 gün önce
ebeveyn
işleme
0d8cb1ce66

+ 1 - 1
src/api/flow/instance.ts

@@ -8,7 +8,7 @@ export function listMyInstance(params?: PageQuery): Promise<PageResult<FlowInsta
 }
 
 export function listInstance(
-  params?: PageQuery & { applicantName?: string; processName?: string; definitionName?: string; currentNodeName?: string }
+  params?: PageQuery & { applicantName?: string; processName?: string; definitionName?: string; processDefinitionId?: number; currentNodeName?: string }
 ): Promise<PageResult<FlowInstance>> {
   return http.get('/flow/instance/page', { params })
 }

BIN
src/assets/login-bg.png


+ 2 - 0
src/views/analysis/StuckInstanceTable.vue

@@ -98,6 +98,8 @@ function updateQuery() {
 }
 
 function onProcessChange() {
+  const def = props.definitionList.find((d) => d.id === localQuery.processDefinitionId)
+  localQuery.processName = def?.name || ''
   updateQuery()
   emit('process-change')
 }

+ 33 - 5
src/views/analysis/useAnalysis.ts

@@ -275,13 +275,36 @@ export function useAnalysis() {
     try {
       definitionOptions.value = await listEnabled()
       if (definitionOptions.value.length > 0 && !query.processDefinitionId) {
-        query.processDefinitionId = definitionOptions.value[definitionOptions.value.length - 1].id
+        const last = definitionOptions.value[definitionOptions.value.length - 1]
+        query.processDefinitionId = last.id
+        // 同步默认流程到明细卡片
+        instanceQuery.processDefinitionId = last.id
       }
+      loadCurrentNodeOptions()
     } catch {
       definitionOptions.value = []
     }
   }
 
+  function loadCurrentNodeOptions() {
+    if (!query.processDefinitionId) {
+      currentNodeOptions.value = []
+      return
+    }
+    const def = definitionOptions.value.find((d) => d.id === query.processDefinitionId)
+    if (def?.flowJson) {
+      try {
+        currentNodeOptions.value = JSON.parse(def.flowJson)
+          .nodes.filter((n: any) => n.type !== 'start' && n.type !== 'end' && n.type !== 'condition' && n.type !== 'cc')
+          .map((n: any) => n.name)
+      } catch {
+        currentNodeOptions.value = []
+      }
+    } else {
+      currentNodeOptions.value = []
+    }
+  }
+
   async function loadOverview() {
     loadingOverview.value = true
     try {
@@ -355,6 +378,7 @@ export function useAnalysis() {
     if (loadingAll.value) return
     loadingAll.value = true
     try {
+      loadCurrentNodeOptions()
       await Promise.all([loadOverview(), loadStatusDistribution(), loadEfficiency(), loadNodes(), loadNodeCount()])
       await loadStuck(1)
     } finally {
@@ -381,7 +405,11 @@ export function useAnalysis() {
 
   function onInstanceProcessChange() {
     instanceQuery.currentNodeName = ''
+    // 按名称或 ID 查找定义(StuckInstanceTable 切换时传 processName,顶栏切换时传 processDefinitionId)
     const def = definitionList.value.find((d) => d.name === instanceQuery.processName)
+      || definitionOptions.value.find((d) => d.name === instanceQuery.processName)
+      || definitionList.value.find((d) => d.id === instanceQuery.processDefinitionId)
+      || definitionOptions.value.find((d) => d.id === instanceQuery.processDefinitionId)
     if (def?.flowJson) {
       try {
         currentNodeOptions.value = JSON.parse(def.flowJson)
@@ -391,7 +419,7 @@ export function useAnalysis() {
         currentNodeOptions.value = []
       }
     } else {
-      currentNodeOptions.value = []
+      loadCurrentNodeOptions()
     }
     loadInstanceList()
   }
@@ -437,10 +465,10 @@ export function useAnalysis() {
     }
   }
 
-  onMounted(() => {
-    loadDefinitions()
+  onMounted(async () => {
+    await loadDefinitions()
+    await loadDefinitionsFull()
     loadAll()
-    loadDefinitionsFull()
     loadInstanceList()
   })
 

+ 26 - 1
src/views/flow/task/todo.vue

@@ -260,7 +260,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted, computed } from 'vue'
+import { ref, reactive, onMounted, computed, watch, nextTick } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { Check, Close, Back, Plus, View, ArrowDown, Filter } from '@element-plus/icons-vue'
 import { listTodo } from '@/api/flow/task'
@@ -314,6 +314,17 @@ function openFilterDrawer() {
   filterDrawerVisible.value = true
 }
 
+// 筛选抽屉打开后,给超长 label 加上 title 属性,hover 时显示完整文字
+watch(filterDrawerVisible, async (val) => {
+  if (!val) return
+  await nextTick()
+  const labels = document.querySelectorAll('.filter-drawer-content .el-form-item__label')
+  labels.forEach((el) => {
+    const htmlEl = el as HTMLElement
+    htmlEl.title = htmlEl.textContent || ''
+  })
+})
+
 function closeFilterDrawer() {
   // 不自动保存,只有点击确定才保存
 }
@@ -740,6 +751,20 @@ onMounted(() => {
   height: 100%;
   padding-right: 8px;
 }
+.filter-drawer-content :deep(.el-form-item__label) {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: block !important;
+  text-align: left !important;
+  direction: ltr !important;
+}
+.filter-drawer-content :deep(.el-input__inner),
+.filter-drawer-content :deep(.el-select .el-input__inner) {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
 :deep(.el-table__body-wrapper .el-button--small.is-link + .el-button--small.is-link) {
   margin-left: 0;
 }

+ 1 - 1
src/views/login/index.vue

@@ -118,7 +118,7 @@ onMounted(() => {
 .login-box {
   width: 400px;
   padding: 20px;
-  transform: translateX(25vw);
+  transform: translateX(calc(25vw + 3cm));
 }
 .login-title {
   text-align: center;