更新代码

src/components/CreateKBFileDialog.vue

@@ -80,7 +80,7 @@
                 <template #default="{ row }">
                   <!-- <p>{{ row.knowledge_type }}</p> -->
                   <el-select v-model="row.knowledge_type" placeholder="Select" style="width: 180px">
-                    <el-option v-for="item in formData.knowledgeTypeOptions" :key="item.value" :label="item.label"
+                    <el-option v-for="item in knowledgeType" :key="item.value" :label="item.label"
                       :value="item.value" />
                   </el-select>
                 </template>
@@ -136,6 +136,8 @@ import { ref, watch, getCurrentInstance, toRaw } from "vue"
 import { api } from "@/utils/config"
 import { ElMessage } from 'element-plus'
 import { getSessionVar, deleteSessionVar } from "@/utils/session";
+import { useKnowledgeBaseStore } from "@/stores/knowledgeBase"
+const { knowledgeType } = useKnowledgeBaseStore()
 const { proxy } = getCurrentInstance()
 
 const props = defineProps({ modelValue: Boolean, knowledgeBase: Object })

src/components/EditKBDialog.vue

@@ -29,6 +29,7 @@
 <script setup>
 import { ref, watch, getCurrentInstance, toRaw } from "vue"
 import { api } from "@/utils/config"
+
 const { proxy } = getCurrentInstance()
 
 const props = defineProps({ modelValue: Boolean, knowledgeBase: Object })

src/components/EditKBFileDialog.vue

@@ -8,7 +8,7 @@
             <el-table :data="formData.fileTableData" border table-layout="fixed" height="400"
               style="max-width: 100%;box-sizing: border-box;min-width: 0px;">
               <el-table-column type="index" label="#" width="50" />
-              <el-table-column label="导入文件标题" prop="file_name">
+              <el-table-column label="文件标题" prop="file_name">
                 <template #default="{ row, $index }">
                   <p :contenteditable="true" class="input-box" @blur="updateInputBox($event, $index, 'file_name')">{{
                     row.file_name }}</p>
@@ -18,7 +18,7 @@
                 <template #default="{ row }">
                   <!-- <p>{{ row.knowledge_type }}</p> -->
                   <el-select v-model="row.knowledge_type" placeholder="Select" style="width: 180px">
-                    <el-option v-for="item in formData.knowledgeTypeOptions" :key="item.value" :label="item.label"
+                    <el-option v-for="item in knowledgeType" :key="item.value" :label="item.label"
                       :value="item.value" />
                   </el-select>
                 </template>
@@ -66,6 +66,7 @@ import { cloneDeep } from "lodash"
 import { ref, watch, getCurrentInstance, toRaw } from "vue"
 import { api } from "@/utils/config"
 import { ElMessage } from 'element-plus'
+import { useKnowledgeBaseStore } from "@/stores/knowledgeBase"
 const { proxy } = getCurrentInstance()
 
 const props = defineProps({ modelValue: Boolean, fileTable: Array })
@@ -79,6 +80,7 @@ const formData = ref({
     { value: "临床路径", label: "临床路径" },
   ]
 })
