feat(知识库): 新增附件上传功能并更新侧边栏折叠logo

ZN

7 小时以前 c523068c312960854fea2acdb61e27a6691a6371

feat(知识库): 新增附件上传功能并更新侧边栏折叠logo

- 在知识库管理页面新增附件材料上传功能，支持文档和图片格式
- 为折叠状态的侧边栏添加专用logo（YGYS.png）
- 修改Logo.vue组件，区分折叠和展开状态的logo显示

 src/assets/logo/YGYS.png

 src/layout/components/Sidebar/Logo.vue

@@ -2,7 +2,7 @@
  <div class="sidebar-logo-container" :class="{ 'collapse': collapse }">

    <transition name="sidebarLogoFade">

      <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">

        <img v-if="logoUrl" :src="logoUrl" class="sidebar-logo" @error="handleImageError" alt="公司Logo" />

        <img v-if="collapseLogoUrl" :src="collapseLogoUrl" class="sidebar-logo" @error="handleImageError" alt="公司Logo" />

        <h1 class="sidebar-title">{{ title }}</h1>

      </router-link>

      <router-link v-else key="expand" class="sidebar-logo-link" to="/">

@@ -17,6 +17,7 @@
import { ref, computed, onMounted, watch } from 'vue'

import useUserStore from '@/store/modules/user'

import defaultLogo from '@/assets/logo/1773911812157.png' // 导入默认logo

import collaborativeApprovalLogo from '@/assets/logo/YGYS.png' // 导入协作审批logo



