orion/filecodebox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

资源本地化，管理面板，口令转二维码

Browse Source
This commit is contained in:
lan-air
2022-12-10 01:52:00 +08:00
parent 14653ab4c9
commit de40b82a82
21 changed files with 161 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/admin.html
+104
View File
@@ -0,0 +1,104 @@
<!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/assert/index.css">
<title>后台管理-口令传送箱</title>
</head>
<body>
<div id="app">
<el-row v-if="login">
<el-col :span="4">&nbsp;</el-col>
<el-col :span="16">
<el-card>
<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 v-if="file.name==='分享文本'">
<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-col>
<el-col :span="4">&nbsp;</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/assert/vue.min.js"></script>
<script src="/static/assert/index.js"></script>
<script src="/static/assert/axios.min.js"></script>
<script>
new Vue({
el: '#app',
delimiters: ['${', '}'],
data: function () {
return {
login: false,
pwd: '',
files: []
};
},
mounted: function () {
const pwd = localStorage.getItem('pwd');
if (pwd) {
login = true;
this.pwd = pwd;
this.loginAdmin();
}
},
methods: {
loginAdmin: function () {
axios.post('', {}, {'headers': {'pwd': this.pwd}}).then(res => {
if (res.data.code === 200) {
this.files = res.data.data;
this.login = true;
localStorage.setItem('pwd', this.pwd);
} else {
localStorage.clear()
this.$message({
message: res.data.msg,
type: 'error'
});
}
})
},
deleteFile: function (code) {
axios.delete('?code=' + code, {'headers': {'pwd': this.pwd}}).then(res => {
if (res.data.code === 200) {
this.files = this.files.filter(item => item.code !== code)
this.$message({
message: res.data.msg,
type: 'success'
});
}
})
}
}
})
</script>
</html>
templates/index.html
+27 -19
View File
@@ -5,9 +5,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="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<link rel="stylesheet" href="/static/assert/index.css">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<title>取件箱-口令传送箱</title>
<style>
.qu .el-button {
@@ -128,11 +127,19 @@
<el-empty v-if="files.length===0" description="请上传文件"></el-empty>
<el-card style="margin-top: 0.2rem" v-for="file in files" :key="file.code">
<el-row>
<el-col :span="24" style="line-height: 45px">
${ file.name }
<el-col :span="20">
<el-row>
<el-col :span="24" style="line-height: 45px">
${ file.name }
</el-col>
<el-col :span="24">
取件码：<h1 style="margin: 0;display: inline">${ file.code }</h1>
</el-col>
</el-row>
</el-col>
<el-col :span="24">
取件码：<h1 style="margin: 0;display: inline">${ file.code }</h1>
<el-col :span="4">
<img style="width: 80px;height: 80px;"
:src="qrcodeUrl(file)">
</el-col>
</el-row>
</el-card>
@@ -141,11 +148,10 @@
</div>
</body>
<!-- import Vue before Element -->
<script src="https://unpkg.com/vue@2/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="//unpkg.com/axios/dist/axios.min.js"></script>
<script src="/static/assert/qrcode.min.js"></script>
<script src="/static/assert/vue.min.js"></script>
<script src="/static/assert/index.js"></script>
<script src="/static/assert/axios.min.js"></script>
<script>
new Vue({
el: '#app',
@@ -166,7 +172,6 @@
if (this.code) {
this.get_file();
}
const that = this
document.addEventListener('paste', function (event) {
if (that.tool === 1) {
@@ -180,13 +185,13 @@
items[i].getAsString(function (str) {
FileData.append('text', str);
axios.post('/share', FileData)
.then(function (response) {
that.$message({'message': response.data.msg, 'type': 'success'});
that.files.push(response.data.data)
})
.catch(function (error) {
that.$message({'message': error.data.msg, 'type': 'error'});
});
.then(function (response) {
that.$message({'message': response.data.msg, 'type': 'success'});
that.files.push(response.data.data)
})
.catch(function (error) {
that.$message({'message': error.data.msg, 'type': 'error'});
});
});
}
} else {
@@ -251,6 +256,9 @@
successUpload(response, file, fileList) {
this.files.push(response.data[0])
},
qrcodeUrl(file) {
return 'https://api.qrserver.com/v1/create-qr-code?data=' + window.location.origin + '/?code=' + file.code
},
}
})
</script>