|
|
|
|
@ -18,7 +18,7 @@
@@ -18,7 +18,7 @@
|
|
|
|
|
@visibleChange="onVisibleChange" |
|
|
|
|
ref="contextMenuRef" |
|
|
|
|
> |
|
|
|
|
<div class="file-list" v-if="loading"> |
|
|
|
|
<div class="file-list"> |
|
|
|
|
<div v-for="item in dataList" :key="item.id" @click="onFileOpen(item)"> |
|
|
|
|
<div class="item SourceClass" v-setItem="item"> |
|
|
|
|
<div class="file-header"> |
|
|
|
|
@ -30,9 +30,15 @@
@@ -30,9 +30,15 @@
|
|
|
|
|
></Icon> |
|
|
|
|
</div> |
|
|
|
|
<div class="file-icon"> |
|
|
|
|
<!-- {{ !!item.isEdit }} --> |
|
|
|
|
|
|
|
|
|
<img :src="item.type === floeType.folder ? Folder : Document" /> |
|
|
|
|
<img |
|
|
|
|
:src=" |
|
|
|
|
item.type === floeType.folder |
|
|
|
|
? Folder |
|
|
|
|
: item.isDraft === 0 |
|
|
|
|
? Document |
|
|
|
|
: Document2 |
|
|
|
|
" |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
|
<div class="file-name"> |
|
|
|
|
<el-input |
|
|
|
|
@ -103,20 +109,29 @@ import { ArrowRight } from '@element-plus/icons-vue'
@@ -103,20 +109,29 @@ import { ArrowRight } from '@element-plus/icons-vue'
|
|
|
|
|
import Folder from '@/assets/image/dashboard/file/folder.svg' |
|
|
|
|
import Upload from '@/assets/image/dashboard/file/upload.svg' |
|
|
|
|
import Document from '@/assets/image/dashboard/file/document.svg' |
|
|
|
|
import Document2 from '@/assets/image/dashboard/file/document2.svg' |
|
|
|
|
|
|
|
|
|
import { Icon } from '@/components/dashboard/Icon' |
|
|
|
|
import EdfsContextMenu from '@/components/dashboard/Edfs-context-menu/index.vue' |
|
|
|
|
import markdownDrawer from './components/markdownDrawer.vue' |
|
|
|
|
|
|
|
|
|
const dropdownMenu = computed(() => { |
|
|
|
|
return menuTarget.value ? fileDropdownMenu : operationDropdownMenu |
|
|
|
|
return menuTarget.value |
|
|
|
|
? fileDropdownMenu |
|
|
|
|
: currentFolderId.value === 0 |
|
|
|
|
? operationDropdownMenu.filter(v => v.command === 'newFolder') |
|
|
|
|
: operationDropdownMenu.filter(v => v.command === 'newMarkdown') |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
const message = useMessage() |
|
|
|
|
|
|
|
|
|
const currentId = ref(0) |
|
|
|
|
watch(breadcrumbList.value, () => { |
|
|
|
|
currentId.value = breadcrumbList.value[breadcrumbList.value.length - 1].id |
|
|
|
|
}) |
|
|
|
|
const currentFolderId = ref(0) |
|
|
|
|
watch( |
|
|
|
|
() => breadcrumbList.value.length, |
|
|
|
|
() => { |
|
|
|
|
currentFolderId.value = breadcrumbList.value[breadcrumbList.value.length - 1].id |
|
|
|
|
} |
|
|
|
|
) |
|
|
|
|
|
|
|
|
|
const dataList = ref<any>([]) |
|
|
|
|
const loading = ref(false) |
|
|
|
|
@ -125,17 +140,14 @@ async function loadData(id: number = 0) {
@@ -125,17 +140,14 @@ async function loadData(id: number = 0) {
|
|
|
|
|
const res = await getFileList({ |
|
|
|
|
parentId: id, |
|
|
|
|
}) |
|
|
|
|
loading.value = false |
|
|
|
|
if (isResError(res)) return |
|
|
|
|
dataList.value = res.data.map((item: any) => ({ |
|
|
|
|
...item, |
|
|
|
|
isEdit: false, |
|
|
|
|
})) |
|
|
|
|
loading.value = true |
|
|
|
|
dataList.value = res.data |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
async function onDelete(item: any) { |
|
|
|
|
try { |
|
|
|
|
let res |
|
|
|
|
let res: any |
|
|
|
|
await message.delConfirm() |
|
|
|
|
switch (item.type) { |
|
|
|
|
case floeType.folder: |
|
|
|
|
@ -147,7 +159,7 @@ async function onDelete(item: any) {
@@ -147,7 +159,7 @@ async function onDelete(item: any) {
|
|
|
|
|
} |
|
|
|
|
if (isResError(res)) return |
|
|
|
|
message.success('删除成功') |
|
|
|
|
loadData(currentId.value) |
|
|
|
|
loadData(currentFolderId.value) |
|
|
|
|
} catch (error) {} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -158,7 +170,7 @@ function onFile(e: any) {
@@ -158,7 +170,7 @@ function onFile(e: any) {
|
|
|
|
|
|
|
|
|
|
function onNewFolder() { |
|
|
|
|
const folder = { |
|
|
|
|
name: '新建文件夹', |
|
|
|
|
name: '未命名文件夹', |
|
|
|
|
type: floeType.folder, |
|
|
|
|
isEdit: true, |
|
|
|
|
} |
|
|
|
|
@ -168,7 +180,7 @@ function onNewFolder() {
@@ -168,7 +180,7 @@ function onNewFolder() {
|
|
|
|
|
|
|
|
|
|
function onNewMarkdown() { |
|
|
|
|
const markdown = { |
|
|
|
|
name: '新建文档', |
|
|
|
|
name: '未命名文档', |
|
|
|
|
type: floeType.file, |
|
|
|
|
isEdit: true, |
|
|
|
|
} |
|
|
|
|
@ -234,23 +246,26 @@ async function onSaveRename(item: any) {
@@ -234,23 +246,26 @@ async function onSaveRename(item: any) {
|
|
|
|
|
if (!item.isEdit) return |
|
|
|
|
item.name = editFileName.value |
|
|
|
|
await nextTick() |
|
|
|
|
item.isEdit = false |
|
|
|
|
await nextTick() |
|
|
|
|
const find = findItem(item.id) |
|
|
|
|
find.isEdit = false |
|
|
|
|
await onSaveFile(item) |
|
|
|
|
editFileName.value = '' |
|
|
|
|
} |
|
|
|
|
async function onRename(item: any) { |
|
|
|
|
if (!item) return |
|
|
|
|
item.isEdit = true |
|
|
|
|
await nextTick() |
|
|
|
|
const find = findItem(item.id) |
|
|
|
|
find.isEdit = true |
|
|
|
|
editFileName.value = item.name |
|
|
|
|
await nextTick() |
|
|
|
|
editInputRefs.value[`editInputRef_${item.id}`].focus() |
|
|
|
|
editInputRefs.value[`editInputRef_${item.id}`].select() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const findItem = (id: number) => dataList.value.find((v: any) => v.id === id) |
|
|
|
|
|
|
|
|
|
async function onSaveFile(item: any) { |
|
|
|
|
const isAdd = !item.id |
|
|
|
|
loading.value = true |
|
|
|
|
switch (item.type) { |
|
|
|
|
case floeType.folder: |
|
|
|
|
await saveFolder(isAdd, item) |
|
|
|
|
@ -260,21 +275,30 @@ async function onSaveFile(item: any) {
@@ -260,21 +275,30 @@ async function onSaveFile(item: any) {
|
|
|
|
|
break |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
loadData(currentId.value) |
|
|
|
|
loadData(currentFolderId.value) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function getPath() { |
|
|
|
|
return currentFolderId.value === 0 |
|
|
|
|
? '' |
|
|
|
|
: breadcrumbList.value[breadcrumbList.value.length - 1].path |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
async function saveFolder(isAdd: boolean, item: any) { |
|
|
|
|
getPath() |
|
|
|
|
let res |
|
|
|
|
if (isAdd) { |
|
|
|
|
res = await createFolder({ |
|
|
|
|
name: item.name, |
|
|
|
|
parentId: currentId.value, |
|
|
|
|
parentId: currentFolderId.value, |
|
|
|
|
path: getPath(), |
|
|
|
|
}) |
|
|
|
|
} else { |
|
|
|
|
res = await updateFolder({ |
|
|
|
|
id: item.id, |
|
|
|
|
name: item.name, |
|
|
|
|
parentId: currentId.value, |
|
|
|
|
parentId: currentFolderId.value, |
|
|
|
|
path: getPath(), |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
if (isResError(res)) return |
|
|
|
|
@ -284,34 +308,56 @@ async function saveFile(isAdd: boolean, item: any) {
@@ -284,34 +308,56 @@ async function saveFile(isAdd: boolean, item: any) {
|
|
|
|
|
if (isAdd) { |
|
|
|
|
res = await createdFile({ |
|
|
|
|
name: item.name + '.md', |
|
|
|
|
parentId: currentId.value, |
|
|
|
|
parentId: currentFolderId.value, |
|
|
|
|
isDraft: 1, |
|
|
|
|
path: getPath(), |
|
|
|
|
}) |
|
|
|
|
} else { |
|
|
|
|
res = await updateFile({ |
|
|
|
|
id: item.id, |
|
|
|
|
name: item.name, |
|
|
|
|
parentId: currentId.value, |
|
|
|
|
parentId: currentFolderId.value, |
|
|
|
|
path: getPath(), |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
if (isResError(res)) return |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const fullscreenLoading = ref() |
|
|
|
|
|
|
|
|
|
function openFullScreen() { |
|
|
|
|
fullscreenLoading.value = ElLoading.service({ |
|
|
|
|
lock: true, |
|
|
|
|
text: '数据加载中请稍等...', |
|
|
|
|
target: document.querySelector('.firmware-management-wrap') as HTMLElement, |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
watch(loading, val => { |
|
|
|
|
if (val) { |
|
|
|
|
openFullScreen() |
|
|
|
|
} else { |
|
|
|
|
fullscreenLoading.value?.close() |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
// markdown 操作 |
|
|
|
|
const curMarkdown = ref() as Ref<ContentType> |
|
|
|
|
const curMarkdown = ref() as Ref<ContentType & { fileName: string }> |
|
|
|
|
const curMdId = ref() |
|
|
|
|
|
|
|
|
|
const isShowMdDrawer = ref(false) |
|
|
|
|
async function onOpenMarkdownDrawer(id: number) { |
|
|
|
|
curMdId.value = id |
|
|
|
|
const res = await getMarkdown({ folderId: id }) |
|
|
|
|
if (isResError(res)) return |
|
|
|
|
curMarkdown.value = res?.data |
|
|
|
|
curMarkdown.value = Object.assign({}, res.data, { fileName: findItem(id).name }) |
|
|
|
|
|
|
|
|
|
isShowMdDrawer.value = true |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
async function onSaveMd(isDraft: 0 | 1, data: string) { |
|
|
|
|
const res = await updateMarkdown({ |
|
|
|
|
content: data, |
|
|
|
|
folderId: currentId.value, |
|
|
|
|
id: curMarkdown.value?.id, |
|
|
|
|
folderId: curMdId.value, |
|
|
|
|
isDraft, |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
@ -319,7 +365,7 @@ async function onSaveMd(isDraft: 0 | 1, data: string) {
@@ -319,7 +365,7 @@ async function onSaveMd(isDraft: 0 | 1, data: string) {
|
|
|
|
|
message.success(isDraft === 1 ? '保存成功' : '发布成功') |
|
|
|
|
isShowMdDrawer.value = false |
|
|
|
|
curMarkdown.value = null as any |
|
|
|
|
loadData(currentId.value) |
|
|
|
|
loadData(currentFolderId.value) |
|
|
|
|
} |
|
|
|
|
onMounted(() => { |
|
|
|
|
loadData() |
|
|
|
|
|
