From 71a9eef518f2f2f1a1eb2fb90f2eb8ab7b155bc8 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期四, 08 一月 2026 14:57:56 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/dev_天津军泰伟业' into dev_天津军泰伟业

---
 src/views/collaborativeApproval/knowledgeBase/index.vue | 1399 +++++++++++++++++++++++++++++----------------------------
 1 files changed, 714 insertions(+), 685 deletions(-)

diff --git a/src/views/collaborativeApproval/knowledgeBase/index.vue b/src/views/collaborativeApproval/knowledgeBase/index.vue
index f944859..76c8ec9 100644
--- a/src/views/collaborativeApproval/knowledgeBase/index.vue
+++ b/src/views/collaborativeApproval/knowledgeBase/index.vue
@@ -3,143 +3,173 @@
     <div class="search_form">
       <div>
         <span class="search_title">鐭ヨ瘑鏍囬锛�</span>
-        <el-input
-          v-model="searchForm.title"
-          style="width: 240px"
-          placeholder="璇疯緭鍏ョ煡璇嗘爣棰樻悳绱�"
-          @change="handleQuery"
-          clearable
-          :prefix-icon="Search"
-        />
+        <el-input v-model="searchForm.title"
+                  style="width: 240px"
+                  placeholder="璇疯緭鍏ョ煡璇嗘爣棰樻悳绱�"
+                  @change="handleQuery"
+                  clearable
+                  :prefix-icon="Search" />
         <span class="search_title ml10">鐭ヨ瘑绫诲瀷锛�</span>
-        <el-select v-model="searchForm.type" clearable @change="handleQuery" style="width: 240px">
-          <el-option label="鍚堝悓鐗规壒" :value="'contract'" />
-          <el-option label="瀹℃壒妗堜緥" :value="'approval'" />
-          <el-option label="瑙e喅鏂规" :value="'solution'" />
-          <el-option label="缁忛獙鎬荤粨" :value="'experience'" />
-          <el-option label="鎿嶄綔鎸囧崡" :value="'guide'" />
+        <el-select v-model="searchForm.type"
+                   clearable
+                   @change="handleQuery"
+                   style="width: 240px">
+          <el-option label="鍚堝悓鐗规壒"
+                     :value="'contract'" />
+          <el-option label="瀹℃壒妗堜緥"
+                     :value="'approval'" />
+          <el-option label="瑙e喅鏂规"
+                     :value="'solution'" />
+          <el-option label="缁忛獙鎬荤粨"
+                     :value="'experience'" />
+          <el-option label="鎿嶄綔鎸囧崡"
+                     :value="'guide'" />
         </el-select>
-        <el-button type="primary" @click="handleQuery" style="margin-left: 10px">
+        <el-button type="primary"
+                   @click="handleQuery"
+                   style="margin-left: 10px">
           鎼滅储
         </el-button>
       </div>
       <div>
-        <el-button type="primary" @click="openForm('add')">鏂板鐭ヨ瘑</el-button>
-        <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button>
+        <el-button @click="handleExport"
+                   style="margin-right: 10px">瀵煎嚭</el-button>
+        <el-button type="primary"
+                   @click="openForm('add')">鏂板鐭ヨ瘑</el-button>
+        <el-button type="danger"
+                   plain
+                   @click="handleDelete">鍒犻櫎</el-button>
       </div>
     </div>
-    
     <div class="table_list">
-      <PIMTable
-        rowKey="id"
-        :column="tableColumn"
-        :tableData="tableData"
-        :page="page"
-        :isSelection="true"
-        @selection-change="handleSelectionChange"
-        :tableLoading="tableLoading"
-        @pagination="pagination"
-        :total="page.total"
-      ></PIMTable>
+      <PIMTable rowKey="id"
+                :column="tableColumn"
+                :tableData="tableData"
+                :page="page"
+                :isSelection="true"
+                @selection-change="handleSelectionChange"
+                :tableLoading="tableLoading"
+                @pagination="pagination"
+                :total="page.total"></PIMTable>
     </div>
-
     <!-- 鏂板/缂栬緫鐭ヨ瘑寮圭獥 -->
-    <el-dialog
-      v-model="dialogVisible"
-      :title="dialogTitle"
-      width="800px"
-      :close-on-click-modal="false"
-    >
-      <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
+    <el-dialog v-model="dialogVisible"
+               :title="dialogTitle"
+               width="800px"
+               :close-on-click-modal="false">
+      <el-form ref="formRef"
+               :model="form"
+               :rules="rules"
+               label-width="120px">
         <el-row :gutter="20">
           <el-col :span="12">
-            <el-form-item label="鐭ヨ瘑鏍囬" prop="title">
-              <el-input v-model="form.title" placeholder="璇疯緭鍏ョ煡璇嗘爣棰�" />
+            <el-form-item label="鐭ヨ瘑鏍囬"
+                          prop="title">
+              <el-input v-model="form.title"
+                        placeholder="璇疯緭鍏ョ煡璇嗘爣棰�" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="鐭ヨ瘑绫诲瀷" prop="type">
-              <el-select v-model="form.type" placeholder="璇烽�夋嫨鐭ヨ瘑绫诲瀷" style="width: 100%">
-                <el-option label="鍚堝悓鐗规壒" value="contract" />
-                <el-option label="瀹℃壒妗堜緥" value="approval" />
-                <el-option label="瑙e喅鏂规" value="solution" />
-                <el-option label="缁忛獙鎬荤粨" value="experience" />
-                <el-option label="鎿嶄綔鎸囧崡" value="guide" />
+            <el-form-item label="鐭ヨ瘑绫诲瀷"
+                          prop="type">
+              <el-select v-model="form.type"
+                         placeholder="璇烽�夋嫨鐭ヨ瘑绫诲瀷"
+                         style="width: 100%">
+                <el-option label="鍚堝悓鐗规壒"
+                           value="contract" />
+                <el-option label="瀹℃壒妗堜緥"
+                           value="approval" />
+                <el-option label="瑙e喅鏂规"
+                           value="solution" />
+                <el-option label="缁忛獙鎬荤粨"
+                           value="experience" />
+                <el-option label="鎿嶄綔鎸囧崡"
+                           value="guide" />
               </el-select>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row :gutter="20">
           <el-col :span="12">
-            <el-form-item label="閫傜敤鍦烘櫙" prop="scenario">
-              <el-input v-model="form.scenario" placeholder="璇疯緭鍏ラ�傜敤鍦烘櫙" />
+            <el-form-item label="閫傜敤鍦烘櫙"
+                          prop="scenario">
+              <el-input v-model="form.scenario"
+                        placeholder="璇疯緭鍏ラ�傜敤鍦烘櫙" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="瑙e喅鏁堢巼" prop="efficiency">
-              <el-select v-model="form.efficiency" placeholder="璇烽�夋嫨瑙e喅鏁堢巼" style="width: 100%">
-                <el-option label="鏄捐憲鎻愬崌" value="high" />
-                <el-option label="涓�鑸彁鍗�" value="medium" />
-                <el-option label="杞诲井鎻愬崌" value="low" />
+            <el-form-item label="瑙e喅鏁堢巼"
+                          prop="efficiency">
+              <el-select v-model="form.efficiency"
+                         placeholder="璇烽�夋嫨瑙e喅鏁堢巼"
+                         style="width: 100%">
+                <el-option label="鏄捐憲鎻愬崌"
+                           value="high" />
+                <el-option label="涓�鑸彁鍗�"
+                           value="medium" />
+                <el-option label="杞诲井鎻愬崌"
+                           value="low" />
               </el-select>
             </el-form-item>
           </el-col>
         </el-row>
