资料档案库-左侧树状列表完成

src/service/api/doc.ts

@@ -0,0 +1,16 @@
+import { request } from '../request';
+
+// 资料库树状列表
+export function docListApi() {
+  return request({
+    url: `/api/knowledge/tree`,
+    method: 'get',
+  });
+}
+// 历史版本列表
+export function historyVersionListApi(docId:number) {
+  return request({
+    url: `/api/knowledge/${docId}/history`,
+    method: 'get',
+  });
+}

src/views/docs/archives/index.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
-import { ref, computed } from 'vue';
+import { ref, computed, onMounted } from 'vue';
 import { useAppStore } from '@/store/modules/app';
 import { Icon } from '@iconify/vue'
 import { useThemeStore } from '@/store/modules/theme';
 import { aiKnowledgeIngest, pollTask, AiError } from '@/service/api/ai';
+import { docListApi, historyVersionListApi } from '@/service/api/doc';
 
 const appStore = useAppStore();
 const themeStore = useThemeStore();
 const gap = computed(() => (appStore.isMobile ? 0 : 16));
 
-const keyword = ref<string>('');
 const uploadFiles = () => {
     window.$message?.success('演示：上传资料（限资料管理员 / 各专业专责维护；上传后进入受控评审，发布生效并生成新版本号，全程留痕）')
 }
@@ -125,14 +125,35 @@ const openOrgs = ref<Record<string, boolean>>({ 一车间: true });
 const libSel = ref({ org: "一车间", cat: "工艺", label: "操作规程" });
 const libCur = computed(() => LIB_ORGS.find((o) => o.org === libSel.value.org)?.groups.find((g) => g.cat === libSel.value.cat)?.folders.find((f) => f.label === libSel.value.label));
 
+const loading = ref<boolean>(false);
+const rightLoading = ref<boolean>(false);
+// 搜索关键词
+const keyword = ref<string>('');
+// 资料库树状列表
+const docList = ref<any[]>([]);
+// 历史版本列表
+const historyList = ref<any[]>([]);
 
+// 获取资料库树状列表
+const getDocList = async () => {
+    loading.value = true;
+    const {data,error} = await docListApi();
+    if(!error){
+        console.log(data);
+        docList.value = data ?? [];
+    }
+    loading.value = false;
+}
 
-
+onMounted(() => {
+    getDocList();
+})
 </script>
 
 <template>
 <NSpace vertical :size="16">
 <!-- 我的草稿箱 -->
+<NSpin :show="loading" size="small">
     <NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px' }">
         <NGrid :x-gap="gap" :y-gap="16" responsive="screen" item-responsive class="pb-[12px] border-b">
             <NGi span="24 s:24 m:16">
