Files
filecodebox/templates/admin.html
T
2022-12-19 22:26:30 +08:00

263 lines
12 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>
</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.type==='text'">
<span>&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-form ref="form" style="width: 50%;margin:2rem auto" :model="config" label-width="200px">
<!--? <el-form-item label="错误限制">-->
<!--? <div>-->
<!--? 间隔-->
<!--? <el-input-number v-model="config.error_count" :min="1"></el-input-number>-->
<!--? 分钟-->
<!--? </div>-->
<!--? <div>-->
<!--? 数量-->
<!--? <el-input-number v-model="config.error_minute" :min="1"></el-input-number>-->
<!--? -->
<!--? </div>-->
<!--? </el-form-item>-->
<!--? <el-form-item label="上传限制">-->
<!--? <div>-->
<!--? 开启上传-->
<!--? <el-switch-->
<!--? v-model="config.enable_upload"-->
<!--? active-color="#13ce66"-->
<!--? inactive-color="#ff4949">-->
<!--? </el-switch>-->
<!--? </div>-->
<!--? <div>-->
<!--? 间隔-->
<!--? <el-input-number v-model="config.upload_minute" :min="1"></el-input-number>-->
<!--? 分钟-->
<!--? </div>-->
<!--? <div>-->
<!--? 数量-->
<!--? <el-input-number v-model="config.upload_count" :min="1"></el-input-number>-->
<!--? -->
<!--? </div>-->
<!--? <div>-->
<!--? 最长-->
<!--? <el-input-number v-model="config.max_days" :min="1"></el-input-number>-->
<!--? -->
<!--? </div>-->
<!--? <div>-->
<!--? 大小-->
<!--? <el-input-number v-model="config.file_size_limit" :min="1"></el-input-number>-->
<!--? MB-->
<!--? </div>-->
<!--? </el-form-item>-->
<!--? <el-form-item label="删除间隔">-->
<!--? 时长-->
<!--? <el-input-number v-model="config.delete_expire_files_interval"></el-input-number>-->
<!--? 分钟-->
<!--? </el-form-item>-->
<!--? <el-form-item label="管理员密码">-->
<!--? <el-input v-model="config.admin_password" type="password"></el-input>-->
<!--? </el-form-item>-->
<el-form-item v-for="(banner,index) in config.banners" :label="'Banner'+ (index+1)">
<div style="width: 50%;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>
</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: {
// enable_upload: true,
// max_days: 7,
// error_count: 3,
// error_minute: 10,
// upload_count: 10,
// upload_minute: 10,
// delete_expire_files_interval: 10,
// admin_password: 'admin',
// file_size_limit: 10,
banners: []
},
files: [],
paginate: {
page: 1,
size: 10,
total: 0,
},
};
},
mounted: function () {
const pwd = localStorage.getItem('pwd');
if (pwd) {
login = true;
this.pwd = pwd;
axios.get('/config', {
headers: {
pwd: pwd
}
}).then(res => {
console.log(res.data.data)
this.config = res.data.data;
});
this.loginAdmin();
}
},
methods: {
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);
}).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'
});
})
},
}
})
</script>
</html>