-        <el-form-item label="闂鎻忚堪" prop="problem">
-          <el-input
-            v-model="form.problem"
-            type="textarea"
-            :rows="3"
-            placeholder="璇锋弿杩伴亣鍒扮殑闂"
-          />
+        <el-form-item label="闂鎻忚堪"
+                      prop="problem">
+          <el-input v-model="form.problem"
+                    type="textarea"
+                    :rows="3"
+                    placeholder="璇锋弿杩伴亣鍒扮殑闂" />
         </el-form-item>
-        <el-form-item label="瑙e喅鏂规" prop="solution">
-          <el-input
-            v-model="form.solution"
-            type="textarea"
-            :rows="4"
-            placeholder="璇疯缁嗘弿杩拌В鍐虫柟妗�"
-          />
+        <el-form-item label="瑙e喅鏂规"
+                      prop="solution">
+          <el-input v-model="form.solution"
+                    type="textarea"
+                    :rows="4"
+                    placeholder="璇疯缁嗘弿杩拌В鍐虫柟妗�" />
         </el-form-item>
-        <el-form-item label="鍏抽敭瑕佺偣" prop="keyPoints">
-          <el-input
-            v-model="form.keyPoints"
-            type="textarea"
-            :rows="3"
-            placeholder="璇疯緭鍏ュ叧閿鐐癸紝鐢ㄩ�楀彿鍒嗛殧"
-          />
+        <el-form-item label="鍏抽敭瑕佺偣"
+                      prop="keyPoints">
+          <el-input v-model="form.keyPoints"
+                    type="textarea"
+                    :rows="3"
+                    placeholder="璇疯緭鍏ュ叧閿鐐癸紝鐢ㄩ�楀彿鍒嗛殧" />
         </el-form-item>
         <el-row :gutter="20">
           <el-col :span="12">
-            <el-form-item label="鍒涘缓浜�" prop="creator">
-              <el-input v-model="form.creator" placeholder="璇疯緭鍏ュ垱寤轰汉" />
+            <el-form-item label="鍒涘缓浜�"
+                          prop="creator">
+              <el-input v-model="form.creator"
+                        placeholder="璇疯緭鍏ュ垱寤轰汉" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="浣跨敤娆℃暟" prop="usageCount">
-              <el-input-number v-model="form.usageCount" :min="0" style="width: 100%" />
+            <el-form-item label="浣跨敤娆℃暟"
+                          prop="usageCount">
+              <el-input-number v-model="form.usageCount"
+                               :min="0"
+                               style="width: 100%" />
             </el-form-item>
           </el-col>
         </el-row>
       </el-form>
       <template #footer>
         <span class="dialog-footer">
+          <el-button type="primary"
+                     @click="submitForm">纭畾</el-button>
           <el-button @click="dialogVisible = false">鍙栨秷</el-button>
-          <el-button type="primary" @click="submitForm">纭畾</el-button>
         </span>
       </template>
     </el-dialog>
-
     <!-- 鏌ョ湅鐭ヨ瘑璇︽儏寮圭獥 -->
-    <el-dialog
-      v-model="viewDialogVisible"
-      title="鐭ヨ瘑璇︽儏"
-      width="900px"
-      :close-on-click-modal="false"
-    >
+    <el-dialog v-model="viewDialogVisible"
+               title="鐭ヨ瘑璇︽儏"
+               width="900px"
+               :close-on-click-modal="false">
       <div class="knowledge-detail">
-        <el-descriptions :column="2" border>
-          <el-descriptions-item label="鐭ヨ瘑鏍囬" :span="2">
+        <el-descriptions :column="2"
+                         border>
+          <el-descriptions-item label="鐭ヨ瘑鏍囬"
+                                :span="2">
             <span class="detail-title">{{ currentKnowledge.title }}</span>
           </el-descriptions-item>
           <el-descriptions-item label="鐭ヨ瘑绫诲瀷">
@@ -165,31 +195,25 @@
             {{ currentKnowledge.createTime }}
           </el-descriptions-item>
         </el-descriptions>
-
         <div class="detail-section">
           <h4>闂鎻忚堪</h4>
           <div class="detail-content">{{ currentKnowledge.problem }}</div>
         </div>
-
         <div class="detail-section">
           <h4>瑙e喅鏂规</h4>
           <div class="detail-content">{{ currentKnowledge.solution }}</div>
         </div>
-
         <div class="detail-section">
           <h4>鍏抽敭瑕佺偣</h4>
           <div class="key-points">
-            <el-tag
-              v-for="(point, index) in currentKnowledge.keyPoints.split(',')"
-              :key="index"
-              type="success"
-              style="margin-right: 8px; margin-bottom: 8px;"
-            >
+            <el-tag v-for="(point, index) in currentKnowledge.keyPoints.split(',')"
+                    :key="index"
+                    type="success"
+                    style="margin-right: 8px; margin-bottom: 8px;">
               {{ point.trim() }}
             </el-tag>
           </div>
         </div>
-
         <div class="detail-section">
           <h4>浣跨敤缁熻</h4>
           <div class="usage-stats">
@@ -216,12 +240,12 @@
           </div>
         </div>
       </div>
-
       <template #footer>
         <span class="dialog-footer">
+          <el-button type="primary"
+                     @click="copyKnowledge">澶嶅埗鐭ヨ瘑</el-button>
           <el-button @click="viewDialogVisible = false">鍏抽棴</el-button>
-          <el-button type="primary" @click="copyKnowledge">澶嶅埗鐭ヨ瘑</el-button>
-          <el-button type="success" @click="markAsFavorite">鏀惰棌</el-button>
+          <!-- <el-button type="success" @click="markAsFavorite">鏀惰棌@</el-button> -->
         </span>
       </template>
     </el-dialog>
@@ -229,620 +253,625 @@
 </template>
 
 <script setup>
