293 行
8.8 KiB
HTML
可执行文件
293 行
8.8 KiB
HTML
可执行文件
<!doctype html>
|
|
<html>
|
|
<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">
|
|
<title>添加插件</title>
|
|
<style>
|
|
html, body {
|
|
background-color: rgb(246, 248, 249);
|
|
font-size: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.file_label {
|
|
position: relative;
|
|
cursor: pointer;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.file_label:before {
|
|
display: block;
|
|
content: '+';
|
|
font-size: 80px;
|
|
font-weight: 100;
|
|
color: #bbb;
|
|
border: 1px solid #bbb;
|
|
width: 100px;
|
|
height: 100px;
|
|
border-radius: 10px;
|
|
text-align: center;
|
|
line-height: 96px;
|
|
}
|
|
|
|
.file_label > input {
|
|
width: 100px;
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.file_label > img {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: white;
|
|
border-radius: 10px;
|
|
display: none;
|
|
}
|
|
|
|
.box {
|
|
border: 1px solid #bbb;
|
|
border-radius: 5px;
|
|
background-color: white;
|
|
padding-bottom: 20px;
|
|
}
|
|
|
|
.list {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: flex-start;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
.title {
|
|
background-color: #f5f5f5;
|
|
color: black;
|
|
font-size: 18px;
|
|
border-bottom: 1px solid #e6e6e6;
|
|
line-height: 60px;
|
|
border-radius: 5px 5px 0 0;
|
|
text-indent: 15px;
|
|
}
|
|
|
|
.left_name {
|
|
width: 100px;
|
|
text-align: right;
|
|
font-size: 14px;
|
|
line-height: 56px;
|
|
color: #666;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
.list > input {
|
|
margin: 10px 0;
|
|
width: 300px;
|
|
border: 1px solid #ccc;
|
|
padding: 10px;
|
|
border-radius: 5px;
|
|
outline: none;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.list > select {
|
|
width: 322px;
|
|
margin: 10px 0;
|
|
padding: 10px;
|
|
border: 1px solid #ccc;
|
|
border-radius: 5px;
|
|
outline: none;
|
|
font-size: 14px;
|
|
color: #333;
|
|
}
|
|
|
|
.list > textarea {
|
|
resize: none;
|
|
width: 300px;
|
|
height: 100px;
|
|
padding: 10px;
|
|
border: 1px solid #ccc;
|
|
border-radius: 5px;
|
|
outline: none;
|
|
font-size: 14px;
|
|
color: #333;
|
|
}
|
|
|
|
.save {
|
|
font-size: 16px;
|
|
width: 50px;
|
|
background-color: #009688;
|
|
color: white;
|
|
text-align: center;
|
|
padding: 8px 10px;
|
|
border-radius: 5px;
|
|
margin: 50px 200px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.save:hover {
|
|
background-color: #099688;
|
|
}
|
|
.label_radio{
|
|
height: 18px;
|
|
align-items: center;
|
|
font-size: 14px;
|
|
position: relative;
|
|
cursor: pointer;
|
|
line-height: 19px;
|
|
color: #313131;
|
|
margin-right: 20px;
|
|
padding-top: 2px;
|
|
}
|
|
.label_radio>input{
|
|
width: 16px;
|
|
height: 16px;
|
|
opacity: 0;
|
|
margin-right: 4px;
|
|
}
|
|
.label_radio>span{
|
|
width: 20px;
|
|
height: 20px;
|
|
border-radius: 50%;
|
|
border: 2px solid #ccc;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
cursor: pointer;
|
|
box-sizing: border-box;
|
|
}
|
|
.label_radio>input:checked+span:after{
|
|
background-color: #009688!important;
|
|
}
|
|
.label_radio>input:checked+span{
|
|
border-color: #009688!important;
|
|
}
|
|
.label_radio>span::after{
|
|
position: absolute;
|
|
content: "";
|
|
width: 8px;
|
|
height: 8px;
|
|
border-radius: 50%;
|
|
background-color: #ddd;
|
|
top: 4px;
|
|
left: 4px;
|
|
transition: .5s;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body style="padding: 50px">
|
|
<form id="form">
|
|
<div class="box">
|
|
<div class="title">添加插件</div>
|
|
<div class="list">
|
|
<div class="left_name">使用模块：</div>
|
|
<div style="margin-top: 15px;">
|
|
<label class="label_radio">
|
|
<input checked type="radio" name="type" value="2">会员卡
|
|
<span></span>
|
|
</label>
|
|
<label class="label_radio">
|
|
<input type="radio" name="type" value="1">其他
|
|
<span></span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="list">
|
|
<div class="left_name">插件名称：</div>
|
|
<input type="text" id="plug_name" name="plug_name" placeholder="插件名称">
|
|
</div>
|
|
<div class="list">
|
|
<div class="left_name">管理路径：</div>
|
|
<input type="text" id="plug_url" name="plug_url" placeholder="管理路径">
|
|
</div>
|
|
<div class="list">
|
|
<div class="left_name">使用路径：</div>
|
|
<input type="text" id="use_url" name="use_url" placeholder="使用路径">
|
|
</div>
|
|
<div class="list">
|
|
<sapn class="left_name">插件图标：</sapn>
|
|
<label class="file_label">
|
|
<input type="file" id="icon" name="icon" placeholder="选择图标" accept="image/png,image/jpeg" value=""/>
|
|
<img>
|
|
</label>
|
|
</div>
|
|
<div class="list">
|
|
<div class="left_name">插件分类：</div>
|
|
<select name="plug_type" id="plug_type">
|
|
<option value="0">选择分类</option>
|
|
<volist name="classList" id="vo">
|
|
<option value="{$vo['id']}">{$vo['class_name']}</option>
|
|
</volist>
|
|
</select>
|
|
</div>
|
|
<div class="list">
|
|
<div class="left_name">插件描述：</div>
|
|
<textarea name="information" id="information" cols="30" rows="10"></textarea>
|
|
</div>
|
|
<div class="save">创建</div>
|
|
</div>
|
|
</form>
|
|
</body>
|
|
<script src="__PUBLIC__/jquery/js/jquery-3.2.1.min.js"></script>
|
|
<script src="__PUBLIC__/js/tips.js"></script>
|
|
<script>
|
|
$('#icon').on('change', function () {
|
|
if (this.files.length) {
|
|
var imgObj = this.files[0];
|
|
var imgType = ['image/jpeg', 'image/jpg', 'image/png'];
|
|
if (jQuery.inArray(imgObj.type, imgType) != -1) {
|
|
//是图片
|
|
var reader = new FileReader();
|
|
reader.readAsDataURL(imgObj);
|
|
reader.onload = function () {
|
|
$('.file_label>img').attr('src', this.result);
|
|
$('.file_label>img').show();
|
|
}
|
|
}
|
|
}
|
|
})
|
|
$('.save').click(function () {
|
|
if(!$('#plug_name').val().trim()){
|
|
showTips('请输入插件名称');
|
|
return;
|
|
}
|
|
if(!$('#icon').val().trim()){
|
|
showTips('请上传插件图标');
|
|
return;
|
|
}
|
|
if($('#plug_type>option:selected').val()==0){
|
|
showTips('请选择插件分类');
|
|
return;
|
|
}
|
|
if(!$('#information').val().trim()){
|
|
showTips('请输入插件描述');
|
|
return;
|
|
}
|
|
var fd = new FormData(document.getElementById('form'));
|
|
$.ajax({
|
|
url:"{:U('doAddPlug')}",
|
|
type: "POST",
|
|
data: fd,
|
|
dataType: 'JSON',
|
|
cache: false, // 不缓存
|
|
processData: false, // jQuery不要去处理发送的数据
|
|
contentType: false, // jQuery不要去设置Content-Type请求头
|
|
success: function (res) {
|
|
if (res.status == 1) {
|
|
showTips(res.msg,function () {
|
|
location.replace("{:U('index')}");
|
|
});
|
|
} else {
|
|
showTips(res.msg);
|
|
}
|
|
}
|
|
})
|
|
})
|
|
</script>
|
|
</html> |