defineProps({

  collapse: {

@@ -36,11 +37,13 @@


// 动态logo路径

const logoUrl = ref('')

const collapseLogoUrl = ref('')



// 检查logo是否存在并设置url

const updateLogoUrl = () => {

  if (!cleanFactoryName.value) {

    logoUrl.value = defaultLogo

    collapseLogoUrl.value = collaborativeApprovalLogo

    return

  }



@@ -51,12 +54,15 @@


    if (dynamicLogo[logoPath]) {

      logoUrl.value = dynamicLogo[logoPath].default

      collapseLogoUrl.value = collaborativeApprovalLogo

    } else {

      logoUrl.value = defaultLogo

      collapseLogoUrl.value = collaborativeApprovalLogo

    }

  } catch (error) {

    console.error('加载工厂Logo失败:', error)

    logoUrl.value = defaultLogo

    collapseLogoUrl.value = collaborativeApprovalLogo

  }

}




 src/views/collaborativeApproval/knowledgeBase/index.vue

@@ -133,6 +133,27 @@
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="附件材料" prop="tempFileIds">
          <el-upload
            v-model:file-list="fileList"
            :action="upload.url"
            multiple
            ref="fileUpload"
            auto-upload
            :headers="upload.headers"
            :before-upload="handleBeforeUpload"
            :on-error="handleUploadError"
            :on-success="handleUploadSuccess"
            :on-remove="handleRemove"
          >
            <el-button type="primary">上传</el-button>
            <template #tip>
              <div class="el-upload__tip">
                支持文档（doc, docx, xls, xlsx, pdf, txt）和图片（jpg, jpeg, png, gif）格式
              </div>
            </template>
          </el-upload>
        </el-form-item>
      </el-form>
    </FormDialog>

@@ -198,6 +219,16 @@
          </div>
        </div>

        <div class="detail-section" v-if="currentKnowledge.commonFileList && currentKnowledge.commonFileList.length > 0">
          <h4>附件材料</h4>
          <div class="file-list">
            <div v-for="file in currentKnowledge.commonFileList" :key="file.id" class="file-item" style="margin-bottom: 8px;">
              <el-icon><Document /></el-icon>
              <el-link type="primary" :href="file.url" target="_blank" style="margin-left: 8px;">{{ file.name }}</el-link>
            </div>
          </div>
        </div>

        <div class="detail-section">
          <h4>使用统计</h4>
          <div class="usage-stats">
@@ -229,14 +260,16 @@
</template>

<script setup>
import { Search } from "@element-plus/icons-vue";
import { Search, Document } from "@element-plus/icons-vue";
import { onMounted, ref, reactive, toRefs, getCurrentInstance, computed, watch } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import PIMTable from "@/components/PIMTable/PIMTable.vue";
import FormDialog from '@/components/Dialog/FormDialog.vue';
import { listKnowledgeBase, delKnowledgeBase,addKnowledgeBase,updateKnowledgeBase } from "@/api/collaborativeApproval/knowledgeBase.js";
import { delLedgerFile } from "@/api/salesManagement/salesLedger.js";
import useUserStore from '@/store/modules/user';
import { userListNoPageByTenantId } from '@/api/system/user.js';
import { getToken } from "@/utils/auth";

// 表单验证规则
const rules = {
@@ -268,6 +301,13 @@
  },
  tableData: [],
  selectedIds: [],
  fileList: [],
  upload: {
    // 上传的地址
    url: import.meta.env.VITE_APP_BASE_API + "/file/upload",
    // 设置上传的请求头部
    headers: { Authorization: "Bearer " + getToken() },
  },
  form: {
    title: "",
    type: "",
@@ -277,7 +317,8 @@
    solution: "",
    keyPoints: "",
    creator: "",
    usageCount: 0
    usageCount: 0,
    tempFileIds: []
  },
  dialogVisible: false,
  dialogTitle: "",
@@ -292,6 +333,8 @@
  page,
  tableData,
  selectedIds,
  fileList,
  upload,
  form,
  dialogVisible,
  dialogTitle,
@@ -462,6 +505,7 @@
  if (type === "add") {
    dialogTitle.value = "新增知识";
    // 重置表单，默认创建人为当前用户
    fileList.value = [];
    Object.assign(form.value, {
      title: "",
      type: "",
@@ -471,10 +515,12 @@
      solution: "",
      keyPoints: "",
      creator: userStore.nickName || "",
      usageCount: 0
      usageCount: 0,
      tempFileIds: []
    });
  } else if (type === "edit" && row) {
    dialogTitle.value = "编辑知识";
    fileList.value = row.commonFileList || [];
    Object.assign(form.value, {
      id: row.id,
      title: row.title,
@@ -485,7 +531,8 @@
      solution: row.solution,
      keyPoints: row.keyPoints,
      creator: row.creator,
      usageCount: row.usageCount
      usageCount: row.usageCount,
      tempFileIds: (row.commonFileList || []).map(file => file.id)
    });
  }
  dialogVisible.value = true;
@@ -577,6 +624,7 @@
// 关闭知识表单对话框
const closeKnowledgeDialog = () => {
  // 清空表单数据，默认创建人为当前用户
  fileList.value = [];
  Object.assign(form.value, {
    id: undefined,
    title: "",
@@ -587,7 +635,8 @@
    solution: "",
    keyPoints: "",
    creator: userStore.nickName || "",
    usageCount: 0
    usageCount: 0,
    tempFileIds: []
  });
  // 清除表单验证状态
  if (formRef.value) {
@@ -607,6 +656,41 @@
  closeViewDialog();
};

// 上传前校检
function handleBeforeUpload(file) {
  proxy.$modal.loading("正在上传文件，请稍候...");
  return true;
}
// 上传失败
function handleUploadError(err) {
  proxy.$modal.msgError("上传文件失败");
  proxy.$modal.closeLoading();
}
// 上传成功回调
function handleUploadSuccess(res, file, uploadFiles) {
  proxy.$modal.closeLoading();
  if (res.code === 200) {
    if (!form.value.tempFileIds) {
      form.value.tempFileIds = [];
    }
    form.value.tempFileIds.push(res.data.tempId);
    proxy.$modal.msgSuccess("上传成功");
  } else {
    proxy.$modal.msgError(res.msg);
    proxy.$refs.fileUpload.handleRemove(file);
  }
}
// 移除文件
function handleRemove(file) {
  if (dialogType.value === "edit") {
    let ids = [];
    ids.push(file.id);
    delLedgerFile(ids).then((res) => {
      proxy.$modal.msgSuccess("删除成功");
    });
  }
}

// 提交知识表单
const submitForm = async () => {
  try {