-import { Search } from "@element-plus/icons-vue";
-import { onMounted, ref, reactive, toRefs } from "vue";
-import { ElMessage, ElMessageBox } from "element-plus";
-import PIMTable from "@/components/PIMTable/PIMTable.vue";
+  import { Search } from "@element-plus/icons-vue";
+  import { onMounted, ref, reactive, toRefs, getCurrentInstance } from "vue";
+  import { ElMessage, ElMessageBox } from "element-plus";
+  import PIMTable from "@/components/PIMTable/PIMTable.vue";
+  import {
+    listKnowledgeBase,
+    delKnowledgeBase,
+    addKnowledgeBase,
+    updateKnowledgeBase,
+  } from "@/api/collaborativeApproval/knowledgeBase.js";
 
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = {
-  title: [
-    { required: true, message: "璇疯緭鍏ョ煡璇嗘爣棰�", trigger: "blur" }
-  ],
-  type: [
-    { required: true, message: "璇烽�夋嫨鐭ヨ瘑绫诲瀷", trigger: "change" }
-  ],
-  problem: [
-    { required: true, message: "璇锋弿杩伴亣鍒扮殑闂", trigger: "blur" }
-  ],
-  solution: [
-    { required: true, message: "璇疯缁嗘弿杩拌В鍐虫柟妗�", trigger: "blur" }
-  ]
-};
-
-// 鍝嶅簲寮忔暟鎹�
-const data = reactive({
-  searchForm: {
-    title: "",
-    type: "",
-  },
-  tableLoading: false,
-  page: {
-    current: 1,
-    size: 100,
-    total: 0,
-  },
-  tableData: [],
-  selectedIds: [],
-  form: {
-    title: "",
-    type: "",
-    scenario: "",
-    efficiency: "medium",
-    problem: "",
-    solution: "",
-    keyPoints: "",
-    creator: "",
-    usageCount: 0
-  },
-  dialogVisible: false,
-  dialogTitle: "",
-  dialogType: "add",
-  viewDialogVisible: false,
-  currentKnowledge: {}
-});
-
-const { 
-  searchForm, 
-  tableLoading, 
-  page, 
-  tableData, 
-  selectedIds,
-  form,
-  dialogVisible,
-  dialogTitle,
-  dialogType,
-  viewDialogVisible,
-  currentKnowledge
-} = toRefs(data);
-
-// 琛ㄥ崟寮曠敤
-const formRef = ref();
-
-// 琛ㄦ牸鍒楅厤缃�
-const tableColumn = ref([
-  {
-    label: "鐭ヨ瘑鏍囬",
-    prop: "title",
-    showOverflowTooltip: true,
-  },
-  {
-    label: "鐭ヨ瘑绫诲瀷",
-    prop: "type",
-    dataType: "tag",
-    formatData: (params) => {
-      const typeMap = {
-        contract: "鍚堝悓鐗规壒",
-        approval: "瀹℃壒妗堜緥",
-        solution: "瑙e喅鏂规",
-        experience: "缁忛獙鎬荤粨",
-        guide: "鎿嶄綔鎸囧崡"
-      };
-      return typeMap[params] || params;
-    },
-    formatType: (params) => {
-      const typeMap = {
-        contract: "success",
-        approval: "warning",
-        solution: "primary",
-        experience: "info",
-        guide: "danger"
-      };
-      return typeMap[params] || "info";
-    }
-  },
-  {
-    label: "閫傜敤鍦烘櫙",
-    prop: "scenario",
-    width: 150,
-    showOverflowTooltip: true,
-  },
-  {
-    label: "瑙e喅鏁堢巼",
-    prop: "efficiency",
-    dataType: "tag",
-    formatData: (params) => {
-      const efficiencyMap = {
-        high: "鏄捐憲鎻愬崌",
-        medium: "涓�鑸彁鍗�",
-        low: "杞诲井鎻愬崌"
-      };
-      return efficiencyMap[params] || params;
-    },
-    formatType: (params) => {
-      const typeMap = {
-        high: "success",
-        medium: "warning",
-        low: "info"
-      };
-      return typeMap[params] || "info";
-    }
-  },
-  {
-    label: "浣跨敤娆℃暟",
-    prop: "usageCount",
-    width: 100,
-    align: "center"
-  },
-  {
-    label: "鍒涘缓浜�",
-    prop: "creator",
-    width: 120,
-  },
-  {
-    label: "鍒涘缓鏃堕棿",
-    prop: "createTime",
-    width: 180,
-  },
-  {
-    dataType: "action",
-    label: "鎿嶄綔",
-    align: "center",
-    fixed: "right",
-    width: 200,
-    operation: [
-      {
-        name: "缂栬緫",
-        type: "text",
-        clickFun: (row) => {
-          openForm("edit", row);
-        }
-      },
-      {
-        name: "鏌ョ湅",
-        type: "text",
-        clickFun: (row) => {
-          viewKnowledge(row);
-        }
-      }
-    ]
-  }
-]);
-
-// 妯℃嫙鏁版嵁
-let mockData = [
-  {
-    id: "1",
-    title: "鐗规畩鍚堝悓瀹℃壒娴佺▼浼樺寲鏂规",
-    type: "contract",
-    scenario: "澶ч鍚堝悓蹇�熷鎵�",
-    efficiency: "high",
-    problem: "澶ч鍚堝悓瀹℃壒娴佺▼澶嶆潅锛屽鎵规椂闂撮暱锛屽奖鍝嶄笟鍔¤繘灞�",
-    solution: "寤虹珛缁胯壊閫氶亾锛屽绗﹀悎鏉′欢鐨勫悎鍚岄噰鐢ㄧ畝鍖栧鎵规祦绋嬶紝鐢遍儴闂ㄨ礋璐d汉鐩存帴瀹℃壒锛屽钩鍧囧鎵规椂闂翠粠3澶╃缉鐭嚦1澶�",
-    keyPoints: "缁胯壊閫氶亾鏉′欢,绠�鍖栨祦绋�,瀹℃壒鏉冮檺,鏃堕棿鎺у埗",
-    creator: "寮犵粡鐞�",
-    usageCount: 15,
-    createTime: "2024-01-15 10:30:00"
-  },
-  {
-    id: "2",
-    title: "璺ㄩ儴闂ㄥ崗浣滃鎵圭粡楠屾�荤粨",
-    type: "experience",
-    scenario: "澶氶儴闂ㄥ崗浣滈」鐩�",
-    efficiency: "medium",
-    problem: "璺ㄩ儴闂ㄩ」鐩鎵规椂锛屽悇閮ㄩ棬鎰忚涓嶇粺涓�锛屽鎵硅繘搴︾紦鎱�",
-    solution: "寤虹珛椤圭洰鍗忚皟鏈哄埗锛屾寚瀹氶」鐩礋璐d汉锛屽畾鏈熷彫寮�鍗忚皟浼氳锛岀粺涓�鍚勬柟鎰忚鍚庡啀杩涜瀹℃壒",
-    keyPoints: "椤圭洰鍗忚皟,瀹氭湡浼氳,缁熶竴鎰忚,璐熻矗浜哄埗搴�",
-    creator: "鏉庝富绠�",
-    usageCount: 8,
-    createTime: "2024-01-14 15:20:00"
-  },
-  {
-    id: "3",
-    title: "绱ф�ラ噰璐鎵规搷浣滄寚鍗�",
-    type: "guide",
-    scenario: "绱ф�ラ噰璐渶姹�",
-    efficiency: "high",
-    problem: "绱ф�ラ噰璐椂瀹℃壒娴佺▼澶嶆潅锛屾棤娉曟弧瓒崇揣鎬ラ渶姹�",
-    solution: "鍒跺畾绱ф�ラ噰璐鎵规爣鍑嗭紝鏄庣‘绱ф�ョ▼搴﹀垎绾э紝涓嶅悓绾у埆閲囩敤涓嶅悓瀹℃壒娴佺▼锛岀‘淇濈揣鎬ラ渶姹傚緱鍒板強鏃跺鐞�",
-    keyPoints: "绱ф�ュ垎绾�,鏍囧噯鍒跺畾,娴佺▼绠�鍖�,鍙婃椂澶勭悊",
-    creator: "鐜嬩笓鍛�",
-    usageCount: 12,
-    createTime: "2024-01-13 09:15:00"
-  }
-];
-
-// 鐭ヨ瘑鏍囬妯℃澘
-const titleTemplates = [
-  "{type}瀹℃壒娴佺▼浼樺寲鏂规",
-  "{scenario}澶勭悊缁忛獙鎬荤粨",
-  "{type}鐗规畩鎯呭喌澶勭悊鎸囧崡",
-  "{scenario}蹇�熷鎵规柟妗�",
-  "{type}鏍囧噯鍖栨搷浣滄祦绋�",
-  "{scenario}闂瑙e喅鏂规",
-  "{type}鏈�浣冲疄璺垫�荤粨",
-  "{scenario}鏁堢巼鎻愬崌鏂规"
-];
-
-// 鐭ヨ瘑绫诲瀷閰嶇疆
-const knowledgeTypes = [
-  { type: "contract", label: "鍚堝悓鐗规壒", efficiency: "high" },
-  { type: "approval", label: "瀹℃壒妗堜緥", efficiency: "medium" },
-  { type: "solution", label: "瑙e喅鏂规", efficiency: "high" },
-  { type: "experience", label: "缁忛獙鎬荤粨", efficiency: "medium" },
-  { type: "guide", label: "鎿嶄綔鎸囧崡", efficiency: "low" }
-];
-
-// 鍦烘櫙鍒楄〃
-const scenarios = ["澶ч鍚堝悓瀹℃壒", "璺ㄩ儴闂ㄥ崗浣�", "绱ф�ラ噰璐�", "鐗规畩鐢宠", "娴佺▼浼樺寲", "闂澶勭悊", "鏍囧噯鍖栧缓璁�", "鏁堢巼鎻愬崌"];
-
-// 鑷姩鐢熸垚鏂版暟鎹�
-const generateNewData = () => {
-  const newId = (mockData.length + 1).toString();
-  const now = new Date();
-  const randomType = knowledgeTypes[Math.floor(Math.random() * knowledgeTypes.length)];
-  const randomScenario = scenarios[Math.floor(Math.random() * scenarios.length)];
-  
-  // 鐢熸垚闅忔満鏍囬
-  let title = titleTemplates[Math.floor(Math.random() * titleTemplates.length)];
-  title = title
-    .replace('{type}', randomType.label)
-    .replace('{scenario}', randomScenario);
-  
-  const newKnowledge = {
-    id: newId,
-    title: title,
-    type: randomType.type,
-    scenario: randomScenario,
-    efficiency: randomType.efficiency,
-    problem: `鍦�${randomScenario}杩囩▼涓亣鍒扮殑闂鎻忚堪...`,
-    solution: `閽堝${randomScenario}鐨勮В鍐虫柟妗堝拰鎿嶄綔姝ラ...`,
-    keyPoints: "鍏抽敭瑕佺偣1,鍏抽敭瑕佺偣2,鍏抽敭瑕佺偣3,鍏抽敭瑕佺偣4",
-    creator: ["寮犵粡鐞�", "鏉庝富绠�", "鐜嬩笓鍛�", "鍒樻�荤洃"][Math.floor(Math.random() * 4)],
-    usageCount: Math.floor(Math.random() * 20) + 1,
-    createTime: now.toLocaleString()
+  // 琛ㄥ崟楠岃瘉瑙勫垯
+  const rules = {
+    title: [{ required: true, message: "璇疯緭鍏ョ煡璇嗘爣棰�", trigger: "blur" }],
+    type: [{ required: true, message: "璇烽�夋嫨鐭ヨ瘑绫诲瀷", trigger: "change" }],
+    problem: [{ required: true, message: "璇锋弿杩伴亣鍒扮殑闂", trigger: "blur" }],
+    solution: [
+      { required: true, message: "璇疯缁嗘弿杩拌В鍐虫柟妗�", trigger: "blur" },
+    ],
   };
-  
-  // 娣诲姞鍒版暟鎹紑澶�
-  mockData.unshift(newKnowledge);
-  
-  // 淇濇寔鏁版嵁閲忓湪鍚堢悊鑼冨洿鍐咃紙鏈�澶氫繚鐣�30鏉★級
-  if (mockData.length > 30) {
-    mockData = mockData.slice(0, 30);
-  }
-  
-  console.log(`[${new Date().toLocaleString()}] 鑷姩鐢熸垚鏂扮煡璇�: ${title}`);
-};
 
-// 鐢熷懡鍛ㄦ湡
-onMounted(() => {
-  getList();
-  startAutoRefresh();
-});
-
-// 寮�濮嬭嚜鍔ㄥ埛鏂�
-const startAutoRefresh = () => {
-  setInterval(() => {
-    generateNewData();
-    getList();
-  }, 600000); // 10鍒嗛挓鍒锋柊涓�娆� (10 * 60 * 1000 = 600000ms)
-};
-
-// 鏌ヨ鏁版嵁
-const handleQuery = () => {
-  page.value.current = 1;
-  getList();
-};
-
-const getList = () => {
-  tableLoading.value = true;
-  
-  setTimeout(() => {
-    let filteredData = [...mockData];
-    
-    if (searchForm.value.title) {
-      filteredData = filteredData.filter(item => 
-        item.title.toLowerCase().includes(searchForm.value.title.toLowerCase())
-      );
-    }
-    
-    if (searchForm.value.type) {
-      filteredData = filteredData.filter(item => item.type === searchForm.value.type);
-    }
-    
-    tableData.value = filteredData;
-    page.value.total = filteredData.length;
-    tableLoading.value = false;
-  }, 500);
-};
-
-// 鍒嗛〉澶勭悊
-const pagination = (obj) => {
-  page.value.current = obj.page;
-  page.value.size = obj.limit;
-  handleQuery();
-};
-
-// 閫夋嫨鍙樺寲澶勭悊
-const handleSelectionChange = (selection) => {
-  selectedIds.value = selection.map(item => item.id);
-};
-
-// 鎵撳紑琛ㄥ崟
-const openForm = (type, row = null) => {
-  dialogType.value = type;
-  if (type === "add") {
-    dialogTitle.value = "鏂板鐭ヨ瘑";
-    // 閲嶇疆琛ㄥ崟
-    Object.assign(form.value, {
+  // 鍝嶅簲寮忔暟鎹�
+  const data = reactive({
+    searchForm: {
+      title: "",
+      type: "",
+    },
+    tableLoading: false,
+    page: {
+      current: 1,
+      size: 20,
+      total: 0,
+    },
+    tableData: [],
+    selectedIds: [],
+    form: {
       title: "",
       type: "",
       scenario: "",
-      efficiency: "medium",
+      efficiency: "",
       problem: "",
       solution: "",
       keyPoints: "",
       creator: "",
-      usageCount: 0
-    });
-  } else if (type === "edit" && row) {
-    dialogTitle.value = "缂栬緫鐭ヨ瘑";
-    Object.assign(form.value, {
-      title: row.title,
-      type: row.type,
-      scenario: row.scenario,
-      efficiency: row.efficiency,
-      problem: row.problem,
-      solution: row.solution,
-      keyPoints: row.keyPoints,
-      creator: row.creator,
-      usageCount: row.usageCount
-    });
-  }
-  dialogVisible.value = true;
-};
-
-// 鏌ョ湅鐭ヨ瘑璇︽儏
-const viewKnowledge = (row) => {
-  currentKnowledge.value = { ...row };
-  viewDialogVisible.value = true;
-};
-
-// 鑾峰彇绫诲瀷鏍囩绫诲瀷
-const getTypeTagType = (type) => {
-  const typeMap = {
-    contract: "success",
-    approval: "warning",
-    solution: "primary",
-    experience: "info",
-    guide: "danger"
-  };
-  return typeMap[type] || "info";
-};
-
-// 鑾峰彇绫诲瀷鏍囩鏂囨湰
-const getTypeLabel = (type) => {
-  const typeMap = {
-    contract: "鍚堝悓鐗规壒",
-    approval: "瀹℃壒妗堜緥",
-    solution: "瑙e喅鏂规",
-    experience: "缁忛獙鎬荤粨",
-    guide: "鎿嶄綔鎸囧崡"
-  };
-  return typeMap[type] || type;
-};
-
-// 鑾峰彇鏁堢巼鏍囩绫诲瀷
-const getEfficiencyTagType = (efficiency) => {
-  const typeMap = {
-    high: "success",
-    medium: "warning",
-    low: "info"
-  };
-  return typeMap[efficiency] || "info";
-};
-
-// 鑾峰彇鏁堢巼鏍囩鏂囨湰
-const getEfficiencyLabel = (efficiency) => {
-  const efficiencyMap = {
-    high: "鏄捐憲鎻愬崌",
-    medium: "涓�鑸彁鍗�",
-    low: "杞诲井鎻愬崌"
-  };
-  return efficiencyMap[efficiency] || efficiency;
-};
-
-// 鑾峰彇鏁堢巼鎻愬崌鐧惧垎姣�
-const getEfficiencyScore = (efficiency) => {
-  const scoreMap = {
-    high: 40,
-    medium: 25,
-    low: 15
-  };
-  return scoreMap[efficiency] || 0;
-};
-
-// 鑾峰彇骞冲潎鑺傜渷鏃堕棿
-const getTimeSaved = (efficiency) => {
-  const timeMap = {
-    high: "2-3澶�",
-    medium: "1-2澶�",
-    low: "0.5-1澶�"
-  };
-  return timeMap[efficiency] || "鏈煡";
-};
-
-// 澶嶅埗鐭ヨ瘑
-const copyKnowledge = () => {
-  const knowledgeText = `
-鐭ヨ瘑鏍囬锛�${currentKnowledge.value.title}
-鐭ヨ瘑绫诲瀷锛�${getTypeLabel(currentKnowledge.value.type)}
-閫傜敤鍦烘櫙锛�${currentKnowledge.value.scenario}
-闂鎻忚堪锛�${currentKnowledge.value.problem}
-瑙e喅鏂规锛�${currentKnowledge.value.solution}
-鍏抽敭瑕佺偣锛�${currentKnowledge.value.keyPoints}
-鍒涘缓浜猴細${currentKnowledge.value.creator}
-  `.trim();
-  
-  // 澶嶅埗鍒板壀璐存澘
-  navigator.clipboard.writeText(knowledgeText).then(() => {
-    ElMessage.success("鐭ヨ瘑鍐呭宸插鍒跺埌鍓创鏉�");
-  }).catch(() => {
-    ElMessage.error("澶嶅埗澶辫触锛岃鎵嬪姩澶嶅埗");
+      usageCount: 0,
+    },
+    dialogVisible: false,
+    dialogTitle: "",
+    dialogType: "add",
+    viewDialogVisible: false,
+    currentKnowledge: {},
   });
-};
 
-// 鏀惰棌鐭ヨ瘑
-const markAsFavorite = () => {
-  // 澧炲姞浣跨敤娆℃暟
-  const index = mockData.findIndex(item => item.id === currentKnowledge.value.id);
-  if (index !== -1) {
-    mockData[index].usageCount += 1;
-    currentKnowledge.value.usageCount += 1;
-  }
-  
-  ElMessage.success("宸叉敹钘忥紝浣跨敤娆℃暟+1");
-};
+  const {
+    searchForm,
+    tableLoading,
+    page,
+    tableData,
+    selectedIds,
+    form,
+    dialogVisible,
+    dialogTitle,
+    dialogType,
+    viewDialogVisible,
+    currentKnowledge,
+  } = toRefs(data);
 
-// 鎻愪氦鐭ヨ瘑琛ㄥ崟
-const submitForm = async () => {
-  try {
-    await formRef.value.validate();
-    
-    if (dialogType.value === "add") {
-      // 鏂板鐭ヨ瘑
-      const newKnowledge = {
-        id: (mockData.length + 1).toString(),
-        title: form.value.title,
-        type: form.value.type,
-        scenario: form.value.scenario,
-        efficiency: form.value.efficiency,
-        problem: form.value.problem,
-        solution: form.value.solution,
-        keyPoints: form.value.keyPoints,
-        creator: form.value.creator,
-        usageCount: form.value.usageCount,
-        createTime: new Date().toLocaleString()
-      };
-      
-      mockData.unshift(newKnowledge);
-      ElMessage.success("鐭ヨ瘑鍒涘缓鎴愬姛");
-    } else {
-      // 缂栬緫鐭ヨ瘑
-      const index = mockData.findIndex(item => item.id === selectedIds.value[0]);
-      if (index !== -1) {
-        Object.assign(mockData[index], {
-          title: form.value.title,
-          type: form.value.type,
-          scenario: form.value.scenario,
-          efficiency: form.value.efficiency,
-          problem: form.value.problem,
-          solution: form.value.solution,
-          keyPoints: form.value.keyPoints,
-          creator: form.value.creator,
-          usageCount: form.value.usageCount
-        });
-        ElMessage.success("鐭ヨ瘑鏇存柊鎴愬姛");
-      }
+  // 琛ㄥ崟寮曠敤
+  const formRef = ref();
+
+  // 琛ㄦ牸鍒楅厤缃�
+  const tableColumn = ref([
+    {
+      label: "鐭ヨ瘑鏍囬",
+      prop: "title",
+      showOverflowTooltip: true,
+    },
+    {
+      label: "鐭ヨ瘑绫诲瀷",
+      prop: "type",
+      dataType: "tag",
+      formatData: params => {
+        const typeMap = {
+          contract: "鍚堝悓鐗规壒",
+          approval: "瀹℃壒妗堜緥",
+          solution: "瑙e喅鏂规",
+          experience: "缁忛獙鎬荤粨",
+          guide: "鎿嶄綔鎸囧崡",
+        };
+        return typeMap[params] || params;
+      },
+      formatType: params => {
+        const typeMap = {
+          contract: "success",
+          approval: "warning",
+          solution: "primary",
+          experience: "info",
+          guide: "danger",
+        };
+        return typeMap[params] || "info";
+      },
+    },
+    {
+      label: "閫傜敤鍦烘櫙",
+      prop: "scenario",
+      width: 150,
+      showOverflowTooltip: true,
+    },
+    {
+      label: "瑙e喅鏁堢巼",
+      prop: "efficiency",
+      dataType: "tag",
+      formatData: params => {
+        const efficiencyMap = {
+          high: "鏄捐憲鎻愬崌",
+          medium: "涓�鑸彁鍗�",
+          low: "杞诲井鎻愬崌",
+        };
+        return efficiencyMap[params] || params;
+      },
+      formatType: params => {
+        const typeMap = {
+          high: "success",
+          medium: "warning",
+          low: "info",
+        };
+        return typeMap[params] || "info";
+      },
+    },
+    {
+      label: "浣跨敤娆℃暟",
+      prop: "usageCount",
+      width: 100,
+      align: "center",
+    },
+    {
+      label: "鍒涘缓浜�",
+      prop: "creator",
+      width: 120,
+    },
+    {
+      label: "鍒涘缓鏃堕棿",
+      prop: "createTime",
+      width: 180,
+    },
+    {
+      dataType: "action",
+      label: "鎿嶄綔",
+      align: "center",
+      fixed: "right",
+      width: 200,
+      operation: [
+        {
+          name: "缂栬緫",
+          type: "text",
+          clickFun: row => {
+            openForm("edit", row);
+          },
+        },
+        {
+          name: "鏌ョ湅",
+          type: "text",
+          clickFun: row => {
+            viewKnowledge(row);
+          },
+        },
+      ],
+    },
+  ]);
+
+  // 妯℃嫙鏁版嵁
+  // let mockData = [
+  //   {
+  //     id: "1",
+  //     title: "鐗规畩鍚堝悓瀹℃壒娴佺▼浼樺寲鏂规",
+  //     type: "contract",
+  //     scenario: "澶ч鍚堝悓蹇�熷鎵�",
+  //     efficiency: "high",
+  //     problem: "澶ч鍚堝悓瀹℃壒娴佺▼澶嶆潅锛屽鎵规椂闂撮暱锛屽奖鍝嶄笟鍔¤繘灞�",
+  //     solution: "寤虹珛缁胯壊閫氶亾锛屽绗﹀悎鏉′欢鐨勫悎鍚岄噰鐢ㄧ畝鍖栧鎵规祦绋嬶紝鐢遍儴闂ㄨ礋璐d汉鐩存帴瀹℃壒锛屽钩鍧囧鎵规椂闂翠粠3澶╃缉鐭嚦1澶�",
+  //     keyPoints: "缁胯壊閫氶亾鏉′欢,绠�鍖栨祦绋�,瀹℃壒鏉冮檺,鏃堕棿鎺у埗",
+  //     creator: "寮犵粡鐞�",
+  //     usageCount: 15,
+  //     createTime: "2024-01-15 10:30:00"
+  //   },
+  //   {
+  //     id: "2",
+  //     title: "璺ㄩ儴闂ㄥ崗浣滃鎵圭粡楠屾�荤粨",
+  //     type: "experience",
+  //     scenario: "澶氶儴闂ㄥ崗浣滈」鐩�",
+  //     efficiency: "medium",
+  //     problem: "璺ㄩ儴闂ㄩ」鐩鎵规椂锛屽悇閮ㄩ棬鎰忚涓嶇粺涓�锛屽鎵硅繘搴︾紦鎱�",
+  //     solution: "寤虹珛椤圭洰鍗忚皟鏈哄埗锛屾寚瀹氶」鐩礋璐d汉锛屽畾鏈熷彫寮�鍗忚皟浼氳锛岀粺涓�鍚勬柟鎰忚鍚庡啀杩涜瀹℃壒",
+  //     keyPoints: "椤圭洰鍗忚皟,瀹氭湡浼氳,缁熶竴鎰忚,璐熻矗浜哄埗搴�",
+  //     creator: "鏉庝富绠�",
+  //     usageCount: 8,
+  //     createTime: "2024-01-14 15:20:00"
+  //   },
+  //   {
+  //     id: "3",
+  //     title: "绱ф�ラ噰璐鎵规搷浣滄寚鍗�",
+  //     type: "guide",
+  //     scenario: "绱ф�ラ噰璐渶姹�",
+  //     efficiency: "high",
+  //     problem: "绱ф�ラ噰璐椂瀹℃壒娴佺▼澶嶆潅锛屾棤娉曟弧瓒崇揣鎬ラ渶姹�",
+  //     solution: "鍒跺畾绱ф�ラ噰璐鎵规爣鍑嗭紝鏄庣‘绱ф�ョ▼搴﹀垎绾э紝涓嶅悓绾у埆閲囩敤涓嶅悓瀹℃壒娴佺▼锛岀‘淇濈揣鎬ラ渶姹傚緱鍒板強鏃跺鐞�",
+  //     keyPoints: "绱ф�ュ垎绾�,鏍囧噯鍒跺畾,娴佺▼绠�鍖�,鍙婃椂澶勭悊",
+  //     creator: "鐜嬩笓鍛�",
+  //     usageCount: 12,
+  //     createTime: "2024-01-13 09:15:00"
+  //   }
+  // ];
+
+  // 鐭ヨ瘑鏍囬妯℃澘
+  const titleTemplates = [
+    "{type}瀹℃壒娴佺▼浼樺寲鏂规",
+    "{scenario}澶勭悊缁忛獙鎬荤粨",
+    "{type}鐗规畩鎯呭喌澶勭悊鎸囧崡",
+    "{scenario}蹇�熷鎵规柟妗�",
+    "{type}鏍囧噯鍖栨搷浣滄祦绋�",
+    "{scenario}闂瑙e喅鏂规",
+    "{type}鏈�浣冲疄璺垫�荤粨",
+    "{scenario}鏁堢巼鎻愬崌鏂规",
+  ];
+
+  // 鐭ヨ瘑绫诲瀷閰嶇疆
+  const knowledgeTypes = [
+    { type: "contract", label: "鍚堝悓鐗规壒", efficiency: "high" },
+    { type: "approval", label: "瀹℃壒妗堜緥", efficiency: "medium" },
+    { type: "solution", label: "瑙e喅鏂规", efficiency: "high" },
+    { type: "experience", label: "缁忛獙鎬荤粨", efficiency: "medium" },
+    { type: "guide", label: "鎿嶄綔鎸囧崡", efficiency: "low" },
+  ];
+
+  // 鍦烘櫙鍒楄〃
+  const scenarios = [
+    "澶ч鍚堝悓瀹℃壒",
+    "璺ㄩ儴闂ㄥ崗浣�",
+    "绱ф�ラ噰璐�",
+    "鐗规畩鐢宠",
+    "娴佺▼浼樺寲",
+    "闂澶勭悊",
+    "鏍囧噯鍖栧缓璁�",
+    "鏁堢巼鎻愬崌",
+  ];
+
+  // 鑷姩鐢熸垚鏂版暟鎹�
+  const generateNewData = () => {
+    const newId = (mockData.length + 1).toString();
+    const now = new Date();
+    const randomType =
+      knowledgeTypes[Math.floor(Math.random() * knowledgeTypes.length)];
+    const randomScenario =
+      scenarios[Math.floor(Math.random() * scenarios.length)];
+
+    // 鐢熸垚闅忔満鏍囬
+    let title = titleTemplates[Math.floor(Math.random() * titleTemplates.length)];
+    title = title
+      .replace("{type}", randomType.label)
+      .replace("{scenario}", randomScenario);
+
+    const newKnowledge = {
+      id: newId,
+      title: title,
+      type: randomType.type,
+      scenario: randomScenario,
+      efficiency: randomType.efficiency,
+      problem: `鍦�${randomScenario}杩囩▼涓亣鍒扮殑闂鎻忚堪...`,
+      solution: `閽堝${randomScenario}鐨勮В鍐虫柟妗堝拰鎿嶄綔姝ラ...`,
+      keyPoints: "鍏抽敭瑕佺偣1,鍏抽敭瑕佺偣2,鍏抽敭瑕佺偣3,鍏抽敭瑕佺偣4",
+      creator: ["寮犵粡鐞�", "鏉庝富绠�", "鐜嬩笓鍛�", "鍒樻�荤洃"][
+        Math.floor(Math.random() * 4)
+      ],
+      usageCount: Math.floor(Math.random() * 20) + 1,
+      createTime: now.toLocaleString(),
+    };
+
+    // 娣诲姞鍒版暟鎹紑澶�
+    mockData.unshift(newKnowledge);
+
+    // 淇濇寔鏁版嵁閲忓湪鍚堢悊鑼冨洿鍐咃紙鏈�澶氫繚鐣�30鏉★級
+    if (mockData.length > 30) {
+      mockData = mockData.slice(0, 30);
     }
-    
-    dialogVisible.value = false;
-    getList();
-  } catch (error) {
-    console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
-  }
-};
 
-// 鍒犻櫎鐭ヨ瘑
-const handleDelete = () => {
-  if (selectedIds.value.length === 0) {
-    ElMessage.warning("璇烽�夋嫨瑕佸垹闄ょ殑鐭ヨ瘑");
-    return;
-  }
-  
-  ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎", {
-    confirmButtonText: "纭",
-    cancelButtonText: "鍙栨秷",
-    type: "warning",
-  }).then(() => {
-    // 浠巑ockData涓垹闄ら�変腑鐨勯」
-    selectedIds.value.forEach(id => {
-      const index = mockData.findIndex(item => item.id === id);
-      if (index !== -1) {
-        mockData.splice(index, 1);
-      }
-    });
-    
-    ElMessage.success("鍒犻櫎鎴愬姛");
-    selectedIds.value = [];
+    console.log(`[${new Date().toLocaleString()}] 鑷姩鐢熸垚鏂扮煡璇�: ${title}`);
+  };
+
+  // 鐢熷懡鍛ㄦ湡
+  onMounted(() => {
     getList();
-  }).catch(() => {
-    // 鐢ㄦ埛鍙栨秷
+    startAutoRefresh();
   });
-};
+
+  // 寮�濮嬭嚜鍔ㄥ埛鏂�
+  const startAutoRefresh = () => {
+    setInterval(() => {
+      generateNewData();
+      getList();
+    }, 600000); // 10鍒嗛挓鍒锋柊涓�娆� (10 * 60 * 1000 = 600000ms)
+  };
+
+  // 鏌ヨ鏁版嵁
+  const handleQuery = () => {
+    page.value.current = 1;
+    getList();
+  };
+
+  const getList = () => {
+    tableLoading.value = true;
+    listKnowledgeBase({ ...page.value, ...searchForm.value })
+      .then(res => {
+        tableLoading.value = false;
+        tableData.value = res.data.records;
+        page.total = res.data.total;
+      })
+      .catch(err => {
+        tableLoading.value = false;
+      });
+  };
+
+  // 鍒嗛〉澶勭悊
+  const pagination = obj => {
+    page.value.current = obj.page;
+    page.value.size = obj.limit;
+    handleQuery();
+  };
+
+  // 閫夋嫨鍙樺寲澶勭悊
+  const handleSelectionChange = selection => {
+    selectedIds.value = selection.map(item => item.id);
+  };
+
+  // 鎵撳紑琛ㄥ崟
+  const openForm = (type, row = null) => {
+    dialogType.value = type;
+    if (type === "add") {
+      dialogTitle.value = "鏂板鐭ヨ瘑";
+      // 閲嶇疆琛ㄥ崟
+      Object.assign(form.value, {
+        title: "",
+        type: "",
+        scenario: "",
+        efficiency: "",
+        problem: "",
+        solution: "",
+        keyPoints: "",
+        creator: "",
+        usageCount: 0,
+      });
+    } else if (type === "edit" && row) {
+      dialogTitle.value = "缂栬緫鐭ヨ瘑";
+      Object.assign(form.value, {
+        id: row.id,
+        title: row.title,
+        type: row.type,
+        scenario: row.scenario,
+        efficiency: row.efficiency,
+        problem: row.problem,
+        solution: row.solution,
+        keyPoints: row.keyPoints,
+        creator: row.creator,
+        usageCount: row.usageCount,
+      });
+    }
+    dialogVisible.value = true;
+  };
+
+  // 鏌ョ湅鐭ヨ瘑璇︽儏
+  const viewKnowledge = row => {
+    currentKnowledge.value = { ...row };
+    viewDialogVisible.value = true;
+  };
+
+  // 鑾峰彇绫诲瀷鏍囩绫诲瀷
+  const getTypeTagType = type => {
+    const typeMap = {
+      contract: "success",
+      approval: "warning",
+      solution: "primary",
+      experience: "info",
+      guide: "danger",
+    };
+    return typeMap[type] || "info";
+  };
+
+  // 鑾峰彇绫诲瀷鏍囩鏂囨湰
+  const getTypeLabel = type => {
+    const typeMap = {
+      contract: "鍚堝悓鐗规壒",
+      approval: "瀹℃壒妗堜緥",
+      solution: "瑙e喅鏂规",
+      experience: "缁忛獙鎬荤粨",
+      guide: "鎿嶄綔鎸囧崡",
+    };
+    return typeMap[type] || type;
+  };
+
+  // 鑾峰彇鏁堢巼鏍囩绫诲瀷
+  const getEfficiencyTagType = efficiency => {
+    const typeMap = {
+      high: "success",
+      medium: "warning",
+      low: "info",
+    };
+    return typeMap[efficiency] || "info";
+  };
+
+  // 鑾峰彇鏁堢巼鏍囩鏂囨湰
+  const getEfficiencyLabel = efficiency => {
+    const efficiencyMap = {
+      high: "鏄捐憲鎻愬崌",
+      medium: "涓�鑸彁鍗�",
+      low: "杞诲井鎻愬崌",
+    };
+    return efficiencyMap[efficiency] || efficiency;
+  };
+
+  // 鑾峰彇鏁堢巼鎻愬崌鐧惧垎姣�
+  const getEfficiencyScore = efficiency => {
+    const scoreMap = {
+      high: 40,
+      medium: 25,
+      low: 15,
+    };
+    return scoreMap[efficiency] || 0;
+  };
+
+  // 鑾峰彇骞冲潎鑺傜渷鏃堕棿
+  const getTimeSaved = efficiency => {
+    const timeMap = {
+      high: "2-3澶�",
+      medium: "1-2澶�",
+      low: "0.5-1澶�",
+    };
+    return timeMap[efficiency] || "鏈煡";
+  };
+
+  // 澶嶅埗鐭ヨ瘑
+  const copyKnowledge = () => {
+    const knowledgeText = `
+        鐭ヨ瘑鏍囬锛�${currentKnowledge.value.title}
+        鐭ヨ瘑绫诲瀷锛�${getTypeLabel(currentKnowledge.value.type)}
+        閫傜敤鍦烘櫙锛�${currentKnowledge.value.scenario}
+        闂鎻忚堪锛�${currentKnowledge.value.problem}
+        瑙e喅鏂规锛�${currentKnowledge.value.solution}
+        鍏抽敭瑕佺偣锛�${currentKnowledge.value.keyPoints}
+        鍒涘缓浜猴細${currentKnowledge.value.creator}
+      `.trim();
+
+    // 澶嶅埗鍒板壀璐存澘
+    navigator.clipboard
+      .writeText(knowledgeText)
+      .then(() => {
+        ElMessage.success("鐭ヨ瘑鍐呭宸插鍒跺埌鍓创鏉�");
+      })
+      .catch(() => {
+        ElMessage.error("澶嶅埗澶辫触锛岃鎵嬪姩澶嶅埗");
+      });
+  };
+
+  // 鏀惰棌鐭ヨ瘑
+  const markAsFavorite = () => {
+    // 澧炲姞浣跨敤娆℃暟
+    const index = mockData.findIndex(
+      item => item.id === currentKnowledge.value.id
+    );
+    if (index !== -1) {
+      mockData[index].usageCount += 1;
+      currentKnowledge.value.usageCount += 1;
+    }
+
+    ElMessage.success("宸叉敹钘忥紝浣跨敤娆℃暟+1");
+  };
+
+  // 鎻愪氦鐭ヨ瘑琛ㄥ崟
+  const submitForm = async () => {
+    try {
+      await formRef.value.validate();
+      if (dialogType.value === "add") {
+        // 鏂板鐭ヨ瘑
+        addKnowledgeBase({ ...form.value })
+          .then(res => {
+            if (res.code == 200) {
+              ElMessage.success("娣诲姞鎴愬姛");
+              dialogVisible.value = false;
+              getList();
+            }
+          })
+          .catch(err => {
+            ElMessage.error(err.msg);
+          });
+      } else {
+        updateKnowledgeBase({ ...form.value })
+          .then(res => {
+            if (res.code == 200) {
+              ElMessage.success("鏇存柊鎴愬姛");
+              dialogVisible.value = false;
+              getList();
+            }
+          })
+          .catch(err => {
+            ElMessage.error(err.msg);
+          });
+      }
+    } catch (error) {
+      console.error("琛ㄥ崟楠岃瘉澶辫触:", error);
+    }
+  };
+
+  // 鍒犻櫎鐭ヨ瘑
+  const handleDelete = () => {
+    if (selectedIds.value.length === 0) {
+      ElMessage.warning("璇烽�夋嫨瑕佸垹闄ょ殑鐭ヨ瘑");
+      return;
+    }
+
+    ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎", {
+      confirmButtonText: "纭",
+      cancelButtonText: "鍙栨秷",
+      type: "warning",
+    })
+      .then(() => {
+        // console.log(selectedIds.value);
+        delKnowledgeBase(selectedIds.value).then(res => {
+          if (res.code == 200) {
+            ElMessage.success("鍒犻櫎鎴愬姛");
+            selectedIds.value = [];
+            getList();
+          }
+        });
+      })
+      .catch(() => {
+        // 鐢ㄦ埛鍙栨秷
+      });
+  };
+
+  // 瀵煎嚭
+  const { proxy } = getCurrentInstance();
+  const handleExport = () => {
+    proxy.download(
+      "/knowledgeBase/export",
+      { ...searchForm.value },
+      "鐭ヨ瘑搴�.xlsx"
+    );
+  };
 </script>
 
 <style scoped>
-.auto-refresh-info {
-  margin-bottom: 15px;
-}
+  .auto-refresh-info {
+    margin-bottom: 15px;
+  }
 
-.auto-refresh-info .el-alert {
-  border-radius: 8px;
-}
+  .auto-refresh-info .el-alert {
+    border-radius: 8px;
+  }
 
-.dialog-footer {
-  text-align: right;
-}
+  .dialog-footer {
+    text-align: right;
+  }
 
-.knowledge-detail {
-  padding: 20px 0;
-}
+  .knowledge-detail {
+    padding: 20px 0;
+  }
 
-.detail-title {
-  font-size: 18px;
-  font-weight: bold;
-  color: #303133;
-}
+  .detail-title {
+    font-size: 18px;
+    font-weight: bold;
+    color: #303133;
+  }
 
-.detail-section {
-  margin-top: 24px;
-}
+  .detail-section {
+    margin-top: 24px;
+  }
 
-.detail-section h4 {
-  margin: 0 0 12px 0;
-  font-size: 16px;
-  font-weight: 600;
-  color: #303133;
-  border-left: 4px solid #409eff;
-  padding-left: 12px;
-}
+  .detail-section h4 {
+    margin: 0 0 12px 0;
+    font-size: 16px;
+    font-weight: 600;
+    color: #303133;
+    border-left: 4px solid #409eff;
+    padding-left: 12px;
+  }
 
-.detail-content {
-  background: #f8f9fa;
-  padding: 16px;
-  border-radius: 6px;
-  line-height: 1.6;
-  color: #606266;
-  white-space: pre-wrap;
-}
+  .detail-content {
+    background: #f8f9fa;
+    padding: 16px;
+    border-radius: 6px;
+    line-height: 1.6;
+    color: #606266;
+    white-space: pre-wrap;
+  }
 
-.key-points {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-}
+  .key-points {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+  }
 
-.usage-stats {
-  margin-top: 16px;
-}
+  .usage-stats {
+    margin-top: 16px;
+  }
 
-.stat-item {
-  text-align: center;
-  padding: 20px;
-  background: #f8f9fa;
-  border-radius: 8px;
-}
+  .stat-item {
+    text-align: center;
+    padding: 20px;
+    background: #f8f9fa;
+    border-radius: 8px;
+  }
 
-.stat-number {
-  font-size: 24px;
-  font-weight: bold;
-  color: #409eff;
-  margin-bottom: 8px;
-}
+  .stat-number {
+    font-size: 24px;
+    font-weight: bold;
+    color: #409eff;
+    margin-bottom: 8px;
+  }
 
-.stat-label {
-  font-size: 14px;
-  color: #909399;
-}
+  .stat-label {
+    font-size: 14px;
+    color: #909399;
+  }
 </style>

--
Gitblit v1.9.3