|
|
|
@ -12,7 +12,55 @@
@@ -12,7 +12,55 @@
|
|
|
|
|
</template> |
|
|
|
|
</el-breadcrumb> |
|
|
|
|
</template> |
|
|
|
|
<template #title-right> |
|
|
|
|
<el-dropdown |
|
|
|
|
style="margin-right: 4px" |
|
|
|
|
@command="command => handleCommand(command)" |
|
|
|
|
> |
|
|
|
|
<span class="el-dropdown-link"> |
|
|
|
|
<EdfsButton |
|
|
|
|
inner-text="" |
|
|
|
|
:icon="createIcon" |
|
|
|
|
type="primary" |
|
|
|
|
size="small" |
|
|
|
|
circle |
|
|
|
|
style="width: 26px; height: 26px; padding-right: 1px" |
|
|
|
|
plain |
|
|
|
|
@click="" |
|
|
|
|
/> |
|
|
|
|
</span> |
|
|
|
|
<template #dropdown> |
|
|
|
|
<el-dropdown-menu> |
|
|
|
|
<template v-for="item in dropdownMenu" :key="item.command"> |
|
|
|
|
<el-dropdown-item :command="item.command"> |
|
|
|
|
<img v-if="item?.icon" :src="item?.icon" width="20" /> |
|
|
|
|
{{ item.label }} |
|
|
|
|
</el-dropdown-item> |
|
|
|
|
</template> |
|
|
|
|
</el-dropdown-menu> |
|
|
|
|
</template> |
|
|
|
|
</el-dropdown> |
|
|
|
|
|
|
|
|
|
<el-button-group class="layout-btns" size="small"> |
|
|
|
|
<EdfsButton |
|
|
|
|
inner-text="" |
|
|
|
|
type="primary" |
|
|
|
|
:icon="cardIcons" |
|
|
|
|
:plain="listLayout !== 'card'" |
|
|
|
|
@click="listLayout = 'card'" |
|
|
|
|
/> |
|
|
|
|
<EdfsButton |
|
|
|
|
inner-text="" |
|
|
|
|
type="primary" |
|
|
|
|
:icon="listIcons" |
|
|
|
|
:plain="listLayout !== 'list'" |
|
|
|
|
@click="listLayout = 'list'" |
|
|
|
|
/> |
|
|
|
|
</el-button-group> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<EdfsContextMenu |
|
|
|
|
v-show="listLayout === 'card'" |
|
|
|
|
eventSourceClass="SourceClass" |
|
|
|
|
:disabledEmpty="false" |
|
|
|
|
@visibleChange="onVisibleChange" |
|
|
|
@ -76,6 +124,48 @@
@@ -76,6 +124,48 @@
|
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</EdfsContextMenu> |
|
|
|
|
<EdfsTable |
|
|
|
|
class="table" |
|
|
|
|
v-show="listLayout === 'list'" |
|
|
|
|
:data="dataList" |
|
|
|
|
@row-click="onFileOpen" |
|
|
|
|
> |
|
|
|
|
<template v-for="(col, idx) in folderCol" :key="idx"> |
|
|
|
|
<el-table-column :label="col.label" :prop="col.prop" v-if="col.prop === 'name'"> |
|
|
|
|
<template #default="scope"> |
|
|
|
|
<template v-if="scope.row.isEdit"> |
|
|
|
|
<el-input |
|
|
|
|
v-model="editFileName" |
|
|
|
|
@blur="onSaveRename(scope.row)" |
|
|
|
|
:key="scope.row.id + 'card' + '_edit'" |
|
|
|
|
:ref="el => setInputRefs(el, scope.row.id)" |
|
|
|
|
@keyup.enter="onSaveRename(scope.row)" |
|
|
|
|
/> |
|
|
|
|
</template> |
|
|
|
|
<div class="edit-name-col" v-else> |
|
|
|
|
{{ scope.row[col.prop] }} |
|
|
|
|
<Icon |
|
|
|
|
class="edit-icon" |
|
|
|
|
icon="gravity-ui:pencil-to-square" |
|
|
|
|
@click="onCommand('rename', scope.row)" |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column :label="col.label" :prop="col.prop" v-else /> |
|
|
|
|
</template> |
|
|
|
|
<el-table-column label="操作" align="center"> |
|
|
|
|
<template #default="scope"> |
|
|
|
|
<el-button |
|
|
|
|
v-if="!(isRootMd && scope.row.type === floeType.file)" |
|
|
|
|
type="danger" |
|
|
|
|
link |
|
|
|
|
@click.stop="onCommand('delete', scope.row)" |
|
|
|
|
>删除</el-button |
|
|
|
|
> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column></EdfsTable |
|
|
|
|
> |
|
|
|
|
</EdfsWrap> |
|
|
|
|
</div> |
|
|
|
|
<markdownDrawer |
|
|
|
@ -98,6 +188,7 @@ import {
@@ -98,6 +188,7 @@ import {
|
|
|
|
|
operationDropdownMenu, |
|
|
|
|
breadcrumbList, |
|
|
|
|
fileDropdownMenu, |
|
|
|
|
folderCol, |
|
|
|
|
} from './utils' |
|
|
|
|
import EdfsWrap from '@/components/dashboard/Edfs-wrap.vue' |
|
|
|
|
import { |
|
|
|
@ -120,10 +211,18 @@ import Upload from '@/assets/image/dashboard/file/upload.svg'
@@ -120,10 +211,18 @@ 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 UploadMDDlg from './components/uploadMDDlg.vue' |
|
|
|
|
import EdfsTable from '@/components/dashboard/Edfs-table/index.vue' |
|
|
|
|
import EdfsButton from '@/components/dashboard/Edfs-button/index.vue' |
|
|
|
|
|
|
|
|
|
import { Icon } from '@/components/dashboard/Icon' |
|
|
|
|
import EdfsContextMenu from '@/components/dashboard/Edfs-context-menu/index.vue' |
|
|
|
|
import markdownDrawer from './components/markdownDrawer.vue' |
|
|
|
|
import { useIcon } from '@/utils/useIcon' |
|
|
|
|
|
|
|
|
|
const listIcons = useIcon({ icon: 'gravity-ui:layout-list' }) |
|
|
|
|
const cardIcons = useIcon({ icon: 'gravity-ui:credit-card' }) |
|
|
|
|
const createIcon = useIcon({ icon: 'gravity-ui:plus' }) |
|
|
|
|
const listLayout = ref<'card' | 'list'>('card') |
|
|
|
|
|
|
|
|
|
const dropdownMenu = computed(() => { |
|
|
|
|
if (isRootMd.value) { |
|
|
|
@ -211,6 +310,13 @@ function onNewMarkdown() {
@@ -211,6 +310,13 @@ function onNewMarkdown() {
|
|
|
|
|
dataList.value.push(markdown) |
|
|
|
|
onRename(markdown) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
async function handleCommand(command: string) { |
|
|
|
|
setTimeout(() => { |
|
|
|
|
onCommand(command, 'custom') |
|
|
|
|
}, 800) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const curCommand = ref('') |
|
|
|
|
function onCommand(command: string, item: any) { |
|
|
|
|
curCommand.value = command |
|
|
|
@ -289,7 +395,7 @@ function onFileOpen(item: any) {
@@ -289,7 +395,7 @@ function onFileOpen(item: any) {
|
|
|
|
|
const editInputRefs = ref<any>({}) |
|
|
|
|
function setInputRefs(el: any, id: number) { |
|
|
|
|
if (el) { |
|
|
|
|
editInputRefs.value[`editInputRef_${id}`] = el |
|
|
|
|
editInputRefs.value[`editInputRef_${listLayout.value}_${id}`] = el |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -298,7 +404,6 @@ async function onSaveRename(item: any) {
@@ -298,7 +404,6 @@ async function onSaveRename(item: any) {
|
|
|
|
|
const find = findItem(item.id) |
|
|
|
|
if (!find.isEdit) return |
|
|
|
|
await nextTick() |
|
|
|
|
debugger |
|
|
|
|
find.isEdit = false |
|
|
|
|
if (find.type === floeType.file && !editFileName.value.endsWith('.md')) { |
|
|
|
|
editFileName.value += '.md' |
|
|
|
@ -316,8 +421,8 @@ async function onRename(item: any) {
@@ -316,8 +421,8 @@ async function onRename(item: any) {
|
|
|
|
|
find.isEdit = true |
|
|
|
|
editFileName.value = find.name |
|
|
|
|
await nextTick() |
|
|
|
|
editInputRefs.value[`editInputRef_${item.id}`].focus() |
|
|
|
|
editInputRefs.value[`editInputRef_${item.id}`].select() |
|
|
|
|
editInputRefs.value[`editInputRef_${listLayout.value}_${item.id}`].focus() |
|
|
|
|
editInputRefs.value[`editInputRef_${listLayout.value}_${item.id}`].select() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const findItem = (id: number) => dataList.value.find((v: any) => v.id === id) |
|
|
|
@ -517,5 +622,27 @@ onMounted(() => {
@@ -517,5 +622,27 @@ onMounted(() => {
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.table { |
|
|
|
|
.edit-name-col { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
width: 100%; |
|
|
|
|
column-gap: 4px; |
|
|
|
|
.edit-icon { |
|
|
|
|
display: none; |
|
|
|
|
color: var(--icon-hover-color); |
|
|
|
|
cursor: pointer; |
|
|
|
|
:hover { |
|
|
|
|
color: var(--icon-color); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
:deep(.el-table__row) { |
|
|
|
|
cursor: pointer; |
|
|
|
|
&:hover .edit-icon { |
|
|
|
|
display: block; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|