文件管理添加删除、重命名文件和新建文件夹功能
This commit is contained in:
parent
2bd9a8a3ec
commit
a66658e62f
|
@ -1,5 +1,6 @@
|
||||||
import { SessionStorage } from "quasar";
|
import { SessionStorage } from "quasar";
|
||||||
import ApplicationConfigEntity from "src/entities/ApplicationConfigEntity";
|
import ApplicationConfigEntity from "src/entities/ApplicationConfigEntity";
|
||||||
|
import { HttpProtocol } from "src/entities/HttpProtocol";
|
||||||
import { SignalSourceEntity } from "src/entities/SignalSourceEntity";
|
import { SignalSourceEntity } from "src/entities/SignalSourceEntity";
|
||||||
import ClientConnection from "./ClientConnection";
|
import ClientConnection from "./ClientConnection";
|
||||||
import EventBus, { EventNamesDefine } from "./EventBus";
|
import EventBus, { EventNamesDefine } from "./EventBus";
|
||||||
|
@ -123,6 +124,19 @@ export default class GlobalData {
|
||||||
return this.getClient(this._current_client_name);
|
return this.getClient(this._current_client_name);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public createCurrentRequestUrl() {
|
||||||
|
let client = this.getCurrentClient();
|
||||||
|
if (client) {
|
||||||
|
let url = new URL(client.url);
|
||||||
|
url.port =
|
||||||
|
this.applicationConfig?.httpserver_port ??
|
||||||
|
HttpProtocol.DefaultHttpPort.toString();
|
||||||
|
url.protocol = "http:";
|
||||||
|
return url;
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
public addClient(name: string | null, client: ClientConnection) {
|
public addClient(name: string | null, client: ClientConnection) {
|
||||||
if (name) {
|
if (name) {
|
||||||
this.clients.set(name, client);
|
this.clients.set(name, client);
|
||||||
|
|
|
@ -87,9 +87,20 @@
|
||||||
</q-btn>
|
</q-btn>
|
||||||
<q-btn
|
<q-btn
|
||||||
flat
|
flat
|
||||||
|
icon="create_new_folder"
|
||||||
|
@click="onCreateNewFolder"
|
||||||
|
:disable="loading"
|
||||||
|
:label="$t('create folder')"
|
||||||
|
>
|
||||||
|
<q-tooltip>
|
||||||
|
{{ $t("create folder") }}
|
||||||
|
</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
<q-btn
|
||||||
|
flat
|
||||||
|
v-if="status != 'uploading'"
|
||||||
icon="upload"
|
icon="upload"
|
||||||
:label="$t('upload file')"
|
:label="$t('upload file')"
|
||||||
:disable="status == 'uploading'"
|
|
||||||
@click="status = 'uploading'"
|
@click="status = 'uploading'"
|
||||||
>
|
>
|
||||||
<q-tooltip>
|
<q-tooltip>
|
||||||
|
@ -167,6 +178,7 @@
|
||||||
<div v-show="status == 'uploading'" class="row q-ma-sm">
|
<div v-show="status == 'uploading'" class="row q-ma-sm">
|
||||||
<q-space />
|
<q-space />
|
||||||
<q-uploader
|
<q-uploader
|
||||||
|
style="height: 69vh; width: 70%"
|
||||||
:url="getUrl"
|
:url="getUrl"
|
||||||
method="post"
|
method="post"
|
||||||
:headers="generatorFileUploadHeaders"
|
:headers="generatorFileUploadHeaders"
|
||||||
|
@ -258,6 +270,7 @@ import { api } from "boot/axios";
|
||||||
import GlobalData from "src/common/GlobalData";
|
import GlobalData from "src/common/GlobalData";
|
||||||
import FileEntity from "src/entities/FileEntity";
|
import FileEntity from "src/entities/FileEntity";
|
||||||
import { HttpProtocol } from "src/entities/HttpProtocol";
|
import { HttpProtocol } from "src/entities/HttpProtocol";
|
||||||
|
import NormalResult from "src/entities/NormalResult";
|
||||||
|
|
||||||
class _BreadcrumbItem {
|
class _BreadcrumbItem {
|
||||||
name: string = "";
|
name: string = "";
|
||||||
|
@ -431,19 +444,6 @@ export default defineComponent({
|
||||||
showDialog() {
|
showDialog() {
|
||||||
refresh_file_list();
|
refresh_file_list();
|
||||||
show_dialog.value = true;
|
show_dialog.value = true;
|
||||||
|
|
||||||
// let client = GlobalData.getInstance().getCurrentClient();
|
|
||||||
// if (client) {
|
|
||||||
// let url = new URL(client.url);
|
|
||||||
// url.port =
|
|
||||||
// GlobalData.getInstance().applicationConfig?.httpserver_port ??
|
|
||||||
// HttpProtocol.DefaultHttpPort.toString();
|
|
||||||
// url.pathname = HttpProtocol.RequestUploadFile;
|
|
||||||
// url.protocol = "http:";
|
|
||||||
// url.searchParams.append("type", HttpProtocol.UploadTypeDatabase);
|
|
||||||
// url.searchParams.append("target_path", path.value);
|
|
||||||
// upload_url.value = url.toString();
|
|
||||||
// }
|
|
||||||
},
|
},
|
||||||
generatorFileUploadHeaders(files: File[]) {
|
generatorFileUploadHeaders(files: File[]) {
|
||||||
if (files.length > 0) {
|
if (files.length > 0) {
|
||||||
|
@ -467,8 +467,146 @@ export default defineComponent({
|
||||||
status.value = "normal";
|
status.value = "normal";
|
||||||
upload_url.value = "";
|
upload_url.value = "";
|
||||||
},
|
},
|
||||||
deleteFile(file: FileEntity) {},
|
async onCreateNewFolder() {
|
||||||
renameFile(file: FileEntity) {},
|
let url = GlobalData.getInstance().createCurrentRequestUrl();
|
||||||
|
if (url) {
|
||||||
|
$q.dialog({
|
||||||
|
title: $t.t("create folder"),
|
||||||
|
message: $t.t("input folder name") + ":",
|
||||||
|
prompt: {
|
||||||
|
model: "",
|
||||||
|
isValid: (val: string) => val && val.trim().length > 0,
|
||||||
|
type: "text",
|
||||||
|
},
|
||||||
|
cancel: true,
|
||||||
|
persistent: true,
|
||||||
|
}).onOk(async (data: string) => {
|
||||||
|
if (url) {
|
||||||
|
url.pathname = HttpProtocol.RequestPathCreateDirectory;
|
||||||
|
let response = (
|
||||||
|
await api.post(url.toString(), {
|
||||||
|
base_dir: path.value,
|
||||||
|
dir_name: data,
|
||||||
|
})
|
||||||
|
).data as NormalResult;
|
||||||
|
if (response && response.success) {
|
||||||
|
refresh_file_list();
|
||||||
|
$q.notify({
|
||||||
|
type: "positive",
|
||||||
|
message: $t.t("create folder") + $t.t("success") + "!",
|
||||||
|
position: "top",
|
||||||
|
timeout: 1500,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
$q.notify({
|
||||||
|
type: "warning",
|
||||||
|
message:
|
||||||
|
$t.t("create folder") +
|
||||||
|
$t.t("fail") +
|
||||||
|
"!" +
|
||||||
|
(response ? response.message : ""),
|
||||||
|
position: "top",
|
||||||
|
timeout: 1500,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async deleteFile(file: FileEntity) {
|
||||||
|
let url = GlobalData.getInstance().createCurrentRequestUrl();
|
||||||
|
if (url) {
|
||||||
|
url.pathname = HttpProtocol.RequestPathDeleteFile;
|
||||||
|
let response = null;
|
||||||
|
try {
|
||||||
|
response = (
|
||||||
|
await api.delete(url.toString(), {
|
||||||
|
data: {
|
||||||
|
base_dir: path.value,
|
||||||
|
file_name: file.name,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
).data as NormalResult;
|
||||||
|
} catch (e) {
|
||||||
|
console.log(e);
|
||||||
|
}
|
||||||
|
if (response && response.success) {
|
||||||
|
refresh_file_list();
|
||||||
|
$q.notify({
|
||||||
|
type: "positive",
|
||||||
|
message: $t.t("delete file") + $t.t("success") + "!",
|
||||||
|
position: "top",
|
||||||
|
timeout: 1500,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
$q.notify({
|
||||||
|
type: "warning",
|
||||||
|
message:
|
||||||
|
$t.t("delete file") +
|
||||||
|
$t.t("fail") +
|
||||||
|
"!" +
|
||||||
|
(response ? response.message : ""),
|
||||||
|
position: "top",
|
||||||
|
timeout: 1500,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
renameFile(file: FileEntity) {
|
||||||
|
let url = GlobalData.getInstance().createCurrentRequestUrl();
|
||||||
|
if (url) {
|
||||||
|
$q.dialog({
|
||||||
|
title: $t.t("rename"),
|
||||||
|
message: $t.t("input new file name") + ":",
|
||||||
|
prompt: {
|
||||||
|
model: file.name,
|
||||||
|
isValid: (val: string) => val && val.trim().length > 0,
|
||||||
|
type: "text",
|
||||||
|
},
|
||||||
|
cancel: true,
|
||||||
|
persistent: true,
|
||||||
|
}).onOk(async (data: string) => {
|
||||||
|
if (data == file.name) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (url) {
|
||||||
|
url.pathname = HttpProtocol.RequestPathRenameFile;
|
||||||
|
url.searchParams.append(
|
||||||
|
"type",
|
||||||
|
HttpProtocol.RequestPathRenameFile
|
||||||
|
);
|
||||||
|
|
||||||
|
let response = (
|
||||||
|
await api.put(url.toString(), {
|
||||||
|
base_dir: path.value,
|
||||||
|
file_name: file.name,
|
||||||
|
new_file_name: data,
|
||||||
|
})
|
||||||
|
).data as NormalResult;
|
||||||
|
if (response && response.success) {
|
||||||
|
refresh_file_list();
|
||||||
|
$q.notify({
|
||||||
|
type: "positive",
|
||||||
|
message: $t.t("file rename") + $t.t("success") + "!",
|
||||||
|
position: "top",
|
||||||
|
timeout: 1500,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
$q.notify({
|
||||||
|
type: "warning",
|
||||||
|
message:
|
||||||
|
$t.t("file rename") +
|
||||||
|
$t.t("fail") +
|
||||||
|
"!" +
|
||||||
|
(response ? response.message : ""),
|
||||||
|
position: "top",
|
||||||
|
timeout: 1500,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
copyStringToClipboard(value: string) {
|
copyStringToClipboard(value: string) {
|
||||||
copyToClipboard(value);
|
copyToClipboard(value);
|
||||||
},
|
},
|
||||||
|
@ -495,27 +633,23 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
getUrl(file: File[]) {
|
getUrl(file: File[]) {
|
||||||
let client = GlobalData.getInstance().getCurrentClient();
|
let url = GlobalData.getInstance().createCurrentRequestUrl();
|
||||||
if (client) {
|
if (url) {
|
||||||
let url = new URL(client.url);
|
|
||||||
url.port =
|
|
||||||
GlobalData.getInstance().applicationConfig?.httpserver_port ??
|
|
||||||
HttpProtocol.DefaultHttpPort.toString();
|
|
||||||
url.pathname = HttpProtocol.RequestUploadFile;
|
url.pathname = HttpProtocol.RequestUploadFile;
|
||||||
url.protocol = "http:";
|
|
||||||
url.searchParams.append("type", HttpProtocol.HttpUploadTypeNormal);
|
url.searchParams.append("type", HttpProtocol.HttpUploadTypeNormal);
|
||||||
url.searchParams.append("base_dir", path.value);
|
url.searchParams.append("base_dir", path.value);
|
||||||
console.log(url.toString());
|
|
||||||
return url.toString();
|
return url.toString();
|
||||||
}
|
}
|
||||||
return "#";
|
return "#";
|
||||||
},
|
},
|
||||||
onUploaded() {
|
onUploaded() {
|
||||||
|
refresh_file_list();
|
||||||
|
|
||||||
$q.notify({
|
$q.notify({
|
||||||
type: "positive",
|
type: "positive",
|
||||||
message: $t.t("file upload") + $t.t("success") + "!",
|
message: $t.t("file upload") + $t.t("success") + "!",
|
||||||
position: "top",
|
position: "top",
|
||||||
timeout: 1000,
|
timeout: 1500,
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
onFailed(info: any) {
|
onFailed(info: any) {
|
||||||
|
@ -524,7 +658,7 @@ export default defineComponent({
|
||||||
type: "warning",
|
type: "warning",
|
||||||
message: $t.t("file upload") + $t.t("fail") + "!",
|
message: $t.t("file upload") + $t.t("fail") + "!",
|
||||||
position: "top",
|
position: "top",
|
||||||
timeout: 1000,
|
timeout: 1500,
|
||||||
});
|
});
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
},
|
},
|
||||||
|
|
|
@ -4,7 +4,9 @@ export namespace HttpProtocol {
|
||||||
export const RequestPathUpdateDBBackupFile = "/common/update_db_backup_file";
|
export const RequestPathUpdateDBBackupFile = "/common/update_db_backup_file";
|
||||||
export const RequestPathDBBackup = "/db_backup";
|
export const RequestPathDBBackup = "/db_backup";
|
||||||
export const RequestPathListFile = "/list_file";
|
export const RequestPathListFile = "/list_file";
|
||||||
|
export const RequestPathCreateDirectory = "/create_directory";
|
||||||
export const RequestPathDeleteFile = "/delete_file";
|
export const RequestPathDeleteFile = "/delete_file";
|
||||||
|
export const RequestPathRenameFile = "/rename_file";
|
||||||
|
|
||||||
export const HttpUploadTypeNormal = "U_T_Normal";
|
export const HttpUploadTypeNormal = "U_T_Normal";
|
||||||
export const UploadTypeBackgroundImage = "U_T_BACKGROUND_IMAGE";
|
export const UploadTypeBackgroundImage = "U_T_BACKGROUND_IMAGE";
|
||||||
|
|
|
@ -0,0 +1,4 @@
|
||||||
|
export default class NormalResult {
|
||||||
|
success = false;
|
||||||
|
message = "";
|
||||||
|
}
|
|
@ -108,4 +108,10 @@ export default {
|
||||||
forward: "前进",
|
forward: "前进",
|
||||||
"cancel upload file": "取消文件上传",
|
"cancel upload file": "取消文件上传",
|
||||||
"select file": "选择文件",
|
"select file": "选择文件",
|
||||||
|
"file upload": "文件上传",
|
||||||
|
"file rename": "文件重命名",
|
||||||
|
"file delete": "文件删除",
|
||||||
|
"delete file": "文件删除",
|
||||||
|
"create folder": "新建文件夹",
|
||||||
|
"input folder name": "输入文件夹名称",
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue