chore: create FileManager class for downloading files

This commit is contained in:
Shishkevich D. 2025-04-08 22:17:29 +07:00 committed by GitHub
parent 520f7a2d15
commit 8ef447a997
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 22 additions and 15 deletions

View file

@ -800,3 +800,23 @@ const MediaQueryMixin = {
window.removeEventListener('resize', this.updateDeviceType); window.removeEventListener('resize', this.updateDeviceType);
}, },
} }
class FileManager {
static downloadTextFile(content, filename='file.txt', options = { type: "text/plain" }) {
let link = window.document.createElement('a');
link.download = filename;
link.style.border = '0';
link.style.padding = '0';
link.style.margin = '0';
link.style.position = 'absolute';
link.style.left = '-9999px';
link.style.top = `${window.pageYOffset || window.document.documentElement.scrollTop}px`;
link.href = URL.createObjectURL(new Blob([content], options));
link.click();
URL.revokeObjectURL(link.href);
link.remove();
}
}

View file

@ -400,9 +400,7 @@
<a-checkbox v-model="logModal.syslog" @change="openLogs()">SysLog</a-checkbox> <a-checkbox v-model="logModal.syslog" @change="openLogs()">SysLog</a-checkbox>
</a-form-item> </a-form-item>
<a-form-item :style="{ float: 'right' }"> <a-form-item :style="{ float: 'right' }">
<a-button type="primary" icon="download" <a-button type="primary" icon="download" @click="FileManager.downloadTextFile(logModal.logs?.join('\n'), 'x-ui.log')"></a-button>
:href="'data:application/text;charset=utf-8,' + encodeURIComponent(logModal.logs?.join('\n'))" download="x-ui.log">
</a-button>
</a-form-item> </a-form-item>
</a-form> </a-form>
<div class="ant-input" :style="{ height: 'auto', maxHeight: '500px', overflow: 'auto', marginTop: '0.5rem' }" v-html="logModal.formattedLogs"></div> <div class="ant-input" :style="{ height: 'auto', maxHeight: '500px', overflow: 'auto', marginTop: '0.5rem' }" v-html="logModal.formattedLogs"></div>

View file

@ -5,7 +5,7 @@
:autosize="{ minRows: 10, maxRows: 20}"></a-input> :autosize="{ minRows: 10, maxRows: 20}"></a-input>
<template slot="footer"> <template slot="footer">
<a-button v-if="!ObjectUtil.isEmpty(txtModal.fileName)" icon="download" <a-button v-if="!ObjectUtil.isEmpty(txtModal.fileName)" icon="download"
@click="txtModal.download(txtModal.content, txtModal.fileName)"> @click="FileManager.downloadTextFile(txtModal.content, txtModal.fileName)">
<span>[[ txtModal.fileName ]]</span> <span>[[ txtModal.fileName ]]</span>
</a-button> </a-button>
<a-button type="primary" icon="copy" @click="txtModal.copy(txtModal.content)"> <a-button type="primary" icon="copy" @click="txtModal.copy(txtModal.content)">
@ -35,17 +35,6 @@
this.close(); this.close();
}) })
}, },
download: function (content = '', fileName = '') {
let link = document.createElement('a');
link.download = fileName;
link.href = URL.createObjectURL(new Blob([content], { type: 'text/plain' }));
link.click();
URL.revokeObjectURL(link.href);
link.remove();
},
close: function () { close: function () {
this.visible = false; this.visible = false;
}, },