352 lines
17 KiB
Python
352 lines
17 KiB
Python
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport"
|
||
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||
<link rel="stylesheet" href="/static/asserts/index.css">
|
||
<link rel="shortcut icon" href="/static/asserts/favicon.ico" type="image/x-icon"/>
|
||
<title>后台管理-{{title}}</title>
|
||
<meta name="description" content="{{description}}"/>
|
||
<meta name="keywords" content="{{keywords}}"/>
|
||
<meta name="generator" content="FileCodeBox"/>
|
||
<meta name="template" content="Lan"/>
|
||
<script src="/static/asserts/vue.min.js"></script>
|
||
<script src="/static/asserts/index.js"></script>
|
||
<style>
|
||
.el-menu-demo {
|
||
text-align: center;
|
||
}
|
||
|
||
body {
|
||
background: #f5f5f5;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div id="app">
|
||
<el-row v-if="login" :gutter="10">
|
||
<el-col :span="24" style="text-align: center">
|
||
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
|
||
<el-menu-item index="2">分享文件管理</el-menu-item>
|
||
<el-menu-item index="3">本地文件列表</el-menu-item>
|
||
<el-menu-item index="4">系统配置</el-menu-item>
|
||
</el-menu>
|
||
</el-col>
|
||
<el-col v-if="activeIndex === '2'">
|
||
<el-card style="height: 80vh;overflow: scroll;margin-bottom: 1rem">
|
||
<el-empty v-if="files.length === 0" description="暂时还没有文件"></el-empty>
|
||
<el-card v-for="file in files" :key="file.code">
|
||
<el-row>
|
||
<el-col :span="20">
|
||
<div style="cursor: pointer;text-align: left">
|
||
<div>取件码:${ file.code }</div>
|
||
<div>文件名:${ file.name }</div>
|
||
<div>次 数:${ file.count }</div>
|
||
<div>到 期:${ file.exp_time.slice(0,19) }</div>
|
||
<div v-if="file.name==='文本分享'">
|
||
<span style="white-space: pre-line">内 容:${ file.text }</span>
|
||
</div>
|
||
<div v-else>
|
||
<span>链 接:</span>
|
||
<a :href="file.text" target="_blank"
|
||
style="color: #1E9FFF;text-underline: none"
|
||
type="primary">点击下载</a>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-button type="danger" @click="deleteFile(file.code)">删除</el-button>
|
||
</el-col>
|
||
</el-row>
|
||
</el-card>
|
||
</el-card>
|
||
<el-pagination
|
||
background
|
||
style="text-align: center"
|
||
layout="prev, pager, next, sizes"
|
||
:page-size="paginate.page_size"
|
||
@current-change="updatePage"
|
||
@size-change="updateSize"
|
||
:total="paginate.total"
|
||
>
|
||
</el-pagination>
|
||
</el-col>
|
||
<el-col v-if="activeIndex === '3'">
|
||
<el-card style="height: 80vh;overflow: scroll;margin-bottom: 1rem">
|
||
<el-empty v-if="locals.length === 0"
|
||
description="暂时还没有文件,请上传至/opt/data/locals目录"></el-empty>
|
||
<el-card v-for="file in locals" :key="file.code">
|
||
<el-row>
|
||
<el-col :span="20">
|
||
<div style="cursor: pointer;text-align: left">
|
||
<div>文件名:${ file.name }</div>
|
||
<div>路径:${ file.path }</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-button type="primary" @click="shareFile(file)">分享</el-button>
|
||
</el-col>
|
||
</el-row>
|
||
</el-card>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col v-if="activeIndex === '4'">
|
||
<el-row>
|
||
<el-col :span="4" style="height: 88vh;overflow: scroll;text-align: center" :gutter="10">
|
||
<el-card v-for="menu in menus" :key="menu.key">
|
||
<div style="cursor: pointer;" @click="updateTab=menu.key">${menu.name}</div>
|
||
</el-card>
|
||
</el-col>
|
||
<el-col :span="20">
|
||
<el-card style="height: 88vh;overflow: scroll">
|
||
<div v-if="updateTab=='INSTALL'">
|
||
<div>
|
||
<h1>FileCodeBox V${config.INSTALL}</h1>
|
||
<h2>Github:<a target="_blank"
|
||
href="https://github.com/vastsa/FileCodeBox">FileCodeBox</a></h2>
|
||
</div>
|
||
</div>
|
||
<div v-else-if="updateTab=='BANNERS'">
|
||
<el-form ref="form" style="margin:1rem auto" :model="config" label-width="200px">
|
||
<el-form-item v-for="(banner,index) in config.BANNERS" :label="'Banner'+ (index+1)">
|
||
<div style="display: inline-block">
|
||
<el-input v-model="banner.text" placeholder="文本"></el-input>
|
||
<el-input v-model="banner.url" placeholder="跳转链接"></el-input>
|
||
<el-input v-model="banner.src" placeholder="图片路径"></el-input>
|
||
</div>
|
||
<div style="display: inline-block">
|
||
<el-button type="danger" @click="deleteBanner(index)">删除</el-button>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button size="mini" @click="addBanner" type="primary">新增Banner</el-button>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button @click="updateConfig" type="primary">更新</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</div>
|
||
<div v-else-if="updateTab=='WEBSITE'">
|
||
<el-form ref="form" style="margin:1rem auto" :model="config" label-width="200px">
|
||
<el-form-item label="后台密码">
|
||
<el-input type="password" v-model="config.ADMIN_PASSWORD"
|
||
placeholder="网站名称"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="网站名称">
|
||
<el-input v-model="config.TITLE" placeholder="网站名称"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="网站描述">
|
||
<el-input v-model="config.DESCRIPTION" placeholder="网站描述"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="网站关键词">
|
||
<el-input v-model="config.KEYWORDS" placeholder="网站关键词"></el-input>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-alert
|
||
title="下列信息修改后需要手动重启系统"
|
||
type="warning">
|
||
</el-alert>
|
||
</el-form-item>
|
||
<el-form-item label="后台地址">
|
||
<el-input v-model="config.ADMIN_ADDRESS" placeholder="后台地址"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="存储引擎">
|
||
<el-input v-model="config.STORAGE_ENGINE" placeholder="存储引擎"></el-input>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button @click="updateConfig" type="primary">更新</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</div>
|
||
<div v-else-if="updateTab=='SHARE'">
|
||
<el-form ref="form" style="margin:1rem auto" :model="config" label-width="200px">
|
||
<el-form-item label="开启上传">
|
||
<el-input v-model="config.ENABLE_UPLOAD" placeholder="开启上传"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="最长天数">
|
||
<el-input v-model="config.MAX_DAYS" placeholder="最长允许保留多少天"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="删除过期间隔">
|
||
<el-input v-model="config.DELETE_EXPIRE_FILES_INTERVAL"
|
||
placeholder="删除过期文件的间隔(分钟)"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="上传大小限制">
|
||
<small>单位:(bit),1mb=1 * 1024 * 1024</small>
|
||
<el-input v-model="config.FILE_SIZE_LIMIT"
|
||
placeholder="上传大小限制(bit)"></el-input>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-alert
|
||
title="下列信息修改后需要手动重启系统"
|
||
type="warning">
|
||
</el-alert>
|
||
</el-form-item>
|
||
<el-form-item label="口令错误限制">
|
||
<small>每几分钟</small>
|
||
<el-input v-model="config.ERROR_MINUTE"
|
||
placeholder="错误次数过多后限制时间"></el-input>
|
||
<small>允许错误几次</small>
|
||
<el-input v-model="config.ERROR_COUNT" placeholder="允许错误次数"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="上传次数限制">
|
||
<small>每几分钟</small>
|
||
<el-input v-model="config.UPLOAD_MINUTE"
|
||
placeholder="每几分钟"></el-input>
|
||
<small>允许上传几次</small>
|
||
<el-input v-model="config.UPLOAD_COUNT"
|
||
placeholder="允许次数"></el-input>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button @click="updateConfig" type="primary">更新</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</div>
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
</el-col>
|
||
</el-row>
|
||
<div v-else style="width: 250px;text-align: center;margin: 40vh auto">
|
||
<el-input v-model="pwd" placeholder="请输入登录密码">
|
||
<el-button slot="append" type="primary" @click="loginAdmin">登录</el-button>
|
||
</el-input>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</body>
|
||
<script src="/static/asserts/axios.min.js"></script>
|
||
<script>
|
||
new Vue({
|
||
el: '#app',
|
||
delimiters: ['${', '}'],
|
||
data: function () {
|
||
return {
|
||
login: false,
|
||
pwd: '',
|
||
activeIndex: '2',
|
||
config: {
|
||
banners: []
|
||
},
|
||
menus: [],
|
||
updateTab: 'INSTALL',
|
||
files: [],
|
||
locals: [],
|
||
paginate: {
|
||
page: 1,
|
||
size: 10,
|
||
total: 0,
|
||
},
|
||
};
|
||
},
|
||
mounted: function () {
|
||
const pwd = localStorage.getItem('pwd');
|
||
if (pwd) {
|
||
login = true;
|
||
this.pwd = pwd;
|
||
this.loginAdmin();
|
||
this.getLocalFiles();
|
||
}
|
||
},
|
||
methods: {
|
||
getConfig: function () {
|
||
axios.get(window.location.href + '/config', {
|
||
headers: {
|
||
pwd: this.pwd
|
||
}
|
||
}).then(res => {
|
||
this.config = res.data.data;
|
||
this.menus = res.data.menus;
|
||
});
|
||
},
|
||
updateSize: function (value) {
|
||
this.paginate.size = value;
|
||
this.loginAdmin();
|
||
},
|
||
updatePage: function (value) {
|
||
this.paginate.page = value;
|
||
this.loginAdmin();
|
||
},
|
||
deleteBanner: function (index) {
|
||
this.config.BANNERS.splice(index, 1);
|
||
},
|
||
addBanner: function () {
|
||
this.config.BANNERS.push({
|
||
'url': '',
|
||
'src': '',
|
||
'text': '',
|
||
})
|
||
},
|
||
updateConfig: function () {
|
||
axios.patch('', this.config, {
|
||
'headers': {
|
||
'pwd': this.pwd,
|
||
'Content-Type': 'multipart/json'
|
||
}
|
||
}).then(res => {
|
||
this.$message({
|
||
message: res.data.detail,
|
||
type: 'success'
|
||
});
|
||
})
|
||
},
|
||
loginAdmin: function () {
|
||
axios.post('', this.paginate, {
|
||
'headers': {
|
||
'pwd': this.pwd,
|
||
'Content-Type': 'multipart/form-data'
|
||
}
|
||
}).then(res => {
|
||
this.paginate = res.data.paginate;
|
||
this.files = res.data.data
|
||
this.login = true;
|
||
localStorage.setItem('pwd', this.pwd);
|
||
this.getConfig();
|
||
}).catch(e => {
|
||
localStorage.clear()
|
||
this.$message({'message': e.response.data.detail, 'type': 'error'});
|
||
});
|
||
},
|
||
handleSelect(key, keyPath) {
|
||
this.activeIndex = key;
|
||
},
|
||
deleteFile: function (code) {
|
||
axios.delete('?code=' + code, {'headers': {'pwd': this.pwd}}).then(res => {
|
||
this.files = this.files.filter(item => item.code !== code)
|
||
this.$message({
|
||
message: res.data.detail,
|
||
type: 'success'
|
||
});
|
||
})
|
||
},
|
||
getLocalFiles: function () {
|
||
axios.get(window.location.href + '/files', {
|
||
'headers': {
|
||
'pwd': this.pwd,
|
||
'Content-Type': 'multipart/form-data'
|
||
}
|
||
}).then(res => {
|
||
this.locals = res.data.data;
|
||
})
|
||
},
|
||
shareFile: function (file) {
|
||
axios.post(window.location.href + '/files', file, {
|
||
'headers': {
|
||
'pwd': this.pwd,
|
||
'Content-Type': 'multipart/form-data'
|
||
}
|
||
}).then(res => {
|
||
this.getLocalFiles()
|
||
this.$alert(`请在24小时内使用:${res.data.data.code}`, '分享成功', {
|
||
confirmButtonText: '确定',
|
||
});
|
||
})
|
||
|
||
}
|
||
}
|
||
})
|
||
</script>
|
||
</html>
|