feat: 新增linux文件夹创建&删除&其他优化

This commit is contained in:
meilin.huang
2022-07-04 20:21:24 +08:00
parent b88923a128
commit 729a3d7028
13 changed files with 162 additions and 69 deletions

View File

@@ -44,7 +44,9 @@ export default defineComponent({
state.isShowSearch = true;
initTageView();
nextTick(() => {
layoutMenuAutocompleteRef.value.focus();
setTimeout(() => {
layoutMenuAutocompleteRef.value.focus();
});
});
};
// 搜索弹窗关闭

View File

@@ -341,7 +341,7 @@ export default defineComponent({
onMounted(async () => {
search();
state.projects = (await projectApi.projects.request({ pageNum: 1, pageSize: 100 })).list;
state.projects = await projectApi.accountProjects.request(null);
});
const choose = (item: any) => {

View File

@@ -135,7 +135,9 @@ export default defineComponent({
state.db = props.db;
state.dialogVisible = true;
nextTick(() => {
remarkInputRef.value?.focus();
setTimeout(() => {
remarkInputRef.value?.focus();
});
});
};

View File

@@ -96,6 +96,12 @@
<el-link type="info" icon="view" :underline="false">查看</el-link>
</el-dropdown-item>
<span v-auth="'machine:file:write'">
<el-dropdown-item @click="showCreateFileDialog(node, data)" v-if="data.type == 'd'">
<el-link type="primary" icon="document" :underline="false" style="margin-left: 2px">新建</el-link>
</el-dropdown-item>
</span>
<span v-auth="'machine:file:upload'">
<el-dropdown-item v-if="data.type == 'd'">
<el-upload
@@ -133,6 +139,35 @@
</div>
</el-dialog>
<el-dialog
:destroy-on-close="true"
title="新建文件"
v-model="createFileDialog.visible"
:before-close="closeCreateFileDialog"
:close-on-click-modal="false"
top="5vh"
width="400px"
>
<div>
<el-form-item prop="name" label="名称:">
<el-input v-model.trim="createFileDialog.name" placeholder="请输入名称" auto-complete="off"></el-input>
</el-form-item>
<el-form-item prop="type" label="类型:">
<el-radio-group v-model="createFileDialog.type">
<el-radio label="d" size="small">文件夹</el-radio>
<el-radio label="-" size="small">文件</el-radio>
</el-radio-group>
</el-form-item>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeCreateFileDialog">关闭</el-button>
<el-button v-auth="'machine:file:write'" type="primary" @click="createFile">确定</el-button>
</div>
</template>
</el-dialog>
<el-dialog
:destroy-on-close="true"
:title="fileContent.dialogTitle"
@@ -164,6 +199,7 @@ import { codemirror } from '@/components/codemirror';
import { getSession } from '@/common/utils/storage';
import enums from './enums';
import config from '@/common/config';
import { isTrue } from '@/common/assert';
export default defineComponent({
name: 'FileManage',
@@ -184,26 +220,8 @@ export default defineComponent({
const fileTree: any = ref(null);
const token = getSession('token');
const cmOptions = {
tabSize: 2,
mode: 'text/x-sh',
theme: 'panda-syntax',
line: true,
// 开启校验
lint: true,
gutters: ['CodeMirror-lint-markers'],
indentWithTabs: true,
smartIndent: true,
matchBrackets: true,
autofocus: true,
styleSelectedText: true,
styleActiveLine: true, // 高亮选中行
foldGutter: true, // 块槽
hintOptions: {
// 当匹配只有一项的时候是否自动补全
completeSingle: true,
},
};
const folderType = 'd';
const fileType = '-';
const state = reactive({
dialogVisible: false,
@@ -250,6 +268,12 @@ export default defineComponent({
path: '',
type: '',
},
createFileDialog: {
visible: false,
name: '',
type: folderType,
node: null as any,
},
file: null as any,
});
@@ -272,18 +296,6 @@ export default defineComponent({
getFiles();
};
/**
* tab切换触发事件
* @param {Object} tab
* @param {Object} event
*/
// handleClick(tab, event) {
// // if (tab.name == 'file-manage') {
// // this.fileManage.node.childNodes = [];
// // this.loadNode(this.fileManage.node, this.fileManage.resolve);
// // }
// }
const add = () => {
// 往数组头部添加元素
state.fileTable = [{}].concat(state.fileTable);
@@ -311,7 +323,6 @@ export default defineComponent({
})
.then(() => {
getFiles();
// state.fileTable.splice(idx, 1);
});
});
} else {
@@ -388,7 +399,6 @@ export default defineComponent({
emit('update:visible', false);
emit('update:machineId', null);
emit('cancel');
// state.activeName = 'conf-file'
state.fileTable = [];
state.tree.folder = { id: 0 };
};
@@ -413,7 +423,7 @@ export default defineComponent({
return resolve([
{
name: path,
type: 'd',
type: folderType,
path: path,
},
]);
@@ -435,13 +445,42 @@ export default defineComponent({
});
for (const file of res) {
const type = file.type;
if (type != 'd') {
if (type == fileType) {
file.leaf = true;
}
}
return resolve(res);
};
const showCreateFileDialog = (node: any) => {
isTrue(node.expanded, '请先点击展开该节点后再创建');
state.createFileDialog.node = node;
state.createFileDialog.visible = true;
};
const createFile = async () => {
const node = state.createFileDialog.node;
console.log(node.data);
const name = state.createFileDialog.name;
const type = state.createFileDialog.type;
const path = node.data.path + '/' + name;
await machineApi.createFile.request({
machineId: props.machineId,
id: state.tree.folder.id,
path,
type,
});
fileTree.value.append({ name: name, path: path, type: type, leaf: type === fileType, size: 0 }, node);
closeCreateFileDialog();
};
const closeCreateFileDialog = () => {
state.createFileDialog.visible = false;
state.createFileDialog.node = null;
state.createFileDialog.name = '';
state.createFileDialog.type = folderType;
};
const deleteFile = (node: any, data: any) => {
const file = data.path;
ElMessageBox.confirm(`此操作将删除 [${file}], 是否继续?`, '提示', {
@@ -468,7 +507,6 @@ export default defineComponent({
const downloadFile = (node: any, data: any) => {
const a = document.createElement('a');
// a.setAttribute('target', '_blank')
a.setAttribute(
'href',
`${config.baseApiUrl}/machines/${props.machineId}/files/${state.tree.folder.id}/read?type=1&path=${data.path}&token=${token}`
@@ -516,7 +554,6 @@ export default defineComponent({
const beforeUpload = (file: File) => {
state.file = file;
// ElMessage.success(`'${file.name}' 上传中,请关注结果通知`);
};
const getFilePath = (data: object, visible: boolean) => {
if (visible) {
@@ -572,7 +609,6 @@ export default defineComponent({
fileTree,
enums,
token,
cmOptions,
add,
getFiles,
handlePageChange,
@@ -583,6 +619,9 @@ export default defineComponent({
updateContent,
handleClose,
loadNode,
showCreateFileDialog,
closeCreateFileDialog,
createFile,
deleteFile,
downloadFile,
getUploadFile,

View File

@@ -25,6 +25,7 @@ export const machineApi = {
rmFile: Api.create("/machines/{machineId}/files/{fileId}/remove", 'delete'),
uploadFile: Api.create("/machines/{machineId}/files/{fileId}/upload?token={token}", 'post'),
fileContent: Api.create("/machines/{machineId}/files/{fileId}/read", 'get'),
createFile: Api.create("/machines/{machineId}/files/{id}/create-file", 'post'),
// 修改文件内容
updateFileContent: Api.create("/machines/{machineId}/files/{id}/write", 'post'),
// 添加文件or目录

View File

@@ -250,7 +250,7 @@ export default defineComponent({
onMounted(async () => {
search();
state.projects = (await projectApi.projects.request({ pageNum: 1, pageSize: 100 })).list;
state.projects = await projectApi.accountProjects.request(null);
});
const handlePageChange = (curPage: number) => {
@@ -266,12 +266,6 @@ export default defineComponent({
state.currentData = item;
};
// connect() {
// Req.post('/open/redis/connect', this.form, res => {
// this.redisInfo = res
// })
// }
const showDatabases = async (id: number) => {
state.databaseDialog.data = (await mongoApi.databases.request({ id })).Databases;
state.databaseDialog.title = `数据库列表`;
@@ -371,14 +365,6 @@ export default defineComponent({
} catch (err) {}
};
// const info = (redis: any) => {
// redisApi.redisInfo.request({ id: redis.id }).then((res: any) => {
// state.infoDialog.info = res;
// state.infoDialog.title = `'${redis.host}' info`;
// state.infoDialog.visible = true;
// });
// };
const search = async () => {
const res = await mongoApi.mongoList.request(state.query);
state.list = res.list;

View File

@@ -118,7 +118,7 @@ export default defineComponent({
onMounted(async () => {
search();
state.projects = (await projectApi.projects.request({ pageNum: 1, pageSize: 100 })).list;
state.projects = await projectApi.accountProjects.request(null);
});
const handlePageChange = (curPage: number) => {