+const { knowledgeType } = useKnowledgeBaseStore()
 let dialogVisible = ref(false)
 const handleCancel = () => {
   emit('update:modelValue', false)

src/components/FileViewer/FileViewer.vue

@@ -3,7 +3,7 @@
     <div class="mask"></div>
     <div ref="containerRef" class="container" :style="{ width: props.width + 'px' }">
       <div class="top" ref="topRef">
-        <span v-show="props.fileName">{{ props.fileName }}</span>
+        <span v-show="props.fileName" class="file-name">{{ props.fileName }}</span>
         <span class="close">
           <el-icon @click="emit('closeViewer')">
             <Close />
@@ -154,6 +154,10 @@ onBeforeUnmount(() => {
     display: flex;
     justify-content: end;
 
+    .file-name {
+      font-weight: bold;
+    }
+
     .close {
       // width: 100px;
       margin-left: auto;

src/stores/knowledgeBase.js

@@ -0,0 +1,17 @@
+// 该文件存储知识库相关的公共数据
+
+import { ref, computed } from 'vue'
+import { defineStore } from 'pinia'
+import http from '@/utils/http'
+
+export const useKnowledgeBaseStore = defineStore('knowledgeBase', () => {
+  let knowledgeType = ref([
+    { id: 1, value: "中华医学会诊疗指南", label: "中华医学会诊疗指南" },
+    { id: 2, value: "规培十四五教材", label: "规培十四五教材" },
+    { id: 3, value: "临床路径", label: "临床路径" },
+  ])
+  function getKnowledgeType() {
+
+  }
+  return { knowledgeType }
+})

src/views/KMPlatform/KnowledgeBase/KM/KnowledgeManagement.vue

@@ -27,28 +27,32 @@
         <div class="management-content-middle">
           <el-table :data="filesList" ref="fileTableRef" size="large" style="width: 99% ;">
             <el-table-column type="selection" width="35" />
-            <el-table-column label="#" prop="index" width="60" />
+            <el-table-column label="#" prop="index" width="50" />
             <el-table-column prop="file_name" min-width="150" label="标题">
               <template #default="{ row }">
                 <div class="list-name">
                   <span class="icon-area">
                     <i :class="`${row.file_type}-icon file-icon`"></i>
                   </span>
-                  <span @click="handleViewFile(row.minio_url, row.file_type)" class="text-area">
+                  <span @click="handleViewFile(row.minio_url, row.file_type, row.file_name)" class="text-area">
                     {{ row.file_name }}
                   </span>
                 </div>
               </template>
             </el-table-column>
-            <el-table-column prop="knowledge_type" label="知识类型" />
+            <el-table-column prop="knowledge_type" label="知识类型">
+              <template #default="{ row }">
+                <el-text line-clamp="1" style="vertical-align: bottom;">{{ row.knowledge_type }}</el-text>
+              </template>
+            </el-table-column>
             <el-table-column prop="version" label="版本" />
             <el-table-column prop="author" label="作者（主编）" min-width="90" />
-            <el-table-column prop="year" label="年份" min-width="70" />
+            <el-table-column prop="year" label="年份" min-width="60" />
             <el-table-column prop="creator" label="上传人" />
-            <el-table-column prop="created_at" label="上传时间" width="170" />
-            <el-table-column prop="" label="状态" min-width="100">
+            <el-table-column prop="created_at" label="上传时间" width="155" />
+            <el-table-column prop="" label="状态" min-width="70">
               <template #default="{ row, $index }">
-                <div style="display:flex; align-items: center;gap: 10px;">
+                <div class="status">
                   <span v-if="row.status">
                     <i class="circle" type="success"></i>
                     <el-text type="success">可用</el-text>
@@ -65,7 +69,7 @@
                 </div>
               </template>
             </el-table-column>
-            <el-table-column prop="created_at" label="下载" width="64">
+            <el-table-column prop="created_at" label="下载" width="50">
               <template #default="{ row }">
                 <div style="text-align: center;">
                   <i class="document-download-icon" :disabled="row.status ? true : false"
@@ -113,7 +117,7 @@
 import { saveAs } from 'file-saver'
 import { ElMessage } from 'element-plus'
 import { ref, getCurrentInstance, computed, watch, toRaw, onMounted } from 'vue'
-import { Download, Search } from '@element-plus/icons-vue'
+import { Search } from '@element-plus/icons-vue'
 import { useRoute, useRouter } from 'vue-router';
 import axios from 'axios';
 import { api } from '@/utils/config';
@@ -212,10 +216,11 @@ function handleEditFile(data) {
   editKBFileData.value.data = data;
 }
 
-const handleViewFile = (url, type) => {
+const handleViewFile = (url, type, name) => {
   viewFileData.value.show = true;
   viewFileData.value.url = url;
   viewFileData.value.type = type
+  viewFileData.value.name = name
   // console.log(viewFileData.value)
 }
 function handleDownloadFile(file_url, file_name, status = true) {
@@ -398,7 +403,11 @@ onMounted(() => {
 
     :deep(.el-table) {
       min-width: 0px;
-      max-width: 100%;
+      max-width: auto;
+
+      .cell {
+        padding: 0px 8px;
+      }
 
       .document-download-icon {
         width: 28px;
@@ -422,13 +431,20 @@ onMounted(() => {
         }
       }
 
+      .status {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        white-space: nowrap;
+      }
+
       .circle {
         border-radius: 50%;
         width: 10px;
         height: 10px;
         background-color: #8AD068;
         display: inline-block;
-        margin-right: 10px;
+        margin-right: 7px;
 
         &:is([type='warning']) {
           background-color: #E6A23C;