修复显示异常与筛选功能UI

2025-12-23 22:02:57 +08:00
parent 9e9404d273
commit 148fa6ad9a
5 changed files with 127 additions and 81 deletions
@@ -156,3 +156,30 @@ body {
 .el-tag--success { background-color: #f6ffed; color: var(--ctms-success); border: 1px solid #b7eb8f; }
 .el-tag--warning { background-color: #fffbe6; color: var(--ctms-warning); border: 1px solid #ffe58f; }
 .el-tag--danger { background-color: #fff1f0; color: var(--ctms-danger); border: 1px solid #ffa39e; }
+
+/* 列表整合工具栏 (Table Toolbar) */
+.ctms-table-toolbar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 20px;
+  gap: 16px;
+  flex-wrap: wrap;
+}
+
+.ctms-filter-group {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.ctms-filter-item {
+  width: 160px;
+}
+
+.ctms-action-group {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+}
@@ -121,12 +121,17 @@ const siteName = (row: any) => {

 const ownerName = (ownerId: string) => {
  const memberMap = members.value.reduce<Record<string, string>>((acc, cur) => {
-    const username = cur?.user?.display_name || cur?.user?.username || cur?.username;
+    const username = cur?.user?.display_name || cur?.user?.full_name || cur?.user?.username || cur?.username;
    if (cur?.user_id) acc[cur.user_id] = username || cur.user_id;
+    if (cur?.id) acc[cur.id] = username || cur.id;
    return acc;
  }, {});
+  
  const owner = milestone.value?.owner;
-  return owner?.display_name || owner?.username || displayUser(ownerId, { members: memberMap });
+  const nameFromObject = owner?.display_name || owner?.full_name || owner?.username;
+  if (nameFromObject) return nameFromObject;
+  
+  return memberMap[ownerId] || ownerId || "—";
 };

 onMounted(async () => {
@@ -1,31 +1,34 @@
 <template>
  <div class="page">
-    <el-card class="mb-12">
-      <div class="filters">
-        <el-select v-model="filters.level" placeholder="核查层级" clearable @change="load">
-          <el-option label="SDV 核查" value="SDV" />
-          <el-option label="SDR 核查" value="SDR" />
-        </el-select>
-        <SiteSelect
-          v-model="filters.site_id"
-          :study-id="study.currentStudy?.id || null"
-          placeholder="中心"
-          style="width: 220px"
-          @change="load"
-        />
-        <div class="spacer" />
-        <el-button v-if="canEdit" type="primary" @click="openCreate">新增核查进度</el-button>
+    <el-card>
+      <div class="table-toolbar">
+        <div class="filter-group">
+          <el-select v-model="filters.level" placeholder="核查层级" clearable @change="load" class="filter-item">
+            <el-option label="SDV 核查" value="SDV" />
+            <el-option label="SDR 核查" value="SDR" />
+          </el-select>
+          <SiteSelect
+            v-model="filters.site_id"
+            :study-id="study.currentStudy?.id || null"
+            placeholder="中心"
+            class="filter-item site-selector"
+            @change="load"
+          />
+        </div>
+        <div class="action-group">
+          <el-button v-if="canEdit" type="primary" @click="openCreate">新增核查进度</el-button>
+        </div>
      </div>
-    </el-card>

-    <VerificationTable
-      :verifications="verifications"
-      :can-edit="canEdit"
-      :loading="loading"
-      :subject-map="subjectMap"
-      :verifier-map="verifierMap"
-      @edit="openEdit"
-    />
+      <VerificationTable
+        :verifications="verifications"
+        :can-edit="canEdit"
+        :loading="loading"
+        :subject-map="subjectMap"
+        :verifier-map="verifierMap"
+        @edit="openEdit"
+      />
+    </el-card>

    <el-dialog :title="editForm.id ? '更新核查进度' : '新增核查进度'" v-model="showEdit" width="520px">
      <el-form :model="editForm" label-width="120px">
@@ -205,10 +208,25 @@ onMounted(async () => {
 .page {
  padding: 16px;
 }
-.filters {
+.table-toolbar {
  display: flex;
-  gap: 8px;
+  justify-content: space-between;
  align-items: center;
+  margin-bottom: 20px;
+  gap: 16px;
+  flex-wrap: wrap;
+}
+.filter-group {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.filter-item {
+  width: 160px;
+}
+.site-selector {
+  width: 220px;
 }
 .spacer {
  flex: 1;
@@ -1,48 +1,54 @@
 <template>
  <div class="page">
    <el-card>
-      <div class="filters">
-        <el-select v-model="filters.eventType" clearable placeholder="操作类型" @change="loadLogs">
-          <el-option v-for="opt in eventTypeOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
-        </el-select>
-        <el-select v-model="filters.operatorId" clearable placeholder="操作人" filterable @change="loadLogs">
-          <el-option v-for="u in userOptions" :key="u.value" :label="u.label" :value="u.value" />
-        </el-select>
-        <el-select v-model="filters.result" clearable placeholder="结果" @change="loadLogs">
-          <el-option label="成功" value="SUCCESS" />
-          <el-option label="失败" value="FAIL" />
-        </el-select>
-        <el-date-picker
-          v-model="filters.range"
-          type="daterange"
-          unlink-panels
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          format="YYYY-MM-DD"
-          value-format="YYYY-MM-DD"
-          @change="loadLogs"
-        />
-        <div class="spacer" />
-        <el-button type="primary" @click="loadLogs">查询</el-button>
-        <el-button
-          v-if="isAdmin"
-          type="warning"
-          plain
-          :loading="exportLoading"
-          @click="confirmExport('system')"
-        >
-          导出系统审计
-        </el-button>
-        <el-button
-          v-if="canProjectExport"
-          type="warning"
-          plain
-          :loading="exportLoading"
-          @click="confirmExport('project')"
-        >
-          导出项目审计
-        </el-button>
+      <div class="ctms-table-toolbar">
+        <div class="ctms-filter-group">
+          <el-select v-model="filters.eventType" clearable placeholder="操作类型" @change="loadLogs" class="ctms-filter-item">
+            <el-option v-for="opt in eventTypeOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
+          </el-select>
+          <el-select v-model="filters.operatorId" clearable placeholder="操作人" filterable @change="loadLogs" class="ctms-filter-item">
+            <el-option v-for="u in userOptions" :key="u.value" :label="u.label" :value="u.value" />
+          </el-select>
+          <el-select v-model="filters.result" clearable placeholder="结果" @change="loadLogs" style="width: 100px">
+            <el-option label="成功" value="SUCCESS" />
+            <el-option label="失败" value="FAIL" />
+          </el-select>
+          <el-date-picker
+            v-model="filters.range"
+            type="daterange"
+            unlink-panels
+            start-placeholder="开始"
+            end-placeholder="结束"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+            style="width: 240px"
+            @change="loadLogs"
+          />
+        </div>
+        <div class="ctms-action-group">
+          <el-button
+            v-if="isAdmin"
+            type="warning"
+            plain
+            size="small"
+            :loading="exportLoading"
+            @click="confirmExport('system')"
+          >
+            导出系统审计
+          </el-button>
+          <el-button
+            v-if="canProjectExport"
+            type="warning"
+            plain
+            size="small"
+            :loading="exportLoading"
+            @click="confirmExport('project')"
+          >
+            导出项目审计
+          </el-button>
+        </div>
      </div>
+
      <el-table :data="logs" v-loading="loading" style="width: 100%">
        <el-table-column prop="timestamp" label="时间" width="180">
          <template #default="scope">{{ displayDateTime(scope.row.timestamp) }}</template>
@@ -318,16 +324,6 @@ onMounted(async () => {
 .page {
  padding: 16px;
 }
-.filters {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-  margin-bottom: 12px;
-  flex-wrap: wrap;
-}
-.spacer {
-  flex: 1;
-}
 .pagination {
  margin-top: 12px;
  text-align: right;