2024-12-07 18:56:07 +08:00
|
|
|
|
<!doctype html>
|
|
|
|
|
|
<html class="x-admin-sm">
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
|
<title>图片管理</title>
|
|
|
|
|
|
<meta name="renderer" content="webkit|ie-comp|ie-stand">
|
|
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
|
|
|
|
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
|
|
|
|
|
|
<meta http-equiv="Cache-Control" content="no-siteapp" />
|
|
|
|
|
|
<script type="text/javascript" src="/x_admin/js/jq.js"></script>
|
|
|
|
|
|
<link rel="stylesheet" href="/x_admin/css/font.css">
|
|
|
|
|
|
<link rel="stylesheet" href="/x_admin/css/xadmin.css">
|
|
|
|
|
|
<script type="text/javascript" src="/x_admin/lib/layui/layui.js" charset="utf-8"></script>
|
|
|
|
|
|
<script type="text/javascript" src="/x_admin/js/xadmin.js"></script>
|
|
|
|
|
|
<style>
|
|
|
|
|
|
.content{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
max-height: 70%;
|
|
|
|
|
|
overflow: auto;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: row;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
align-content: center;
|
|
|
|
|
|
justify-content: space-evenly;
|
|
|
|
|
|
}
|
|
|
|
|
|
.pic_box_upload{
|
|
|
|
|
|
width: 100px;
|
|
|
|
|
|
height: 100px;
|
|
|
|
|
|
margin: 5px 5px;
|
|
|
|
|
|
}
|
|
|
|
|
|
.pic_box_upload img{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
}
|
|
|
|
|
|
.pic_box{
|
|
|
|
|
|
width: 100px;
|
|
|
|
|
|
height: 100px;
|
|
|
|
|
|
margin: 5px 5px;
|
|
|
|
|
|
}
|
|
|
|
|
|
.pic_box:hover {
|
|
|
|
|
|
box-shadow: 0px 0px 1px;
|
|
|
|
|
|
}
|
|
|
|
|
|
.pic_box img{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
}
|
|
|
|
|
|
#fileInput {
|
|
|
|
|
|
display: none; /* 隐藏文件输入元素 */
|
|
|
|
|
|
}
|
|
|
|
|
|
.jz{
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
margin: auto 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
|
|
|
<div class="content">
|
2025-08-02 23:03:04 +08:00
|
|
|
|
<div class="pic_box_upload" onclick="upload_action()"><img src="https://tc.pcxbc.com/tsf/upload_pic.jpg" alt=""></div>
|
2024-12-07 18:56:07 +08:00
|
|
|
|
{volist name="result" id="vo"}
|
|
|
|
|
|
<div class="pic_box" onclick="sendParamToParent('{$vo.id}','{$vo.url_data}')"><img src="{$vo.url_data}" alt=""></div>
|
|
|
|
|
|
{/volist}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="layui-card-body jz">
|
|
|
|
|
|
<div id="page" style="text-align: center;">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<input type="file" id="fileInput">
|
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
|
|
</html>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
var page_num;
|
|
|
|
|
|
var laypage;
|
|
|
|
|
|
var all_page = "{$num}";
|
|
|
|
|
|
layui.use('laypage', function () {
|
|
|
|
|
|
laypage = layui.laypage;
|
|
|
|
|
|
laypage.render({
|
|
|
|
|
|
elem: 'page',
|
|
|
|
|
|
count: all_page, //数据总数，从服务端得到
|
|
|
|
|
|
limit: 20,
|
|
|
|
|
|
groups:20,
|
|
|
|
|
|
jump: function (obj, first) {
|
|
|
|
|
|
//首次不执行
|
|
|
|
|
|
if (!first) {
|
|
|
|
|
|
//obj包含了当前分页的所有参数，比如：
|
|
|
|
|
|
console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
|
|
|
|
|
|
console.log(obj.limit); //得到每页显示的条数
|
|
|
|
|
|
page_num = obj.curr;
|
|
|
|
|
|
jump_page(page_num)
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
function jump_page(num){
|
|
|
|
|
|
load()
|
|
|
|
|
|
$.ajax({
|
|
|
|
|
|
url: "/admin/pic", //请求的url地址s
|
|
|
|
|
|
dataType: "json", //返回格式为json
|
|
|
|
|
|
async: true,//请求是否异步，默认为异步，这也是ajax重要特性
|
|
|
|
|
|
data: {'page': num}, //参数值
|
|
|
|
|
|
type: "POST", //请求方式
|
|
|
|
|
|
success: function (req) {
|
|
|
|
|
|
console.log(req)
|
|
|
|
|
|
c_load();
|
|
|
|
|
|
if(req['code'] == 0){
|
|
|
|
|
|
var str,str_s,str_all="";
|
|
|
|
|
|
for (let i = 0; i < req['data']['result'].length; i++) {
|
|
|
|
|
|
str = '<div class="pic_box" onclick="sendParamToParent(\''+req['data']['result'][i]['id']+'\',\''+req['data']['result'][i]['url_data']+'\')"><img src="'+req['data']['result'][i]['url_data']+'" alt=""></div>'
|
|
|
|
|
|
str_all = str_all+str;
|
|
|
|
|
|
}
|
|
|
|
|
|
$('.content').each(function() {
|
|
|
|
|
|
$(this).find('.pic_box').remove();
|
|
|
|
|
|
});
|
|
|
|
|
|
$('.content').append(str_all);
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
error: function () {
|
|
|
|
|
|
//请求出错处理
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
|
function sendParamToParent(id,data) {
|
|
|
|
|
|
var param = [id,data]; // 这是要传递的参数
|
|
|
|
|
|
// 调用父窗口的一个函数，并传递参数
|
|
|
|
|
|
if (window.parent && window.parent.receiveParamFromIframe) {
|
|
|
|
|
|
window.parent.receiveParamFromIframe(param);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
layer.msg('图片选择失败');
|
|
|
|
|
|
}
|
|
|
|
|
|
xadmin.close();
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function upload_action(){
|
|
|
|
|
|
document.getElementById('fileInput').click();
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
$('#fileInput').on('change', function() {
|
|
|
|
|
|
// 获取被选择的文件
|
|
|
|
|
|
var fileInput = $(this)[0];
|
|
|
|
|
|
var file = fileInput.files[0];
|
|
|
|
|
|
console.log(file)
|
|
|
|
|
|
// return
|
|
|
|
|
|
// 检查是否有文件被选择
|
|
|
|
|
|
if (file) {
|
|
|
|
|
|
load()
|
|
|
|
|
|
var formdata = new FormData();
|
|
|
|
|
|
formdata.append('cover_image',file)
|
|
|
|
|
|
$.ajax({
|
|
|
|
|
|
url:"/admin/pic_upload_action", //请求的url地址
|
|
|
|
|
|
contentType:false,
|
|
|
|
|
|
processData:false,
|
|
|
|
|
|
async:true,//请求是否异步，默认为异步，这也是ajax重要特性
|
|
|
|
|
|
data:formdata, //参数值
|
|
|
|
|
|
type:"POST", //请求方式
|
|
|
|
|
|
success:function(req){
|
|
|
|
|
|
c_load()
|
|
|
|
|
|
//请求成功时处理
|
|
|
|
|
|
if(req.code == 0){
|
|
|
|
|
|
var newDiv = $('<div></div>')
|
|
|
|
|
|
.addClass('pic_box')
|
|
|
|
|
|
.attr('onclick', 'sendParamToParent(\''+req.data.id+'\',\''+req.data.url+'\')')
|
|
|
|
|
|
.append($('<img></img>')
|
|
|
|
|
|
.attr('src', req.data.url)
|
|
|
|
|
|
.attr('alt', '')
|
|
|
|
|
|
);
|
|
|
|
|
|
$('.content > div:first').after(newDiv);
|
|
|
|
|
|
layer.msg(req.msg);
|
|
|
|
|
|
}else{
|
|
|
|
|
|
layer.msg(req.msg);
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
error:function(){
|
|
|
|
|
|
//请求出错处理
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
//加载提示开启
|
|
|
|
|
|
function load() {
|
|
|
|
|
|
var index = layer.load(1, {
|
|
|
|
|
|
shade: [0.1, '#fff'] //0.1透明度的白色背景
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
// 关闭加载提示
|
|
|
|
|
|
function c_load() {
|
|
|
|
|
|
layer.close(layer.index)
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