@@ -143,7 +164,7 @@ const libCur = computed(() => LIB_ORGS.find((o) => o.org === libSel.value.org)?.
             </NGi>
             <NGi span="24 s:24 m:8" class="flex items-center justify-end gap-12px">
             <div class="flex items-center gap-2">
-                <NInput v-model:value="keyword" size="small" type="text" class="w-40 text-xs" placeholder="全文检索…">
+                <NInput v-model:value="keyword" size="small" type="text" class="w-40 text-xs" clearable placeholder="全文检索…">
                     <template #suffix>
                         <Icon icon="akar-icons:search" class="size-14px text-slate-400 cursor-pointer" />
                     </template>
@@ -181,26 +202,26 @@ const libCur = computed(() => LIB_ORGS.find((o) => o.org === libSel.value.org)?.
         <!-- 文件夹树 + 当前文件夹资料 -->
         <div v-else class="flex gap-3">
             <div class="shrink-0 space-y-2 w-56 scroll-left">
-                <div v-for="o in LIB_ORGS" :key="o.org" class="overflow-hidden rounded-lg border bg-white">
+                <div v-for="o in docList" :key="o.org" class="overflow-hidden rounded-lg border bg-white">
                     <button class="flex w-full items-center gap-1.5 px-2.5 py-2 text-xs font-semibold text-slate-700 hover:bg-slate-50 bg-transparent"
-                    @click="openOrgs[o.org] = !openOrgs[o.org]">
+                    @click="openOrgs[o.org_name] = !openOrgs[o.org_name]">
-                    <Icon icon="formkit:right" class="size-14px transition-transform" :class="openOrgs[o.org] ? 'rotate-90' : ''" />
+                    <Icon icon="formkit:right" class="size-14px transition-transform" :class="openOrgs[o.org_name] ? 'rotate-90' : ''" />
-                    <Icon v-if="openOrgs[o.org]" icon="quill:folder-open" class="size-14px" :style="{ color: themeStore.themeColor }" />
+                    <Icon v-if="openOrgs[o.org_name]" icon="quill:folder-open" class="size-14px" :style="{ color: themeStore.themeColor }" />
                     <Icon v-else icon="material-symbols:folder-outline" class="size-14px text-slate-400" />
-                    {{ o.org }}
+                    {{ o.org_name }}
                     </button>
-                    <template v-if="openOrgs[o.org]">
+                    <template v-if="openOrgs[o.org_name]">
-                        <div v-for="g in o.groups" :key="g.cat" class="border-t px-2 py-1.5">
+                        <div v-for="g in o.categories" :key="g.cat" class="border-t px-2 py-1.5">
-                            <div class="px-1 pb-0.5 text-[10px] font-medium tracking-wide text-slate-400">{{ g.cat }}专业</div>
+                            <div class="px-1 pb-0.5 text-[10px] font-medium tracking-wide text-slate-400">{{ g.category }}</div>
-                            <button v-for="f in g.folders" :key="f.label"
+                            <button v-for="f in g.folders" :key="f.folder"
-                                @click="libSel = { org: o.org, cat: g.cat, label: f.label }"
+                                @click="libSel = { org: o.org_name, cat: g.category, label: f.folder }"
                                 class="flex w-full items-center gap-1.5 rounded px-2 py-1 text-left text-xs transition"
-                                :class="libSel.org === o.org && libSel.cat === g.cat && libSel.label === f.label ? 'bg-[var(--theme-color)] font-medium text-white' : 'text-slate-600 hover:bg-slate-100  bg-transparent'"
+                                :class="libSel.org === o.org_name && libSel.cat === g.category && libSel.label === f.folder ? 'bg-[var(--theme-color)] font-medium text-white' : 'text-slate-600 hover:bg-slate-100  bg-transparent'"
                                 :style="{ '--theme-color': themeStore.themeColor }"
                             >
                                 <Icon icon="material-symbols:folder-outline" class="size-14px text-slate-400" />
-                                <span class="min-w-0 flex-1 truncate">{{ f.label }}</span>
+                                <span class="min-w-0 flex-1 truncate">{{ f.folder }}</span>
-                                <span class="text-[10px]" :class="libSel.label === f.label && libSel.cat === g.cat && libSel.org === o.org ? 'text-white/70' : 'text-slate-300'">{{ f.docs.length }}</span>
+                                <span class="text-[10px]" :class="libSel.label === f.folder && libSel.cat === g.category && libSel.org === o.org_name ? 'text-white/70' : 'text-slate-300'">{{ f.count }}</span>
                             </button>
                         </div>
                     </template>
@@ -210,7 +231,7 @@ const libCur = computed(() => LIB_ORGS.find((o) => o.org === libSel.value.org)?.
                 <div class="mb-1.5 flex flex-wrap items-center gap-1 text-xs text-slate-400">
                     当前位置：{{ libSel.org }} 
                     <Icon icon="formkit:right" class="size-12px" /> 
-                    {{ libSel.cat }}专业 
+                    {{ libSel.cat }} 
                     <Icon icon="formkit:right" class="size-12px" /> 
                     <span class="font-medium text-slate-600">{{ libSel.label }}</span>
                     <span class="ml-auto">共 {{ libCur?.docs.length ?? 0 }} 份 · 版本受控</span>
@@ -238,6 +259,7 @@ const libCur = computed(() => LIB_ORGS.find((o) => o.org === libSel.value.org)?.
             </div>
         </div>
     </NCard>
+</NSpin>
 </NSpace>
 </template>
 

src/views/my/highRisk/modules/fmea.vue

@@ -208,7 +208,7 @@ onMounted(() => {
   </div>
   <div class="flex items-center justify-end gap-2 pt-3">
     <NButton size="small" @click="exportData">
-      <Icon icon="bi:download" class="mr-1 size-12px" />
+      <Icon icon="material-symbols:download" class="mr-1 size-14px" />
       导出
     </NButton>
     <NButton type="primary" size="small" @click="emit('close')">关闭</NButton>

src/views/my/highRisk/modules/hazop.vue

@@ -220,7 +220,7 @@ onMounted(() => {
   </div>
   <div class="flex items-center justify-end gap-2 pt-3">
     <NButton size="small" @click="exportData">
-      <Icon icon="bi:download" class="mr-1 size-12px" />
+      <Icon icon="material-symbols:download" class="mr-1 size-14px" />
       导出
     </NButton>
     <NButton type="primary" size="small" @click="emit('close')">关闭</NButton>

src/views/my/highRisk/modules/template.vue

@@ -308,7 +308,7 @@ onMounted(() => {
 
 <style scoped lang="scss">
 .scroll {
-  height: calc(100vh - 303px);
+  height: calc(100vh - 267px);
   overflow-y: auto;
 }
 </style>