Merge remote-tracking branch 'origin/dev' into dev

# Conflicts:
#	src/components/preview/SimTextPreview.vue
This commit is contained in:
jmal 2021-03-25 20:05:43 +08:00
commit 9aadc58cb7
5 changed files with 134 additions and 64 deletions

View File

@ -26,7 +26,6 @@
<el-input placeholder="请输入内容" size="small"> <el-input placeholder="请输入内容" size="small">
<el-button slot="append" size="small" icon="el-icon-search"></el-button> <el-button slot="append" size="small" icon="el-icon-search"></el-button>
</el-input> </el-input>
<el-button slot="reference" :class="lightTheme?'light-button':'dark-button'" size="small" icon="el-icon-search">搜索</el-button>
</el-popover> </el-popover>
</el-button-group> </el-button-group>
@ -135,7 +134,7 @@
let input = data.node.span.querySelector('.fancytree-title .fancytree-edit-input') let input = data.node.span.querySelector('.fancytree-title .fancytree-edit-input')
let width = input.style.width.substring(0,input.style.width.length-2) let width = input.style.width.substring(0,input.style.width.length-2)
input.style.width = parseInt(width)+50+'px' input.style.width = parseInt(width)+50+'px'
if(input.value.length -1 > data.node.data.suffix.length){ if(input.value && input.value.length -1 > data.node.data.suffix.length){
input.selectionStart = 0 input.selectionStart = 0
input.selectionEnd = input.value.length - 1 - data.node.data.suffix.length input.selectionEnd = input.value.length - 1 - data.node.data.suffix.length
} }
@ -246,6 +245,7 @@
username: this.$store.state.user.name, username: this.$store.state.user.name,
path: data.path path: data.path
}).then(()=>{ }).then(()=>{
this.$emit('removeFile', data.path)
let node = this.tree.getActiveNode() let node = this.tree.getActiveNode()
node.remove() node.remove()
this.$message.success("删除成功!") this.$message.success("删除成功!")

View File

@ -76,6 +76,7 @@
@treeNodeClick="treeNodeClick" @treeNodeClick="treeNodeClick"
@onLoadTreePath="onLoadTreePath" @onLoadTreePath="onLoadTreePath"
@onRename="onRename" @onRename="onRename"
@removeFile="removeFile"
> >
</fancy-tree> </fancy-tree>
</div> </div>
@ -85,7 +86,7 @@
<i v-show="!options.readOnly && !moblie " class="editor-resize-conter" icon="el-icon-arrow-right" title="影藏文件目录" @click="hideContents"/> <i v-show="!options.readOnly && !moblie " class="editor-resize-conter" icon="el-icon-arrow-right" title="影藏文件目录" @click="hideContents"/>
</div> </div>
<div :style="{width: editorWidth-2+'px'}"> <div :style="{width: editorWidth-2+'px'}">
<el-tabs v-model="editableTabsValue" type="card" closable @tab-remove="removeTab"> <el-tabs v-model="editableTabsValue" type="card" closable @tab-remove="removeTab" @tab-click="clickTab">
<el-tab-pane <el-tab-pane
v-for="(item,index) in editableTabs" v-for="(item,index) in editableTabs"
:key="item.name" :key="item.name"
@ -95,21 +96,20 @@
<span slot="label"><svg-icon class="tabs-icon-svg" :icon-class="findSvgClass(item.name)"></svg-icon> {{item.title}}</span> <span slot="label"><svg-icon class="tabs-icon-svg" :icon-class="findSvgClass(item.name)"></svg-icon> {{item.title}}</span>
<div v-if="textPreviewVisible" class="editor"> <div v-if="textPreviewVisible" class="editor">
<vditor-preview <vditor-preview
:ref="'vditor'+index"
class="content-body" class="content-body"
v-show="editableTabsValue.endsWith('.md') && previewMode" v-show="editableTabsValue.endsWith('.md') && previewMode"
:content="item.content"
:style="{height: editorHieght+'px'}" :style="{height: editorHieght+'px'}"
/> />
<MonacoEditor <MonacoEditor
v-show="editableTabsValue.endsWith('.md') ? !previewMode: true" v-show="editableTabsValue.endsWith('.md') ? !previewMode: true"
ref="monacoEditor" :ref="'monacoEditor'+index"
:width="editorWidth" :width="editorWidth"
:height="editorHieght" :height="editorHieght"
:theme="lightTheme?'vs':'vs-dark'" :theme="lightTheme?'vs':'vs-dark'"
:language="item.language" :language="item.language"
:diffEditor="diffEditor" :diffEditor="diffEditor"
original="..." original="..."
:value="item.content"
:options="options" :options="options"
@change="change($event,index)" @change="change($event,index)"
@save="save($event,index)" @save="save($event,index)"
@ -182,6 +182,7 @@
contextmenu: true, contextmenu: true,
codeLens: true, codeLens: true,
readOnly: true, readOnly: true,
lineNumbers: this.$pc,
minimap: { minimap: {
enabled: this.$pc enabled: this.$pc
}, },
@ -217,7 +218,9 @@
}, },
directoryTreeData: {}, directoryTreeData: {},
editableTabsValue: '1', editableTabsValue: '1',
nextActiveName: '',
editableTabs: [], editableTabs: [],
editableValueMap: new Map(),
filePathNav: '', filePathNav: '',
toolbars: { toolbars: {
readmodel: true, // 沉浸式阅读 readmodel: true, // 沉浸式阅读
@ -306,9 +309,9 @@
copyTitle: res.data.name, copyTitle: res.data.name,
language: this.getEditorLanguage(res.data.suffix), language: this.getEditorLanguage(res.data.suffix),
status: undefined,//标签状态 status: undefined,//标签状态
name: pathname, name: pathname
content: res.data.contentText
}) })
this.setEditMap(0, res.data.contentText)
this.editableTabsValue = pathname this.editableTabsValue = pathname
// 界面的渲染后的初始化工作 // 界面的渲染后的初始化工作
this.$nextTick(()=>{ this.$nextTick(()=>{
@ -479,6 +482,12 @@
onLoadTreePath(path){ onLoadTreePath(path){
this.filePathNav = path this.filePathNav = path
}, },
removeFile(filepath) {
let findIndex = this.editableTabs.findIndex(editable => editable.name === filepath)
if(findIndex > -1){
this.editableTabs.splice(findIndex, 1)
}
},
treeNodeClick(row) { treeNodeClick(row) {
if(row.isFolder){ if(row.isFolder){
return return
@ -519,17 +528,19 @@
copyTitle:row.name, copyTitle:row.name,
status: undefined, status: undefined,
language: this.getEditorLanguage(row.suffix), language: this.getEditorLanguage(row.suffix),
name:row.path, name:row.path
content:res.data.contentText
} }
if(row.isAddTab){ if(row.isAddTab){
this.editableTabs.push(tab) this.editableTabs.push(tab)
this.setEditMap(this.editableTabs.length -1, res.data.contentText)
}else{ }else{
let thisTabIndex = this.editableTabs.findIndex(tab=> tab.status===undefined) let thisTabIndex = this.editableTabs.findIndex(tab=> tab.status===undefined)
if(thisTabIndex > -1){ if(thisTabIndex > -1){
this.editableTabs[thisTabIndex] = tab this.editableTabs[thisTabIndex] = tab
this.setEditMap(thisTabIndex, res.data.contentText)
}else{ }else{
this.editableTabs.push(tab) this.editableTabs.push(tab)
this.setEditMap(this.editableTabs.length - 1, res.data.contentText)
} }
} }
this.editableTabsValue = row.path this.editableTabsValue = row.path
@ -538,8 +549,19 @@
}) })
}else{ }else{
this.editableTabsValue = row.path this.editableTabsValue = row.path
this.clickTab()
} }
}, },
setEditMap(index, text) {
this.editableValueMap.set(index, text)
this.$nextTick(()=> {
let ref = 'monacoEditor' + index
this.$refs[ref][0]._setValue(text)
if (!this.$pc && this.dialogWidthPercent < 1) {
this.fullScreen()
}
})
},
containerResize() { containerResize() {
this.loadEditorSize() this.loadEditorSize()
}, },
@ -554,6 +576,9 @@
if(this.$store.state.user.token && this.$store.state.user.userId === fileUserId){ if(this.$store.state.user.token && this.$store.state.user.userId === fileUserId){
this.options.readOnly = false this.options.readOnly = false
} }
if (!this.$pc) {
this.options.readOnly = true
}
if(this.options.readOnly || this.moblie){ if(this.options.readOnly || this.moblie){
this.$nextTick(()=> { this.$nextTick(()=> {
this.editorWidth += this.contentsWidth this.editorWidth += this.contentsWidth
@ -597,9 +622,15 @@
this.isSaveDialogVisible = false this.isSaveDialogVisible = false
this.isShowUpdateBtn = false this.isShowUpdateBtn = false
}, },
// 放弃修改
closeTabDialog(){ closeTabDialog(){
this.isTabSaveDialogVisible = false this.isTabSaveDialogVisible = false
this.editableTabsValue = this.nextActiveName
this.editableTabs.splice(this.removeIndex,1) this.editableTabs.splice(this.removeIndex,1)
let modifyingIndex = this.editableTabs.findIndex(editable => editable.status === 'Modifying')
if (modifyingIndex < 0){
this.isShowUpdateBtn = false
}
}, },
closeDialog() { closeDialog() {
this.textPreviewVisible = false this.textPreviewVisible = false
@ -609,7 +640,7 @@
this.closeAllTabs() this.closeAllTabs()
}, },
change(value,index) { change(value,index) {
if(value === this.editableTabs[index].content){ if(value === this.editableValueMap.get(index)){
if(this.editableTabs[index].copyTitle !== this.editableTabs[index].title){ if(this.editableTabs[index].copyTitle !== this.editableTabs[index].title){
this.editableTabs[index].title = this.editableTabs[index].copyTitle this.editableTabs[index].title = this.editableTabs[index].copyTitle
this.editableTabs[index].status = 'Modified' this.editableTabs[index].status = 'Modified'
@ -758,7 +789,17 @@
} }
}, },
changePreviewMode() { changePreviewMode() {
let currentIndex = this.editableTabs.findIndex(editable => editable.name === this.editableTabsValue)
if (currentIndex > -1){
let ref = 'vditor' + currentIndex
this.$refs[ref][0].setContent(this.editableValueMap.get(currentIndex))
}
this.previewMode = !this.previewMode this.previewMode = !this.previewMode
this.clickTab()
},
clickTab() {
this.editorWidth += 0.001
this.editorHieght += 0.001
}, },
removeTab(targetName) { removeTab(targetName) {
let tabs = this.editableTabs; let tabs = this.editableTabs;
@ -775,6 +816,7 @@
} }
}); });
} }
this.nextActiveName = activeName
if(this.editableTabs[removeIndex].status !== 'Modifying'){ if(this.editableTabs[removeIndex].status !== 'Modifying'){
this.editableTabsValue = activeName; this.editableTabsValue = activeName;
this.editableTabs = tabs.filter(tab => tab.name !== targetName); this.editableTabs = tabs.filter(tab => tab.name !== targetName);

View File

@ -30,10 +30,7 @@ import "vditor/src/assets/scss/index.scss"
}, },
watch: { watch: {
content(val){ content(val){
if(!this.vditorPreviewShow){ this.setContent(val)
this.vditorPreviewInit(val)
this.vditorPreviewShow = true
}
} }
}, },
mounted() { mounted() {
@ -43,6 +40,12 @@ import "vditor/src/assets/scss/index.scss"
} }
}, },
methods:{ methods:{
setContent(val) {
if(!this.vditorPreviewShow){
this.vditorPreviewInit(val)
this.vditorPreviewShow = true
}
},
vditorPreviewInit(content){ vditorPreviewInit(content){
const that = this const that = this
vditor.preview(document.getElementById('vditor'), vditor.preview(document.getElementById('vditor'),

View File

@ -22,6 +22,7 @@
<van-cell title="图片" icon="photo-o" @click="clickFileType('image',{isFolder: false})"/> <van-cell title="图片" icon="photo-o" @click="clickFileType('image',{isFolder: false})"/>
<van-cell title="视频" icon="video-o" @click="clickFileType('video',{isFolder: false})"/> <van-cell title="视频" icon="video-o" @click="clickFileType('video',{isFolder: false})"/>
<van-cell title="音乐" icon="music-o" @click="clickFileType('audio',{isFolder: false})"/> <van-cell title="音乐" icon="music-o" @click="clickFileType('audio',{isFolder: false})"/>
<van-cell title="文件传输" icon="upgrade" @click="uploadList"/>
</div> </div>
<div class="logout"> <div class="logout">
@ -46,7 +47,7 @@
title="浏览" title="浏览"
right-arrow right-arrow
@click-right="checkboxAll" @click-right="checkboxAll"
:right-text="this.selectRowData.length !== this.fileList.length ? '选择' : '取消'" :right-text="this.selectRowData.length !== this.fileList.length ? '选择44' : '取消'"
@click-left="leftMenu" @click-left="leftMenu"
left-arrow> left-arrow>
<div class="header-button" slot="left"> <div class="header-button" slot="left">
@ -63,7 +64,7 @@
</van-nav-bar> </van-nav-bar>
<van-nav-bar <van-nav-bar
:style="vanNavBarClass" :style="vanNavBarClass"
v-if="pathList.length < 3 && selectStatus" v-if="selectStatus"
:title="selectRowData.length === 0 ? '选择项目' : selectRowData.length+'项'" :title="selectRowData.length === 0 ? '选择项目' : selectRowData.length+'项'"
right-arrow right-arrow
:left-text="this.selectRowData.length !== this.fileList.length ? '全选' : '取消全选'" :left-text="this.selectRowData.length !== this.fileList.length ? '全选' : '取消全选'"
@ -72,13 +73,13 @@
right-text="完成" right-text="完成"
> >
</van-nav-bar> </van-nav-bar>
<van-nav-bar <van-nav-bar
:style="vanNavBarClass" :style="vanNavBarClass"
v-if="pathList.length >= 3" v-if="pathList.length >= 3 && !selectStatus"
:title="pathList[pathList.length-2].folder" :title="pathList[pathList.length-2].folder"
right-text="选择" :right-text="this.selectRowData.length !== this.fileList.length ? '选择' : '取消'"
left-arrow left-arrow
@click-right="checkboxAll"
@click-left="clickBack"> @click-left="clickBack">
<div class="header-button" slot="left"> <div class="header-button" slot="left">
<van-icon name="arrow-left" /> <van-icon name="arrow-left" />
@ -207,7 +208,7 @@
</e-vue-contextmenu> </e-vue-contextmenu>
<van-overlay ref="overlayShow" :show="overlayShow" duration="0.3" @click="overlayClick"> <van-overlay ref="overlayShow" :show="overlayShow" duration="0.3" @click="overlayClick">
<van-cell v-if="rowContextData.name!=null" :style="overlayContentClass" class="list-item overlay-content-class" center @click="fileClick(rowContextData)" :is-link="rowContextData.isFolder"> <van-cell v-if="rowContextData.name!=null" :style="overlayContentClass" class="list-item overlay-content-class" center @click="fileClick(rowContextData,rowContextData.index)" :is-link="rowContextData.isFolder">
<!--<div :style="overlayContentClass">--> <!--<div :style="overlayContentClass">-->
<div> <div>
<van-row class="row-file"> <van-row class="row-file">
@ -344,23 +345,38 @@
}; };
}, },
mounted(){ mounted(){
// 加载路径 // // 加载路径
const pathList = getPathList() // const pathList = getPathList()
if (pathList && pathList !== 'undefined') { // if (pathList && pathList !== 'undefined') {
const res = JSON.parse(pathList) // const res = JSON.parse(pathList)
const list = [] // const list = []
res.forEach(function(element) { // res.forEach(function(element) {
const item0 = {} // const item0 = {}
item0['folder'] = element.folder + '' // item0['folder'] = element.folder + ''
item0['index'] = element.index // item0['index'] = element.index
list.push(item0) // list.push(item0)
// })
// this.pathList = list
// }
// 加载url上的path
if (this.$route.query.path !== '/') {
const path = decodeURI(this.$route.query.path)
this.pathList.splice(1, 1)
path.split('/').forEach((pathName, index) => {
if (index > 0) {
const item = {}
item['folder'] = pathName
item['index'] = index
this.pathList.push(item)
}
}) })
this.pathList = list
} }
console.log(this.pathList)
if (window.history && window.history.pushState) { if (window.history && window.history.pushState) {
history.pushState(null, null, document.URL); history.pushState(null, null, document.URL)
window.addEventListener('popstate', this.goBack, false); window.addEventListener('popstate', this.goBack, false)
} }
}, },
destroyed(){ destroyed(){
@ -406,7 +422,6 @@
}, },
// 长按事件 // 长按事件
rowContextmenu(row, target, touchClientX) { rowContextmenu(row, target, touchClientX) {
// 改变菜单 // 改变菜单
if(this.selectStatus && this.selectIndexList.includes(row.index)){ if(this.selectStatus && this.selectIndexList.includes(row.index)){
if(this.selectIndexList.includes(row.index)){ if(this.selectIndexList.includes(row.index)){
@ -446,7 +461,7 @@
this.favoriteOperating(true) this.favoriteOperating(true)
break break
case 'open': case 'open':
this.fileClick(this.rowContextData) this.fileClick(this.rowContextData, this.rowContextData.index)
break break
case 'unselect': case 'unselect':
const index = this.rowContextData.index const index = this.rowContextData.index
@ -458,8 +473,8 @@
case 'select': case 'select':
this.selectStatus = true this.selectStatus = true
this.selectIndexList.push(this.rowContextData.index) this.selectIndexList.push(this.rowContextData.index)
setTimeout(function () { setTimeout(() => {
that.$refs.checkboxes[that.rowContextData.index].toggle(); this.$refs.checkboxes[that.rowContextData.index].toggle()
},0) },0)
break break
case 'rename': case 'rename':
@ -470,7 +485,7 @@
},0) },0)
break break
case 'copy': case 'copy':
Toast('暂不支持移动'); vant.Toast('暂不支持移动');
break break
case 'download': case 'download':
this.downloadFile() this.downloadFile()
@ -552,7 +567,7 @@
fileConfig.packageDownload(fileIds, this.$store.state.user.token) fileConfig.packageDownload(fileIds, this.$store.state.user.token)
return return
} }
fileConfig.publicDownload(this.rowContextData) fileConfig.download(this.$store.state.user.name, this.rowContextData, this.$store.state.user.token)
} else { } else {
this.$message({ this.$message({
message: '所选文件夹为空', message: '所选文件夹为空',
@ -563,11 +578,10 @@
// 收藏/取消收藏 // 收藏/取消收藏
favoriteOperating(isFavorite) { favoriteOperating(isFavorite) {
this.rowContextData.isFavorite = isFavorite this.rowContextData.isFavorite = isFavorite
this.highlightFavorite(isFavorite, true) this.highlightFavorite(isFavorite, true)
api.favoriteUrl({ api.favoriteUrl({
token: this.$store.state.user.token, token: this.$store.state.user.token,
id: this.rowContextData.id, fileIds: this.rowContextData.id,
isFavorite: isFavorite isFavorite: isFavorite
}).then(res => { }).then(res => {
}) })
@ -587,7 +601,7 @@
} }
const str = this.getShowSumFileAndFolder(fileList) const str = this.getShowSumFileAndFolder(fileList)
Dialog.confirm({ vant.Dialog.confirm({
title: '提示', title: '提示',
message: '此操作将永久删除' + str + ', 是否继续?' message: '此操作将永久删除' + str + ', 是否继续?'
}).then(() => { }).then(() => {
@ -601,9 +615,8 @@
} else { } else {
this.getFileList() this.getFileList()
} }
Toast.setDefaultOptions({ duration: 500 }); vant.Toast.setDefaultOptions({ duration: 800 });
Toast.success('删除成功'); vant.Toast.success('删除成功');
this.$refs.fileListTable.clearSelection()// 删除后清空之前选择的数据
this.selectRowData = [] this.selectRowData = []
}) })
}) })
@ -674,12 +687,12 @@
}, },
// 浏览器的返回事件 // 浏览器的返回事件
goBack(){ goBack(){
const linkIndex = this.pathList.length-3 const linkIndex = this.pathList.length - 2
this.handleLink(this.pathList[linkIndex],linkIndex) this.handleLink(this.pathList[linkIndex],linkIndex)
}, },
// 点击返回按钮(标题) // 点击返回按钮(标题)
clickBack() { clickBack() {
const linkIndex = this.pathList.length-3 const linkIndex = this.pathList.length - 2
this.handleLink(this.pathList[linkIndex], linkIndex, true) this.handleLink(this.pathList[linkIndex], linkIndex, true)
}, },
//菜单键 //菜单键
@ -784,7 +797,6 @@
if(isPushLink){ if(isPushLink){
this.$router.push(`/_m?path=${encodeURIComponent(this.path)}`) this.$router.push(`/_m?path=${encodeURIComponent(this.path)}`)
} }
setPath(this.path, this.pathList)
this.getFileList() this.getFileList()
} }
}, },
@ -853,12 +865,15 @@
// 填充数据 // 填充数据
loadData(res,onLoad){ loadData(res,onLoad){
if(onLoad){ if(onLoad){
res.data.forEach((file,number) => { res.data.forEach((file,index) => {
file['index'] = (this.pagination.pageIndex - 1) * this.pagination.pageSize + number file['index'] = (this.pagination.pageIndex - 1) * this.pagination.pageSize + index
this.fileList.push(file) this.fileList.push(file)
}); })
}else{ }else{
this.fileList = res.data this.fileList = res.data
this.fileList.map((file,index) => {
file['index'] = index
})
} }
// 加载状态结束 // 加载状态结束
this.loading = false this.loading = false
@ -877,6 +892,9 @@
this.getFileList() this.getFileList()
this.leftMenuShow = false this.leftMenuShow = false
}, },
uploadList() {
this.$router.push(`/upload/index_m`)
},
// 统计 // 统计
statistics() { statistics() {
let totalSize = 0 let totalSize = 0
@ -962,16 +980,11 @@
} else { } else {
this.path = '/' + row.name this.path = '/' + row.name
} }
const itemFirst = {} const item = {}
itemFirst['folder'] = row.name item['folder'] = row.name
itemFirst['index'] = this.pathList.length - 1 item['index'] = this.pathList.length - 1
const itemSecond = {} this.pathList.push(item)
itemSecond['folder'] = '+'
itemSecond['index'] = this.pathList.length
this.pathList[this.pathList.length - 1] = itemFirst
this.pathList.push(itemSecond)
this.$router.push(`/_m?path=${encodeURIComponent(this.path)}`) this.$router.push(`/_m?path=${encodeURIComponent(this.path)}`)
setPath(this.path, this.pathList)
this.getFileList() this.getFileList()
} else { } else {
if (row.contentType.startsWith('image')) { if (row.contentType.startsWith('image')) {

View File

@ -16,7 +16,10 @@
<li v-for="file in fileList" :key="file.id"> <li v-for="file in fileList" :key="file.id">
<uploader-file ref="files" :class="'file_' + file.id" :file="file" :list="true"></uploader-file> <uploader-file ref="files" :class="'file_' + file.id" :file="file" :list="true"></uploader-file>
</li> </li>
<div v-if="!fileList.length" class="no-file"><i class="iconfont icon-empty-file"></i> 暂无待上传文件</div> <div v-if="!fileList.length" class="no-file">
<van-empty description="暂无待上传文件" />
</van-button>
</div>
</ul> </ul>
</van-list> </van-list>
</div> </div>
@ -34,10 +37,12 @@
}; };
}, },
mounted(){ mounted(){
this.fileList = window.uploader.fileList if (window.uploader) {
this.fileList = window.uploader.fileList
}
}, },
destroyed(){ destroyed(){
window.removeEventListener('popstate', this.goBack, false); window.removeEventListener('popstate', this.goBack, false)
}, },
methods: { methods: {
onClickLeft() { onClickLeft() {
@ -78,4 +83,11 @@
margin-right: 16px; margin-right: 16px;
} }
} }
.no-file {
.plus {
position: absolute;
bottom: 1rem;
right: 2rem;
}
}
</style> </style>