管理后台前后端逻辑、UI美化

frontend/src/views/ia/KnowledgeNotes.vue

@@ -3,7 +3,6 @@
     <div class="page-header">
       <div>
         <h1 class="page-title">{{ TEXT.modules.knowledgeNotes.title }}</h1>
-        <p class="page-subtitle">{{ TEXT.modules.knowledgeNotes.subtitle }}</p>
       </div>
       <el-button type="primary" @click="goNew">{{ TEXT.modules.knowledgeNotes.newTitle }}</el-button>
     </div>
@@ -24,7 +23,14 @@
     </el-card>
 
     <el-card>
-      <el-table :data="items" v-loading="loading" style="width: 100%" class="ctms-table" @row-click="onRowClick">
+      <el-table
+        :data="sortedItems"
+        v-loading="loading"
+        style="width: 100%"
+        class="ctms-table"
+        @row-click="onRowClick"
+        :row-class-name="noteRowClass"
+      >
         <el-table-column prop="site_name" :label="TEXT.common.fields.site" min-width="160" />
         <el-table-column prop="title" :label="TEXT.common.fields.title" min-width="200" />
         <el-table-column prop="level" :label="TEXT.common.fields.level" width="120" />
@@ -33,21 +39,30 @@
         </el-table-column>
         <el-table-column :label="TEXT.common.labels.actions" width="120">
           <template #default="scope">
-            <el-button link type="danger" size="small" @click.stop="remove(scope.row)">{{ TEXT.common.actions.delete }}</el-button>
+            <el-button
+              link
+              type="danger"
+              size="small"
+              :disabled="isInactiveSite(scope.row.site_name)"
+              @click.stop="remove(scope.row)"
+            >
+              {{ TEXT.common.actions.delete }}
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
-      <StateEmpty v-if="!loading && items.length === 0" :description="TEXT.modules.knowledgeNotes.empty" />
+      <StateEmpty v-if="!loading && sortedItems.length === 0" :description="TEXT.modules.knowledgeNotes.empty" />
     </el-card>
   </div>
 </template>
 
 <script setup lang="ts">
-import { onMounted, reactive, ref } from "vue";
+import { computed, onMounted, reactive, ref } from "vue";
 import { useRouter } from "vue-router";
 import { ElMessage, ElMessageBox } from "element-plus";
 import { useStudyStore } from "../../store/study";
 import { listKnowledgeNotes, deleteKnowledgeNote } from "../../api/knowledgeNotes";
+import { fetchSites } from "../../api/sites";
 import { displayDateTime } from "../../utils/display";
 import StateEmpty from "../../components/StateEmpty.vue";
 import { TEXT } from "../../locales";
@@ -56,11 +71,37 @@ const router = useRouter();
 const study = useStudyStore();
 const loading = ref(false);
 const items = ref<any[]>([]);
+const sites = ref<any[]>([]);
 const filters = reactive({
   site_name: "",
   keyword: "",
 });
 
+const siteActiveMap = computed(() => {
+  const map: Record<string, boolean> = {};
+  sites.value.forEach((site) => {
+    if (site?.name) map[site.name] = !!site.is_active;
+  });
+  return map;
+});
+const isInactiveSite = (siteName?: string) => !!siteName && siteActiveMap.value[siteName] === false;
+const noteRowClass = ({ row }: { row: any }) =>
+  `${row?.id ? "clickable-row" : ""}${isInactiveSite(row?.site_name) ? " row-inactive" : ""}`.trim();
+const sortedItems = computed(() =>
+  [...items.value].sort((a, b) => Number(isInactiveSite(a?.site_name)) - Number(isInactiveSite(b?.site_name)))
+);
+
+const loadSites = async () => {
+  const studyId = study.currentStudy?.id;
+  if (!studyId) return;
+  try {
+    const { data } = await fetchSites(studyId, { limit: 500 });
+    sites.value = Array.isArray(data) ? data : data.items || [];
+  } catch {
+    sites.value = [];
+  }
+};
+
 const load = async () => {
   const studyId = study.currentStudy?.id;
   if (!studyId) return;
@@ -94,6 +135,10 @@ const onRowClick = (row: any) => {
 const remove = async (row: any) => {
   const studyId = study.currentStudy?.id;
   if (!studyId) return;
+  if (isInactiveSite(row?.site_name)) {
+    ElMessage.warning("中心已停用");
+    return;
+  }
   const ok = await ElMessageBox.confirm(TEXT.common.confirm.delete, TEXT.common.labels.tips).catch(() => null);
   if (!ok) return;
   try {
@@ -105,7 +150,10 @@ const remove = async (row: any) => {
   }
 };
 
-onMounted(load);
+onMounted(async () => {
+  await loadSites();
+  load();
+});
 </script>
 
 <style scoped>
@@ -136,4 +184,16 @@ onMounted(load);
 .filter-card :deep(.el-form-item) {
   margin-bottom: 0;
 }
+
+</style>
+
+<style>
+.row-inactive td {
+  color: var(--ctms-text-secondary);
+  background-color: #fff7d6 !important;
+}
+
+.row-inactive .el-tag {
+  opacity: 0.6;
+}
 </style>