Files
filecodebox/templates/admin.html
T
2023-01-18 22:08:01 +08:00

352 lines
17 KiB
Python
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!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>&nbsp;&nbsp; ${ file.count }</div>
<div>&nbsp;&nbsp; ${ file.exp_time.slice(0,19) }</div>
<div v-if="file.name==='文本分享'">
<span style="white-space: pre-line">&nbsp;&nbsp; ${ file.text }</span>
</div>
<div v-else>
<span>&nbsp;&nbsp; </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>