|
|
@@ -1,10 +1,10 @@
|
|
|
<template>
|
|
|
<div class="page-doc">
|
|
|
<div class="header">
|
|
|
- <home-header @login="emits('login')" />
|
|
|
+ <home-header @login="emits('login')" sub-title="知识库管理" />
|
|
|
</div>
|
|
|
<div class="my-doc-container">
|
|
|
- <TitleHeader :items="menuList" />
|
|
|
+ <TitleHeader :items="menuList" @tabClick="tabClickHandle" />
|
|
|
<FileDetail
|
|
|
v-if="clickFileDetail && clickFileDetail.sign == 'file'"
|
|
|
:fileDetail="clickFileDetail"
|
|
|
@@ -69,18 +69,25 @@
|
|
|
:pagination="false"
|
|
|
>
|
|
|
<template #bodyCell="{ column, record }">
|
|
|
- <template v-if="column.key === 'fileName'">
|
|
|
- <div
|
|
|
- v-if="record.sign == 'dir'"
|
|
|
- class="name-box"
|
|
|
- @click="jumpToFile(record)"
|
|
|
- >
|
|
|
- <MyIcon :icon="iconTypeName.dir" size="18" />
|
|
|
- <span>{{ record.fileName }}</span>
|
|
|
- </div>
|
|
|
- <div v-else class="name-box" @click="showFileDetail(record)">
|
|
|
- <MyIcon :icon="iconTypeName[record.fileType]" size="18" />
|
|
|
- <span>{{ record.fileName }}</span>
|
|
|
+ <template v-if="column.dataIndex === 'fileName'">
|
|
|
+ <div class="editable-cell">
|
|
|
+ <div v-if="editableData[record.key]">
|
|
|
+ <a-input v-model:value="editableData[record.key].fileName" @pressEnter="save(record.key)" />
|
|
|
+ </div>
|
|
|
+ <div v-else class="editable-cell-text-wrapper">
|
|
|
+ <div
|
|
|
+ v-if="record.sign == 'dir'"
|
|
|
+ class="name-box"
|
|
|
+ @click="jumpToFile(record)"
|
|
|
+ >
|
|
|
+ <MyIcon :icon="iconTypeName.dir" size="18" />
|
|
|
+ <span>{{ record.fileName }}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else class="name-box" @click="showFileDetail(record)">
|
|
|
+ <MyIcon :icon="iconTypeName[record.fileType]" size="18" />
|
|
|
+ <span>{{ record.fileName }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-if="column.key === 'createTime'">
|
|
|
@@ -107,7 +114,16 @@
|
|
|
</a>
|
|
|
<template #overlay>
|
|
|
<a-menu>
|
|
|
- <a-menu-item v-if="record.sign !== 'dir'">
|
|
|
+ <a-menu-item>
|
|
|
+ <a-button
|
|
|
+ type="link"
|
|
|
+ :icon="h(DeleteOutlined)"
|
|
|
+ style="color: #000"
|
|
|
+ @click="moveFiles([record.id])"
|
|
|
+ >刪除</a-button
|
|
|
+ >
|
|
|
+ </a-menu-item>
|
|
|
+ <a-menu-item>
|
|
|
<a-button
|
|
|
type="link"
|
|
|
:icon="h(DeliveredProcedureOutlined)"
|
|
|
@@ -125,6 +141,15 @@
|
|
|
>置顶</a-button
|
|
|
>
|
|
|
</a-menu-item>
|
|
|
+ <a-menu-item>
|
|
|
+ <a-button
|
|
|
+ type="link"
|
|
|
+ :icon="h(FormOutlined)"
|
|
|
+ style="color: #000"
|
|
|
+ @click="editFolderName(record.key)"
|
|
|
+ >编辑</a-button
|
|
|
+ >
|
|
|
+ </a-menu-item>
|
|
|
</a-menu>
|
|
|
</template>
|
|
|
</a-dropdown>
|
|
|
@@ -153,8 +178,11 @@
|
|
|
/**
|
|
|
* @description 我的文档
|
|
|
*/
|
|
|
+import { cloneDeep } from 'lodash-es';
|
|
|
import { h, ref, reactive, onMounted } from "vue";
|
|
|
import {
|
|
|
+ FormOutlined,
|
|
|
+ DeleteOutlined,
|
|
|
CloudUploadOutlined,
|
|
|
SearchOutlined,
|
|
|
DownloadOutlined,
|
|
|
@@ -189,11 +217,27 @@ const menuList = ref<{
|
|
|
checked: boolean
|
|
|
}[]>([
|
|
|
{
|
|
|
- name: "我的收藏",
|
|
|
- id: '',
|
|
|
+ name: "全部",
|
|
|
+ id: '-1',
|
|
|
checked: true
|
|
|
}
|
|
|
])
|
|
|
+const currentTabId = ref('-1')
|
|
|
+const tabClickHandle = (item) => {
|
|
|
+ if (currentTabId.value === item['id']) return;
|
|
|
+ if (item['id'] === '-1') {
|
|
|
+ menuList.value = [{
|
|
|
+ name: "全部",
|
|
|
+ id: '-1',
|
|
|
+ checked: true
|
|
|
+ }]
|
|
|
+ getDataSource();
|
|
|
+ } else {
|
|
|
+ getDataSource({
|
|
|
+ id: item.id,
|
|
|
+ });
|
|
|
+ }
|
|
|
+}
|
|
|
// 切换目录
|
|
|
const changeMenu = (fileName: any = null) => {
|
|
|
// 切换目录时重置搜索内容和选中的文件
|
|
|
@@ -250,6 +294,7 @@ const onSelectChange = (selectedRowKeys: any[]) => {
|
|
|
const clickFileDetail = ref<null | any>(null);
|
|
|
const jumpToFile = (data: any) => {
|
|
|
clickFileDetail.value = data;
|
|
|
+ currentTabId.value = data.id;
|
|
|
// 触发目录切换的回调
|
|
|
changeMenu(data.fileName);
|
|
|
getDataSource({
|
|
|
@@ -309,6 +354,20 @@ const downloadFiles = async (ids: any[] = []) => {
|
|
|
message.error("下载失败，请稍后重试！");
|
|
|
}
|
|
|
};
|
|
|
+const editableData = reactive({});
|
|
|
+const save = (key: string) => {
|
|
|
+ const item = dataSource.value.filter(item => key === item.key)[0];
|
|
|
+ Object.assign(item, editableData[key]);
|
|
|
+ delete editableData[key];
|
|
|
+};
|
|
|
+//编辑文件夹名称
|
|
|
+const editFolderName = (key) => {
|
|
|
+ editableData[key] = cloneDeep(dataSource.value.filter(item => key === item.key)[0]);
|
|
|
+}
|
|
|
+//刪除
|
|
|
+const deleteFiles = () => {
|
|
|
+
|
|
|
+}
|
|
|
// 移动：最外层文件禁止多选移动，文件夹类型禁止移动
|
|
|
const moveFileModel = ref(false);
|
|
|
const moveFileIds = ref<any[]>([]);
|
|
|
@@ -352,7 +411,6 @@ const topFile = async (id: string) => {
|
|
|
|
|
|
// 跳到文件详情页面
|
|
|
const showFileDetail = (data: any) => {
|
|
|
- console.log("跳到文件详情页面", data);
|
|
|
clickFileDetail.value = {
|
|
|
...data,
|
|
|
id: data.fileId,
|
